/* =========================================================
   Gaia Receitas Vegetarianas — base.css (FIX MENU + DROPDOWN)
   - Remove duplicações de body/html
   - Mantém NAV fixo + padding-top correto (SÓ com .has-gaia-nav)
   - Mantém dropdown sem cortar
   - Sticky footer sem re-declarar body
   ========================================================= */

/* ====== VARIÁVEIS ====== */
:root{
  --body:        #fff9f3;
  --texto:       #1f2a24;
  --texto-suave: #55635d;
  --menu:        #01333D;
  --cta:         #ff9800;
  --card:        #ffffff;
  --accent:      #e7c69b;

  --radius: 1.2rem;
  --shadow: 0 10px 24px rgba(0,0,0,.07);

  --nav-bg: rgba(1,51,61,.92);
  --nav-h:  72px;

  --hero-min: clamp(300px, 40vh, 460px);
  --hero-pos: center top;

  --h1:  clamp(2.2rem, 2.0rem + 1.5vw, 3.4rem);
  --h2:  clamp(1.9rem, 1.7rem + 1.0vw, 2.8rem);
  --lead:clamp(1.2rem, 1.1rem + .5vw, 1.55rem);
}

/* ====== BASE ====== */
*{ box-sizing:border-box; }

html{ height: 100%; }
body{
  margin:0;
  min-height: 100vh;

  background: var(--body);
  color: var(--texto);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

  /* ✅ Por padrão NÃO empurra topo.
     Só empurra quando existir NAV Gaia (body.has-gaia-nav) */
  padding-top: 0;

  /* sticky footer */
  display: flex;
  flex-direction: column;
}

a{ text-decoration:none; }
img{ max-width:100%; height:auto; }

main.flex-grow-1{ flex: 1 0 auto; }
footer{ margin-top: auto; }

/* ====== NAVBAR ====== */
.navbar-gaia{
  background: var(--nav-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  min-height: var(--nav-h);
  box-shadow: 0 10px 20px rgba(0,0,0,.15);
}

/* NÃO cortar dropdown */
.navbar-gaia,
.navbar-gaia .container{
  overflow: visible !important;
}

/* Botões do menu */
.navbar-gaia .btn{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  border-radius: .7rem;
  font-weight: 700;
  font-size: .92rem;
  padding: .45rem .85rem;
  line-height: 1;
  white-space: nowrap;
}

.navbar-gaia .dropdown-toggle{
  display: inline-flex;
  align-items: center;
}

/* CTA */
.btn-cta{
  background: var(--cta);
  color:#1a1a1a;
  border: 0;
}
.btn-cta:hover{ filter: brightness(.95); }

/* Dropdown Bootstrap padrão */
.navbar-gaia .dropdown-menu{
  margin-top: .35rem;
  z-index: 2100;
}

/* “ponte invisível” */
@media (min-width: 992px){
  .navbar-gaia .dropdown-menu::before{
    content:"";
    position:absolute;
    left:0; right:0;
    top:-10px;
    height:10px;
  }
}

/* ====== HERO ====== */
.hero{
  min-height: var(--hero-min);
  display: grid;
  place-items: center;
  position: relative;
  border-bottom: 1px solid rgba(0,0,0,.06);
  background-position: var(--hero-pos);
}

.hero-overlay{
  width: 100%;
  min-height: var(--hero-min);
  padding: 3.2rem 1.25rem 2.6rem;
  background: radial-gradient(1200px 600px at 50% 35%, rgba(0,0,0,.25), rgba(0,0,0,.55));
}

.hero h1{
  font-size: var(--h1);
  letter-spacing: .2px;
  text-shadow: 0 10px 22px rgba(0,0,0,.35);
}

.hero .lead{
  font-size: var(--lead);
  color: rgba(255,255,255,.90);
  text-shadow: 0 10px 22px rgba(0,0,0,.35);
}

/* ====== TÍTULOS / SEÇÕES ====== */
.section-title{
  font-size: var(--h2);
  font-weight: 800;
  letter-spacing: .2px;
  margin: 2rem 0 1.2rem;
  text-align: center;
}
.muted{ color: var(--texto-suave); }

/* ====== CARDS ====== */
.card-gaia{
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.06);
}
.card-gaia img{
  width: 100%;
  height: 220px;
  object-fit: cover;
}
.card-gaia .card-body{
  padding: 1rem 1rem 1.1rem;
  text-align: center;
}
.card-gaia .card-title{
  font-weight: 800;
  margin: 0.2rem 0 0;
}

