/* ============================================================
   LIGHT THEME — GLOBAL COLOR SYSTEM
   ============================================================ */

html[data-theme="light"] {
  --color-text: #d3e3f1;
  --color-text-muted: #abbac8;

  /* Main surfaces */
  --color-surface: rgba(255,255,255,0.15);
  --color-surface-strong: rgba(255,255,255,0.92);

  /* Borders */
  --color-border: rgba(0,0,0,0.12);

  /* Buttons & accents */
  --color-accent: #4d697c;
  --menu-hover-bg: #99aebd;

  /* Page background */
  --theme-background: linear-gradient(135deg, #dbe7f2, #b7c9d9);
}

/* ============================================================
   LIGHT THEME — GLOBAL BUTTONS
   ============================================================ */

html[data-theme="light"] button,
html[data-theme="light"] .btn {
  background: var(--color-accent);
  color: #ffffff;
  border: 1px solid rgba(0,0,0,0.15);
}

html[data-theme="light"] button:hover,
html[data-theme="light"] .btn:hover {
  background: var(--menu-hover-bg);
  color: var(--color-text);
}

/* Beautybutton text color */
html[data-theme="light"] .beautybutton {
  color: #ffffff !important;
}

/* ============================================================
   LIGHT THEME — MENUS
   ============================================================ */

html[data-theme="light"] .mod-menu a {
  color: #1f2a33;
}

html[data-theme="light"] .mod-menu a:hover {
  color: #0b3d5c;
}

html[data-theme="light"] .sidebar-left .mod-menu .nav-item > a,
html[data-theme="light"] .sidebar-right .mod-menu .nav-item > a {
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(0,0,0,0.15);
  color: #1f2a33;
}

html[data-theme="light"] .sidebar-left .mod-menu .nav-item > a:hover,
html[data-theme="light"] .sidebar-right .mod-menu .nav-item > a:hover {
  background: #dce7ef;
  color: #0b3d5c;
}

/* ============================================================
   LIGHT THEME — DIVISION TOPBARS
   ============================================================ */

html[data-theme="light"] body.meetmarco-division .meetmarco-topbar {
  background: linear-gradient(to bottom, #7a0a0a, #d44a4a);
}

html[data-theme="light"] body.goshopping-division .goshopping-topbar {
  background: linear-gradient(to bottom, #6a6a6a, #bfbfbf);
}

html[data-theme="light"] body.bookings-division .bookings-topbar {
  background: linear-gradient(to bottom, #1f3d7a, #4f7cc8);
}

html[data-theme="light"] .symbio-topbar {
  background: linear-gradient(to bottom, #d0d0d0, #4a7aa0);
}

/* ============================================================
   LIGHT THEME — DIVISION HERO BUTTONS
   ============================================================ */

html[data-theme="light"] .division-btn,
html[data-theme="light"] .category-links a,
html[data-theme="light"] .goshopping-links a,
html[data-theme="light"] .booking-btn,
html[data-theme="light"] .booking-nav-btn {
  background: #4d697c;
  color: #bed3e0;
  border: 1px solid #98a8b2;
  box-shadow: 0 3px 8px rgba(0,0,0,0.25);
}

html[data-theme="light"] .division-btn:hover,
html[data-theme="light"] .category-links a:hover,
html[data-theme="light"] .goshopping-links a:hover,
html[data-theme="light"] .booking-btn:hover,
html[data-theme="light"] .booking-nav-btn:hover {
  background: #99aebd;
  color: #c66800;
  box-shadow: 0 5px 14px rgba(0,0,0,0.35);
}

/* ============================================================
   LIGHT THEME — FOOTER
   ============================================================ */

html[data-theme="light"] .footer-block h4,
html[data-theme="light"] .footer-block h5 {
  color: #1f2a33;
  border-bottom-color: rgba(0,0,0,0.25);
}

html[data-theme="light"] .footer-btn:not(.meetmarco-btn):not(.goshopping-btn):not(.bookings-btn):not(.software-btn) {
  background: rgba(0,0,0,0.08);
  color: #1f3a5a;
  border-color: rgba(0,0,0,0.2);
}

html[data-theme="light"] .footer-bottom p {
  color: #1f2a33;
  background: rgba(255,255,255,0.6);
}

/* ============================================================
   LIGHT THEME — MISC FIXES
   ============================================================ */

html[data-theme="light"] .spoken-text-inner {
  color: #ffffff;
}

html[data-theme="light"] .tour-badge {
  filter: brightness(1.1);
}
