/* =========================================================
   bingofun.click - Core stylesheet (prefix: sadf-)
   Mobile-first HTML5 casino / bingo gaming site (en-PH)
   Comments in English only.
   ========================================================= */

:root{
  --sadf-primary:#F08080;     /* light coral */
  --sadf-secondary:#CD5C5C;   /* indian red */
  --sadf-bg:#1C2833;          /* deep slate */
  --sadf-bg-2:#22303c;
  --sadf-bg-3:#2c3e50;
  --sadf-accent:#FF69B4;      /* hot pink */
  --sadf-blue:#4169E1;        /* royal blue */
  --sadf-text:#EEEEEE;        /* light gray */
  --sadf-muted:#b9c2cc;
  --sadf-gold:#ffd36e;
  --sadf-radius:1.4rem;
  --sadf-shadow:0 .4rem 1.2rem rgba(0,0,0,.35);
  --sadf-header-h:6rem;
  --sadf-bottomnav-h:6.4rem;
}

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{font-size:62.5%;scroll-behavior:smooth;}
html,body{overflow-x:hidden;}
body{
  font-family:"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background:linear-gradient(160deg,var(--sadf-bg) 0%,#0f1822 100%);
  color:var(--sadf-text);
  line-height:1.5rem;
  font-size:1.5rem;
  min-height:100vh;
}
img{max-width:100%;display:block;}
a{color:var(--sadf-primary);text-decoration:none;}
a:hover{color:var(--sadf-accent);}

/* Layout containers */
.sadf-wrapper{max-width:430px;margin:0 auto;position:relative;}
.sadf-container{padding:1.2rem;width:100%;}
.sadf-section{margin:2.2rem 0;}
.sadf-section-title{
  font-size:2rem;font-weight:800;color:#fff;margin-bottom:1.2rem;
  display:flex;align-items:center;gap:.6rem;
}
.sadf-section-title::before{
  content:"";display:inline-block;width:.5rem;height:2rem;
  background:linear-gradient(var(--sadf-primary),var(--sadf-accent));
  border-radius:.4rem;
}

/* ===== Header ===== */
.sadf-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(28,40,51,.96);
  backdrop-filter:blur(8px);
  border-bottom:.1rem solid rgba(240,128,128,.25);
  box-shadow:var(--sadf-shadow);
}
.sadf-header-inner{
  max-width:430px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1rem;min-height:5.6rem;
}
.sadf-logo{display:flex;align-items:center;gap:.7rem;}
.sadf-logo img{width:3rem;height:3rem;border-radius:.6rem;}
.sadf-logo-text{font-size:1.8rem;font-weight:900;color:#fff;letter-spacing:.03rem;}
.sadf-logo-text span{color:var(--sadf-primary);}
.sadf-header-actions{display:flex;align-items:center;gap:.6rem;}
.sadf-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  font-size:1.4rem;font-weight:700;border:none;border-radius:2rem;
  padding:.8rem 1.4rem;cursor:pointer;transition:transform .15s,filter .15s;
  min-height:4rem;min-width:4rem;line-height:1;
}
.sadf-btn:active{transform:scale(.96);}
.sadf-btn-login{
  background:transparent;color:#fff;
  border:.12rem solid var(--sadf-primary);
}
.sadf-btn-login:hover{background:rgba(240,128,128,.15);}
.sadf-btn-register{
  background:linear-gradient(135deg,var(--sadf-primary),var(--sadf-accent));
  color:#fff;box-shadow:0 .3rem .8rem rgba(255,105,180,.4);
}
.sadf-btn-block{display:flex;width:100%;padding:1.1rem 1.4rem;font-size:1.5rem;}
.sadf-menu-toggle{
  background:transparent;border:none;color:#fff;font-size:2.2rem;
  cursor:pointer;padding:.4rem .6rem;display:flex;align-items:center;
}

