/* Tarima v24 — PWA + Mobile Polish. No reemplaza imágenes. */
:root{
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
html{scroll-behavior:smooth}
body{padding-bottom:0}

.mobile-tabbar{
  display:none;
}

.pwa-install-card{
  position:fixed;
  left:18px;
  right:18px;
  bottom:calc(92px + var(--safe-bottom));
  z-index:9999;
  border:1px solid rgba(212,175,55,.28);
  border-radius:24px;
  background:linear-gradient(135deg,rgba(17,17,17,.96),rgba(5,5,5,.96));
  color:#fff;
  box-shadow:0 24px 80px rgba(0,0,0,.62),0 0 40px rgba(212,175,55,.12);
  padding:16px 54px 16px 18px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:center;
  backdrop-filter:blur(18px);
}
.pwa-install-card[hidden]{display:none!important}
.pwa-install-card strong{display:block;font-size:16px;margin-bottom:4px;color:#fff}
.pwa-install-card p{margin:0;color:rgba(255,255,255,.72);font-size:13px;line-height:1.35}
.pwa-install-card button{
  border:0;
  cursor:pointer;
  border-radius:999px;
  font-weight:900;
}
#tarimaInstallBtn{
  background:linear-gradient(135deg,#f7d75c,#d4af37);
  color:#050505;
  padding:12px 16px;
}
.pwa-dismiss{
  position:absolute;
  right:12px;
  top:10px;
  width:30px;
  height:30px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:20px;
  line-height:1;
}

.offline-pro{
  min-height:70vh;
  display:grid;
  place-items:center;
  padding:60px 22px;
  background:radial-gradient(circle at 50% 20%,rgba(212,175,55,.18),transparent 32%),#050505;
}
.offline-card{
  width:min(560px,100%);
  text-align:center;
  border:1px solid rgba(255,255,255,.1);
  border-radius:34px;
  background:rgba(12,12,12,.88);
  padding:44px 28px;
  box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.offline-mark{
  display:inline-grid;
  place-items:center;
  width:74px;
  height:74px;
  border-radius:24px;
  background:linear-gradient(135deg,#f7d75c,#d4af37);
  color:#050505;
  font-size:42px;
  font-weight:950;
  margin-bottom:20px;
}
.offline-card h1{font-size:clamp(34px,6vw,58px);line-height:.98;margin:0 0 14px;color:#fff;letter-spacing:-.04em}
.offline-card p{color:rgba(255,255,255,.76);line-height:1.6;margin:0 0 26px}

@media(max-width:850px){
  body{padding-bottom:calc(84px + var(--safe-bottom))}
  .footer{padding-bottom:calc(110px + var(--safe-bottom))!important}
  .topbar{z-index:50}
  .nav{padding:12px 0}
  .brand{font-size:19px}
  .mobile-tabbar{
    position:fixed;
    left:10px;
    right:10px;
    bottom:calc(10px + var(--safe-bottom));
    z-index:9998;
    height:72px;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    align-items:center;
    gap:4px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:28px;
    background:rgba(8,8,8,.86);
    backdrop-filter:blur(22px);
    box-shadow:0 18px 70px rgba(0,0,0,.62),0 0 34px rgba(212,175,55,.08);
    padding:7px;
  }
  .mobile-tabbar-item{
    height:58px;
    border-radius:22px;
    color:rgba(255,255,255,.72);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    font-weight:800;
    text-decoration:none;
    transition:.18s ease;
  }
  .mobile-tabbar-item small{font-size:10px;line-height:1;letter-spacing:.01em}
  .tab-icon{font-size:19px;line-height:1;color:inherit}
  .mobile-tabbar-item.active,
  .mobile-tabbar-item:hover{
    color:#d4af37;
    background:rgba(212,175,55,.08);
  }
  .mobile-tabbar-main{
    color:#050505;
    background:linear-gradient(135deg,#f7d75c,#d4af37);
    box-shadow:0 8px 28px rgba(212,175,55,.22);
  }
  .mobile-tabbar-main.active,
  .mobile-tabbar-main:hover{
    color:#050505;
    background:linear-gradient(135deg,#f7d75c,#d4af37);
  }

  .artist-register-pro,
  .venue-register-pro,
  .artist-profile-hero,
  .booking-pro,
  .dashboard-pro{
    overflow-x:hidden;
  }

  input,select,textarea,button{font-size:16px!important}
  .btn,.btn-gold,.btn-outline,.btn-dark{min-height:48px}

  .grid-3,.media-grid,.highlight-grid,.reservation-grid,.trust-grid{
    grid-template-columns:1fr!important;
  }

  .profile-card,
  .artist-profile-wrap,
  .booking-layout,
  .dashboard-layout{
    grid-template-columns:1fr!important;
  }
}
