/* GIGIA — custom polish on top of DaisyUI. Mobile-first, iOS-friendly. */

:root{
  --gigia-slate-900:#1E293B;
  --gigia-slate-700:#475569;
  --gigia-slate-400:#94A3B8;
  --gigia-slate-200:#E2E8F0;
  --safe-top: env(safe-area-inset-top);
  --safe-bottom: env(safe-area-inset-bottom);
  --safe-left: env(safe-area-inset-left);
  --safe-right: env(safe-area-inset-right);
}

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
}
body{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  min-height:100dvh;
}

/* kill the iOS tap-highlight flash but keep focus visible */
*{ -webkit-tap-highlight-color:transparent; }
:focus-visible{ outline:2px solid oklch(var(--p)); outline-offset:2px; border-radius:6px; }

/* inputs at 16px prevent iOS zoom */
input, select, textarea{ font-size:16px !important; }

/* safe-area padding helpers */
.safe-top{ padding-top:max(0.75rem, var(--safe-top)); }
.safe-bottom{ padding-bottom:max(0.75rem, var(--safe-bottom)); }
.safe-x{ padding-left:max(1rem, var(--safe-left)); padding-right:max(1rem, var(--safe-right)); }

/* hero gradient — slate palette */
.gigia-hero{
  background:
    radial-gradient(1200px 500px at 85% -10%, rgba(148,163,184,0.35), transparent 60%),
    radial-gradient(900px 500px at 5% 110%, rgba(30,41,59,0.18), transparent 55%),
    linear-gradient(180deg, #F8FAFC 0%, #EEF2F7 100%);
}
[data-theme="dark"] .gigia-hero{
  background:
    radial-gradient(1200px 500px at 85% -10%, rgba(148,163,184,0.18), transparent 60%),
    radial-gradient(900px 500px at 5% 110%, rgba(30,41,59,0.6), transparent 55%),
    linear-gradient(180deg, #0F172A 0%, #1E293B 100%);
}

/* pillar card hover */
.pillar-card{ transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.pillar-card:hover{ transform:translateY(-3px); box-shadow:0 14px 40px -18px rgba(30,41,59,.35); }

/* offer card discount ribbon */
.offer-card{ position:relative; overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
.offer-card:active{ transform:scale(.99); }
.offer-card .ribbon{
  position:absolute; top:12px; left:12px;
  background:oklch(var(--er)); color:oklch(var(--erc));
  font-weight:700; font-size:.75rem; padding:.25rem .6rem; border-radius:999px;
  box-shadow:0 6px 16px -6px rgba(220,38,38,.6);
}

/* chip row for example prompts */
.chip-row{
  display:flex; gap:.5rem; overflow-x:auto; padding:.25rem .25rem .75rem;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.chip-row::-webkit-scrollbar{ display:none; }
.chip-row > *{ scroll-snap-align:start; flex:0 0 auto; }

/* sticky bottom chat opener on mobile */
.chat-fab{
  position:fixed;
  right:max(1rem, var(--safe-right));
  bottom:calc(max(1rem, var(--safe-bottom)) + 4rem);
  z-index:40;
  box-shadow:0 20px 40px -18px rgba(30,41,59,.55);
}
@media (min-width: 1024px){
  .chat-fab{ bottom:max(1.25rem, var(--safe-bottom)); }
}

/* mobile bottom tab bar (Nextdoor-style) */
.mobile-tabbar{
  position:fixed; left:0; right:0; bottom:0; z-index:30;
  display:flex; justify-content:space-around;
  background:oklch(var(--b1)/.92);
  backdrop-filter:saturate(1.4) blur(12px);
  -webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-top:1px solid oklch(var(--b2));
  padding:.35rem max(.5rem, var(--safe-right)) max(.5rem, var(--safe-bottom)) max(.5rem, var(--safe-left));
}
.mobile-tabbar a{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; padding:.35rem .25rem; font-size:.7rem; color:oklch(var(--bc)/.7);
  border-radius:.75rem; min-height:48px;
}
.mobile-tabbar a.active{ color:oklch(var(--p)); background:oklch(var(--p)/.07); }
.mobile-tabbar svg{ width:22px; height:22px; }
@media (min-width: 1024px){ .mobile-tabbar{ display:none; } }

/* give the page room above the mobile tabbar */
.has-tabbar{ padding-bottom:5.5rem; }
@media (min-width: 1024px){ .has-tabbar{ padding-bottom:3rem; } }

/* skip link */
.skip-link{
  position:absolute; left:-999px; top:0; z-index:100;
  background:oklch(var(--p)); color:oklch(var(--pc));
  padding:.75rem 1rem; border-radius:.5rem;
}
.skip-link:focus{ left:1rem; top:1rem; }

/* privacy badge — shown on sensitive storage places */
.badge-privacy{
  display:inline-flex; align-items:center; gap:.4rem;
  background:oklch(var(--su)/.12); color:oklch(var(--su));
  border:1px solid oklch(var(--su)/.4);
  padding:.25rem .6rem; border-radius:999px; font-size:.72rem; font-weight:600;
}

/* empty states */
.empty-state{
  text-align:center; padding:3rem 1rem; color:oklch(var(--bc)/.7);
}

/* subtle card hover */
.card-hover{ transition: transform .2s ease, box-shadow .2s ease; }
.card-hover:hover{ transform:translateY(-2px); box-shadow:0 12px 30px -16px rgba(30,41,59,.3); }

/* chat bubbles */
.chat-bubble-user{ background:oklch(var(--p)); color:oklch(var(--pc)); }
.chat-bubble-ai{ background:oklch(var(--b2)); color:oklch(var(--bc)); }

/* strike-through original price neat */
del.price{ color:oklch(var(--bc)/.5); margin-right:.4rem; }

/* iOS: allow pull-to-refresh but prevent rubber-banding glitches on chat */
.no-bounce{ overscroll-behavior-y:contain; }

/* loading skeleton */
.skel{
  background:linear-gradient(90deg, oklch(var(--b2)) 25%, oklch(var(--b3)/.4) 37%, oklch(var(--b2)) 63%);
  background-size:400% 100%;
  animation:skel 1.4s ease infinite;
  border-radius:.5rem;
}
@keyframes skel{ 0%{background-position:100% 0;} 100%{background-position:0 0;} }

/* mark text we want AI crawlers to pull first (AEO) */
[data-aeo]{ scroll-margin-top:5rem; }

/* large touch targets everywhere */
.btn, .tab, .menu li > *, .link{ min-height:40px; }
@media (max-width: 640px){
  .btn{ min-height:44px; }
}