/* ===== Mobile slide menu ===== */
.sadf-mobile-menu{
  position:fixed;top:0;right:-100%;width:82%;max-width:340px;
  height:100vh;background:var(--sadf-bg-2);z-index:9999;
  transition:right .28s ease;padding:2rem 1.6rem;overflow-y:auto;
  border-left:.1rem solid rgba(240,128,128,.2);
}
.sadf-mobile-menu.sadf-open{right:0;}
.sadf-menu-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:9998;
  display:none;
}
.sadf-menu-backdrop.sadf-open{display:block;}
.sadf-menu-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:1.6rem;padding-bottom:1rem;border-bottom:.1rem solid rgba(255,255,255,.08);
}
.sadf-menu-head h3{font-size:1.7rem;color:#fff;}
.sadf-menu-close{background:none;border:none;color:#fff;font-size:2.2rem;cursor:pointer;}
.sadf-mobile-menu nav{display:flex;flex-direction:column;gap:.4rem;}
.sadf-mobile-menu nav a{
  display:flex;align-items:center;gap:.9rem;padding:1.1rem 1rem;
  color:var(--sadf-text);font-size:1.5rem;font-weight:600;
  border-radius:1rem;transition:background .15s;
}
.sadf-mobile-menu nav a:hover,.sadf-mobile-menu nav a.active{
  background:rgba(240,128,128,.15);color:#fff;
}
.sadf-mobile-menu nav a i{color:var(--sadf-primary);width:2.2rem;text-align:center;}
.sadf-menu-cta{margin-top:1.6rem;display:flex;flex-direction:column;gap:.8rem;}

/* ===== Hero carousel ===== */
.sadf-hero{margin-top:var(--sadf-header-h);padding:1rem;}
.sadf-carousel{position:relative;border-radius:var(--sadf-radius);overflow:hidden;box-shadow:var(--sadf-shadow);}
.sadf-carousel-track{display:flex;transition:transform .4s ease;}
.sadf-slide{min-width:100%;position:relative;cursor:pointer;}
.sadf-slide img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;}
.sadf-slide-overlay{
  position:absolute;left:0;right:0;bottom:0;padding:1.4rem 1.2rem;
  background:linear-gradient(transparent,rgba(0,0,0,.85));
}
.sadf-slide-overlay h2{font-size:2rem;color:#fff;margin-bottom:.4rem;}
.sadf-slide-overlay p{font-size:1.3rem;color:var(--sadf-muted);}
.sadf-carousel-dots{
  position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);
  display:flex;gap:.5rem;
}
.sadf-dot{width:.8rem;height:.8rem;border-radius:50%;background:rgba(255,255,255,.4);}
.sadf-dot.sadf-active{background:var(--sadf-primary);width:2rem;border-radius:.4rem;}

/* ===== Promo strip ===== */
.sadf-promo-strip{
  background:linear-gradient(135deg,var(--sadf-blue),var(--sadf-accent));
  border-radius:var(--sadf-radius);padding:1.4rem;margin:1rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  box-shadow:var(--sadf-shadow);
}
.sadf-promo-strip .sadf-strip-text{font-size:1.4rem;color:#fff;font-weight:700;flex:1;}
.sadf-promo-strip .sadf-strip-text small{display:block;font-weight:500;opacity:.9;font-size:1.2rem;margin-top:.2rem;}

/* ===== Category section + game grid ===== */
.sadf-category-block{margin:1.6rem 0;padding:0 1rem;}
.sadf-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;
}
.sadf-game-card{
  background:var(--sadf-bg-2);border-radius:1.2rem;overflow:hidden;
  cursor:pointer;transition:transform .15s,box-shadow .15s;
  border:.1rem solid rgba(255,255,255,.05);
  position:relative;
}
.sadf-game-card:active{transform:scale(.95);}
.sadf-game-card img{width:100%;aspect-ratio:1/1;object-fit:cover;}
.sadf-game-name{
  font-size:1.15rem;color:#fff;text-align:center;padding:.5rem .3rem;
  font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.sadf-game-card .sadf-hot-tag{
  position:absolute;top:.4rem;right:.4rem;background:var(--sadf-accent);
  color:#fff;font-size:.95rem;padding:.15rem .5rem;border-radius:.6rem;font-weight:700;
}

/* ===== Info / features cards ===== */
.sadf-card{
  background:var(--sadf-bg-2);border-radius:var(--sadf-radius);
  padding:1.4rem;margin:1rem;box-shadow:var(--sadf-shadow);
  border:.1rem solid rgba(240,128,128,.12);
}
.sadf-card h3{font-size:1.7rem;color:#fff;margin-bottom:.8rem;display:flex;align-items:center;gap:.6rem;}
.sadf-card h3 i{color:var(--sadf-primary);}
.sadf-card p{font-size:1.4rem;color:var(--sadf-muted);margin-bottom:.8rem;}
.sadf-card ul{list-style:none;padding:0;}
.sadf-card ul li{
  font-size:1.35rem;color:var(--sadf-text);padding:.5rem 0 .5rem 2rem;position:relative;
}
.sadf-card ul li::before{
  content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;
  position:absolute;left:0;color:var(--sadf-primary);
}
.sadf-card-grid{display:grid;grid-template-columns:1fr;gap:1rem;}

/* Inline SEO link list */
.sadf-seo-links{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem;}
.sadf-seo-links a{
  font-size:1.25rem;padding:.4rem .8rem;background:rgba(240,128,128,.1);
  border-radius:.8rem;border:.1rem dashed rgba(240,128,128,.3);
}

/* ===== Testimonials ===== */
.sadf-testimonial{
  background:var(--sadf-bg-2);border-radius:1.2rem;padding:1.2rem;margin-bottom:.8rem;
  border-left:.3rem solid var(--sadf-primary);
}
.sadf-testimonial p{font-size:1.35rem;color:var(--sadf-text);font-style:italic;margin-bottom:.6rem;}
.sadf-testimonial .sadf-author{font-size:1.2rem;color:var(--sadf-gold);font-weight:700;}

/* ===== Winners ===== */
.sadf-winner-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:.7rem 1rem;background:var(--sadf-bg-2);border-radius:.8rem;margin-bottom:.5rem;
}
.sadf-winner-row .sadf-w-name{font-size:1.3rem;color:#fff;font-weight:600;}
.sadf-winner-row .sadf-w-game{font-size:1.15rem;color:var(--sadf-muted);}
.sadf-winner-row .sadf-w-amount{font-size:1.4rem;color:var(--sadf-gold);font-weight:800;}

/* ===== Payment methods ===== */
.sadf-pay-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;}
.sadf-pay-item{
  background:#fff;border-radius:.8rem;padding:.8rem .4rem;text-align:center;
  font-size:1.1rem;color:var(--sadf-bg);font-weight:700;
}
.sadf-pay-item i{font-size:1.8rem;display:block;margin-bottom:.2rem;color:var(--sadf-blue);}

/* ===== RTP compact table ===== */
.sadf-rtp-table{width:100%;border-collapse:collapse;font-size:1.3rem;}
.sadf-rtp-table th,.sadf-rtp-table td{padding:.7rem .4rem;text-align:center;border-bottom:.1rem solid rgba(255,255,255,.07);}
.sadf-rtp-table th{color:var(--sadf-gold);font-weight:700;}
.sadf-rtp-table td{color:var(--sadf-text);}
.sadf-rtp-table tr:last-child td{border-bottom:none;}

/* ===== Achievements / Tricks ===== */
.sadf-trick{
  display:flex;gap:.8rem;align-items:flex-start;padding:.8rem;
  background:var(--sadf-bg-2);border-radius:1rem;margin-bottom:.6rem;
}
.sadf-trick .sadf-trick-ico{
  flex-shrink:0;width:3rem;height:3rem;border-radius:.7rem;
  background:linear-gradient(135deg,var(--sadf-primary),var(--sadf-accent));
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.6rem;
}
.sadf-trick h4{font-size:1.4rem;color:#fff;margin-bottom:.2rem;}
.sadf-trick p{font-size:1.25rem;color:var(--sadf-muted);}

/* ===== App download CTA ===== */
.sadf-app-cta{
  background:linear-gradient(135deg,var(--sadf-secondary),var(--sadf-blue));
  border-radius:var(--sadf-radius);padding:1.6rem;margin:1rem;text-align:center;
}
.sadf-app-cta h3{font-size:1.9rem;color:#fff;margin-bottom:.6rem;}
.sadf-app-cta p{font-size:1.3rem;color:#fff;opacity:.9;margin-bottom:1rem;}
.sadf-app-buttons{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;}
.sadf-app-buttons .sadf-btn{background:#fff;color:var(--sadf-bg);}
.sadf-app-buttons .sadf-btn i{font-size:1.6rem;}

/* ===== Play now CTA ===== */
.sadf-play-cta{
  text-align:center;padding:2rem 1rem;margin:1rem;
  background:radial-gradient(circle at center,rgba(255,105,180,.18),transparent 70%);
  border-radius:var(--sadf-radius);
}
.sadf-play-cta h3{font-size:2.2rem;color:#fff;margin-bottom:.6rem;}
.sadf-play-cta .sadf-btn{font-size:1.6rem;padding:1.2rem 2.4rem;margin-top:.6rem;}
.sadf-promo-text{font-size:1.4rem;color:var(--sadf-primary);font-weight:700;}

/* ===== FAQ ===== */
.sadf-faq-item{
  background:var(--sadf-bg-2);border-radius:1rem;margin-bottom:.6rem;overflow:hidden;
}
.sadf-faq-q{
  padding:1rem 1.2rem;font-size:1.4rem;font-weight:700;color:#fff;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;
}
.sadf-faq-q i{color:var(--sadf-primary);transition:transform .2s;}
.sadf-faq-item.sadf-open .sadf-faq-q i{transform:rotate(180deg);}
.sadf-faq-a{padding:0 1.2rem 1.1rem;font-size:1.3rem;color:var(--sadf-muted);display:none;}
.sadf-faq-item.sadf-open .sadf-faq-a{display:block;}

/* ===== Footer ===== */
.sadf-footer{
  background:#0f1822;padding:2.2rem 1rem 1rem;margin-top:2rem;
  border-top:.2rem solid var(--sadf-primary);
}
.sadf-footer-brand{font-size:1.5rem;color:var(--sadf-text);margin-bottom:1rem;}
.sadf-footer-brand strong{color:var(--sadf-primary);}
.sadf-footer-links{
  display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1.2rem;
}
.sadf-footer-links a{
  font-size:1.2rem;color:var(--sadf-muted);padding:.3rem .7rem;
  background:var(--sadf-bg-2);border-radius:.7rem;
}
.sadf-footer-links a:hover{color:#fff;background:rgba(240,128,128,.2);}
.sadf-footer-promos{
  display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0;
}
.sadf-footer-promos .sadf-btn{flex:1;min-width:9rem;font-size:1.25rem;padding:.8rem 1rem;}
.sadf-footer-copy{
  text-align:center;font-size:1.2rem;color:var(--sadf-muted);
  border-top:.1rem solid rgba(255,255,255,.08);padding-top:1rem;margin-top:1rem;
}

/* ===== Mobile bottom navigation ===== */
.sadf-bottomnav{
  position:fixed;bottom:0;left:0;right:0;z-index:1000;
  height:var(--sadf-bottomnav-h);
  background:rgba(28,40,51,.98);
  backdrop-filter:blur(10px);
  border-top:.15rem solid rgba(240,128,128,.3);
  display:flex;justify-content:space-around;align-items:center;
  box-shadow:0 -.3rem 1rem rgba(0,0,0,.35);
}
.sadf-bottomnav-btn{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:none;border:none;cursor:pointer;color:var(--sadf-muted);
  min-width:6rem;min-height:5.6rem;padding:.4rem;gap:.2rem;
  transition:color .15s,transform .15s;flex:1;
}
.sadf-bottomnav-btn:active{transform:scale(.9);}
.sadf-bottomnav-btn i,.sadf-bottomnav-btn span.material-icons-outlined,
.sadf-bottomnav-btn ion-icon{font-size:2.4rem;line-height:1;}
.sadf-bottomnav-btn span:not(.material-icons-outlined){
  font-size:1.05rem;font-weight:600;
}
.sadf-bottomnav-btn.sadf-active{color:var(--sadf-primary);}
.sadf-bottomnav-btn.sadf-active i{color:var(--sadf-accent);}
.sadf-bottomnav-btn.sadf-promo{
  color:var(--sadf-gold);
}
.sadf-bottomnav-btn.sadf-promo i{color:var(--sadf-gold);}
.sadf-bn-badge{
  position:absolute;top:.4rem;right:1.4rem;background:var(--sadf-accent);
  color:#fff;font-size:.95rem;font-weight:700;border-radius:50%;
  width:1.6rem;height:1.6rem;display:flex;align-items:center;justify-content:center;
}
.sadf-bottomnav-btn{position:relative;}

/* Main padding for bottom nav */
main{padding-bottom:calc(var(--sadf-bottomnav-h) + 1rem);}

/* ===== Desktop ===== */
@media (min-width:769px){
  .sadf-bottomnav{display:none;}
  main{padding-bottom:2rem;}
  .sadf-wrapper{max-width:760px;}
  .sadf-grid{grid-template-columns:repeat(6,1fr);}
  .sadf-pay-grid{grid-template-columns:repeat(6,1fr);}
  .sadf-card-grid{grid-template-columns:1fr 1fr;}
  .sadf-menu-toggle{display:none;}
}

/* ===== Utilities ===== */
.sadf-text-center{text-align:center;}
.sadf-mt-1{margin-top:1rem;}
.sadf-mb-1{margin-bottom:1rem;}
.sadf-hide-desktop{}
@media (min-width:769px){.sadf-hide-desktop{display:none !important;}}
.sadf-show-desktop{display:none;}
@media (min-width:769px){.sadf-show-desktop{display:block;}}

/* Fade-in animation for sections */
.sadf-fade{opacity:0;transform:translateY(1rem);transition:opacity .5s,transform .5s;}
.sadf-fade.sadf-in{opacity:1;transform:translateY(0);}
