/* CasinoFull — mobile fixes (desktop unchanged) */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.cf-nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: calc(100% - 16px);
  margin: 10px 8px;
  padding: 12px 14px;
  border: 1px solid #af7c41;
  background: linear-gradient(180deg, rgba(175, 124, 65, 0.35), rgba(80, 20, 20, 0.85));
  color: #f2cf5c;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  box-sizing: border-box;
  border-radius: 4px;
}

.cf-nav-toggle-bars {
  display: inline-block;
  width: 18px;
  height: 12px;
  position: relative;
}

.cf-nav-toggle-bars:before,
.cf-nav-toggle-bars:after,
.cf-nav-toggle-bars i {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: #f2cf5c;
}

.cf-nav-toggle-bars:before { top: 0; }
.cf-nav-toggle-bars i { top: 5px; display: block; }
.cf-nav-toggle-bars:after { bottom: 0; }

@media screen and (max-width: 980px) {
  body {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100vw !important;
  }

  .table100,
  .table100w {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Do NOT force all images to scale — breaks decorative GIFs into huge stripes */
  .cf-content img,
  .bodytext img,
  td.bodytext img {
    max-width: 100%;
    height: auto !important;
  }

  /* ---- Top banner: only center strip ---- */
  .bgtop1 {
    height: auto !important;
  }

  .bgtop1 table {
    width: 100% !important;
  }

  .bgtop1 td:first-child,
  .bgtop1 td:last-child {
    display: none !important;
  }

  .bgtop1 td {
    text-align: center !important;
  }

  .bgtop1 img {
    max-height: 40px !important;
    width: auto !important;
    height: auto !important;
    max-width: 90vw !important;
  }

  /* ---- Logo ---- */
  tr > td[height="189"] {
    height: auto !important;
    text-align: center !important;
  }

  tr > td[height="189"] > table.table100w > tbody > tr > td:first-child,
  tr > td[height="189"] > table.table100w > tr > td:first-child,
  tr > td[height="189"] > table.table100w > tbody > tr > td:last-child,
  tr > td[height="189"] > table.table100w > tr > td:last-child {
    display: none !important;
  }

  tr > td[height="189"] img[src*="logo"] {
    display: block !important;
    width: min(280px, 85vw) !important;
    max-width: 85vw !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  /* ---- Top icon nav: horizontal swipe ---- */
  .cf-topnav-wrap {
    height: auto !important;
    display: block;
    overflow: hidden;
    background: #6b1515;
  }

  .cf-topnav {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .cf-topnav > tbody,
  .cf-topnav > tbody > tr,
  .cf-topnav > tr {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    width: max-content !important;
    min-width: 100%;
  }

  .cf-topnav td {
    display: inline-flex !important;
    width: auto !important;
    padding: 4px 2px !important;
  }

  .cf-topnav img {
    max-width: none !important;
    width: 92px !important;
    height: 36px !important;
  }

  .cf-topnav img[src*="column_"] {
    display: none !important;
  }

  /* ---- Main columns: stack ---- */
  .bgcol_l,
  .bgcol_r,
  .bg_shadow2 {
    display: none !important;
  }

  td.table100h > table.table100 > tbody > tr,
  td.table100h > table.table100 > tr {
    display: block !important;
  }

  td.table100h > table.table100 > tbody > tr > td,
  td.table100h > table.table100 > tr > td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .cf-nav-toggle {
    display: inline-flex;
  }

  td.cf-content {
    padding: 8px 10px 20px !important;
    width: 100% !important;
  }

  /* =========================================================
     SIDE MENU (#cfSideNav) — kill ornate 3-column GIF frames
     Screenshot bug: left stripes ate half the screen
     ========================================================= */
  #cfSideNav,
  td.bg_shadow {
    width: 100% !important;
    max-width: 100% !important;
    background: #5a1212 !important;
    background-image: none !important;
    padding: 8px 0 16px !important;
    box-sizing: border-box;
  }

  td.table100h > table.table100 > tbody > tr > td.bg_shadow.is-closed,
  td.table100h > table.table100 > tr > td.bg_shadow.is-closed,
  #cfSideNav.is-closed,
  td.bg_shadow.is-closed {
    display: none !important;
  }

  /* Flatten every nested menu table inside sidebar */
  #cfSideNav table,
  #cfSideNav tbody,
  #cfSideNav tr,
  #cfSideNav td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
  }

  /* Hide ALL decorative frame images */
  #cfSideNav img[src*="menu_"],
  #cfSideNav img[src*="uz_"],
  #cfSideNav img[src*="non.gif"],
  #cfSideNav td[width="49"],
  #cfSideNav td[width="10"] {
    display: none !important;
  }

  #cfSideNav td.bg_menu,
  #cfSideNav td[rowspan],
  #cfSideNav td[background] {
    display: block !important;
    width: 100% !important;
    background: #4a0e0e !important;
    background-image: none !important;
    padding: 0 !important;
  }

  #cfSideNav a.menu {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    padding: 12px 16px !important;
    margin: 0 !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
    color: #f2cf5c !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(235, 193, 121, 0.18);
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }

  #cfSideNav a.menu:active,
  #cfSideNav a.menu:hover {
    background: rgba(0, 0, 0, 0.25);
  }

  #cfSideNav form {
    display: block !important;
    padding: 10px 16px !important;
  }

  #cfSideNav input.in {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    height: 36px !important;
  }

  #cfSideNav form img[src*="ok.gif"] {
    display: inline-block !important;
    width: 22px !important;
    height: auto !important;
  }

  h1 {
    font-size: 15px !important;
    line-height: 1.3;
    padding: 0 6px;
    word-wrap: break-word;
  }

  .bodytext,
  .bodytext p,
  p.green {
    font-size: 13px !important;
    line-height: 1.45;
    word-wrap: break-word;
  }

  table[background*="title_bg"] img {
    max-width: 64px;
    height: auto !important;
  }

  .bgbot1,
  tr > td.bgbot2 {
    display: none !important;
  }

  td.ray {
    font-size: 11px;
    text-align: center;
    padding: 10px !important;
  }
}

@media screen and (max-width: 600px) {
  .bgtop1 img {
    max-height: 28px !important;
  }

  tr > td[height="189"] img[src*="logo"] {
    width: min(220px, 80vw) !important;
  }

  .cf-topnav img {
    width: 82px !important;
    height: 32px !important;
  }

  #cfSideNav a.menu {
    font-size: 16px !important;
    padding: 14px 16px !important;
  }
}