/* ═══════════════════════════════════════════════════
   Lakewood Oaks — Theme System (Dark default + Light)
   Include this AFTER page <style> blocks so overrides win
   ═══════════════════════════════════════════════════ */

/* ─── Smooth transition on theme change ─── */
html.theme-transition,
html.theme-transition *,
html.theme-transition *::before,
html.theme-transition *::after {
  transition: background-color 0.35s ease,
              color 0.35s ease,
              border-color 0.35s ease,
              box-shadow 0.35s ease !important;
}

/* ─── Theme toggle button ─── */
.theme-toggle {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
  cursor: pointer; transition: all 0.3s; color: rgba(255,255,255,0.7);
  flex-shrink: 0;
}
.theme-toggle:hover {
  background: rgba(140,165,81,0.15); border-color: rgba(140,165,81,0.3);
  color: #8CA551;
}
.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }
[data-theme="light"] .theme-toggle .icon-sun { display: block; }
[data-theme="light"] .theme-toggle .icon-moon { display: none; }

/* ══════════════════════════════════════════
   LIGHT MODE OVERRIDES
   ══════════════════════════════════════════ */

/* ─── Body & base ─── */
[data-theme="light"] body {
  background: #f5f5f2 !important;
  color: #1a1a1a !important;
}

/* ─── Navigation ─── */
[data-theme="light"] .page-nav {
  background: linear-gradient(to bottom, rgba(245,245,242,0.95), transparent) !important;
}
[data-theme="light"] .nav-back {
  color: rgba(0,0,0,0.6) !important;
}
[data-theme="light"] .nav-back:hover { color: #1a1a1a !important; }
[data-theme="light"] .nav-links a {
  color: rgba(0,0,0,0.5) !important;
}
[data-theme="light"] .nav-links a:hover,
[data-theme="light"] .nav-links a.active {
  color: #1a1a1a !important;
}
[data-theme="light"] .nav-logo {
  background: #8CA551 !important;
}
[data-theme="light"] .theme-toggle {
  background: rgba(0,0,0,0.05); border-color: rgba(0,0,0,0.1);
  color: rgba(0,0,0,0.6);
}
[data-theme="light"] .theme-toggle:hover {
  background: rgba(107,138,58,0.12); border-color: rgba(107,138,58,0.3);
  color: #5a7630;
}

/* ─── Hero (adjust brightness for light mode) ─── */
[data-theme="light"] .hero-bg {
  filter: brightness(0.75) !important;
}
[data-theme="light"] .hero-video {
  filter: brightness(0.75) !important;
}
[data-theme="light"] .hero-title {
  color: white !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.3);
}
[data-theme="light"] .hero-label {
  color: #8CA551 !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.2);
}
[data-theme="light"] .hero-desc {
  color: rgba(255,255,255,0.9) !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.3);
}

/* ─── Section headings & text ─── */
[data-theme="light"] .section-label {
  color: #6b8a3a !important;
}
[data-theme="light"] .section-desc {
  color: rgba(0,0,0,0.55) !important;
}

