
/* ==========================================================
   Nairobi Sweets V5 Phase 3
   Admin, login, dashboard, join, SEO and global polish
========================================================== */
:root{
  --v5-gold:#ffd84b;
  --v5-orange:#ff9f1c;
  --v5-navy:#050750;
  --v5-deep:#02030f;
  --v5-glass:rgba(8,14,55,.74);
  --v5-line:rgba(255,216,75,.18);
  --v5-white:rgba(255,255,255,.08);
}

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

body{
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,216,75,.10), transparent 25%),
    radial-gradient(circle at 88% 12%, rgba(255,45,117,.14), transparent 30%),
    radial-gradient(circle at top,#07105a 0%,#03040f 46%,#000 100%) !important;
}

input,select,textarea,button{
  font:inherit;
}

input,select,textarea{
  border:1px solid rgba(255,216,75,.18) !important;
  background:rgba(3,7,32,.76) !important;
  color:#fff !important;
  outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

input:focus,select:focus,textarea:focus{
  border-color:rgba(255,216,75,.46) !important;
  box-shadow:0 0 0 4px rgba(255,216,75,.10), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

button,a,.btn,[role="button"]{
  -webkit-tap-highlight-color:transparent;
}

button:active,a:active,.btn:active{
  transform:scale(.98);
}

img,video{
  max-width:100%;
}

/* Universal luxury cards without destroying existing layouts */
.card,
.profile-card,
.login-card,
.auth-card,
.dashboard-card,
.vault-card,
.panel,
.box,
.stat-card,
.stat-mini,
.join-price-card,
.join-pricing-box,
.seo-locations-box,
.disclaimer-box,
.map-card,
.sweet-panel,
.form-card,
.admin-panel,
.table-wrap{
  background:linear-gradient(145deg,rgba(10,15,70,.78),rgba(2,5,35,.84)) !important;
  border:1px solid var(--v5-line) !important;
  box-shadow:0 24px 80px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.055) !important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.topbar,
.site-header,
.header,
.navbar,
.admin-header,
.dashboard-header{
  background:rgba(0,0,0,.84) !important;
  border-bottom:1px solid rgba(255,216,75,.14) !important;
  backdrop-filter:blur(22px) saturate(1.15);
  -webkit-backdrop-filter:blur(22px) saturate(1.15);
  box-shadow:0 14px 36px rgba(0,0,0,.34);
}

.btn,
button,
.install-app-btn,
.hero-join-btn,
.hero-login-btn,
.join-main-link,
.call-btn,
.wa-btn,
.view-profile-btn,
.live-location-btn{
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.install-app-btn,
.hero-join-btn,
.join-main-link,
.view-profile-btn{
  box-shadow:0 16px 34px rgba(255,159,28,.22) !important;
}

.btn:hover,
button:hover,
.install-app-btn:hover,
.hero-join-btn:hover,
.join-main-link:hover{
  filter:brightness(1.06);
}

/* Tables */
table{
  border-collapse:separate !important;
  border-spacing:0 8px !important;
}

td,th{
  border-bottom:1px solid rgba(255,255,255,.06) !important;
}

tr{
  background:rgba(255,255,255,.035);
}

/* Mobile nav */
.bottom-nav{
  height:calc(70px + env(safe-area-inset-bottom)) !important;
  padding-bottom:env(safe-area-inset-bottom) !important;
  background:rgba(0,0,0,.88) !important;
  border-top:1px solid rgba(255,216,75,.14) !important;
  backdrop-filter:blur(20px) saturate(1.15);
  -webkit-backdrop-filter:blur(20px) saturate(1.15);
}

.bottom-nav a{
  min-width:46px;
  min-height:46px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,216,75,.08);
  border:1px solid rgba(255,216,75,.12);
}

/* PWA install help */
.v5-install-hint{
  position:fixed;
  left:16px;
  right:16px;
  bottom:calc(86px + env(safe-area-inset-bottom));
  z-index:99999;
  display:none;
  padding:16px;
  border-radius:22px;
  background:linear-gradient(145deg,rgba(4,9,47,.94),rgba(0,0,0,.92));
  border:1px solid rgba(255,216,75,.22);
  box-shadow:0 20px 60px rgba(0,0,0,.55);
  color:#fff;
}

.v5-install-hint.show{
  display:block;
}

.v5-install-hint strong{
  display:block;
  color:var(--v5-gold);
  font-size:18px;
  margin-bottom:6px;
}

.v5-install-hint p{
  margin:0;
  color:#e5e7eb;
  line-height:1.5;
  font-size:13px;
}

.v5-install-hint button{
  margin-top:12px;
  width:100%;
  min-height:44px;
  border:0;
  border-radius:14px;
  background:linear-gradient(135deg,var(--v5-gold),var(--v5-orange));
  color:#000;
  font-weight:950;
}

/* Loading */
.v5-skeleton{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#050750,#000);
}

.v5-skeleton::before{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  animation:v5Shimmer 1.4s infinite;
}

@keyframes v5Shimmer{
  100%{transform:translateX(100%)}
}

/* Better mobile breathing room */
@media(max-width:720px){
  body{
    padding-bottom:calc(92px + env(safe-area-inset-bottom)) !important;
  }

  .topbar,
  .site-header,
  .header,
  .navbar{
    padding-top:calc(12px + env(safe-area-inset-top)) !important;
  }

  .hero,
  .page,
  main{
    scroll-margin-top:90px;
  }

  .stats-box,
  .join-pricing-grid,
  .profiles{
    gap:14px !important;
  }
}

@media(prefers-reduced-motion:reduce){
  *{
    transition:none !important;
    animation:none !important;
    scroll-behavior:auto !important;
  }
}
