@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --brand-green: #009E60;
  --brand-green-light: #10B981;
  --brand-green-dark: #007A4B;
  --brand-dark: #0F172A;
  --brand-slate: #334155;
  --brand-bg: #F8FAFC;
}

html {
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
}

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: #1E293B;
  background-color: #F8FAFC;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
  position: relative;
}

/* Senior / High Readability Mode (A+ Liels) */
body.senior-mode {
  font-size: 120% !important;
}

body.senior-mode .text-xs,
body.senior-mode .text-\[10px\],
body.senior-mode .text-\[11px\] {
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
}

body.senior-mode .text-sm {
  font-size: 1.1rem !important;
  line-height: 1.6 !important;
}

body.senior-mode .text-base,
body.senior-mode p,
body.senior-mode li,
body.senior-mode .service-desc {
  font-size: 1.25rem !important;
  line-height: 1.6 !important;
}

/* Crisp dark text on light backgrounds in Senior Mode */
body.senior-mode .bg-white p,
body.senior-mode .bg-white li,
body.senior-mode .bg-slate-50 p,
body.senior-mode .bg-slate-50 li,
body.senior-mode .bg-slate-100 p,
body.senior-mode .bg-slate-100 li,
body.senior-mode .bg-\[\#F8FAFC\] p,
body.senior-mode .bg-\[\#F8FAFC\] li,
body.senior-mode main p,
body.senior-mode main li {
  color: #0F172A !important;
}

/* High contrast for dark containers in Senior Mode (prevents black-on-black) */
body.senior-mode .bg-brand-dark p,
body.senior-mode .bg-brand-dark li,
body.senior-mode .bg-brand-dark span:not(#pkg-popular-badge),
body.senior-mode #komplekti li,
body.senior-mode #komplekti span:not(#pkg-popular-badge):not(#pkg-popular-price),
body.senior-mode #parents-desc,
body.senior-mode #kontakti p,
body.senior-mode #kontakti li,
body.senior-mode #kontakti span,
body.senior-mode .text-slate-200,
body.senior-mode .text-slate-300,
body.senior-mode .text-emerald-100 {
  color: #F8FAFC !important;
}

body.senior-mode .text-lg {
  font-size: 1.35rem !important;
  line-height: 1.5 !important;
}

body.senior-mode .text-xl {
  font-size: 1.55rem !important;
  line-height: 1.4 !important;
}

body.senior-mode .text-2xl {
  font-size: 1.85rem !important;
  line-height: 1.3 !important;
}

body.senior-mode .text-3xl {
  font-size: 2.25rem !important;
  line-height: 1.2 !important;
}

body.senior-mode .text-4xl,
body.senior-mode .text-5xl,
body.senior-mode .text-6xl,
body.senior-mode #hero-title,
body.senior-mode h1 {
  font-size: clamp(2.75rem, 5.5vw, 4.25rem) !important;
  line-height: 1.15 !important;
}

body.senior-mode input,
body.senior-mode select,
body.senior-mode textarea {
  font-size: 1.15rem !important;
  padding: 0.85rem 1rem !important;
}

body.senior-mode label {
  font-size: 0.95rem !important;
}

/* Content buttons scale gently for seniors without crowding borders */
body.senior-mode button,
body.senior-mode a.rounded-xl,
body.senior-mode a.rounded-2xl,
body.senior-mode a[class*="rounded"],
body.senior-mode #pieteikt button,
body.senior-mode form button,
body.senior-mode .hero-cta-btn,
body.senior-mode .package-btn,
body.senior-mode .service-btn {
  font-size: 0.9375rem !important;
  line-height: 1.3 !important;
  letter-spacing: normal !important;
}

body.senior-mode #hero-btn-call-label {
  font-size: 0.8125rem !important;
  line-height: 1.1 !important;
}

body.senior-mode #hero-btn-call-num {
  font-size: 0.9375rem !important;
  line-height: 1.2 !important;
}

/* HEADER & TOP-BAR STABILITY in Senior Mode */
body.senior-mode header,
body.senior-mode .top-bar-nav,
body.senior-mode header nav,
body.senior-mode header a,
body.senior-mode header button,
body.senior-mode #top-bar,
body.senior-mode .font-toggle-container button {
  font-size: initial;
}

body.senior-mode header a.inline-flex,
body.senior-mode header button {
  font-size: 0.8125rem !important;
}

@media (max-width: 640px) {
  body.senior-mode header h1 {
    font-size: 1.15rem !important;
  }
}


/* Custom Utilities */
.bg-brand-green {
  background-color: #009E60;
}

.bg-brand-green-dark {
  background-color: #007A4B;
}

.text-brand-green {
  color: #009E60;
}

.border-brand-green {
  border-color: #009E60;
}

.bg-brand-dark {
  background-color: #0F172A;
}

.glass-nav {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.glass-dark {
  background: rgba(15, 23, 42, 0.92);
  backdrop-filter: blur(12px);
}

/* Badge Pulse */
@keyframes green-pulse {
  0% { box-shadow: 0 0 0 0 rgba(0, 158, 96, 0.5); }
  70% { box-shadow: 0 0 0 12px rgba(0, 158, 96, 0); }
  100% { box-shadow: 0 0 0 0 rgba(0, 158, 96, 0); }
}

.pulse-green {
  animation: green-pulse 2s infinite;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #F1F5F9;
}
::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94A3B8;
}

/* Shimmer animation for store badge */
@keyframes shimmer {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(200%); }
}