/* ─── Cards (generic pattern) ─── */
[data-theme="light"] .stat-card,
[data-theme="light"] .model-card,
[data-theme="light"] .render-card,
[data-theme="light"] .plan-card,
[data-theme="light"] .contact-cta,
[data-theme="light"] .amenity-detail,
[data-theme="light"] .floorplan-container,
[data-theme="light"] .other-model-card {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .stat-card:hover,
[data-theme="light"] .model-card:hover,
[data-theme="light"] .plan-card:hover,
[data-theme="light"] .other-model-card:hover {
  border-color: rgba(107,138,58,0.3) !important;
}

/* ─── Model cards ─── */
[data-theme="light"] .model-card {
  color: #1a1a1a !important;
}
[data-theme="light"] .model-card-img {
  background: rgba(0,0,0,0.03) !important;
}
[data-theme="light"] .model-placeholder {
  color: rgba(0,0,0,0.15) !important;
}
[data-theme="light"] .model-specs {
  color: rgba(0,0,0,0.45) !important;
}
[data-theme="light"] .model-price {
  color: #6b8a3a !important;
}

/* ─── Stats ─── */
[data-theme="light"] .stat-num {
  color: #6b8a3a !important;
}
[data-theme="light"] .stat-label {
  color: rgba(0,0,0,0.5) !important;
}

/* ─── FAQ ─── */
[data-theme="light"] .faq-item {
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .faq-question {
  color: #1a1a1a !important;
}
[data-theme="light"] .faq-question:hover {
  color: #6b8a3a !important;
}
[data-theme="light"] .faq-answer-inner {
  color: rgba(0,0,0,0.55) !important;
}

/* ─── CTA sections (green gradient → light green) ─── */
[data-theme="light"] .mid-cta,
[data-theme="light"] .cta-section {
  background: linear-gradient(135deg, #e8eee0 0%, #d4dfc4 100%) !important;
}
[data-theme="light"] .mid-cta h2,
[data-theme="light"] .cta-section h2 {
  color: #333F1F !important;
}
[data-theme="light"] .mid-cta p,
[data-theme="light"] .cta-section p {
  color: rgba(51,63,31,0.7) !important;
}

/* ─── Contact CTA card ─── */
[data-theme="light"] .contact-cta p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .contact-cta .phone {
  color: #6b8a3a !important;
}
[data-theme="light"] .contact-cta .phone:hover {
  color: #1a1a1a !important;
}

/* ─── Buttons ─── */
[data-theme="light"] .cta-btn {
  background: #6b8a3a !important;
  color: white !important;
}
[data-theme="light"] .cta-btn:hover {
  background: #5a7630 !important;
}
[data-theme="light"] .cta-btn-outline {
  color: #333F1F !important;
  border-color: rgba(51,63,31,0.3) !important;
}
[data-theme="light"] .cta-btn-outline:hover {
  border-color: #333F1F !important;
  background: rgba(51,63,31,0.05) !important;
}

/* ─── Carousel buttons ─── */
[data-theme="light"] .carousel-btn {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #1a1a1a !important;
}
[data-theme="light"] .carousel-btn:hover {
  background: rgba(107,138,58,0.15) !important;
  border-color: #6b8a3a !important;
}

/* ─── Tabs ─── */
[data-theme="light"] .tabs {
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .tab-btn {
  color: rgba(0,0,0,0.45) !important;
}
[data-theme="light"] .tab-btn:hover {
  color: rgba(0,0,0,0.7) !important;
}
[data-theme="light"] .tab-btn.active {
  color: #6b8a3a !important;
  border-color: #6b8a3a !important;
}

/* ─── Render cards ─── */
[data-theme="light"] .render-placeholder {
  color: rgba(0,0,0,0.15) !important;
}

/* ─── Plan cards ─── */
[data-theme="light"] .plan-card-info {
  border-color: rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .plan-card-info p {
  color: rgba(0,0,0,0.45) !important;
}

/* ─── Specs bar (model page) ─── */
[data-theme="light"] .specs-bar {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .spec-lbl {
  color: rgba(0,0,0,0.4) !important;
}

/* ─── Locked overlay ─── */
[data-theme="light"] .locked-message p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .locked-icon {
  background: rgba(107,138,58,0.12) !important;
  color: #6b8a3a !important;
}

/* ─── Other models section ─── */
[data-theme="light"] .other-model-card {
  color: #1a1a1a !important;
}
[data-theme="light"] .other-model-card .model-specs {
  color: rgba(0,0,0,0.45) !important;
}
[data-theme="light"] .other-model-card .model-price {
  color: #6b8a3a !important;
}

/* ─── Amenity tags (clubhouse) ─── */
[data-theme="light"] .amenity-tag {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .amenity-tag:hover {
  border-color: rgba(107,138,58,0.35) !important;
  color: rgba(0,0,0,0.8) !important;
  background: rgba(107,138,58,0.08) !important;
}
[data-theme="light"] .amenity-tag.active {
  background: rgba(107,138,58,0.12) !important;
  border-color: #6b8a3a !important;
  color: #1a1a1a !important;
}
[data-theme="light"] .amenity-detail p {
  color: rgba(0,0,0,0.55) !important;
}

/* ─── Footer ─── */
[data-theme="light"] .page-footer {
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .page-footer span,
[data-theme="light"] .page-footer p {
  color: rgba(0,0,0,0.35) !important;
}

/* ─── Scroll hint ─── */
[data-theme="light"] .scroll-hint {
  color: rgba(255,255,255,0.4) !important;
}

/* ─── Contact page form ─── */
[data-theme="light"] .form-section {
  background: rgba(0,0,0,0.02) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .form-section h2 {
  color: #1a1a1a !important;
}
[data-theme="light"] .form-section .form-desc {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .form-group label {
  color: rgba(0,0,0,0.7) !important;
}
[data-theme="light"] .form-group input,
[data-theme="light"] .form-group select,
[data-theme="light"] .form-group textarea {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #1a1a1a !important;
}
[data-theme="light"] .form-group select option {
  background: white !important;
  color: #1a1a1a !important;
}
[data-theme="light"] .form-group input::placeholder,
[data-theme="light"] .form-group textarea::placeholder {
  color: rgba(0,0,0,0.3) !important;
}
[data-theme="light"] .info-section h2 {
  color: #1a1a1a !important;
}
[data-theme="light"] .info-card {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .info-card:hover {
  border-color: rgba(107,138,58,0.25) !important;
}
[data-theme="light"] .info-card .info-label {
  color: #6b8a3a !important;
}
[data-theme="light"] .info-card .info-value {
  color: rgba(0,0,0,0.75) !important;
}
[data-theme="light"] .info-card .info-value a {
  color: rgba(0,0,0,0.75) !important;
}
[data-theme="light"] .info-card .info-value a:hover {
  color: #6b8a3a !important;
}
[data-theme="light"] .submit-btn {
  background: #6b8a3a !important;
}
[data-theme="light"] .submit-btn:hover {
  background: #5a7630 !important;
}
[data-theme="light"] .form-success {
  background: rgba(107,138,58,0.12) !important;
  border-color: rgba(107,138,58,0.3) !important;
  color: #6b8a3a !important;
}
[data-theme="light"] .contact-info-card {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .contact-info-card h3 {
  color: #1a1a1a !important;
}
[data-theme="light"] .contact-info-card p,
[data-theme="light"] .contact-info-card a {
  color: rgba(0,0,0,0.55) !important;
}

/* ─── Login page ─── */
[data-theme="light"] .login-card {
  background: white !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .login-card h1 {
  color: #1a1a1a !important;
}
[data-theme="light"] .login-card p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .login-card input {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #1a1a1a !important;
}
[data-theme="light"] .login-card label {
  color: rgba(0,0,0,0.6) !important;
}

/* ─── Selector page (index) — keep dark to avoid gaps between clip-paths ─── */
[data-theme="light"] .selector-root {
  background: #1a1a1a !important;
}
/* selector page text stays white — it's on dark image backgrounds */

/* ─── Fase 2 specific ─── */
[data-theme="light"] .feature {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .feature:hover {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(229,134,60,0.35) !important;
}
[data-theme="light"] .feature p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .feature-num {
  color: rgba(229,134,60,0.4) !important;
}
[data-theme="light"] .register-section {
  background: linear-gradient(135deg, rgba(229,134,60,0.08) 0%, rgba(229,134,60,0.04) 100%) !important;
  border-color: rgba(229,134,60,0.2) !important;
}
[data-theme="light"] .register-section h2 {
  color: #1a1a1a !important;
}
[data-theme="light"] .register-section p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .register-btn {
  background: #d17530 !important;
  color: white !important;
}

/* ─── District specific ─── */
[data-theme="light"] .experience-card {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .experience-card:hover {
  border-color: rgba(112,111,111,0.3) !important;
}
[data-theme="light"] .experience-card p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .highlight {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .highlight-num {
  color: #706F6F !important;
}
[data-theme="light"] .highlight-label {
  color: rgba(0,0,0,0.5) !important;
}
[data-theme="light"] .cta-banner {
  background: linear-gradient(135deg, #e8e8e6 0%, #ddddd8 100%) !important;
}
[data-theme="light"] .cta-banner h2 {
  color: #1a1a1a !important;
}
[data-theme="light"] .cta-banner p {
  color: rgba(0,0,0,0.55) !important;
}

/* ─── Floating menu (FAB) ─── */
[data-theme="light"] .fab-toggle {
  background: #6b8a3a !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15) !important;
}
[data-theme="light"] .fab-toggle:hover {
  background: #5a7630 !important;
}
[data-theme="light"] .fab-label {
  background: rgba(0,0,0,0.8) !important;
  color: white !important;
}
[data-theme="light"] .fab-icon {
  background: white !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #1a1a1a !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.1) !important;
}
[data-theme="light"] .fab-item:hover .fab-icon {
  background: #6b8a3a !important;
  border-color: #6b8a3a !important;
  color: white !important;
}

/* ─── Under Construction Timeline ─── */
[data-theme="light"] .timeline::before {
  background: rgba(107,138,58,0.25) !important;
}
[data-theme="light"] .timeline-node {
  background: #6b8a3a !important;
  border-color: #f5f5f2 !important;
  box-shadow: 0 0 0 4px rgba(107,138,58,0.2) !important;
}
[data-theme="light"] .timeline-connector {
  background: rgba(107,138,58,0.2) !important;
}
[data-theme="light"] .timeline-card {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .timeline-card:hover {
  border-color: rgba(107,138,58,0.3) !important;
}
[data-theme="light"] .timeline-card h3 {
  color: #1a1a1a !important;
}
[data-theme="light"] .timeline-card p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .timeline-date {
  background: rgba(107,138,58,0.12) !important;
  color: #6b8a3a !important;
}
[data-theme="light"] .media-item {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .media-item:hover {
  border-color: rgba(107,138,58,0.3) !important;
}
[data-theme="light"] .video-play-overlay {
  background: rgba(0,0,0,0.2) !important;
}
[data-theme="light"] .media-item:hover .video-play-overlay {
  background: rgba(0,0,0,0.1) !important;
}
[data-theme="light"] .video-play-icon {
  background: rgba(107,138,58,0.9) !important;
}
[data-theme="light"] .lightbox {
  background: rgba(245,245,242,0.95) !important;
}
[data-theme="light"] .lightbox-close {
  background: rgba(0,0,0,0.06) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #1a1a1a !important;
}
[data-theme="light"] .lightbox-close:hover {
  background: rgba(0,0,0,0.1) !important;
  border-color: rgba(0,0,0,0.2) !important;
}
[data-theme="light"] .lightbox-nav {
  background: rgba(0,0,0,0.05) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #1a1a1a !important;
}
[data-theme="light"] .lightbox-nav:hover {
  background: rgba(107,138,58,0.15) !important;
  border-color: #6b8a3a !important;
}
[data-theme="light"] .lightbox-caption {
  color: rgba(0,0,0,0.5) !important;
}
[data-theme="light"] .lightbox-counter {
  color: rgba(0,0,0,0.4) !important;
}

/* ─── Coming Soon (fase2 & district) ─── */
[data-theme="light"] .coming-soon h2 {
  color: #1a1a1a !important;
}
[data-theme="light"] .coming-soon p {
  color: rgba(0,0,0,0.55) !important;
}
[data-theme="light"] .coming-soon-label {
  color: inherit !important;
}
[data-theme="light"] .coming-soon-icon {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .coming-soon-divider {
  background: rgba(0,0,0,0.1) !important;
}
[data-theme="light"] .coming-soon-cta {
  background: #6b8a3a !important;
  color: white !important;
}
[data-theme="light"] .coming-soon-cta:hover {
  background: #5a7630 !important;
}