@import url('top-bar.css');
@import url('hero.css');
@import url('footer.css');
@import url('packs.css');
@import url('modal.css');
@import url('fecha.css');
@import url('divisor.css');
@import url('terms.css');
@import url('how.css');
@import url('courses.css');
@import url('numeros-resultados.css');

/* ================= RESET ================= */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
}

html {
  scroll-behavior: smooth;
}
#garage1 {
  scroll-margin-top: 90px; /* Ajusta al alto de tu topbar */
}

#sorteo-en-vivo {
  scroll-margin-top: 600px; /* Ajusta al alto de tu topbar */
}

#como-funciona {
  scroll-margin-top: 90px; /* Ajusta al alto de tu topbar */
}

#packs {
  scroll-margin-top: 30px; /* Ajusta al alto de tu topbar */
}
/* ================= BASE ================= */

body {
  font-family: ui-sans-serif, system-ui, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
  background: #0b0b0b;
  color: #fff;
  overflow-x: hidden;
}

/* ================= SCROLL TOP ================= */

#scrollTopBtn {
  position: fixed;
  bottom: 100px;   /* ← antes 24px */
  right: 24px;

  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #ffc400;
  background: rgba(255,196,0,.12);
  color: #ffc400;

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;

  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: .25s ease;
  z-index: 999;
}


#scrollTopBtn.show {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

#scrollTopBtn:hover {
  background: #ffc400;
  color: #000;
  box-shadow: 0 0 16px rgba(255,122,0,.6);
}

#scrollTopBtn svg {
  width: 20px;
  height: 20px;
}

/* ================= WHATSAPP ================= */

#whatsappBtn{
position:fixed;
bottom:25px;
right:25px;
width:56px;
height:56px;
border-radius:50%;
background:#25d366;
display:flex;
align-items:center;
justify-content:center;
box-shadow:0 8px 22px rgba(0,0,0,.35);
z-index:999;
transition:.3s;
}

#whatsappBtn svg{
width:28px;
height:28px;
color:white;
}

#whatsappBtn:hover{
transform:scale(1.08);
}

/* ================= MOBILE GLOBAL ================= */

@media (max-width:768px){

/* SAFE AREA (iOS) */
body {
  padding-bottom: env(safe-area-inset-bottom);
}

/* CONTENEDORES */
.container,
.main-content {
  padding: 12px;
}

/* TITULOS */
h1 { font-size: 22px; }
h2 { font-size: 20px; }
h3 { font-size: 18px; }

/* CARDS */
.card {
  padding: 14px;
  border-radius: 12px;
}

.dashboard-cards {
  grid-template-columns: 1fr;
  gap: 12px;
}

/* WIDGETS */
.dashboard-widgets {
  grid-template-columns: 1fr;
}

/* ICONOS */
.feature svg {
  width: 20px;
  height: 20px;
  padding: 5px;
}

/* ================= FLOATING BUTTONS (MOBILE) ================= */

/* WHATSAPP ABAJO */

#whatsappBtn {
  right: 16px;
  bottom: 16px;

  width: 52px;
  height: 52px;
}

#whatsappBtn svg {
  width: 24px;
  height: 24px;
}

/* SCROLL TOP ARRIBA */

#scrollTopBtn {
  right: 16px;
  bottom: 84px;

  width: 48px;
  height: 48px;
}

#scrollTopBtn svg {
  width: 22px;
  height: 22px;
}

/* SIN HOVER EN MOBILE */

#scrollTopBtn:hover,
#whatsappBtn:hover {
  transform: none;
  box-shadow: none;
  background: inherit;
  color: inherit;
}

/* TABLAS */
table {
  font-size: 13px;
}

/* INPUTS (evita zoom iOS) */
input,
select,
textarea {
  font-size: 16px;
}

/* SIDEBAR */
.sidebar {
  width: 100%;
}

/* BOTONES */
.btn {
  padding: 10px 14px;
}

/* TAP FEEDBACK */
button:active,
#scrollTopBtn:active,
#whatsappBtn:active {
  transform: scale(.96);
}

/* PREVENIR SCROLL RARO */
* {
  overscroll-behavior: contain;
}

}