.shimmer-badge {
  position: relative;
  overflow: hidden;
}

.shimmer-badge::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  animation: shimmer 2.5s infinite;
}

/* Seamless Google Translate suppression */
.goog-te-banner-frame.skiptranslate,
.goog-te-banner-frame,
#goog-gt-tt,
.goog-te-balloon-frame {
  display: none !important;
  visibility: hidden !important;
}

body {
  top: 0px !important;
  position: static !important;
}

.goog-tooltip,
.goog-tooltip:hover {
  display: none !important;
}

.goog-text-highlight {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.skiptranslate > iframe {
  height: 0 !important;
  border: 0 !important;
  visibility: hidden !important;
}

/* Accessibility: prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .animate-ping, .pulse-green, .shimmer-badge::after {
    animation: none !important;
  }
}

/* Storefront & Modal Utilities */
.hover\:underline:hover { text-decoration: underline; }
.mt-2\.5 { margin-top: 0.625rem; }
.max-h-\[60vh\] { max-height: 60vh; }
.list-disc { list-style-type: disc; }
.list-inside { list-style-position: inside; }
.space-y-0\.5 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.125rem; }
.pl-1 { padding-left: 0.25rem; }
.animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }

/* Component & Selector classes */
.lang-toggle-container { display: flex; align-items: center; }
.lang-btn { cursor: pointer; user-select: none; }
.lang-btn-mob { cursor: pointer; user-select: none; }
.star-btn { cursor: pointer; transition: transform 0.15s ease; }
.star-btn:hover { transform: scale(1.15); }

/* Button alignment, typography & text centering */
button, .btn, a.btn, input[type="button"], input[type="submit"] {
  text-align: center;
  box-sizing: border-box;
}

button[class*="flex"]:not(#faq-accordion button):not([id^="faq-btn-"]):not(.hidden):not(.lg\:hidden):not([class*="hidden"]):not([style*="display: none"]),
a[class*="flex"][class*="rounded"]:not(.hidden):not([class*="hidden"]) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

@media (min-width: 1024px) {
  #mobile-menu-btn,
  .lg\:hidden {
    display: none !important;
  }
}

button[class*="flex"] > i, a[class*="flex"] > i,
button[class*="flex"] > svg, a[class*="flex"] > svg,
button[class*="flex"] > span[aria-hidden="true"],
a[class*="flex"] > span[aria-hidden="true"] {
  flex-shrink: 0 !important;
}

/* Button core typography and breathing room across all rounded variants */
button[class*="rounded-xl"], a[class*="rounded-xl"],
button[class*="rounded-2xl"], a[class*="rounded-2xl"],
button.btn, a.btn {
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Lucide icon placeholder: reserve dimension so layout doesn't jump */
i[data-lucide]:empty {
  display: inline-block;
  visibility: hidden;
}

/* FAQ Accordion Styling: left-align question, push chevron to right edge */
#faq-accordion button,
button[id^="faq-btn-"] {
  text-align: left !important;
  justify-content: space-between !important;
  display: flex !important;
  width: 100% !important;
}

#faq-accordion button > span,
button[id^="faq-btn-"] > span {
  text-align: left !important;
  flex: 1 1 auto;
}

#faq-accordion button svg,
#faq-accordion button i,
button[id^="faq-btn-"] svg,
button[id^="faq-btn-"] i {
  flex-shrink: 0 !important;
  margin-left: 0.75rem;
}