/* ====== BUSCA ====== */
.search-wrap{
  max-width: 780px;
  margin: 1.2rem auto 2.2rem;
  padding: 0 1rem;
}
.search-wrap .input-group{
  box-shadow: var(--shadow);
  border-radius: 999px;
  overflow: hidden;
}
.search-wrap input{
  border: 0;
  padding: 0.85rem 1rem;
}
.search-wrap .btn{
  border: 0;
  padding: 0.85rem 1.25rem;
  font-weight: 800;
}

/* ====== MOMENTO KIDS ====== */
.kids-card{
  max-width: 420px;
  margin: 0 auto 2.4rem;
}
.kids-card img{
  width:100%;
  height: 220px;
  object-fit: cover;
}

/* ====== BRAND ====== */
.brand-badge{
  width: 48px;
  height: 48px;
  border-radius: 999px;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.06);

  box-shadow:
    0 10px 20px rgba(0,0,0,.25),
    0 0 0 3px rgba(255,255,255,.10);
  flex-shrink: 0;
}
.brand-badge::before{
  content:"";
  position:absolute;
  inset: 2px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.22);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.18);
  pointer-events:none;
}
.brand-logo{
  border-radius: 999px;
  display:block;
  object-fit: cover;
}

/* ====== RESPONSIVO ====== */
@media (max-width: 992px){
  body.has-gaia-nav{ padding-top: calc(var(--nav-h) + 6px); }

  .hero-overlay{ padding: 2.8rem 1.1rem 2.2rem; }
  .card-gaia img{ height: 200px; }

  .navbar-gaia .btn{
    font-size: .88rem;
    padding: .42rem .75rem;
    border-radius: .65rem;
  }
}

/* ===========================
   FIX GLOBAL: NAV + BADGE fixos (anti-conflito)
   =========================== */

/* ✅ Só empurra topo quando a página REALMENTE tem .navbar-gaia */
body.has-gaia-nav{
  padding-top: var(--nav-h) !important;
}

/* garante que o nav continue FIXO */
.navbar-gaia.fixed-top{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2000 !important;
}

/* dropdown por cima */
.navbar-gaia .dropdown-menu{
  z-index: 2100 !important;
}

/* badge (se você usa) */
.gaia-login-badge{
  position: fixed !important;
  z-index: 2200 !important;
}

/* css efeito botão verde e vermelho no NAV */
.gaia-status-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  display:inline-block;
}
.gaia-status-dot.is-on{
  background:#19c37d;
  box-shadow:0 0 6px rgba(25,195,125,.8);
}
.gaia-status-dot.is-off{
  background:#ff3b30;
  box-shadow:0 0 6px rgba(255,59,48,.8);
}

/* =========================
   Admin • Usuários (listar)
   ========================= */
.admin-users-table .col-id{ width: 60px; }
.admin-users-table .col-plano{ width: 120px; }
.admin-users-table .col-role{ width: 120px; }
.admin-users-table .col-acoes{ width: 340px; }

.admin-users-table .admin-actions{
  white-space: nowrap;
}

.admin-users-table .perm-btn{
  min-width: 140px;
  text-align: center;
}

/* ================================
   Admin • Usuários (listar.php)
   ================================ */
.admin-users-table .actions-cell{
  text-align: right;
  white-space: nowrap;
}
.admin-users-table .actions-wrap{
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.admin-users-table .actions-wrap .btn-group{
  flex: 0 0 auto;
}
.admin-users-table .actions-wrap .action-perm{
  min-width: 140px;
  text-align: center;
}

@media (max-width: 576px){
  .admin-users-table .actions-wrap{
    width: 100%;
    justify-content: flex-start;
  }
  .admin-users-table .actions-cell{
    white-space: normal;
  }
}

/* =========================================================
   ADMIN • Usuários — coluna Ações alinhada
   ========================================================= */
.gaia-actions-cell{
  text-align: right;
  white-space: nowrap;
}
.gaia-actions-wrap{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: .5rem;
  flex-wrap: nowrap;
}
.gaia-actions-wrap .btn,
.gaia-actions-wrap .badge{
  white-space: nowrap;
}

@media (max-width: 576px){
  .gaia-actions-cell{ white-space: normal; }
  .gaia-actions-wrap{ flex-wrap: wrap; justify-content: flex-end; }
}