/* ═══════════════════════════════════════════════════════════════════════════
   THE PORTAL — THEME TOKENS
   Centralized design tokens for dark + light themes.
   Edited via Admin Dashboard → Stili.
   Default: dark theme. body.ccp-theme-light activates light theme overrides.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ------------------------------------------------------------------
   :root — DARK THEME (default)
   ------------------------------------------------------------------ */
:root {
  /* Surfaces (backgrounds) */
  --ccp-bg-base:        #0a0a0a;   /* main page bg */
  --ccp-bg-surface:     #1a1a1a;   /* cards, panels */
  --ccp-bg-raised:      #141414;   /* sidebar, topbar */
  --ccp-bg-sunken:      #111111;   /* deeper bg, inputs */
  --ccp-bg-hover:       #2a2a2a;   /* hover states, code */

  /* Text */
  --ccp-text-primary:   #ffffff;   /* main text */
  --ccp-text-secondary: #cccccc;   /* secondary text */
  --ccp-text-muted:     #888888;   /* meta, hints, labels */
  --ccp-text-inverse:   #1a1a1a;   /* text on light surfaces (gold buttons etc.) */

  /* Borders */
  --ccp-border-soft:    #2a2a2a;   /* subtle dividers */
  --ccp-border-medium:  #444444;   /* card borders, inputs */
  --ccp-border-strong:  #ffffff;   /* emphatic borders */

  /* Accents — Gold */
  --ccp-gold:           #c9a96e;   /* primary brand accent */
  --ccp-gold-hover:     #d4bc8a;   /* hover state */
  --ccp-gold-deep:      #a8883c;   /* deep gold (text on light, decorations) */
  --ccp-gold-soft:      #3a2f1f;   /* badges, pills bg */

  /* Accents — Green (success / nature) */
  --ccp-green:          #2d6a4f;   /* primary green */
  --ccp-green-hover:    #5a8a6a;   /* lighter green for text/hover */
  --ccp-green-soft:     #1a3d2f;   /* badges, pills bg */
  --ccp-wa-green:       #1d6b3a;   /* WhatsApp btn — dark forest, luxury-friendly */
  --ccp-wa-green-hover: #248348;   /* WhatsApp btn hover */

  /* Accents — Ice Blue (active states, secondary accent) — v5.49.0 */
  --ccp-ice:            #a8c5dd;   /* mid icy blue — section labels, badges */
  --ccp-ice-deep:       #7db8d9;   /* deeper — active state border, CTA fill */
  --ccp-ice-pale:       #e6eef5;   /* pale — hover wash */
  --ccp-ice-soft:       rgba(168, 197, 221, 0.12);  /* translucent bg */
  --ccp-ice-border:     rgba(168, 197, 221, 0.22);  /* translucent border */

  /* Accents — Copper (urgency: events < 40 days out) */
  --ccp-copper:         #c47f6a;   /* warm terracotta — urgency accent */
  --ccp-copper-soft:    rgba(196,127,106,.12); /* soft terracotta bg */

  /* States */
  --ccp-danger:         #e57373;
  --ccp-danger-soft:    #3a1f1f;
  --ccp-warning:        #ff8a65;
  --ccp-warning-soft:   #3a2415;
  --ccp-info:           #5b9bd5;
  --ccp-info-soft:      #1f2c3a;
  --ccp-purple:         #9575cd;   /* WP role color */
  --ccp-purple-soft:    #2a1f3a;

  /* Shadows */
  --ccp-shadow-sm:      0 1px 2px rgba(0,0,0,0.4);
  --ccp-shadow-md:      0 4px 12px rgba(0,0,0,0.5);
  --ccp-shadow-lg:      0 8px 24px rgba(0,0,0,0.6), 0 16px 48px rgba(0,0,0,0.4);
  --ccp-shadow-glow:    0 0 0 1px rgba(201,169,110,0.3), 0 4px 16px rgba(201,169,110,0.15);

  /* ── Event Detail v3.1 component tokens ─────────────────────────── */
  /* These are used by event-detail.css. Named after the design intent
     rather than the atomic bg-* / border-* scale for legibility.     */
  --ccp-bg:             #0a0a0a;                       /* wrap / tabbar bg   */
  --ccp-surface:        #131313;                       /* topnav / cell bg   */
  --ccp-surface-1:      #181818;                       /* info/gallery/file cards bg */
  --ccp-surface-raised: #1a1a1a;                       /* lighter panels     */
  --ccp-surface-sunken: #0d0d0d;                       /* deep inset areas   */
  --ccp-surface-hover:  #2a2a2a;                       /* hover wash         */
  --ccp-border-subtle:  #1f1f1f;                       /* cell / nav borders */
  --ccp-text-ghost:     #555555;                       /* very muted text    */
  --ccp-easing:         cubic-bezier(0.4, 0, 0.2, 1); /* standard easing    */
  --ccp-font-sans:      'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --ccp-font-display:   'Bebas Neue', 'Arial Black', sans-serif;
  --ccp-radius-sm:      4px;
  --ccp-radius-md:      8px;
  --ccp-radius-lg:      12px;
  /* ────────────────────────────────────────────────────────────────── */

  /* Backward-compat aliases (existing portal.css vars) */
  --ccp-black:    var(--ccp-text-primary);
  --ccp-white:    var(--ccp-text-primary);
  --ccp-gray-1:   #f6f6f6;
  --ccp-gray-2:   var(--ccp-border-soft);
  --ccp-gray-3:   var(--ccp-text-muted);
  --ccp-gray-4:   #555555;
  --ccp-green-bg: var(--ccp-green-soft);
  --ccp-gold-dk:  var(--ccp-gold-deep);
  --ccp-dark:     var(--ccp-bg-base);
  --ccp-light:    var(--ccp-bg-hover);
  --ccp-border:   var(--ccp-border-soft);
  --ccp-text:     var(--ccp-text-secondary);
}

/* ------------------------------------------------------------------
   body.ccp-theme-light — LIGHT THEME (Editorial White)
   Clean white + soft gray, with brushed-gold and forest-green accents.
   ------------------------------------------------------------------ */
body.ccp-theme-light {
  /* Surfaces — pure white + neutral grays */
  --ccp-bg-base:        #fafafa;   /* near-white, main page bg */
  --ccp-bg-surface:     #ffffff;   /* pure white — cards */
  --ccp-bg-raised:      #f4f4f4;   /* sidebar, topbar */
  --ccp-bg-sunken:      #ececec;   /* input bg, code */
  --ccp-bg-hover:       #f0f0f0;   /* hover states */

  /* Text — neutral grays, no warm tint */
  --ccp-text-primary:   #1a1a1a;   /* near-black */
  --ccp-text-secondary: #4a4a4a;   /* graphite */
  --ccp-text-muted:     #8a8a8a;   /* neutral gray */
  --ccp-text-inverse:   #ffffff;   /* text on dark accents */

  /* Borders — neutral grays */
  --ccp-border-soft:    #e5e5e5;   /* subtle dividers */
  --ccp-border-medium:  #d0d0d0;   /* card borders, inputs */
  --ccp-border-strong:  #1a1a1a;   /* editorial accent */

  /* Accents — Gold (saturated for white bg legibility) */
  --ccp-gold:           #b8924a;   /* primary brand accent */
  --ccp-gold-hover:     #9f7b3a;   /* hover state */
  --ccp-gold-deep:      #856332;   /* deep gold */
  --ccp-gold-soft:      #f1e8d2;   /* badges, pills bg — neutral cream */

  /* Accents — Green */
  --ccp-green:          #2d6a4f;   /* unchanged — works on light */
  --ccp-green-hover:    #1f4d3a;   /* darker on hover */
  --ccp-green-soft:     #d4e4da;   /* badges, pills bg */
  --ccp-wa-green:       #1d6b3a;   /* WhatsApp btn — same forest, works on white too */
  --ccp-wa-green-hover: #15522c;   /* darker on hover for light bg */

  /* Accents — Ice Blue (light mode tuned for legibility on white) */
  --ccp-ice:            #5a85a8;   /* darker ice — readable on white (5.0:1 ✅) */
  --ccp-ice-deep:       #3d7299;   /* deepest — borders + CTA fill */
  --ccp-ice-pale:       #c8d4df;   /* pale icy blue — same as section title bg */
  --ccp-ice-soft:       rgba(61, 114, 153, 0.10);  /* translucent on white */
  --ccp-ice-border:     rgba(61, 114, 153, 0.22);  /* translucent border */

  /* ── Event Detail v3.1 component tokens (light) ─────────────────── */
  --ccp-bg:             #fafafa;
  --ccp-surface:        #ffffff;
  --ccp-surface-1:      #f6f6f6;  /* info/gallery/file cards bg on light */
  --ccp-surface-raised: #f4f4f4;
  --ccp-surface-sunken: #ececec;
  --ccp-surface-hover:  #f0f0f0;
  --ccp-border-subtle:  #e5e5e5;
  --ccp-text-ghost:     #aaaaaa;
  --ccp-easing:         cubic-bezier(0.4, 0, 0.2, 1);
  /* ────────────────────────────────────────────────────────────────── */

  /* Accents — Copper (light mode: deeper for white-bg legibility) */
  --ccp-copper:         #b06650;
  --ccp-copper-soft:    rgba(176,102,80,.10); /* soft terracotta bg on white */

  /* States */
  --ccp-danger:         #b85450;
  --ccp-danger-soft:    #f4dddc;
  --ccp-warning:        #c8842b;
  --ccp-warning-soft:   #f5e6cc;
  --ccp-info:           #4a6b7c;
  --ccp-info-soft:      #dce5ea;
  --ccp-purple:         #6a4ea0;
  --ccp-purple-soft:    #e6def0;

  /* Shadows (much softer on light) */
  --ccp-shadow-sm:      0 1px 2px rgba(26,26,26,0.04), 0 1px 3px rgba(26,26,26,0.06);
  --ccp-shadow-md:      0 2px 8px rgba(26,26,26,0.06), 0 4px 16px rgba(26,26,26,0.08);
  --ccp-shadow-lg:      0 8px 24px rgba(26,26,26,0.08), 0 16px 48px rgba(26,26,26,0.12);
  --ccp-shadow-glow:    0 0 0 1px rgba(184,146,74,0.25), 0 4px 16px rgba(184,146,74,0.12);

  /* Backward-compat aliases */
  --ccp-black:    var(--ccp-text-primary);   /* = #1a1a1a in light mode */
  --ccp-gray-1:   #f6f6f6;
  --ccp-gray-4:   #4a4a4a;

  /* Admin-dashboard local tokens (mirror) — declared here so that legacy
     CSS that references them on document.body resolves correctly even when
     admin-dashboard.css is served from cache. */
  --adm-bg:         #fafafa;
  --adm-sidebar:    #f4f4f4;
  --adm-card:       #ffffff;
  --adm-topbar:     #f4f4f4;
  --adm-text:       #1a1a1a;
  --adm-text-dim:   #4a4a4a;
  --adm-text-muted: #8a8a8a;
  --adm-border:     #e5e5e5;
  --adm-gold:       #b8924a;
  --adm-gold-light: #9f7b3a;
  --adm-green:      #2d6a4f;
  --adm-red:        #b85450;
  --adm-blue:       #4a6b7c;
  --adm-purple:     #6a4ea0;
  --adm-orange:     #c8842b;

  /* Caption-generator local tokens */
  --cap-gold:    #b8924a;
  --cap-gold-dk: #856332;
  --cap-green:   #2d6a4f;

  /* Caption-generator surface tokens — override :root dark defaults */
  --cap-black:  #fafafa;
  --cap-border: rgba(0,0,0,0.09);
  --cap-text:   rgba(0,0,0,0.88);
  --cap-muted:  rgba(0,0,0,0.40);
}


