/* Yico Softwares - direitos reservados */
/* LexOS — Light Premium theme refinements */
html { scroll-behavior: smooth; }
body {
  background-color: #F7F7F8;
  color: #111827;
  -webkit-font-smoothing: antialiased;
}

:root {
  --background: #F7F7F8;
  --foreground: #111827;
  --border: #E5E7EB;
  --surface: #FFFFFF;
  --surface-secondary: #FCFCFD;
  --text-primary: #111827;
  --text-secondary: #374151;
  --text-tertiary: #6B7280;
  --primary: #4FAFA7;
  --primary-hover: #3E9E97;
  --danger: #EF4444;
  --warning: #F59E0B;
  --success: #10B981;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --shadow-soft: 0 8px 30px rgba(15,23,42,.05);
  --shadow-card: 0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.05);
}

/* Cards float softly */
.bg-card, [class*="bg-card"] {
  box-shadow: var(--shadow-card);
  border-color: rgba(15,23,42,.06) !important;
}

/* Header: white translucent with blur */
header.sticky {
  background-color: rgba(255,255,255,0.75) !important;
  border-bottom: 1px solid rgba(15,23,42,.06) !important;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
}

/* Primary teal buttons hover */
.bg-lex-teal:hover, .hover\:bg-lex-teal:hover { background-color: #3E9E97 !important; }

/* Soft pastel alerts */
.bg-lex-red\/10 { background-color: rgba(239,68,68,.08) !important; }
.bg-lex-orange\/10 { background-color: rgba(245,158,11,.10) !important; }
.bg-lex-green\/10 { background-color: rgba(16,185,129,.10) !important; }
.bg-lex-blue\/10  { background-color: rgba(59,130,246,.10) !important; }

/* Back-to-top */
#back-to-top {
  position: fixed;
  bottom: 78px;
  right: 20px;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  color: #374151;
  cursor: pointer;
  z-index: 50;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease, background .25s ease, border-color .25s ease, color .25s ease;
  backdrop-filter: blur(8px);
  box-shadow: 0 8px 30px rgba(15,23,42,.06);
}
#back-to-top.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
#back-to-top:hover {
  background: #F3FBFA;
  border-color: rgba(79,175,167,.35);
  color: #3E9E97;
}
#back-to-top svg { width: 18px; height: 18px; }

/* Smooth area/pricing transitions */
#area-panel { transition: opacity .35s ease; }
#area-panel.is-swapping { opacity: 0; }
.price-flip { animation: priceFlip .35s ease; }
@keyframes priceFlip {
  0% { opacity: 0; transform: translateY(-4px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Dashboard mockup keeps dark contrast on light site */
.dashboard-mock, .bg-\[\#0A121C\] { color: #E5EDF5; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .price-flip, #area-panel { transition: none; animation: none; }
}

/* Restore dashboard mockup dark surface for elegant contrast */
.bg-\[\#0A121C\] { background-color: #0F172A !important; color: #E5EDF5; }
.bg-\[\#0A121C\] .text-muted-foreground { color: #94A3B8 !important; }
.bg-\[\#0A121C\] * { border-color: rgba(255,255,255,.08); }

/* Light card-lex */
.card-lex {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 8px 30px rgba(15,23,42,.05) !important;
}
.card-lex:hover {
  border-color: rgba(79,175,167,.35) !important;
  box-shadow: 0 2px 6px rgba(15,23,42,.06), 0 20px 40px rgba(15,23,42,.08) !important;
  transform: translateY(-2px);
}

/* Btn secondary light */
.btn-secondary-lex:hover { background: #F3F4F6 !important; }

/* Chip/pill light backgrounds that used bg-white/[.02] etc */
.bg-white\/\[0\.02\], .bg-white\/\[0\.03\], .bg-white\/\[0\.05\] {
  background-color: rgba(15,23,42,.03) !important;
}

/* Keep the dark dashboard mockup's inner chips using their originals: scope override */
.bg-\[\#0A121C\] .bg-white\/\[0\.02\],
.bg-\[\#0A121C\] .bg-white\/\[0\.03\],
.bg-\[\#0A121C\] .bg-white\/\[0\.05\] {
  background-color: rgba(255,255,255,.03) !important;
}
.bg-\[\#0A121C\] .card-lex { background: rgba(255,255,255,.04) !important; border-color: rgba(255,255,255,.08) !important; color: #E5EDF5; box-shadow: none !important; }

/* Footer light */
footer { background-color: #F7F7F8 !important; border-top: 1px solid #E5E7EB; color: #374151; }