/* ═══════════════════════════════════════════════════════════════════════════
   LIGHT THEME — SELECTOR-LEVEL OVERRIDES
   Hardcoded colors in legacy CSS files are overridden here when the
   light theme is active. Each rule uses var(--token) so the Stili page
   can rewire all colors live.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Body / page ── */
body.ccp-theme-light.ccp-portal-active,
body.ccp-theme-light .ccp-dashboard,
body.ccp-theme-light .ccp-staff-dashboard,
body.ccp-theme-light .ccp-wp-dashboard {
  background: var(--ccp-bg-base) !important;
  color: var(--ccp-text-primary);
}

body.ccp-theme-light .ccp-dashboard,
body.ccp-theme-light .ccp-staff-dashboard,
body.ccp-theme-light .ccp-wp-dashboard {
  color: var(--ccp-text-primary);
}

/* ── My Dashboard (admin SPA) shell ── */
body.ccp-theme-light .ccp-adm-app {
  background: var(--ccp-bg-base) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-topbar {
  background: var(--ccp-bg-raised) !important;
  border-bottom: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-sidebar {
  background: var(--ccp-bg-raised) !important;
  border-right: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-main {
  background: var(--ccp-bg-base) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-card,
body.ccp-theme-light .ccp-adm-panel,
body.ccp-theme-light .ccp-adm-modal {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
  box-shadow: var(--ccp-shadow-sm);
}
body.ccp-theme-light .ccp-adm-modal,
body.ccp-theme-light .ccp-adm-panel-raised {
  box-shadow: var(--ccp-shadow-lg);
}

/* Sidebar nav links (kept gold accent for active item) */
body.ccp-theme-light .ccp-adm-nav a,
body.ccp-theme-light .ccp-adm-sidebar a {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-nav a:hover,
body.ccp-theme-light .ccp-adm-sidebar a:hover {
  background: var(--ccp-bg-hover) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-nav a.active,
body.ccp-theme-light .ccp-adm-sidebar a.active {
  background: var(--ccp-gold-soft) !important;
  color: var(--ccp-gold-deep) !important;
}

/* Logo: white PNG → near-black on all light portals (my-dashboard, WP, cliente, staff) */
body.ccp-theme-light .ccp-adm-logo img,
body.ccp-theme-light .ccp-sidebar-logo-img,
body.ccp-theme-light .ccp-portal-logo img,
body.ccp-theme-light .ccp-logo-img {
  filter: brightness(0);
  opacity: 0.85;
}

/* Topbar elements */
body.ccp-theme-light .ccp-adm-search input {
  background: var(--ccp-bg-sunken) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-adm-search input::placeholder {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-adm-bell {
  color: var(--ccp-text-primary) !important;
}

/* KPI / stat cards */
body.ccp-theme-light .ccp-adm-stat,
body.ccp-theme-light .ccp-adm-kpi {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-stat-label,
body.ccp-theme-light .ccp-adm-kpi-label {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-adm-stat-value,
body.ccp-theme-light .ccp-adm-kpi-value {
  color: var(--ccp-text-primary) !important;
}

/* Tables */
body.ccp-theme-light .ccp-adm-table,
body.ccp-theme-light .ccp-adm-table th,
body.ccp-theme-light .ccp-adm-table td {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-adm-table th {
  background: var(--ccp-bg-sunken) !important;
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-adm-table tr:hover td {
  background: var(--ccp-bg-hover) !important;
}

/* Buttons */
body.ccp-theme-light .ccp-adm-btn,
body.ccp-theme-light .ccp-adm-btn-secondary {
  background: var(--ccp-bg-sunken) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-adm-btn:hover {
  background: var(--ccp-bg-hover) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-adm-btn-primary,
body.ccp-theme-light .ccp-adm-btn.primary {
  background: var(--ccp-gold) !important;
  color: var(--ccp-text-inverse) !important;
  border: 1px solid var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-adm-btn-primary:hover,
body.ccp-theme-light .ccp-adm-btn.primary:hover {
  background: var(--ccp-gold-hover) !important;
  border-color: var(--ccp-gold-hover) !important;
}
body.ccp-theme-light .ccp-adm-btn-danger {
  background: var(--ccp-danger) !important;
  color: var(--ccp-text-inverse) !important;
  border-color: var(--ccp-danger) !important;
}

/* Inputs */
body.ccp-theme-light .ccp-adm-input,
body.ccp-theme-light .ccp-adm-select,
body.ccp-theme-light .ccp-adm-textarea,
body.ccp-theme-light input[type="text"]:not(.ccp-adm-search input),
body.ccp-theme-light input[type="email"],
body.ccp-theme-light input[type="number"],
body.ccp-theme-light input[type="url"],
body.ccp-theme-light input[type="date"],
body.ccp-theme-light input[type="password"],
body.ccp-theme-light textarea,
body.ccp-theme-light select {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-adm-input:focus,
body.ccp-theme-light .ccp-adm-select:focus,
body.ccp-theme-light .ccp-adm-textarea:focus,
body.ccp-theme-light textarea:focus,
body.ccp-theme-light select:focus {
  border-color: var(--ccp-gold) !important;
  outline: 2px solid var(--ccp-gold-soft);
  outline-offset: -1px;
}
body.ccp-theme-light input::placeholder,
body.ccp-theme-light textarea::placeholder {
  color: var(--ccp-text-muted) !important;
}

/* Section titles — REMAIN black with white text (editorial signature) */
body.ccp-theme-light .ccp-section-title,
body.ccp-theme-light .ccp-adm-section-title {
  background: #1a1a1a !important;
  color: #ffffff !important;
}

/* Cards / general portal sections (frontend) */
body.ccp-theme-light .ccp-card,
body.ccp-theme-light .ccp-section,
body.ccp-theme-light .ccp-info-card,
body.ccp-theme-light .ccp-day-card,
body.ccp-theme-light .ccp-message-card {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-soft);
  box-shadow: var(--ccp-shadow-sm);
}

/* Sidebar (frontend portals) */
body.ccp-theme-light .ccp-sidebar,
body.ccp-theme-light .ccp-portal-sidebar {
  background: var(--ccp-bg-raised) !important;
  border-right: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-sidebar a,
body.ccp-theme-light .ccp-portal-sidebar a {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-sidebar a:hover,
body.ccp-theme-light .ccp-portal-sidebar a:hover {
  background: var(--ccp-bg-hover) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-sidebar a.active,
body.ccp-theme-light .ccp-portal-sidebar a.active {
  background: var(--ccp-gold-soft) !important;
  color: var(--ccp-gold-deep) !important;
}
/* WhatsApp CTA: override sidebar-a secondary color → primary (#1a1a1a on #25D366 = 7.99:1 ✅) */
body.ccp-theme-light .ccp-sidebar a.ccp-sidebar-whatsapp,
body.ccp-theme-light .ccp-portal-sidebar a.ccp-sidebar-whatsapp {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-sidebar a.ccp-sidebar-whatsapp:hover,
body.ccp-theme-light .ccp-portal-sidebar a.ccp-sidebar-whatsapp:hover {
  color: var(--ccp-text-primary) !important;
}
/* Notification badge: force white text on red bg (#fff on #c0392b = 5.07:1 ✅) */
body.ccp-theme-light .ccp-notif-bell-badge {
  color: #ffffff !important;
}

/* Top header / hero (frontend) */
body.ccp-theme-light .ccp-portal-header,
body.ccp-theme-light .ccp-dashboard-header {
  background: var(--ccp-bg-surface) !important;
  border-bottom: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}

/* Buttons (frontend) */
body.ccp-theme-light .ccp-btn,
body.ccp-theme-light .ccp-button {
  background: var(--ccp-bg-sunken) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-btn:hover,
body.ccp-theme-light .ccp-button:hover {
  background: var(--ccp-bg-hover) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-btn-primary,
body.ccp-theme-light .ccp-btn.primary,
body.ccp-theme-light .ccp-btn-gold {
  background: var(--ccp-gold) !important;
  color: var(--ccp-text-inverse) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-btn-primary:hover,
body.ccp-theme-light .ccp-btn.primary:hover,
body.ccp-theme-light .ccp-btn-gold:hover {
  background: var(--ccp-gold-hover) !important;
  border-color: var(--ccp-gold-hover) !important;
}
body.ccp-theme-light .ccp-btn-green {
  background: var(--ccp-green) !important;
  color: var(--ccp-text-inverse) !important;
  border-color: var(--ccp-green) !important;
}
body.ccp-theme-light .ccp-btn-danger {
  background: var(--ccp-danger) !important;
  color: var(--ccp-text-inverse) !important;
  border-color: var(--ccp-danger) !important;
}

/* Accordions / toggles */
body.ccp-theme-light .ccp-accordion,
body.ccp-theme-light .ccp-accordion-header,
body.ccp-theme-light .ccp-moodboard-block {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-accordion-header {
  background: var(--ccp-bg-raised) !important;
}

/* Chat / messages */
body.ccp-theme-light .ccp-chat-thread,
body.ccp-theme-light .ccp-chat-msg,
body.ccp-theme-light .ccp-message {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-soft);
}
body.ccp-theme-light .ccp-chat-msg.own,
body.ccp-theme-light .ccp-message.own {
  background: var(--ccp-gold-soft) !important;
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-chat-input,
body.ccp-theme-light .ccp-chat-input textarea {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-medium) !important;
}

/* Timeline */
body.ccp-theme-light .ccp-tl-dashboard-wrap,
body.ccp-theme-light .ccp-tl-wrap,
body.ccp-theme-light .ccp-tl-event,
body.ccp-theme-light .ccp-tl-card {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-soft);
}
body.ccp-theme-light .ccp-tl-dashboard-wrap {
  background: var(--ccp-bg-raised) !important;
}
body.ccp-theme-light .ccp-tl-time {
  color: var(--ccp-gold-deep) !important;
}

/* Moodboard */
body.ccp-theme-light .ccp-moodboard-grid,
body.ccp-theme-light .ccp-mb-image-card {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
}

/* Caption Generator */
body.ccp-theme-light .ccp-caption-generator,
body.ccp-theme-light .ccp-caption-result,
body.ccp-theme-light .ccp-caption-history-item {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-soft) !important;
}

/* PDF Tiers Matrix */
body.ccp-theme-light .ccp-pdf-modal,
body.ccp-theme-light .ccp-pdf-tier-cell,
body.ccp-theme-light .ccp-pdf-svc-card {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-pdf-modal-backdrop {
  background: rgba(250, 247, 241, 0.85) !important;
}

/* Photoshoot dashboard */
body.ccp-theme-light .ccp-ph-dash,
body.ccp-theme-light .ccp-ph-card,
body.ccp-theme-light .ccp-ph-row {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border: 1px solid var(--ccp-border-soft) !important;
}

/* Headings */
body.ccp-theme-light h1,
body.ccp-theme-light h2,
body.ccp-theme-light h3,
body.ccp-theme-light h4,
body.ccp-theme-light h5,
body.ccp-theme-light h6 {
  color: var(--ccp-text-primary);
}

/* Links */
body.ccp-theme-light .ccp-dashboard a,
body.ccp-theme-light .ccp-staff-dashboard a,
body.ccp-theme-light .ccp-wp-dashboard a,
body.ccp-theme-light .ccp-adm-app a {
  color: var(--ccp-gold-deep);
}
body.ccp-theme-light .ccp-dashboard a:hover,
body.ccp-theme-light .ccp-adm-app a:hover {
  color: var(--ccp-gold);
}

/* Generic badges / pills */
body.ccp-theme-light .ccp-badge,
body.ccp-theme-light .ccp-pill {
  background: var(--ccp-gold-soft) !important;
  color: var(--ccp-gold-deep) !important;
  border: 1px solid var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-badge.green,
body.ccp-theme-light .ccp-pill.green {
  background: var(--ccp-green-soft) !important;
  color: var(--ccp-green) !important;
  border-color: var(--ccp-green) !important;
}
body.ccp-theme-light .ccp-badge.red,
body.ccp-theme-light .ccp-pill.red {
  background: var(--ccp-danger-soft) !important;
  color: var(--ccp-danger) !important;
  border-color: var(--ccp-danger) !important;
}

/* SVG icons inherit currentColor */
body.ccp-theme-light .ccp-icon,
body.ccp-theme-light svg.ccp-icon {
  color: var(--ccp-text-primary);
}

/* Scrollbars (WebKit) */
body.ccp-theme-light ::-webkit-scrollbar-track {
  background: var(--ccp-bg-sunken);
}
body.ccp-theme-light ::-webkit-scrollbar-thumb {
  background: var(--ccp-border-medium);
  border-radius: 4px;
}
body.ccp-theme-light ::-webkit-scrollbar-thumb:hover {
  background: var(--ccp-gold);
}

/* Footer */
body.ccp-theme-light .ccp-footer,
body.ccp-theme-light .ccp-portal-footer {
  background: var(--ccp-bg-raised) !important;
  border-top: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-muted) !important;
}

/* Activity log items */
body.ccp-theme-light .ccp-adm-activity-item,
body.ccp-theme-light .ccp-activity-item {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-adm-activity-item.unread,
body.ccp-theme-light .ccp-activity-item.unread {
  background: var(--ccp-gold-soft) !important;
  border-color: var(--ccp-gold) !important;
}

/* Notification dropdown */
body.ccp-theme-light .ccp-adm-notif-dropdown {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
  box-shadow: var(--ccp-shadow-lg);
}

/* Search results dropdown */
body.ccp-theme-light .ccp-adm-search-results {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
  box-shadow: var(--ccp-shadow-lg);
}
body.ccp-theme-light .ccp-adm-search-results a:hover {
  background: var(--ccp-bg-hover) !important;
}

/* Hide bg overrides keeping the editorial pillole signature */
body.ccp-theme-light .ccp-section-title h2,
body.ccp-theme-light .ccp-section-title h3 {
  color: #ffffff !important;
}

/* Quill / rich-text editors */
body.ccp-theme-light .ql-editor {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ql-toolbar {
  background: var(--ccp-bg-sunken) !important;
  border-color: var(--ccp-border-soft) !important;
}

/* Modal backdrops */
body.ccp-theme-light .ccp-modal-backdrop,
body.ccp-theme-light .ccp-overlay,
body.ccp-theme-light .ccp-adm-modal-backdrop {
  background: rgba(26, 26, 26, 0.5) !important;
}

/* Disabled states */
body.ccp-theme-light :disabled,
body.ccp-theme-light .ccp-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ════════════════════════════════════════════════════════════════════════
   LIGHT THEME — PORTAL FRONTEND SPECIFIC OVERRIDES (v5.47.6)
   Fixes hardcoded rgba(255,255,255,X) and low-contrast gold colors
   found in portal.css, caption-generator.css, class-ccp-preview.php
   ════════════════════════════════════════════════════════════════════════ */

/* ── Generic portal paragraphs and labels ── */
body.ccp-theme-light .ccp-dashboard p,
body.ccp-theme-light .ccp-wp-dashboard p,
body.ccp-theme-light .ccp-staff-dashboard p {
  color: var(--ccp-text-primary);
}
body.ccp-theme-light .ccp-dashboard label,
body.ccp-theme-light .ccp-wp-dashboard label,
body.ccp-theme-light .ccp-staff-dashboard label {
  color: var(--ccp-text-secondary);
}

/* ── Staff portal — sidebar-count: gold text su gold-translucent bg = 1.08:1 ❌
   Dark mode: bg-hover (#2a2a2a) + gold token → 5.74:1+ robusto anche a gold customizzati.
   Light mode: gestito sotto body.ccp-theme-light (solid gold-deep bg + white, viene dopo). ── */
.ccp-staff-dashboard .ccp-sidebar-count {
  background: var(--ccp-bg-hover) !important; /* #2a2a2a dark — robusto ai token custom */
  color: var(--ccp-gold) !important;          /* 5.74:1 su #2a2a2a ✅ */
}

/* ── Staff portal — acc-days-past dark mode: verde #2d8a4e su bg quasi-nero = ~3.44:1 ❌
   Schiarire il verde in dark mode. Light mode: già gestito sotto body.ccp-theme-light. ── */
.ccp-staff-dashboard .ccp-acc-days.ccp-acc-days-past {
  color: #5abf7a !important; /* bright green — 6.23:1 su bg rgba(45,138,78,0.1)@#1a1a1a ✅ */
}

/* ── Staff portal — accordion label: dark mode fix (v5.48.2)
   staff.css: .ccp-acc-label { background: #efefef } — hardcoded light gray, jarring in dark.
   Dark mode: dark bg + light text. Light mode: già gestito sotto body.ccp-theme-light. ── */
.ccp-staff-dashboard .ccp-acc-label {
  background: var(--ccp-bg-hover) !important;   /* #2a2a2a — dark pill */
  color: var(--ccp-text-secondary) !important;  /* #cccccc — 8.14:1 su #2a2a2a ✅ */
}
body.ccp-theme-light .ccp-staff-dashboard .ccp-acc-label {
  background: #efefef !important;              /* ripristina bg chiaro originale in light */
  color: var(--ccp-text-secondary) !important; /* #4a4a4a su #efefef = 6.79:1 ✅ */
}

/* ── Staff portal — accordion hover: dark mode fix (v5.48.2)
   staff.css define hover bg #fdf8ee (cream) e #eaf5ee (light green) — visivamente jarring
   su sfondo scuro. Qui si sovrascrivono con colori translucenti per dark mode.
   Tema chiaro: si ripristinano i valori originali di staff.css sotto body.ccp-theme-light. ── */
.ccp-staff-dashboard .ccp-accordion-item.ccp-acc-upcoming .ccp-accordion-header:hover,
.ccp-staff-dashboard .ccp-accordion-item.ccp-acc-upcoming .ccp-accordion-header.ccp-accordion-open {
  background: rgba(196, 162, 88, 0.12) !important; /* gold tenue su dark */
}
.ccp-staff-dashboard .ccp-accordion-item.ccp-acc-past .ccp-accordion-header:hover,
.ccp-staff-dashboard .ccp-accordion-item.ccp-acc-past .ccp-accordion-header.ccp-accordion-open {
  background: rgba(45, 138, 78, 0.12) !important; /* green tenue su dark */
}
body.ccp-theme-light .ccp-staff-dashboard .ccp-accordion-item.ccp-acc-upcoming .ccp-accordion-header:hover,
body.ccp-theme-light .ccp-staff-dashboard .ccp-accordion-item.ccp-acc-upcoming .ccp-accordion-header.ccp-accordion-open {
  background: #fdf8ee !important; /* cream originale staff.css — ok in light */
}
body.ccp-theme-light .ccp-staff-dashboard .ccp-accordion-item.ccp-acc-past .ccp-accordion-header:hover,
body.ccp-theme-light .ccp-staff-dashboard .ccp-accordion-item.ccp-acc-past .ccp-accordion-header.ccp-accordion-open {
  background: #eaf5ee !important; /* light green originale staff.css — ok in light */
}

/* ── Staff portal — component overrides (v5.48.1)
   staff.css usa rgba(255,255,255,X) e colori trasparenti pensati per dark mode.
   Qui si sovrascrivono in light mode per leggibilità. ── */

/* .ccp-staff-sec-bar: titolo-sezione orizzontale in staff portal.
   In dark: bg=#0a0a0a + white text ✅. In light: bg=#fafafa + white text = 1.04:1 ❌ */
body.ccp-theme-light .ccp-staff-sec-bar,
body.ccp-theme-light .ccp-staff-sec-bar * {
  color: var(--ccp-text-primary) !important; /* #1a1a1a su #fafafa = 16:1 ✅ */
}
body.ccp-theme-light button.ccp-staff-sec-bar:hover {
  background: var(--ccp-bg-hover) !important;
}
body.ccp-theme-light .ccp-staff-sec-bar--sub {
  background: var(--ccp-bg-raised) !important;
}

/* .ccp-acc-label: pill tipo matrimonio (wedding/elopement/photoshoot).
   bg:#efefef hardcoded. color:--ccp-text-muted(#8a8a8a) = 3:1 ❌ → text-secondary = 6.79:1 ✅ */
body.ccp-theme-light .ccp-acc-label {
  color: var(--ccp-text-secondary) !important;
}

/* .ccp-acc-days: pill giorni mancanti. gold su gold-10% bg = 1.19:1 ❌ → gold-deep = 4.66:1 ✅ */
body.ccp-theme-light .ccp-acc-days {
  color: var(--ccp-gold-deep) !important;
}
/* .ccp-acc-days-past: "X giorni fa". green su green-10% bg = 1:1 ❌ → dark green = 7.5:1 ✅ */
body.ccp-theme-light .ccp-acc-days.ccp-acc-days-past {
  color: #1a5e30 !important;
}

/* .ccp-sidebar-count: numero matrimoni nel menu sidebar.
   gold text su gold-20% bg = 1.19:1 ❌ → solid gold-deep bg + white = 4.97:1 ✅ */
body.ccp-theme-light .ccp-sidebar-count {
  background: var(--ccp-gold-deep) !important;
  color: #ffffff !important;
}

/* ── Dashboard section content override (portal.css):
   .ccp-dashboard:not(.ccp-staff-dashboard) .ccp-section:not(.ccp-accordion) > *:not(.ccp-section-title)
   sets color:rgba(255,255,255,0.85) and the label rule uses !important.
   We need body-prefixed selectors with equal specificity + !important to win
   by stylesheet order (theme-tokens.css loads after portal.css).
   v5.48.3: esteso a .ccp-dashboard (include staff — uniformità con altri portali). ── */
body.ccp-theme-light .ccp-dashboard .ccp-section:not(.ccp-accordion) > *:not(.ccp-section-title) {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-dashboard .ccp-section:not(.ccp-accordion) label,
body.ccp-theme-light .ccp-dashboard .ccp-section:not(.ccp-accordion) .ccp-hint {
  color: var(--ccp-text-secondary) !important;
}

/* ── Sidebar: couple meta (rgba-white) ── */
body.ccp-theme-light .ccp-sidebar-couple-meta {
  color: var(--ccp-text-secondary) !important;
}

/* ── Sidebar: wedding info subtitle (rgba-white) ── */
body.ccp-theme-light .ccp-dash-wedding-info {
  color: var(--ccp-text-secondary) !important;
}

/* ── Sidebar nav links (rgba-white 0.45) ── */
body.ccp-theme-light .ccp-sidebar-link {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-sidebar-link:hover {
  color: var(--ccp-text-primary) !important;
  background: var(--ccp-bg-hover) !important;
  transform: translateX(3px) !important;
}
body.ccp-theme-light .ccp-sidebar-link.active {
  color: var(--ccp-gold-deep) !important;
  background: var(--ccp-gold-soft) !important;
  border-left-color: var(--ccp-gold) !important;
}

/* ── Sidebar logout links (rgba-white) ── */
body.ccp-theme-light .ccp-logout,
body.ccp-theme-light .ccp-sidebar-logout {
  color: var(--ccp-text-muted) !important;
  border-color: var(--ccp-border-medium) !important;
  background: transparent !important;
}
body.ccp-theme-light .ccp-logout:hover,
body.ccp-theme-light .ccp-sidebar-logout:hover {
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-strong) !important;
  background: var(--ccp-bg-hover) !important;
}
body.ccp-theme-light .ccp-sidebar-logout-top {
  color: var(--ccp-text-muted) !important;
}

/* ── Sidebar feature buttons (gold text on light bg → use deep gold) ── */
body.ccp-theme-light .ccp-sidebar-feature-btn {
  color: var(--ccp-gold-deep) !important;
}

/* ── Info tooltip "i" button ── */
body.ccp-theme-light .ccp-info-btn {
  color: var(--ccp-text-secondary) !important;
  border-color: var(--ccp-border-medium) !important;
  background: transparent !important;
}
body.ccp-theme-light .ccp-info-btn:hover {
  color: var(--ccp-gold-deep) !important;
  border-color: var(--ccp-gold) !important;
  background: var(--ccp-gold-soft) !important;
}

/* ── Form labels and hints ── */
body.ccp-theme-light .ccp-form-label {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-hint {
  color: var(--ccp-text-muted) !important;
}

/* ── Wedding day extra-day header — light bg in light mode ── */
body.ccp-theme-light .ccp-extra-day-header {
  background: var(--ccp-bg-raised) !important;
  border-bottom: 1px solid var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-extra-day-label {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-extra-day-date {
  color: var(--ccp-text-secondary) !important;
}

/* ── Primary CTA buttons: white on light-gold → low contrast.
   Use gold-deep bg (#856332) → white text contrast ≈ 5.1:1 (AA pass) ── */
body.ccp-theme-light .ccp-btn.ccp-btn-primary,
body.ccp-theme-light button.ccp-btn-primary,
body.ccp-theme-light .ccp-fr-submit-btn {
  background: var(--ccp-gold-deep) !important;
  color: #ffffff !important;
  border-color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-btn.ccp-btn-primary:hover,
body.ccp-theme-light button.ccp-btn-primary:hover {
  background: var(--ccp-gold) !important;
  border-color: var(--ccp-gold) !important;
}

/* ── Vendor invite modal buttons ── */
body.ccp-theme-light .ccp-vi-btn-send {
  background: var(--ccp-bg-raised) !important;
  color: var(--ccp-gold-deep) !important;
  border-color: var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-vi-btn-link {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-medium) !important;
}

/* ── Onboarding modal ── */
body.ccp-theme-light .ccp-ob-btn-secondary {
  color: var(--ccp-text-secondary) !important;
  border-color: var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-ob-cand-loc {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ob-candidate-btn {
  background: var(--ccp-bg-surface) !important;
  border-color: var(--ccp-border-medium) !important;
  color: var(--ccp-text-primary) !important;
}

/* ── Preview bar (admin-impersonation top bar) ── */
body.ccp-theme-light #ccp-preview-bar {
  background: var(--ccp-bg-raised) !important;
  border-bottom: 1px solid var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-preview-text,
body.ccp-theme-light .ccp-preview-text strong,
body.ccp-theme-light .ccp-preview-text span {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-preview-type-badge {
  background: var(--ccp-gold-soft) !important;
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-preview-btn-secondary {
  color: var(--ccp-text-secondary) !important;
  border-color: var(--ccp-border-medium) !important;
  background: transparent !important;
}
body.ccp-theme-light .ccp-preview-btn-secondary:hover {
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-strong) !important;
}
body.ccp-theme-light .ccp-preview-btn-exit {
  background: var(--ccp-gold-deep) !important;
  color: #ffffff !important;
  border-color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-preview-btn-exit:hover {
  background: var(--ccp-gold) !important;
  border-color: var(--ccp-gold) !important;
}

/* ── Caption Generator component — light token overrides ── */
body.ccp-theme-light .ccp-caption-generator {
  --cap-text:    var(--ccp-text-primary);
  --cap-muted:   var(--ccp-text-muted);
  --cap-surface: var(--ccp-bg-surface);
  --cap-dark:    var(--ccp-bg-sunken);
  --cap-border:  var(--ccp-border-soft);
  --cap-gold:    var(--ccp-gold-deep);    /* #856332 → ratio ≥4.5:1 on white */
}
body.ccp-theme-light .ccp-caption-hints-help {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-caption-hints-list h5,
body.ccp-theme-light .ccp-caption-history-empty,
body.ccp-theme-light summary {
  color: var(--ccp-text-secondary) !important; /* #4a4a4a on #ececec bg = 11:1 */
  background: transparent !important;
}
body.ccp-theme-light .ccp-caption-hints-list li {
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-caption-hint-empty {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-caption-hint-author {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-caption-hint-input {
  border-color: var(--ccp-border-medium) !important;
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
}
/* Gold accent text → deep gold for legibility on white (contrast ≥4.5:1) */
body.ccp-theme-light .ccp-caption-generator label,
body.ccp-theme-light .ccp-caption-generator h4 {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-caption-hint-submit {
  color: var(--ccp-gold-deep) !important;
}

/* ── Timeline component ── */
body.ccp-theme-light .ccp-tl-toggle-btn {
  color: var(--ccp-text-secondary) !important;
  border-color: var(--ccp-border-medium) !important;
  background: transparent !important;
}
body.ccp-theme-light .ccp-tl-toggle-btn.active {
  color: var(--ccp-gold-deep) !important;
  border-color: var(--ccp-gold-deep) !important;
  background: var(--ccp-gold-soft) !important;
}
body.ccp-theme-light .ccp-tl-toggle-btn:hover:not(.active) {
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-strong) !important;
}
body.ccp-theme-light .ccp-tl-edit-btn {
  color: var(--ccp-gold-deep) !important;
  border-color: var(--ccp-border-medium) !important;
  background: transparent !important;
}
body.ccp-theme-light .ccp-tl-edit-btn:hover {
  color: var(--ccp-gold-deep) !important;
  background: var(--ccp-gold-soft) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-tl-main-time,
body.ccp-theme-light .ccp-tl-detail-time {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-tl-detail-title {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-tl-detail-desc {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-tl-detail-item {
  border-color: var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-tl-actions button {
  color: var(--ccp-text-secondary) !important;
  border-color: var(--ccp-border-medium) !important;
  background: transparent !important;
}
body.ccp-theme-light .ccp-tl-actions button:hover {
  color: var(--ccp-gold-deep) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-tl-actions .ccp-tl-del:hover {
  color: var(--ccp-danger) !important;
  border-color: var(--ccp-danger) !important;
}
body.ccp-theme-light .ccp-tl-add-btn {
  color: var(--ccp-gold-deep) !important;
  border-color: var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-tl-add-btn:hover {
  color: var(--ccp-gold-deep) !important;
  background: var(--ccp-gold-soft) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-tl-modal-close {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-tl-field label,
body.ccp-theme-light .ccp-tl-field .ccp-form-label {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-tl-check-row label {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-tl-field input,
body.ccp-theme-light .ccp-tl-field textarea,
body.ccp-theme-light .ccp-tl-field select {
  border-color: var(--ccp-border-medium) !important;
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-tl-comments {
  border-top-color: var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-tl-comments-title {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-tl-comment {
  border-bottom-color: var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-tl-comment-meta {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-tl-comment-meta strong {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-tl-comment-text {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-tl-comment-del {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-tl-empty {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-tl-comment-form textarea {
  border-color: var(--ccp-border-medium) !important;
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-tl-comment-form button {
  color: var(--ccp-gold-deep) !important;
  background: var(--ccp-gold-soft) !important;
  border-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-tl-comment-form button:hover {
  background: var(--ccp-gold-soft) !important;
  border-color: var(--ccp-gold-deep) !important;
}

/* ── Timeline visibility rows (inline styles override with !important) ── */
body.ccp-theme-light .ccp-tl-vis-row {
  background: var(--ccp-bg-raised) !important;
  border-color: var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-tl-vis-row label {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-tl-vis-row p {
  color: var(--ccp-text-muted) !important;
}
/* ── Timeline "Allow download" toggle row (inline styles override) ── */
body.ccp-theme-light .ccp-tl-dl-toggle {
  background: var(--ccp-bg-raised) !important;
}
body.ccp-theme-light .ccp-tl-dl-toggle label {
  color: var(--ccp-text-primary) !important;
}

/* ── Moodboard component ── */
body.ccp-theme-light .ccp-mb-upload-label {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-mb-upload-label span {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-mb-upload-label small {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-mb-loading,
body.ccp-theme-light .ccp-mb-empty {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-mb-lb-close {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-mb-lb-cp-title {
  color: var(--ccp-gold-deep) !important;
}

/* ── Finance — highlighted commission item (dark bg → light gold surface) ── */
body.ccp-theme-light .ccp-fin-wp-highlight {
  background: var(--ccp-gold-soft) !important;
  border-color: rgba(133, 99, 50, 0.3) !important;
}
body.ccp-theme-light .ccp-fin-wp-highlight .ccp-fin-wp-label {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-fin-wp-highlight .ccp-fin-wp-val {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-fin-wp-highlight span {
  color: var(--ccp-text-secondary) !important;
}

/* ── Admin dashboard action buttons (gold on light bg → use gold-deep) ── */
body.ccp-theme-light .ccp-adm-act-btn--gold {
  color: var(--ccp-gold-deep) !important;
  border-color: rgba(133, 99, 50, 0.4) !important;
}
body.ccp-theme-light .ccp-adm-act-btn--gold:hover {
  background: var(--ccp-gold-soft) !important;
  border-color: var(--ccp-gold-deep) !important;
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-adm-act-btn:hover {
  color: var(--ccp-text-primary) !important;
  background: var(--ccp-bg-hover) !important;
  border-color: var(--ccp-border-medium) !important;
}

/* ── Banners — error / warning (labeled "dark theme" in portal.css) ── */
body.ccp-theme-light .ccp-banner-error {
  color: #7b1c10 !important;              /* dark red on light pink bg */
  background: rgba(192, 57, 43, 0.10) !important;
}
body.ccp-theme-light .ccp-banner-error strong {
  color: #7b1c10 !important;
}
body.ccp-theme-light .ccp-banner-warning {
  color: #5a4a2a !important;              /* dark amber on light gold bg */
}
body.ccp-theme-light .ccp-banner-warning strong {
  color: #5a4a2a !important;
}

/* ── Invite modal — inline rgba(255,255,255,X) overrides ── */
body.ccp-theme-light .ccp-fr-modal label {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-fr-modal h3 {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light #ccp-invite-list,
body.ccp-theme-light #ccp-invite-success p {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light #ccp-invite-role,
body.ccp-theme-light .ccp-fr-modal select {
  background: var(--ccp-bg-raised) !important;
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-fr-modal hr {
  border-top-color: var(--ccp-border-soft) !important;
}

/* ── Wedding form section headers (Sposa/Sposo H4) ── */
body.ccp-theme-light .ccp-wf-form h4 {
  color: var(--ccp-gold-deep) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   THEME LIGHT v5.48.0 — Section containers, tooltips, sidebar, IG Handles
   v5.48.0: refactor selettori a .ccp-dashboard:not(.ccp-staff-dashboard)
   per centralizzazione tra WP/Client/Vendor portal (Staff escluso).
   ════════════════════════════════════════════════════════════════════════ */

/* ── Task 2 (v5.48.3 extended): Section containers — icy gray per TUTTI i portali frontend
   (.ccp-dashboard = Client + WP + Vendor + Staff). My-dashboard usa .ccp-adm-* → non toccato.
   v5.48.3: rimossa l'esclusione :not(.ccp-staff-dashboard) — Roberto vuole uniformità. ── */
body.ccp-theme-light .ccp-dashboard .ccp-section {
  background: #eaeff4 !important;
}
/* Staff non ha border-radius in portal.css (era escluso) — aggiungilo qui per light mode */
body.ccp-theme-light .ccp-staff-dashboard .ccp-section {
  border-radius: 10px !important;
  overflow: hidden;
  margin-bottom: 12px !important;
}
/* Section title bar — swap editorial black → icy blue-gray + dark text (tutti i portali frontend) */
body.ccp-theme-light .ccp-dashboard .ccp-section-title {
  background: #c8d4df !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-dashboard .ccp-section-title *,
body.ccp-theme-light .ccp-dashboard .ccp-section-title h2,
body.ccp-theme-light .ccp-dashboard .ccp-section-title h3 {
  color: var(--ccp-text-primary) !important;
}
/* Accordion toggle text (SHOW/HIDE) and info-btn inside section-title stay themed */
body.ccp-theme-light .ccp-dashboard .ccp-section-title .ccp-info-btn {
  color: var(--ccp-text-secondary) !important;
  border-color: var(--ccp-border-medium) !important;
}

/* ── Task 4: Info tooltip — white-on-white bug → dark text on raised bg ── */
body.ccp-theme-light .ccp-info-tooltip {
  background: var(--ccp-bg-raised) !important;
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-medium) !important;
  box-shadow: var(--ccp-shadow-md) !important;
}
body.ccp-theme-light .ccp-info-tooltip p,
body.ccp-theme-light .ccp-info-tooltip span,
body.ccp-theme-light .ccp-info-tooltip * {
  color: var(--ccp-text-primary) !important;
}

/* ── Task 5: Instagram Caption Generator — override :root dark vars ──
   --cap-black/#0a0a0a defined in caption-generator.css :root.
   body.ccp-theme-light (specificity 0,1,0,1=11) > :root (0,1,0,0=10). ── */
body.ccp-theme-light {
  --cap-black: var(--ccp-bg-surface);   /* #ffffff replaces #0a0a0a */
  --cap-dark:  var(--ccp-bg-raised);    /* #f4f4f4 replaces #141414 */
}

/* ── Task 5b: Instagram Handles body (inline style="background:#0a0a0a") ──
   !important CSS beats non-!important inline styles per cascade spec. ── */
body.ccp-theme-light #ccp-ig-body {
  background: var(--ccp-bg-surface) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light #ccp-ig-body p,
body.ccp-theme-light #ccp-ig-body label {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light #ccp-ig-body span {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light #ccp-ig-body strong {
  color: var(--ccp-gold-deep) !important;  /* gold category labels stay gold */
}
body.ccp-theme-light #ccp-ig-body input[type="text"],
body.ccp-theme-light #ccp-ig-body select {
  background: var(--ccp-bg-raised) !important;
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-medium) !important;
}
body.ccp-theme-light #ccp-ig-list-preview {
  background: var(--ccp-bg-raised) !important;
  border-color: var(--ccp-border-soft) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light #ccp-ig-add-btn {
  color: var(--ccp-gold-deep) !important;
  border-color: var(--ccp-gold-deep) !important;
}
/* Divider lines (inline style="height:1px;background:rgba(255,255,255,.08)") */
body.ccp-theme-light #ccp-ig-body [style*="height:1px"] {
  background: var(--ccp-border-soft) !important;
}
/* "or enter manually" divider text */
body.ccp-theme-light #ccp-ig-body [style*="rgba(255,255,255,.3)"] {
  color: var(--ccp-text-muted) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   THEME TOGGLE COMPONENT (used in all 4 dashboards' settings pages)
   ════════════════════════════════════════════════════════════════════════ */
.ccp-theme-toggle {
  display: flex;
  gap: 12px;
  margin: 16px 0 8px;
}
.ccp-theme-toggle__option {
  flex: 1;
  cursor: pointer;
  padding: 18px;
  border: 2px solid var(--ccp-border-soft);
  border-radius: 12px;
  background: var(--ccp-bg-surface);
  color: var(--ccp-text-primary);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  transition: all 0.2s ease;
  text-align: center;
}
.ccp-theme-toggle__option:hover {
  border-color: var(--ccp-gold);
  background: var(--ccp-bg-hover);
}
.ccp-theme-toggle__option.is-active {
  border-color: var(--ccp-gold);
  background: var(--ccp-gold-soft);
  color: var(--ccp-text-primary);
  box-shadow: var(--ccp-shadow-glow);
}
.ccp-theme-toggle__option svg {
  width: 32px;
  height: 32px;
}
.ccp-theme-toggle__label {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 18px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.ccp-theme-toggle__hint {
  font-size: 12px;
  color: var(--ccp-text-muted);
  letter-spacing: 0.02em;
}
.ccp-theme-toggle input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Smooth transition on theme switch */
body, body * {
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.2s ease;
}
body.ccp-theme-no-transition,
body.ccp-theme-no-transition * {
  transition: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v5.49.0 — SIDEBAR REDESIGN · Light mode overrides for "Ice Accent"
   The base styles in portal.css use hardcoded gold rgba(196,162,88,...)
   which targets the dark-mode gold #c9a96e. In light mode the gold token
   shifts to #b8924a — these overrides re-tune the translucent values so
   hover/flag remain readable on white backgrounds.
   ═══════════════════════════════════════════════════════════════════════ */

/* Sidebar link hover — gold tuned for light bg (more saturated, more visible).
   Selector beats the existing `.ccp-sidebar a:hover` rule (line 382-385) which
   would otherwise force `var(--ccp-bg-hover)` solid bg. */
body.ccp-theme-light .ccp-sidebar a.ccp-sidebar-link:hover,
body.ccp-theme-light .ccp-portal-sidebar a.ccp-sidebar-link:hover {
  color: var(--ccp-text-primary) !important;
  background: linear-gradient(90deg, rgba(184, 146, 74, 0.18), transparent 80%) !important;
  box-shadow: inset 2px 0 0 var(--ccp-gold) !important;
  background-color: transparent !important;  /* belt-and-braces: kill solid bg-color */
}

/* Active state — must beat `.ccp-sidebar a.active` rule (line 387-391) that forces
   `var(--ccp-gold-soft)` cream bg. Use ice gradient + ice-deep box-shadow + readable text. */
body.ccp-theme-light .ccp-sidebar a.ccp-sidebar-link.active,
body.ccp-theme-light .ccp-portal-sidebar a.ccp-sidebar-link.active {
  color: var(--ccp-text-primary) !important;
  background: linear-gradient(90deg, var(--ccp-ice-soft), transparent 80%) !important;
  background-color: transparent !important;
  box-shadow: inset 2px 0 0 var(--ccp-ice-deep) !important;
}
body.ccp-theme-light .ccp-sidebar a.ccp-sidebar-link.active:hover,
body.ccp-theme-light .ccp-portal-sidebar a.ccp-sidebar-link.active:hover {
  /* keep ice on active even on hover — preserves "you are here" affordance */
  background: linear-gradient(90deg, var(--ccp-ice-soft), transparent 80%) !important;
  background-color: transparent !important;
  box-shadow: inset 2px 0 0 var(--ccp-ice-deep) !important;
  color: var(--ccp-text-primary) !important;
}

/* Sidebar count badge — gold pill (light mode tuned) */
body.ccp-theme-light .ccp-sidebar-count {
  background: rgba(184, 146, 74, 0.18) !important;
  color: var(--ccp-gold-deep) !important;   /* #856332 — 5.5:1 on white ✅ */
}

/* WhatsApp — forest green stays readable on white (8.4:1 contrast white-on-#1d6b3a ✅).
   Selector beats existing `.ccp-sidebar a.ccp-sidebar-whatsapp` rule (line 393-396)
   that would force `var(--ccp-text-primary)` = #1a1a1a (illegible on dark green). */
body.ccp-theme-light .ccp-sidebar a.ccp-sidebar-whatsapp,
body.ccp-theme-light .ccp-portal-sidebar a.ccp-sidebar-whatsapp {
  background: var(--ccp-wa-green) !important;
  color: #ffffff !important;
}
body.ccp-theme-light .ccp-sidebar a.ccp-sidebar-whatsapp:hover,
body.ccp-theme-light .ccp-portal-sidebar a.ccp-sidebar-whatsapp:hover {
  background: var(--ccp-wa-green-hover) !important;  /* #15522c on light */
  color: #ffffff !important;
}

/* SHARE flag above Idea button — re-tuned for white bg */
body.ccp-theme-light .ccp-sidebar-feature-btn::before {
  color: var(--ccp-gold-deep) !important;            /* #856332 — readable on cream */
  background: rgba(184, 146, 74, 0.20) !important;
  border-color: rgba(184, 146, 74, 0.55) !important;
  text-shadow: none !important;                       /* drop glow on light bg */
}
body.ccp-theme-light .ccp-sidebar-feature-btn::after {
  color: var(--ccp-gold-deep) !important;
  filter: none !important;                            /* drop glow on light bg */
}

/* ═══════════════════════════════════════════════════════════════════════
   v5.49.1 — SIDEBAR FLOATING SHELL · Light mode overrides
   portal.css appends dark values (#111318, #1e2026) that need resetting
   for light mode. All rules use same selector depth as the dark block
   (body.ccp-theme-light + .class) → load order ensures we win.
   ═══════════════════════════════════════════════════════════════════════ */

/* Floating shell: white bg, light border, soft shadow */
body.ccp-theme-light .ccp-sidebar,
body.ccp-theme-light .ccp-portal-sidebar {
  background: #ffffff !important;
  border: 1px solid #e2e6ea !important;
  border-right: 1px solid #e2e6ea !important;     /* belt-and-braces */
  border-radius: 14px !important;                  /* reassert floating shape */
  box-shadow: 0 24px 60px rgba(0,0,0,0.10) !important;
}

/* Section borders: light */
body.ccp-theme-light .ccp-sidebar-brand {
  border-bottom-color: #e2e6ea !important;
}
body.ccp-theme-light .ccp-sidebar-couple {
  border-bottom-color: #e2e6ea !important;
}
body.ccp-theme-light .ccp-sidebar-cta {
  border-top-color: #e2e6ea !important;
}

/* Text colours for light bg */
body.ccp-theme-light .ccp-sidebar-couple-name {
  color: #1a1a1a !important;
}
body.ccp-theme-light .ccp-sidebar-couple-meta {
  color: #888 !important;
}
body.ccp-theme-light .ccp-sidebar-link {
  color: #4a5568 !important;
}

/* THE PORTAL logo (white) → visible on white bg via invert */
body.ccp-theme-light .ccp-sidebar-logo-img {
  filter: brightness(0) !important;   /* white asset → black on white bg */
}

/* CTA card light mode */
body.ccp-theme-light .ccp-sidebar-cta-card {
  background: radial-gradient(circle at top right, rgba(61,114,153,0.06), transparent 60%), #f4f6f8 !important;
  border-color: var(--ccp-ice-border) !important;
}
body.ccp-theme-light .ccp-sidebar-cta-title {
  color: #999 !important;
}
body.ccp-theme-light .ccp-sidebar-cta-row .ccp-sidebar-bookcall,
body.ccp-theme-light .ccp-sidebar-cta-row .ccp-sidebar-feature-btn {
  background: #ffffff !important;
  border-color: #d8dde2 !important;
  color: #4a5568 !important;
}
body.ccp-theme-light .ccp-sidebar-cta-row .ccp-sidebar-bookcall:hover,
body.ccp-theme-light .ccp-sidebar-cta-row .ccp-sidebar-feature-btn:hover {
  border-color: var(--ccp-ice-deep) !important;
  color: var(--ccp-ice-deep) !important;
  background: #ffffff !important;
}
/* Nav section labels */
body.ccp-theme-light .ccp-sidebar-nav .ccp-sidebar-nav-label {
  color: var(--ccp-ice-deep) !important;
}

/* ── v5.49.3 — Notification dropdown light mode (cross-portal fix) ──
   portal.css usa rgba(255,255,255,X) hardcoded per tutti i testi delle notifiche.
   Questi override coprono Client + WP + Staff in un unico punto centralizzato.
   ─────────────────────────────────────────────────────────────────────────── */
body.ccp-theme-light .ccp-notif-dropdown {
  background: var(--ccp-bg-surface) !important;
  border: 1px solid var(--ccp-border-soft) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.12) !important;
}
body.ccp-theme-light .ccp-notif-header {
  border-bottom: 1px solid var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-notif-item {
  border-bottom: 1px solid var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-notif-item:hover {
  background: var(--ccp-bg-hover) !important;
}
body.ccp-theme-light .ccp-notif-item--unread {
  background: var(--ccp-gold-soft) !important;
  border-left-color: var(--ccp-gold) !important;
}
body.ccp-theme-light .ccp-notif-text {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-notif-text strong {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-notif-meta {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-notif-empty,
body.ccp-theme-light .ccp-notif-loading {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-notif-list::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.15) !important;
}

/* ── v5.50.0 — WP Cards light mode ─────────────────────────────────────────
   Most WP card tokens are already CSS-variable-driven and inherit light values
   automatically. These overrides handle the few hardcoded cases.
   ─────────────────────────────────────────────────────────────────────────── */

/* Hover sweep: gold-soft in light = cream #f1e8d2 — slightly richer wash */
body.ccp-theme-light .ccp-wp-card::before {
  background: linear-gradient(90deg, rgba(184,146,74,.08), rgba(184,146,74,.03) 55%, transparent) !important;
}

/* Past-event hover sweep: keep subtle green tint on white */
body.ccp-theme-light .ccp-wp-card--past::before {
  background: linear-gradient(90deg, rgba(45,106,79,.07), transparent 60%) !important;
}

/* Ring track on hover: cream #f1e8d2 nearly invisible on white bg → use border-medium */
body.ccp-theme-light .ccp-wp-card:hover .ccp-wp-ring-track {
  stroke: var(--ccp-border-medium) !important;
}

/* Past event: green ring bg on white (rgba values are fine, just slightly softer) */
body.ccp-theme-light .ccp-wp-ring-bg {
  fill: rgba(45,106,79,.10) !important;
}
body.ccp-theme-light .ccp-wp-card--past:hover .ccp-wp-ring-bg {
  fill: rgba(74,170,122,.18) !important;
}

/* Duration bar default: border-soft on dark = #2a2a2a → on light = #e5e5e5, fine.
   Past event bar keeps its green tint — no override needed. */

/* Past badge: #4aaa7a text + rgba(45,106,79,.15) bg — readable on white, no override needed. */

/* ── v5.51.0 — Event Detail v3.1 "The Compass" light mode ─────────────────
   Most ED elements use --ccp-bg/surface/border-subtle vars which already resolve
   to light values via body.ccp-theme-light above.
   These overrides handle the few structural cases where dark defaults leak through.
   ─────────────────────────────────────────────────────────────────────────── */

/* Wrap + nav bar: light surface with subtle shadow instead of dark border */
body.ccp-theme-light .ccp-ed-wrap {
  background: var(--ccp-bg) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-ed-topnav {
  background: var(--ccp-surface) !important;
  border-bottom-color: var(--ccp-border-subtle) !important;
  box-shadow: 0 1px 0 var(--ccp-border-subtle) !important;
}
body.ccp-theme-light .ccp-ed-tabbar {
  background: var(--ccp-bg) !important;
  border-bottom-color: var(--ccp-border-subtle) !important;
}

/* Nav logo + divider + search */
body.ccp-theme-light .ccp-ed-nav-div {
  background: var(--ccp-border-subtle) !important;
}
body.ccp-theme-light .ccp-ed-nav-search {
  background: var(--ccp-surface-raised) !important;
  border-color: var(--ccp-border-subtle) !important;
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ed-nav-search:hover {
  border-color: var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-ed-nav-iconbtn {
  background: var(--ccp-surface-raised) !important;
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ed-nav-iconbtn:hover {
  background: var(--ccp-surface-hover) !important;
  color: var(--ccp-text-primary) !important;
}

/* Bento cells: white surface, soft border */
body.ccp-theme-light .ccp-ed-cell {
  background: var(--ccp-surface) !important;
  border-color: var(--ccp-border-subtle) !important;
}
body.ccp-theme-light .ccp-ed-cell:hover {
  border-color: var(--ccp-border-medium) !important;
}

/* Countdown cell: light gradient instead of dark */
body.ccp-theme-light .ccp-ed-c-countdown {
  background: linear-gradient(135deg, var(--ccp-surface) 0%, var(--ccp-surface-sunken) 100%) !important;
}

/* Ghost button border in light mode */
body.ccp-theme-light .ccp-ed-btn {
  border-color: var(--ccp-border-medium) !important;
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-ed-btn:hover {
  border-color: var(--ccp-gold) !important;
  color: var(--ccp-gold) !important;
  background: transparent !important;
}

/* Cell labels + arrows */
body.ccp-theme-light .ccp-ed-cell-lbl {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ed-cell-arrow {
  color: var(--ccp-text-ghost) !important;
}
body.ccp-theme-light .ccp-ed-cell:hover .ccp-ed-cell-arrow {
  color: var(--ccp-gold) !important;
}

/* Cell head dividers inside cells */
body.ccp-theme-light .ccp-ed-cell-head {
  border-bottom-color: var(--ccp-border-subtle) !important;
}

/* Drawer overlay */
body.ccp-theme-light .ccp-ed-drawer {
  background: var(--ccp-surface) !important;
  border-left-color: var(--ccp-border-subtle) !important;
}

/* ── v5.51.5 — Caption Generator: history text block ──
   caption-generator.css line 495: color rgba(255,255,255,0.75) — white on white = invisible
   caption-generator.css line 497: background rgba(0,0,0,0.28) — dark wash on white card
   Both need !important to beat the existing !important in caption-generator.css.          ── */
body.ccp-theme-light .ccp-caption-history-text {
  color: var(--ccp-text-primary) !important;
  background: var(--ccp-bg-raised) !important;
}

/* ── v5.51.5 — Event Detail: gallery tab subgrid item borders ── */
body.ccp-theme-light .ccp-ed-gallery-grid-item {
  border-color: var(--ccp-border-subtle) !important;
}

/* ── v5.51.5 — Suggestion engine action cell: copper soft bg ── */
body.ccp-theme-light .ccp-ed-c-action {
  background: var(--ccp-surface-raised) !important;
  border-color: var(--ccp-border-subtle) !important;
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-ed-c-action:hover {
  background: var(--ccp-surface-hover) !important;
  border-color: var(--ccp-gold) !important;
  color: var(--ccp-text-primary) !important;
}

/* ── v5.51.5 — Tab badge: invert on light ── */
body.ccp-theme-light .ccp-ed-tab-badge {
  background: rgba(0,0,0,.08) !important;
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ed-tab-badge.has-unread {
  background: var(--ccp-gold-soft) !important;
  color: var(--ccp-gold-deep) !important;
}

/* ── v5.51.5 — Nav bell bridge: icon tint on light ── */
body.ccp-theme-light .ccp-ed-nav-iconbtn {
  border-color: var(--ccp-border-subtle) !important;
}

/* ── v5.51.5 — Tabbar active tab indicator: gold line on light ── */
body.ccp-theme-light .ccp-ed-tab.active::after {
  background: var(--ccp-gold-deep) !important;
}

/* ── v5.51.5 — Sub-day title / head text ── */
body.ccp-theme-light .ccp-ed-sd-title {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-ed-sd-meta {
  color: var(--ccp-text-muted) !important;
}

/* ── v5.51.5 — Compose box textarea + placeholder ── */
body.ccp-theme-light .ccp-ed-compose-input {
  color: var(--ccp-text-primary) !important;
  background: transparent !important;
}
body.ccp-theme-light .ccp-ed-compose-input::placeholder {
  color: var(--ccp-text-ghost) !important;
}

/* ── v5.51.5 — File list empty state text ── */
body.ccp-theme-light .ccp-ed-file-empty {
  color: var(--ccp-text-ghost) !important;
}

/* ── v5.51.5 — Vendor role label ── */
body.ccp-theme-light .ccp-ed-vendor-role {
  color: var(--ccp-text-muted) !important;
}

/* ── v5.51.5 — Progress bar label ── */
body.ccp-theme-light .ccp-ed-prog-label {
  color: var(--ccp-text-muted) !important;
}

/* ── v5.51.6 — Link legibility on white (gold #b8924a = 3.6:1 → deep gold #856332 = 5.5:1) ── */
body.ccp-theme-light .ccp-ed-link {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-ed-link:hover {
  color: var(--ccp-gold) !important;
  opacity: 1 !important;
}

/* ── v5.51.6 — Info row total border: visible on light ── */
body.ccp-theme-light .ccp-ed-info-row--total {
  border-top-color: var(--ccp-border-medium) !important;
}

/* ── v5.51.6 — contract tab entry animation ── */
#ccp-ed-view-contract.active .ccp-ed-info-card {
  animation: none; /* handled by ccp-view-enter on the view itself */
}

/* ── v5.51.6 — Light: days header ── */
body.ccp-theme-light .ccp-ed-days-header {
  border-bottom-color: var(--ccp-border-subtle) !important;
}
body.ccp-theme-light .ccp-ed-dc-title {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-ed-dc-sub {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ed-dc-num {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-ed-dc-month {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ed-day-card.main-event .ccp-ed-dc-num {
  color: var(--ccp-gold-deep) !important;
}
body.ccp-theme-light .ccp-ed-day-card.main-event .ccp-ed-dc-title {
  color: var(--ccp-gold-deep) !important;
}

/* ── v5.51.6 — Gallery card labels + dates on light ── */
body.ccp-theme-light .ccp-ed-gallery-card-label {
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-ed-gallery-card-date {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ed-gallery-card-soon {
  color: var(--ccp-text-ghost) !important;
}
body.ccp-theme-light .ccp-ed-gallery-card {
  border-color: var(--ccp-border-subtle) !important;
}

/* ══════════════════════════════════════════════════════════════════
   v5.51.7 — LIGHT THEME: INFO ROWS, TIMELINE NAME, CONTRACT AMOUNTS
══════════════════════════════════════════════════════════════════ */

/* Info row separator: hard-coded rgba(255,255,255,.04) → light gray */
body.ccp-theme-light .ccp-ed-info-row {
  border-bottom-color: rgba(0,0,0,.06) !important;
}
/* Info row total border: already uses --ccp-border token; reinforce on light */
body.ccp-theme-light .ccp-ed-info-row--total {
  border-top-color: var(--ccp-border-medium) !important;
}
/* Timeline item name: explicit token override (inherits from dark body otherwise) */
body.ccp-theme-light .ccp-ed-tl-name {
  color: var(--ccp-text-primary) !important;
}
/* Timeline dot colors: ensure gold/green read on light bg */
body.ccp-theme-light .ccp-ed-tl-dot.gold {
  border-color: rgba(133,99,50,.35) !important;
  background: rgba(133,99,50,.10) !important;
}
body.ccp-theme-light .ccp-ed-tl-dot.green {
  border-color: rgba(45,106,79,.35) !important;
  background: rgba(45,106,79,.10) !important;
}
/* Contract main amount: force primary text on light */
body.ccp-theme-light .ccp-ed-contract-main {
  color: var(--ccp-text-primary) !important;
}
/* Finance/payout alternate rows on light */
body.ccp-theme-light .ccp-ed-finance-payout:nth-child(even),
body.ccp-theme-light .ccp-ed-pay-row:nth-child(even) {
  background: rgba(0,0,0,.025) !important;
}
/* Moodboard grid item bg on light */
body.ccp-theme-light .ccp-ed-mood-item {
  background: var(--ccp-surface-raised) !important;
}
/* Subday back button on light */
body.ccp-theme-light .ccp-ed-back {
  color: var(--ccp-text-secondary) !important;
  border-color: var(--ccp-border-subtle) !important;
}
body.ccp-theme-light .ccp-ed-back:hover {
  color: var(--ccp-text-primary) !important;
  border-color: var(--ccp-border-medium) !important;
}

/* ══════════════════════════════════════════════════════════════════
   v5.52.0 — LIGHT THEME: remaining portal.css rgba(255,255,255,X) gaps
   All items confirmed missing via grep audit 2026-04-29.
══════════════════════════════════════════════════════════════════ */

/* Finance summary KPI — profit + final row have dark backgrounds in dark mode,
   so their labels use rgba(255,255,255,.6). In light mode both backgrounds
   resolve to --ccp-bg-base (#fafafa) or --ccp-bg-surface (#fff) → white text
   on white = invisible. Reset to text-muted. */
body.ccp-theme-light .ccp-fin-kpi-profit .ccp-fin-kpi-label,
body.ccp-theme-light .ccp-fin-kpi-final .ccp-fin-kpi-label {
  color: var(--ccp-text-muted) !important;
}
/* The profit cell bg also needs to look intentional on light (was bg-base = off-white) */
body.ccp-theme-light .ccp-fin-kpi-profit {
  background: var(--ccp-gold-soft) !important;
  border-color: rgba(133,99,50,.2) !important;
}
body.ccp-theme-light .ccp-fin-kpi-profit .ccp-fin-kpi-val {
  color: var(--ccp-gold-deep) !important;
}
/* Final cell: keep #fafafa bg, add subtle left border accent */
body.ccp-theme-light .ccp-fin-kpi-final {
  border-color: var(--ccp-border-medium) !important;
}
body.ccp-theme-light .ccp-fin-kpi-final .ccp-fin-kpi-val {
  color: var(--ccp-text-primary) !important;
}

/* Link share label + "soon" text — portal.css line 1483, 1516 */
body.ccp-theme-light .ccp-link-share-label {
  color: var(--ccp-text-muted) !important;
}

/* Unread count badge inside topbar notification button — portal.css line 1027
   white-25% bg on light topbar = invisible */
body.ccp-theme-light .ccp-unread-count {
  background: rgba(0,0,0,.08) !important;
  color: var(--ccp-text-primary) !important;
}

/* Onboarding overlay — portal.css lines 2688-2756 */
body.ccp-theme-light .ccp-ob-subtitle {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-ob-date-input {
  background: var(--ccp-bg-raised) !important;
  border-color: var(--ccp-border-medium) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-ob-date-input::-webkit-calendar-picker-indicator {
  filter: none !important; /* remove invert(1) — picker is already dark on light bg */
}
body.ccp-theme-light .ccp-ob-btn-skip {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ob-btn-skip:hover {
  color: var(--ccp-text-secondary) !important;
}

/* ── Client portal vendor cards: near-transparent dark bg → give it structure on white ── */
body.ccp-theme-light .ccp-vendor-card {
  background: var(--ccp-bg-surface) !important;
  border-color: var(--ccp-border-soft) !important;
  box-shadow: var(--ccp-shadow-sm);
}

/* ── Vendor rows (admin / WP portal linked-vendors list) ── */
body.ccp-theme-light .ccp-vendor-row {
  border-color: var(--ccp-border-soft) !important;
}
body.ccp-theme-light .ccp-vendor-row:hover {
  background: var(--ccp-bg-hover) !important; /* replace hardcoded #252525 */
}

/* ── Onboarding: split-step path selection ── */
body.ccp-theme-light .ccp-ob-split-sub {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ob-split-option:hover .ccp-ob-split-sub {
  color: var(--ccp-text-secondary) !important;
}
body.ccp-theme-light .ccp-ob-split-divider {
  background: var(--ccp-border-soft) !important;
}

/* ── Onboarding: lead form inputs (Path B) ── */
body.ccp-theme-light .ccp-ob-lead-input,
body.ccp-theme-light .ccp-ob-lead-textarea {
  background: var(--ccp-bg-raised) !important;
  border-color: var(--ccp-border-medium) !important;
  color: var(--ccp-text-primary) !important;
}
body.ccp-theme-light .ccp-ob-lead-input::placeholder,
body.ccp-theme-light .ccp-ob-lead-textarea::placeholder {
  color: var(--ccp-text-muted) !important;
}
body.ccp-theme-light .ccp-ob-candidate-btn:hover {
  background: var(--ccp-bg-hover) !important;
}

/* ── v5.52.3: ccp-link-soon "coming soon / in progress" label ── */
body.ccp-theme-light .ccp-link-soon {
  color: var(--ccp-text-muted) !important;
}

/* ── v5.52.4: photoshoot dashboard head border ── */
/* photoshoot-dashboard.css: rgba(255,255,255,0.08) border = invisible on light bg */
body.ccp-theme-light .ccp-ph-dash-head {
  border-bottom-color: var(--ccp-border-soft) !important;
}

/* ── Plugin UI isolation (v5.73.0) ──────────────────────────────────────────
   WP theme reset.css applies background-color on [type="button"]:hover/:focus
   with specificity (0,2,0). We override using wrapper selectors as namespace,
   raising specificity to (0,2,1) across all plugin dashboards and overlays.
   Covers: WP dashboard, Client dashboard, Staff dashboard, Tutorial overlay.
   Any future button/input added inside these wrappers is automatically protected.
   ─────────────────────────────────────────────────────────────────────────── */
.ccp-ed-wrap button:hover,          .ccp-ed-wrap button:focus,
.ccp-ed-wrap [type="button"]:hover, .ccp-ed-wrap [type="button"]:focus,
.ccp-ed-wrap [type="submit"]:hover, .ccp-ed-wrap [type="submit"]:focus,
.ccp-dashboard button:hover,          .ccp-dashboard button:focus,
.ccp-dashboard [type="button"]:hover, .ccp-dashboard [type="button"]:focus,
.ccp-dashboard [type="submit"]:hover, .ccp-dashboard [type="submit"]:focus,
#ccp-tutorial-overlay button:hover,          #ccp-tutorial-overlay button:focus,
#ccp-tutorial-overlay [type="button"]:hover, #ccp-tutorial-overlay [type="button"]:focus {
  background-color: transparent;
  border-color: inherit;
  color: inherit;
}

/* ── Tutorial light mode (v5.74.0) ──────────────────────────────────────────
   tutorial.css ha colori hardcoded rgba(255,255,255,X) pensati per dark mode.
   In light mode questi diventano bianco su bianco = illeggibile.
   ─────────────────────────────────────────────────────────────────────────── */
body.ccp-theme-light .ccp-tutorial-nav-item {
  color: var(--ccp-text-muted);
}
body.ccp-theme-light .ccp-tutorial-toc-card-desc {
  color: var(--ccp-text-secondary);
}
body.ccp-theme-light .ccp-tutorial-article-body p,
body.ccp-theme-light .ccp-tutorial-article-body li,
body.ccp-theme-light .ccp-tutorial-article-body .ccp-tut-tip {
  color: var(--ccp-text-secondary);
}
body.ccp-theme-light .ccp-tutorial-article-body em {
  color: var(--ccp-text-muted);
}

/* ── Fetta 3 ATELIER v3 — light mode contrast fixes ─────────────────────────
   Dark mode uses gold (#c9a96e) freely on dark surfaces (good ratio).
   Light mode: gold (#b8924a) on white fails WCAG AA. Use gold-deep (#856332).
   ─────────────────────────────────────────────────────────────────────────── */
body.ccp-theme-light .ccp-cl-pill--gold-xs {
  background: var(--ccp-bg-raised);
  color: var(--ccp-gold-deep);
}
body.ccp-theme-light .ccp-cl-days-list-loc {
  color: var(--ccp-text-secondary);
}
body.ccp-theme-light .ccp-cl-cardx-person-role--action {
  color: var(--ccp-gold-deep);
}

/* ── Fetta 5 — Global light mode contrast fixes ──────────────────────────────
   Pre-existing offenders identified by WCAG scanner (all from .ccp-cl-cardx-*).
   Dark mode unaffected — these rules are scoped to .ccp-theme-light only.
   ─────────────────────────────────────────────────────────────────────────── */
body.ccp-theme-light .ccp-cl-cardx-label      { color: var(--ccp-text-secondary); }
body.ccp-theme-light .ccp-cl-cardx-action     { color: var(--ccp-gold-deep); }
body.ccp-theme-light .ccp-cl-cardx-list-status{ color: var(--ccp-text-secondary); }
body.ccp-theme-light .ccp-cl-cardx-pill--copper{ color: #9a4030; }
