/* ══════════════════════════════════════════════════════════════
   builder-apple.css  —  Apple-inspired design for ExoCV Builder
   Loaded only on ai-cv-builder.html, after main.css + profiles.css
   No push — localhost test only until validated
══════════════════════════════════════════════════════════════ */

/* ── SYSTEM FONT (SF Pro / Helvetica Neue cascade) ── */
body,
.topbar, .sidebar, .step, .modal-box, .dl-modal-box,
button, input, textarea, select {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text',
               'Helvetica Neue', 'Segoe UI', Arial, sans-serif;
}

/* ── GEOMETRY — Apple larger, consistent radii ── */
.item-card,
.photo-panel    { border-radius: 14px !important; }
.field-input,
.field-textarea,
.field-select   { border-radius: 10px !important; }
.dl-modal-box   { border-radius: 20px !important; }
.modal-box      { border-radius: 18px !important; }
.btn-add-card   { border-radius: 10px !important; }
.sb-cv-btn,
.sb-interview-link { border-radius: 10px !important; }
.sidebar        { border-radius: 0 !important; }
.topbar         { border-radius: 0 !important; }


/* ═══════════════════════════════════════════════════════════════
   LIGHT MODE — Apple.com aesthetic
   Background : #f5f5f7  |  Cards : #fff  |  Accent : #0071e3
═══════════════════════════════════════════════════════════════ */
html[data-theme="light"] {
  /* ── Overwrite every gold/violet variable with Apple blue ── */
  --ink:        #f5f5f7;
  --ink-2:      #ffffff;
  --ink-3:      #f5f5f7;
  --ink-4:      #e8e8ed;
  --gold:       #0071e3;
  --gold-lt:    #0077ed;
  --gold-dim:   rgba(0,113,227,.15);
  --gold-pale:  rgba(0,113,227,.07);
  --white:      #1d1d1f;
  --text:       #1d1d1f;
  --slate:      #f5f5f7;
  --slate-2:    #e8e8ed;
  --slate-3:    #86868b;
  --muted:      rgba(0,0,0,.50);
  --muted-2:    rgba(0,0,0,.30);
  --muted-3:    rgba(0,0,0,.05);
  --border:     rgba(0,0,0,.10);
  --border-2:   rgba(0,0,0,.06);
  --red:        #ff3b30;
  --green:      #34c759;
  --r:          12px;
  --r2:         16px;
  --r3:         22px;
  --sh:         0 1px 3px rgba(0,0,0,.07), 0 4px 16px rgba(0,0,0,.07);
  --sh2:        0 2px 8px rgba(0,0,0,.06), 0 12px 40px rgba(0,0,0,.08);
  --glow:       0 0 20px rgba(0,113,227,.12);
}

/* Body */
html[data-theme="light"] body {
  background: #f5f5f7 !important;
  background-image: none !important;
  color: #1d1d1f;
}

/* ── TOPBAR — frosted glass macOS ── */
html[data-theme="light"] .topbar {
  background: rgba(255,255,255,.82) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  border-bottom: 1px solid rgba(0,0,0,.09) !important;
  box-shadow: 0 0.5px 0 rgba(0,0,0,.08) !important;
}

/* ── LOGO light — noir & blanc, aucune teinte bleue ── */
html[data-theme="light"] .logo-gem {
  color: #1d1d1f;
  filter: none;
}
html[data-theme="light"] .logo-text { color: #1d1d1f; }
html[data-theme="light"] .logo-text b { color: #1d1d1f; }

/* ── STEP NAV — blue active, green done ── */
html[data-theme="light"] .step-label     { color: rgba(0,0,0,.35); }
html[data-theme="light"] .step-line      { background: rgba(0,0,0,.08); }
html[data-theme="light"] .step-circle    {
  background: #f0f0f5;
  border-color: rgba(0,0,0,.1);
  color: rgba(0,0,0,.4);
}
html[data-theme="light"] .step-item.active .step-label  { color: #0071e3; font-weight: 600; }
html[data-theme="light"] .step-item.active .step-circle {
  background: #0071e3;
  color: #fff;
  border-color: transparent;
  box-shadow: 0 0 0 4px rgba(0,113,227,.14), 0 2px 8px rgba(0,113,227,.28) !important;
}
html[data-theme="light"] .step-item.done .step-circle   {
  background: #1d1d1f;
  color: #fff;
  border-color: transparent;
  box-shadow: none !important;
}
html[data-theme="light"] .step-item.done .step-check    { color: #fff; }
html[data-theme="light"] .step-item.done .step-label    { color: rgba(0,0,0,.3); }
html[data-theme="light"] .step-item.done .step-line     { background: rgba(0,0,0,.14) !important; }
html[data-theme="light"] .step-item:hover:not(.active) .step-circle { border-color: rgba(0,113,227,.3); }
html[data-theme="light"] .step-item:hover:not(.active) .step-label  { color: rgba(0,0,0,.55); }

/* Topbar scoped step overrides */
html[data-theme="light"] .topbar .step-item.active .step-circle {
  box-shadow: 0 0 0 4px rgba(0,113,227,.14), 0 0 14px rgba(0,113,227,.25) !important;
}
html[data-theme="light"] .topbar .step-item.done .step-circle  { background: #1d1d1f; box-shadow: none !important; }
html[data-theme="light"] .topbar .step-item.done .step-check   { color: #fff; }
html[data-theme="light"] .topbar .step-item.done .step-label   { color: rgba(0,0,0,.3); }
html[data-theme="light"] .topbar .step-item:hover:not(.active) .step-circle { border-color: rgba(0,113,227,.3); }

/* ── PROGRESS ── */
html[data-theme="light"] .progress-fill {
  background: linear-gradient(90deg, #0071e3, #0077ed) !important;
  box-shadow: none !important;
}
html[data-theme="light"] .progress-track { background: rgba(0,0,0,.07); }

/* ── SIDEBAR ── */
html[data-theme="light"] .sidebar {
  background: rgba(255,255,255,.94) !important;
  border-right: 1px solid rgba(0,0,0,.07) !important;
  box-shadow: none !important;
}
html[data-theme="light"] .sb-section-label   { color: #86868b; }
html[data-theme="light"] .sb-divider         { background: rgba(0,0,0,.06); }
html[data-theme="light"] .sb-cv-btn {
  background: #f5f5f7;
  border-color: rgba(0,0,0,.1);
  color: #1d1d1f;
}
html[data-theme="light"] .sb-cv-btn:hover {
  background: #e8e8ed;
  border-color: rgba(0,113,227,.3);
}
html[data-theme="light"] .save-badge         { color: rgba(0,0,0,.28); border-color: rgba(0,0,0,.08); }
html[data-theme="light"] .save-badge.saved   { color: #34c759; border-color: rgba(52,199,89,.2); background: rgba(52,199,89,.06); }
html[data-theme="light"] .lang-switcher      { background: #f0f0f5; border-color: rgba(0,0,0,.08); }
html[data-theme="light"] .lang-btn           { color: rgba(0,0,0,.4); }
html[data-theme="light"] .lang-btn.active,
html[data-theme="light"] .lang-btn:hover     { background: #0071e3; color: #fff; }
html[data-theme="light"] .sb-login-btn       {
  background: rgba(0,113,227,.07);
  border-color: rgba(0,113,227,.2);
  color: #0071e3;
}
html[data-theme="light"] .sb-login-btn:hover { background: rgba(0,113,227,.12); }
html[data-theme="light"] .sb-user-email      { color: #0071e3; }
html[data-theme="light"] .sb-interview-link  {
  color: #0071e3;
  background: rgba(0,113,227,.06);
  border-color: rgba(0,113,227,.15);
}
html[data-theme="light"] .sb-interview-link:hover {
  background: rgba(0,113,227,.12);
  border-color: rgba(0,113,227,.3);
  color: #004db2;
}
html[data-theme="light"] .sb-menu-item       { color: rgba(0,0,0,.45); }
html[data-theme="light"] .sb-menu-item:hover { background: rgba(0,0,0,.04); color: #1d1d1f; }
html[data-theme="light"] .sb-legal-link      { color: rgba(0,0,0,.25); }
html[data-theme="light"] .sb-legal-link:hover{ color: #0071e3; }

/* ── STEP CONTENT ── */
html[data-theme="light"] .step-header h1,
html[data-theme="light"] .step-header h2  { color: #1d1d1f; }
html[data-theme="light"] .step-kicker     { color: #0071e3; }
html[data-theme="light"] .step-kicker::before {
  background: linear-gradient(90deg, #0071e3, transparent);
}
html[data-theme="light"] .step-sub        { color: #6e6e73; }
html[data-theme="light"] .step-actions    { border-top-color: rgba(0,0,0,.06); }

/* ── FORM ── */
html[data-theme="light"] .field-label        { color: #1d1d1f; font-weight: 600; }
html[data-theme="light"] .field-wrap:focus-within .field-label { color: #0071e3; }
html[data-theme="light"] .field-note         { color: #86868b; }
html[data-theme="light"] .char-counter       { color: rgba(0,0,0,.3); }
html[data-theme="light"] .error-msg          { color: #ff3b30; }

html[data-theme="light"] .field-input,
html[data-theme="light"] .field-textarea,
html[data-theme="light"] .field-select {
  background: #ffffff;
  border-color: rgba(0,0,0,.12);
  color: #1d1d1f;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
html[data-theme="light"] .field-input:hover,
html[data-theme="light"] .field-textarea:hover,
html[data-theme="light"] .field-select:hover {
  background: #fff;
  border-color: rgba(0,0,0,.2);
}
html[data-theme="light"] .field-input:focus,
html[data-theme="light"] .field-textarea:focus,
html[data-theme="light"] .field-select:focus {
  background: #fff;
  border-color: #0071e3;
  box-shadow: 0 0 0 3px rgba(0,113,227,.15), 0 1px 2px rgba(0,0,0,.04) !important;
}
html[data-theme="light"] .field-input::placeholder,
html[data-theme="light"] .field-textarea::placeholder { color: rgba(0,0,0,.25); }

html[data-theme="light"] .ats-hint {
  color: #0071e3;
  background: rgba(0,113,227,.07);
  border-color: rgba(0,113,227,.2);
}

/* ── PHOTO PANEL ── */
html[data-theme="light"] .photo-panel      { background: #fff; border-color: rgba(0,0,0,.08); }
html[data-theme="light"] .toggle-track     { background: #e5e5ea; border-color: rgba(0,0,0,.08); }
html[data-theme="light"] .toggle-track::before { background: #fff; }
html[data-theme="light"] .toggle-switch input:checked + .toggle-track {
  background: #0071e3; border-color: #0071e3;
}
html[data-theme="light"] .photo-avatar     { background: #f5f5f7; border-color: rgba(0,0,0,.15); color: #86868b; }
html[data-theme="light"] .photo-avatar:hover { border-color: #0071e3; border-style: solid; }
html[data-theme="light"] .btn-upload       { border-color: rgba(0,0,0,.15); color: #1d1d1f; }
html[data-theme="light"] .btn-upload:hover { background: #1d1d1f; color: #fff; border-color: #1d1d1f; }

/* ── CV LANG BUTTONS ── */
html[data-theme="light"] .cv-lang-btn      { background: #fff; border-color: rgba(0,0,0,.1); color: #1d1d1f; }
html[data-theme="light"] .cv-lang-btn:hover{ border-color: rgba(0,113,227,.3); color: #0071e3; }
html[data-theme="light"] .cv-lang-btn.active{ background: #0071e3; border-color: #0071e3; color: #fff; }

/* ── ITEM CARDS ── */
html[data-theme="light"] .item-card         {
  background: #fff;
  border-color: rgba(0,0,0,.08);
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
html[data-theme="light"] .item-card::before {
  background: linear-gradient(180deg, #0071e3, rgba(0,113,227,.12)) !important;
}
html[data-theme="light"] .item-card:hover   { border-color: rgba(0,113,227,.22); box-shadow: 0 4px 20px rgba(0,0,0,.08); }
html[data-theme="light"] .item-card:focus-within { border-color: rgba(0,113,227,.38) !important; }
html[data-theme="light"] .card-label        { color: rgba(0,0,0,.3); }

html[data-theme="light"] .btn-move-up,
html[data-theme="light"] .btn-move-down     {
  background: #f5f5f7;
  border-color: rgba(0,0,0,.1);
  color: rgba(0,0,0,.4);
}
html[data-theme="light"] .btn-move-up:hover:not(:disabled),
html[data-theme="light"] .btn-move-down:hover:not(:disabled) {
  background: #0071e3; border-color: #0071e3; color: #fff;
}
html[data-theme="light"] .btn-remove-card   { color: rgba(0,0,0,.25); }
html[data-theme="light"] .btn-remove-card:hover { background: rgba(255,59,48,.09); color: #ff3b30; }

html[data-theme="light"] .btn-add-card      {
  border-color: rgba(0,0,0,.12);
  color: rgba(0,0,0,.35);
}
html[data-theme="light"] .btn-add-card:hover {
  background: rgba(0,113,227,.07);
  border-color: rgba(0,113,227,.38);
  color: #0071e3;
  border-style: solid;
}

/* ── TAGS ── */
html[data-theme="light"] .tags-field       {
  background: #fff;
  border-color: rgba(0,0,0,.1);
}
html[data-theme="light"] .tags-field:focus-within {
  border-color: #0071e3;
  box-shadow: 0 0 0 3px rgba(0,113,227,.12) !important;
}
html[data-theme="light"] .tag-item         {
  background: rgba(0,113,227,.1);
  color: #0071e3;
  border-color: rgba(0,113,227,.2);
}
html[data-theme="light"] .tag-remove       { color: rgba(0,113,227,.45); }
html[data-theme="light"] .tag-remove:hover { color: #0071e3; }
html[data-theme="light"] .tags-input       { color: #1d1d1f; }
html[data-theme="light"] .tags-input::placeholder { color: rgba(0,0,0,.25); }
html[data-theme="light"] .tags-add-btn     {
  background: rgba(0,113,227,.12);
  border-color: rgba(0,113,227,.25);
  color: #0071e3;
}
html[data-theme="light"] .tags-add-btn:hover { background: rgba(0,113,227,.22); }

/* ── SUBSECTION ── */
html[data-theme="light"] .subsection       { border-top-color: rgba(0,0,0,.06); }
html[data-theme="light"] .subsection-title { color: #1d1d1f; border-bottom-color: rgba(0,0,0,.06); }
html[data-theme="light"] .subsection-hint  { color: #6e6e73; }

/* ── LANG ROW ── */
html[data-theme="light"] .current-check    { color: #6e6e73; }
html[data-theme="light"] .current-check input[type="checkbox"] { accent-color: #0071e3; }
html[data-theme="light"] .btn-remove-lang  {
  background: #fff; border-color: rgba(0,0,0,.1); color: rgba(0,0,0,.3);
}
html[data-theme="light"] .btn-remove-lang:hover {
  background: rgba(255,59,48,.08);
  border-color: rgba(255,59,48,.25);
  color: #ff3b30;
}
html[data-theme="light"] .date-sep         { color: rgba(0,0,0,.3); }

/* ── NAV BUTTONS — Apple pill style ── */
html[data-theme="light"] .btn-primary {
  background: #0071e3;
  color: #fff;
  border-color: transparent;
  border-radius: 980px !important;
  box-shadow: none !important;
}
html[data-theme="light"] .btn-primary:hover {
  background: #0077ed;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,113,227,.3) !important;
}
html[data-theme="light"] .btn-secondary {
  background: rgba(0,0,0,.05);
  color: #1d1d1f;
  border-color: rgba(0,0,0,.1);
  border-radius: 980px !important;
}
html[data-theme="light"] .btn-secondary:hover {
  background: rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.16);
  color: #1d1d1f;
}
html[data-theme="light"] #prev6,
html[data-theme="light"] .btn-share-cta,
html[data-theme="light"] .btn-pdf-cta {
  background: rgba(0,113,227,.08);
  border-color: rgba(0,113,227,.28);
  color: #0071e3;
}
html[data-theme="light"] #prev6:hover,
html[data-theme="light"] .btn-share-cta:hover,
html[data-theme="light"] .btn-pdf-cta:hover {
  background: rgba(0,113,227,.14);
  border-color: rgba(0,113,227,.5);
  box-shadow: 0 4px 16px rgba(0,113,227,.15) !important;
}

/* ── TEMPLATE GROUPS ── */
.tpl-group { margin-bottom: 22px; }
.tpl-group-header {
  display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px;
  padding-bottom: 7px;
}
html[data-theme="light"] .tpl-group-header  { border-bottom: 1px solid rgba(0,0,0,.07); }
html:not([data-theme="light"]) .tpl-group-header { border-bottom: 1px solid rgba(255,255,255,.08); }
.tpl-group-label { font-size: 13px; font-weight: 600; letter-spacing: -.2px; }
html[data-theme="light"]           .tpl-group-label { color: #1d1d1f; }
html:not([data-theme="light"])     .tpl-group-label { color: #f5f5f7; }
.tpl-group-desc { font-size: 11px; opacity: .5; }
.tpl-group.tpl-group-empty { display: none; }

/* ── MOBILE TOGGLE — "Plus de modèles" / "Voir moins" ── */
.tpl-mobile-toggle { display: none; }

@media (max-width: 768px) {
  .tpl-mobile-toggle {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 6px auto 20px;
    padding: 10px 22px;
    background: #0071e3;
    color: #fff;
    border: none;
    border-radius: 980px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(0,113,227,.35);
    transition: background .2s, box-shadow .2s, transform .2s;
  }
  .tpl-mobile-toggle:hover,
  .tpl-mobile-toggle:active {
    background: #0077ed;
    box-shadow: 0 6px 20px rgba(0,113,227,.45);
  }
  .tpl-toggle-icon { transition: transform .25s ease; }
  .tpl-mobile-toggle[aria-expanded="true"] .tpl-toggle-icon { transform: rotate(180deg); }
  /* Hide modern + creative groups by default on mobile */
  .tpl-extra { display: none; }
  /* When toggle is expanded, show them */
  .tpl-mobile-toggle[aria-expanded="true"] ~ .tpl-extra { display: block; }
}

/* ── FILTER BAR ── */
.tpl-filter-bar {
  display: flex; align-items: center; gap: 8px; margin-bottom: 14px; flex-wrap: wrap;
}
.tpl-filter-btn {
  display: inline-flex; align-items: center; gap: 6px; position: relative;
  padding: 7px 16px; border-radius: 20px; border: none; cursor: pointer;
  font-size: 13px; font-weight: 500;
  background: #0071e3; color: #fff;
  transition: background .15s, transform .1s, box-shadow .15s;
}
.tpl-filter-btn:hover { background: #005bbf; box-shadow: 0 2px 8px rgba(0,113,227,.3); }
.tpl-filter-btn:active { transform: scale(.96); }
html:not([data-theme="light"]) .tpl-filter-btn       { background: #0a84ff; }
html:not([data-theme="light"]) .tpl-filter-btn:hover { background: #409cff; box-shadow: 0 2px 8px rgba(10,132,255,.35); }
.tpl-filter-active-dot {
  width: 7px; height: 7px; background: #ff3b30; border-radius: 50%;
  position: absolute; top: 3px; right: 5px;
  display: none;
}
.tpl-filter-active-dot.visible { display: block; }
.tpl-filter-clear {
  display: none; align-items: center; gap: 5px;
  padding: 6px 13px; border-radius: 20px; border: none; cursor: pointer;
  font-size: 12px; font-weight: 500; transition: opacity .15s;
}
.tpl-filter-clear.visible { display: inline-flex; }
.tpl-filter-clear:hover { opacity: .7; }
html[data-theme="light"]       .tpl-filter-clear { background: rgba(0,0,0,.06); color: #1d1d1f; }
html:not([data-theme="light"]) .tpl-filter-clear { background: rgba(255,255,255,.1); color: #e8e8ed; }

/* ── FILTER PANEL ── */
.tpl-filter-panel {
  display: none; border-radius: 14px; padding: 16px 18px; margin-bottom: 18px;
  animation: tplPanelIn .2s ease;
}
.tpl-filter-panel.open { display: block; }
@keyframes tplPanelIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
html[data-theme="light"]       .tpl-filter-panel { background: #f5f5f7; border: 1px solid rgba(0,0,0,.07); }
html:not([data-theme="light"]) .tpl-filter-panel { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); }
.tpl-filter-hint { font-size: 12px; opacity: .5; margin: 0 0 12px; }
.tpl-filter-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.tpl-chip {
  padding: 6px 15px; border-radius: 20px; border: 1.5px solid; cursor: pointer;
  font-size: 13px; font-weight: 500; transition: all .15s; line-height: 1.3;
}
html[data-theme="light"] .tpl-chip { border-color: rgba(0,0,0,.12); background: #fff; color: #1d1d1f; }
html[data-theme="light"] .tpl-chip.selected { border-color: #0071e3; background: rgba(0,113,227,.08); color: #0071e3; }
html[data-theme="light"] .tpl-chip:hover:not(.selected) { background: rgba(0,0,0,.04); }
html:not([data-theme="light"]) .tpl-chip { border-color: rgba(255,255,255,.15); background: rgba(255,255,255,.06); color: #e8e8ed; }
html:not([data-theme="light"]) .tpl-chip.selected { border-color: #0a84ff; background: rgba(10,132,255,.15); color: #409cff; }
html:not([data-theme="light"]) .tpl-chip:hover:not(.selected) { background: rgba(255,255,255,.1); }
.tpl-filter-apply {
  padding: 8px 22px; border-radius: 20px; border: none; cursor: pointer;
  font-size: 13px; font-weight: 600; background: #0071e3; color: #fff;
  transition: background .15s, transform .1s;
}
.tpl-filter-apply:hover { background: #005bbf; }
.tpl-filter-apply:active { transform: scale(.96); }
html:not([data-theme="light"]) .tpl-filter-apply       { background: #0a84ff; }
html:not([data-theme="light"]) .tpl-filter-apply:hover { background: #409cff; }

/* Hidden cards during filter */
.template-card.tpl-hidden { display: none !important; }

/* ── TEMPLATE PICKER ── */
html[data-theme="light"] .tpl-preview {
  border-color: rgba(0,0,0,.08);
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
}
html[data-theme="light"] .template-card:hover .tpl-preview { box-shadow: 0 6px 20px rgba(0,0,0,.1); }
html[data-theme="light"] .template-card.active .tpl-preview {
  border-color: #0071e3;
  box-shadow: 0 0 0 3px rgba(0,113,227,.14), 0 6px 20px rgba(0,0,0,.1);
}
html[data-theme="light"] .template-card > span           { color: #86868b; }
html[data-theme="light"] .template-card.active > span    { color: #0071e3; }
html[data-theme="light"] .tpl-badge {
  color: #0071e3;
  background: rgba(0,113,227,.08);
  border-color: rgba(0,113,227,.2);
}

/* ── PREVIEW SHELL ── */
html[data-theme="light"] .preview-shell {
  border-color: rgba(0,0,0,.08);
  box-shadow: 0 8px 32px rgba(0,0,0,.08);
}
html[data-theme="light"] .preview-toolbar {
  background: rgba(255,255,255,.97);
  border-bottom-color: rgba(0,0,0,.06);
}
html[data-theme="light"] .preview-title            { color: rgba(0,0,0,.38); }
html[data-theme="light"] .preview-title::before    {
  background: #0071e3;
  box-shadow: 0 0 6px rgba(0,113,227,.4);
}
html[data-theme="light"] .btn-toolbar-share        {
  background: rgba(0,0,0,.04);
  border-color: rgba(0,0,0,.1);
  color: #1d1d1f;
}
html[data-theme="light"] .btn-toolbar-share:hover  { background: rgba(0,0,0,.08); }
html[data-theme="light"] .btn-toolbar-pdf          {
  background: #0071e3;
  color: #fff;
  border: none;
  box-shadow: none !important;
}
html[data-theme="light"] .btn-toolbar-pdf:hover    { background: #0077ed; }
html[data-theme="light"] .preview-stage {
  background: #e5e5ea !important;
  background-image:
    linear-gradient(rgba(0,0,0,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.035) 1px, transparent 1px) !important;
}
html[data-theme="light"] .preview-zoom-group       {
  background: rgba(0,0,0,.04);
  border-color: rgba(0,0,0,.09);
}
html[data-theme="light"] .btn-toolbar-zoom         { color: rgba(0,0,0,.38); }
html[data-theme="light"] .btn-toolbar-zoom:hover   { background: rgba(0,0,0,.07); color: #1d1d1f; }
html[data-theme="light"] .preview-zoom-pct         { color: rgba(0,0,0,.38); }
html[data-theme="light"] .scroll-preview-hint      { color: #0071e3; }

/* ── DOWNLOAD MODAL ── */
html[data-theme="light"] .dl-modal-box             { background: #fff; border-color: rgba(0,0,0,.08); box-shadow: 0 24px 60px rgba(0,0,0,.12); }
html[data-theme="light"] .dl-modal-title           { color: #1d1d1f; }
html[data-theme="light"] .dl-modal-sub             { color: #6e6e73; }
html[data-theme="light"] .dl-modal-close           { border-color: rgba(0,0,0,.1); color: rgba(0,0,0,.38); }
html[data-theme="light"] .dl-modal-close:hover     { background: rgba(0,0,0,.06); color: #1d1d1f; }
html[data-theme="light"] .dl-modal-icon            { background: rgba(0,113,227,.1); border-color: rgba(0,113,227,.2); color: #0071e3; }
html[data-theme="light"] .dl-format-card           { background: #f5f5f7; border-color: rgba(0,0,0,.09); }
html[data-theme="light"] .dl-format-card:hover     { background: #ededf0; border-color: rgba(0,113,227,.3); box-shadow: 0 4px 16px rgba(0,0,0,.08); }
html[data-theme="light"] .dl-format-pdf            { border-color: rgba(0,113,227,.25); background: rgba(0,113,227,.06); }
html[data-theme="light"] .dl-format-pdf:hover      { border-color: #0071e3; background: rgba(0,113,227,.1); box-shadow: 0 8px 24px rgba(0,113,227,.15); }
html[data-theme="light"] .dl-format-badge          { background: #0071e3; }
html[data-theme="light"] .dl-icon-pdf              { background: rgba(0,113,227,.12); color: #0071e3; }
html[data-theme="light"] .dl-icon-img              { background: rgba(0,0,0,.06); color: rgba(0,0,0,.4); }
html[data-theme="light"] .dl-format-card:hover .dl-icon-img { color: #1d1d1f; }
html[data-theme="light"] .dl-format-name           { color: #1d1d1f; }
html[data-theme="light"] .dl-format-desc           { color: #6e6e73; }
html[data-theme="light"] .dl-format-pdf .dl-format-name { color: #0071e3; }
html[data-theme="light"] .dl-format-pdf .dl-format-desc { color: rgba(0,113,227,.6); }
html[data-theme="light"] .dl-watermark-note        { background: rgba(0,113,227,.07); border-color: rgba(0,113,227,.18); color: #0057b8; }

/* ── SHARE MODAL ── */
html[data-theme="light"] .modal-box                { background: #fff; border-color: rgba(0,0,0,.08); }
html[data-theme="light"] .modal-head h3            { color: #1d1d1f; }
html[data-theme="light"] .modal-box > p            { color: #6e6e73; }
html[data-theme="light"] .btn-icon                 { color: rgba(0,0,0,.38); }
html[data-theme="light"] .btn-icon:hover           { background: rgba(0,0,0,.06); color: #1d1d1f; }
html[data-theme="light"] .share-url-input          { background: #f5f5f7; border-color: rgba(0,0,0,.1); color: #1d1d1f; }
html[data-theme="light"] .btn-copy                 { background: #f5f5f7; border-color: rgba(0,0,0,.1); color: #1d1d1f; }
html[data-theme="light"] .btn-copy:hover           { background: #0071e3; color: #fff; border-color: #0071e3; }
html[data-theme="light"] .btn-copy.copied          { background: #34c759; border-color: #34c759; }

/* ── AI MODAL ── */
html[data-theme="light"] .modal-ai-box             { background: #fff; }
html[data-theme="light"] .modal-ai-head            { border-bottom-color: rgba(0,0,0,.08); }
html[data-theme="light"] .ai-improvement-item      { background: rgba(0,113,227,.05); border-color: rgba(0,113,227,.12); color: #1d1d1f; }
html[data-theme="light"] .ai-letter-wrap            { background: #f5f5f7; border-color: rgba(0,0,0,.08); color: #1d1d1f; }
html[data-theme="light"] .ai-no-offer              { background: rgba(0,113,227,.05); border-color: rgba(0,113,227,.14); color: #0071e3; }

/* ── TOASTS light ── */
html[data-theme="light"] .toast.info               { color: #0071e3; }
html[data-theme="light"] .toast.info .toast-icon   { background: rgba(0,113,227,.1) !important; }

/* ── SKELETON ── */
html[data-theme="light"] .skeleton {
  background: linear-gradient(90deg, #eaeaed 25%, #f5f5f7 50%, #eaeaed 75%);
  background-size: 200% 100%;
}

/* ── PROFILES PANEL light ── */
html[data-theme="light"] .profiles-panel           { background: #fff; }

/* ── MULTIPAGE WARN ── */
html[data-theme="light"] .dl-multipage-warn        { background: rgba(255,149,0,.07); border-color: rgba(255,149,0,.2); color: #d4840a; }

/* ── SCROLLBAR light ── */
html[data-theme="light"] ::-webkit-scrollbar-thumb { background: #c7c7cc; }


/* ═══════════════════════════════════════════════════════════════
   DARK MODE — Apple dark (macOS / iOS dark)
   Background : #000  |  Cards : #1c1c1e  |  Accent : #0a84ff
═══════════════════════════════════════════════════════════════ */
html:not([data-theme="light"]) {
  --ink:        #000000;
  --ink-2:      #1c1c1e;
  --ink-3:      #2c2c2e;
  --ink-4:      #3a3a3c;
  --gold:       #0a84ff;
  --gold-lt:    #409cff;
  --gold-dim:   rgba(10,132,255,.22);
  --gold-pale:  rgba(10,132,255,.08);
  --muted:      rgba(235,235,245,.55);
  --muted-2:    rgba(235,235,245,.28);
  --muted-3:    rgba(235,235,245,.09);
  --border:     rgba(255,255,255,.14);
  --border-2:   rgba(255,255,255,.08);
  --text:       #f5f5f7;
  --red:        #ff453a;
  --green:      #30d158;
  --r:          12px;
  --r2:         16px;
  --r3:         22px;
  --sh:         0 2px 8px rgba(0,0,0,.5);
  --sh2:        0 8px 32px rgba(0,0,0,.65);
  --glow:       0 0 20px rgba(10,132,255,.2);
}

html:not([data-theme="light"]) body {
  background: #000000 !important;
  background-image: none !important;
  color: #f5f5f7;
}

/* ── TOPBAR dark — Apple frosted glass ── */
html:not([data-theme="light"]) .topbar {
  background: rgba(28,28,30,.72) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  box-shadow: none !important;
}

/* ── LOGO dark — noir & blanc, aucune teinte bleue ── */
html:not([data-theme="light"]) .logo-gem {
  color: #ffffff;
  filter: none;
}
html:not([data-theme="light"]) .logo-text   { color: #ffffff; }
html:not([data-theme="light"]) .logo-text b { color: #ffffff; }

/* ── STEP NAV dark ── */
html:not([data-theme="light"]) .step-circle   {
  border-color: rgba(255,255,255,.15);
  color: rgba(255,255,255,.28);
}
html:not([data-theme="light"]) .step-line     { background: rgba(255,255,255,.08); }
html:not([data-theme="light"]) .step-item.active .step-label  { color: #409cff; }
html:not([data-theme="light"]) .step-item.active .step-circle {
  background: #0a84ff;
  border-color: #0a84ff;
  color: #fff;
  box-shadow: 0 0 0 4px rgba(10,132,255,.2), 0 0 14px rgba(10,132,255,.3) !important;
}
html:not([data-theme="light"]) .step-item.done .step-circle   {
  background: #48484a;
  border-color: #48484a;
  box-shadow: none !important;
}
html:not([data-theme="light"]) .step-item.done .step-check    { color: #fff; }
html:not([data-theme="light"]) .step-item.done .step-label    { color: rgba(255,255,255,.3); }
html:not([data-theme="light"]) .step-item.done .step-line     { background: rgba(255,255,255,.1) !important; }
html:not([data-theme="light"]) .step-item:hover:not(.active) .step-circle { border-color: rgba(10,132,255,.4); }
html:not([data-theme="light"]) .step-item:hover:not(.active) .step-label  { color: rgba(255,255,255,.55); }

/* Topbar scoped dark */
html:not([data-theme="light"]) .topbar .step-item.active .step-circle {
  box-shadow: 0 0 0 4px rgba(10,132,255,.2), 0 0 14px rgba(10,132,255,.25) !important;
}
html:not([data-theme="light"]) .topbar .step-item.done .step-circle  { background: #48484a; box-shadow: none !important; }
html:not([data-theme="light"]) .topbar .step-item.done .step-check   { color: #fff; }

/* ── PROGRESS dark ── */
html:not([data-theme="light"]) .progress-fill {
  background: linear-gradient(90deg, #0a84ff, #409cff) !important;
  box-shadow: 0 0 8px rgba(10,132,255,.4) !important;
}

/* ── SIDEBAR dark ── */
html:not([data-theme="light"]) .sidebar {
  background: #1c1c1e !important;
  border-right-color: rgba(255,255,255,.08) !important;
}
html:not([data-theme="light"]) .sb-cv-btn          { background: #2c2c2e; border-color: rgba(255,255,255,.1); color: #f5f5f7; }
html:not([data-theme="light"]) .sb-cv-btn:hover    { background: #3a3a3c; border-color: rgba(10,132,255,.4); }
html:not([data-theme="light"]) .lang-btn.active,
html:not([data-theme="light"]) .lang-btn:hover     { background: #0a84ff; color: #fff; }
html:not([data-theme="light"]) .sb-login-btn       { background: rgba(10,132,255,.12); border-color: rgba(10,132,255,.3); color: #409cff; }
html:not([data-theme="light"]) .sb-login-btn:hover { background: rgba(10,132,255,.2); }
html:not([data-theme="light"]) .sb-user-email      { color: #409cff; }
html:not([data-theme="light"]) .sb-interview-link  { color: #409cff; background: rgba(10,132,255,.1); border-color: rgba(10,132,255,.22); }
html:not([data-theme="light"]) .sb-interview-link:hover { background: rgba(10,132,255,.18); border-color: rgba(10,132,255,.4); color: #6eb4ff; }
html:not([data-theme="light"]) .save-badge.saved   { color: #30d158; border-color: rgba(48,209,88,.2); }

/* ── STEP KICKER dark ── */
html:not([data-theme="light"]) .step-kicker        { color: #0a84ff; }
html:not([data-theme="light"]) .step-kicker::before{ background: linear-gradient(90deg, #0a84ff, transparent); }
html:not([data-theme="light"]) .step-actions       { border-top-color: rgba(255,255,255,.07); }

/* ── FORM dark ── */
html:not([data-theme="light"]) .field-wrap:focus-within .field-label { color: #0a84ff; }
html:not([data-theme="light"]) .field-input,
html:not([data-theme="light"]) .field-textarea,
html:not([data-theme="light"]) .field-select       {
  background: #2c2c2e;
  border-color: rgba(255,255,255,.12);
}
html:not([data-theme="light"]) .field-input:hover,
html:not([data-theme="light"]) .field-textarea:hover,
html:not([data-theme="light"]) .field-select:hover { background: #3a3a3c; border-color: rgba(255,255,255,.2); }
html:not([data-theme="light"]) .field-input:focus,
html:not([data-theme="light"]) .field-textarea:focus,
html:not([data-theme="light"]) .field-select:focus {
  border-color: #0a84ff;
  box-shadow: 0 0 0 3px rgba(10,132,255,.2) !important;
  background: #2c2c2e;
}
html:not([data-theme="light"]) .ats-hint { color: #409cff; background: rgba(10,132,255,.1); border-color: rgba(10,132,255,.25); }

/* ── PHOTO PANEL dark ── */
html:not([data-theme="light"]) .photo-panel        { background: #1c1c1e; border-color: rgba(255,255,255,.08); }
html:not([data-theme="light"]) .toggle-track       { background: rgba(255,255,255,.15); }
html:not([data-theme="light"]) .toggle-switch input:checked + .toggle-track { background: #0a84ff; border-color: #0a84ff; }
html:not([data-theme="light"]) .photo-avatar       { border-color: rgba(255,255,255,.2); background: #2c2c2e; }
html:not([data-theme="light"]) .photo-avatar:hover { border-color: #0a84ff; }

/* ── CV LANG dark ── */
html:not([data-theme="light"]) .cv-lang-btn.active { background: #0a84ff; border-color: #0a84ff; }

/* ── ITEM CARDS dark ── */
html:not([data-theme="light"]) .item-card           { background: #1c1c1e; border-color: rgba(255,255,255,.08); }
html:not([data-theme="light"]) .item-card::before   { background: linear-gradient(180deg, #0a84ff, rgba(10,132,255,.12)) !important; }
html:not([data-theme="light"]) .item-card:hover     { border-color: rgba(255,255,255,.13); box-shadow: 0 4px 24px rgba(0,0,0,.4); }
html:not([data-theme="light"]) .item-card:focus-within { border-color: rgba(10,132,255,.4) !important; }
html:not([data-theme="light"]) .btn-move-up:hover:not(:disabled),
html:not([data-theme="light"]) .btn-move-down:hover:not(:disabled) { background: #0a84ff; border-color: #0a84ff; }
html:not([data-theme="light"]) .btn-add-card:hover {
  background: rgba(10,132,255,.1);
  border-color: rgba(10,132,255,.4);
  color: #409cff;
}

/* ── TAGS dark ── */
html:not([data-theme="light"]) .tags-field          { background: #2c2c2e; border-color: rgba(255,255,255,.1); }
html:not([data-theme="light"]) .tags-field:focus-within { border-color: #0a84ff; box-shadow: 0 0 0 3px rgba(10,132,255,.2) !important; }
html:not([data-theme="light"]) .tag-item            { background: rgba(10,132,255,.18); color: #409cff; border-color: rgba(10,132,255,.3); }
html:not([data-theme="light"]) .tag-remove          { color: rgba(10,132,255,.5); }
html:not([data-theme="light"]) .tag-remove:hover    { color: #409cff; }
html:not([data-theme="light"]) .tags-add-btn        { background: rgba(10,132,255,.18); border-color: rgba(10,132,255,.3); color: #409cff; }
html:not([data-theme="light"]) .tags-add-btn:hover  { background: rgba(10,132,255,.3); }
html:not([data-theme="light"]) .current-check input[type="checkbox"] { accent-color: #0a84ff; }

/* ── NAV BUTTONS dark — Apple pill ── */
html:not([data-theme="light"]) .btn-primary {
  background: #0a84ff;
  color: #fff;
  border-color: transparent;
  border-radius: 980px !important;
  box-shadow: none !important;
}
html:not([data-theme="light"]) .btn-primary:hover {
  background: #409cff;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(10,132,255,.35) !important;
}
html:not([data-theme="light"]) .btn-secondary {
  color: #f5f5f7;
  border-color: rgba(255,255,255,.15);
  border-radius: 980px !important;
}
html:not([data-theme="light"]) .btn-secondary:hover { border-color: rgba(255,255,255,.28); color: #fff; }
html:not([data-theme="light"]) #prev6,
html:not([data-theme="light"]) .btn-share-cta,
html:not([data-theme="light"]) .btn-pdf-cta       { background: rgba(10,132,255,.12); border-color: rgba(10,132,255,.35); color: #409cff; }
html:not([data-theme="light"]) #prev6:hover,
html:not([data-theme="light"]) .btn-share-cta:hover,
html:not([data-theme="light"]) .btn-pdf-cta:hover {
  background: rgba(10,132,255,.22);
  border-color: rgba(10,132,255,.6);
  box-shadow: 0 4px 16px rgba(10,132,255,.25) !important;
}

/* ── TEMPLATE PICKER dark ── */
html:not([data-theme="light"]) .template-card.active .tpl-preview {
  border-color: #0a84ff;
  box-shadow: 0 0 0 3px rgba(10,132,255,.2), 0 8px 32px rgba(0,0,0,.5);
}
html:not([data-theme="light"]) .template-card.active > span  { color: #409cff; }
html:not([data-theme="light"]) .tpl-badge { color: #409cff; background: rgba(10,132,255,.12); border-color: rgba(10,132,255,.25); }

/* ── PREVIEW dark ── */
html:not([data-theme="light"]) .preview-toolbar    { background: #1c1c1e; }
html:not([data-theme="light"]) .preview-title::before { background: #0a84ff; box-shadow: 0 0 8px rgba(10,132,255,.5); }
html:not([data-theme="light"]) .btn-toolbar-pdf    { background: #0a84ff; box-shadow: none !important; }
html:not([data-theme="light"]) .btn-toolbar-pdf:hover { background: #409cff; }
html:not([data-theme="light"]) .preview-stage {
  background: #000 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px) !important;
}
html:not([data-theme="light"]) .scroll-preview-hint { color: #409cff; }

/* ── DOWNLOAD MODAL dark ── */
html:not([data-theme="light"]) .dl-modal-box        { background: #1c1c1e; }
html:not([data-theme="light"]) .dl-modal-icon       { background: rgba(10,132,255,.12); border-color: rgba(10,132,255,.25); color: #409cff; }
html:not([data-theme="light"]) .dl-format-card      { background: #2c2c2e; }
html:not([data-theme="light"]) .dl-format-card:hover{ border-color: rgba(10,132,255,.4); background: #3a3a3c; }
html:not([data-theme="light"]) .dl-format-pdf       { border-color: rgba(10,132,255,.3); background: rgba(10,132,255,.08); }
html:not([data-theme="light"]) .dl-format-pdf:hover { border-color: #0a84ff; background: rgba(10,132,255,.14); box-shadow: 0 8px 28px rgba(10,132,255,.2); }
html:not([data-theme="light"]) .dl-format-badge     { background: #0a84ff; }
html:not([data-theme="light"]) .dl-icon-pdf         { background: rgba(10,132,255,.15); color: #409cff; }
html:not([data-theme="light"]) .dl-format-pdf .dl-format-name { color: #409cff; }
html:not([data-theme="light"]) .dl-format-pdf .dl-format-desc { color: rgba(64,156,255,.65); }
html:not([data-theme="light"]) .dl-watermark-note   { background: rgba(10,132,255,.09); border-color: rgba(10,132,255,.22); color: #8bc5ff; }

/* ── SHARE MODAL dark ── */
html:not([data-theme="light"]) .modal-box           { background: #1c1c1e; }
html:not([data-theme="light"]) .btn-copy:hover      { background: #0a84ff; border-color: #0a84ff; }
html:not([data-theme="light"]) .btn-copy.copied     { background: #30d158; border-color: #30d158; }
html:not([data-theme="light"]) .share-url-input     { background: #2c2c2e; }

/* ── TOAST info dark ── */
html:not([data-theme="light"]) .toast.info          { color: #409cff; }
html:not([data-theme="light"]) .toast.info .toast-icon { background: rgba(10,132,255,.15) !important; }

/* ── SCROLLBAR dark — Apple-style subtle ── */
html:not([data-theme="light"]) ::-webkit-scrollbar-thumb { background: #3a3a3c; }
html:not([data-theme="light"]) { scrollbar-color: #3a3a3c transparent; }


/* ═══════════════════════════════════════════════════════════════
   SIDEBAR — textes manquants (dark + light)
═══════════════════════════════════════════════════════════════ */

/* Light mode — éléments non couverts */
html[data-theme="light"] .sb-theme-label   { color: #86868b; font-size: .74rem; font-weight: 500; }
html[data-theme="light"] .sb-theme-row     { display: flex; align-items: center; justify-content: space-between; }
html[data-theme="light"] .theme-toggle     { color: #1d1d1f; background: #f0f0f5; border: 1px solid rgba(0,0,0,.08); border-radius: 8px; }
html[data-theme="light"] .theme-toggle:hover { background: #e4e4e9; }
html[data-theme="light"] .save-badge       { color: rgba(0,0,0,.35); border-color: rgba(0,0,0,.08); font-size: .71rem; }

/* Dark mode — sidebar textes */
html:not([data-theme="light"]) .sb-section-label  { color: rgba(235,235,245,.38); font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
html:not([data-theme="light"]) .sb-theme-label     { color: rgba(235,235,245,.38); font-size: .74rem; font-weight: 500; }
html:not([data-theme="light"]) .sb-theme-row       { display: flex; align-items: center; justify-content: space-between; }
html:not([data-theme="light"]) .theme-toggle       { color: #f5f5f7; background: #2c2c2e; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; }
html:not([data-theme="light"]) .theme-toggle:hover { background: #3a3a3c; }
html:not([data-theme="light"]) .sb-menu-item       { color: rgba(235,235,245,.55); }
html:not([data-theme="light"]) .sb-menu-item:hover { background: rgba(255,255,255,.05); color: #f5f5f7; }
html:not([data-theme="light"]) .sb-divider         { background: rgba(255,255,255,.07); }
html:not([data-theme="light"]) .sb-legal-link      { color: rgba(235,235,245,.25); }
html:not([data-theme="light"]) .sb-legal-link:hover{ color: #409cff; }
html:not([data-theme="light"]) .save-badge         { color: rgba(235,235,245,.3); border-color: rgba(255,255,255,.1); font-size: .71rem; }
html:not([data-theme="light"]) .save-badge.saved   { color: #f5f5f7; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); }
html:not([data-theme="light"]) .lang-switcher      { background: #2c2c2e; border-color: rgba(255,255,255,.08); }
html:not([data-theme="light"]) .lang-btn           { color: rgba(235,235,245,.38); }
html:not([data-theme="light"]) .sb-user-wrap       { color: #f5f5f7; }


/* ═══════════════════════════════════════════════════════════════
   ÉTAPE 6 — Boutons hardcodés violet → Apple blue
   (btn-ai-cta, btn-letter-cta, btn-score-cta)
═══════════════════════════════════════════════════════════════ */

/* Base — même style pill — tous les boutons étape 6 */
.btn-ai-cta,
.btn-letter-cta,
.btn-score-cta,
.btn-share-cta,
.btn-pdf-cta,
#prev6 {
  border-radius: 980px !important;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Helvetica Neue', sans-serif !important;
  flex-shrink: 0 !important;
}
.step-actions-export .cta-group {
  overflow: visible !important;
  padding-right: .5rem;
}

/* Light */
html[data-theme="light"] .btn-ai-cta,
html[data-theme="light"] .btn-letter-cta,
html[data-theme="light"] .btn-score-cta,
html[data-theme="light"] .btn-share-cta,
html[data-theme="light"] .btn-pdf-cta,
html[data-theme="light"] #prev6 {
  background: rgba(0,113,227,.08) !important;
  border: 1.5px solid rgba(0,113,227,.28) !important;
  color: #0071e3 !important;
  box-shadow: none !important;
}
html[data-theme="light"] .btn-ai-cta:hover,
html[data-theme="light"] .btn-letter-cta:hover,
html[data-theme="light"] .btn-score-cta:hover,
html[data-theme="light"] .btn-share-cta:hover,
html[data-theme="light"] .btn-pdf-cta:hover,
html[data-theme="light"] #prev6:hover {
  background: rgba(0,113,227,.14) !important;
  border-color: rgba(0,113,227,.5) !important;
  box-shadow: 0 4px 16px rgba(0,113,227,.15) !important;
  transform: translateY(-1px);
  color: #0071e3 !important;
}

/* Dark */
html:not([data-theme="light"]) .btn-ai-cta,
html:not([data-theme="light"]) .btn-letter-cta,
html:not([data-theme="light"]) .btn-score-cta,
html:not([data-theme="light"]) .btn-share-cta,
html:not([data-theme="light"]) .btn-pdf-cta,
html:not([data-theme="light"]) #prev6 {
  background: rgba(10,132,255,.12) !important;
  border: 1.5px solid rgba(10,132,255,.35) !important;
  color: #409cff !important;
  box-shadow: none !important;
}
html:not([data-theme="light"]) .btn-ai-cta:hover,
html:not([data-theme="light"]) .btn-letter-cta:hover,
html:not([data-theme="light"]) .btn-score-cta:hover,
html:not([data-theme="light"]) .btn-share-cta:hover,
html:not([data-theme="light"]) .btn-pdf-cta:hover,
html:not([data-theme="light"]) #prev6:hover {
  background: rgba(10,132,255,.22) !important;
  border-color: rgba(10,132,255,.6) !important;
  box-shadow: 0 4px 16px rgba(10,132,255,.25) !important;
  transform: translateY(-1px);
  color: #6eb4ff !important;
}

/* ── Flèche SVG hardcodée violet dans le scroll-hint ── */
html[data-theme="light"] .scroll-preview-hint .hint-arrow svg { stroke: #0071e3 !important; }
html:not([data-theme="light"]) .scroll-preview-hint .hint-arrow svg { stroke: #0a84ff !important; }

/* ==========================================================================
   Final-step UX polish: clear hierarchy + sticky export actions
   ========================================================================== */
#step7Content {
  padding-bottom: 126px !important;
}

.main-content {
  transform: none !important;
}

#step7.step.active {
  animation: none !important;
  transform: none !important;
}

.step-actions-export {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  z-index: 80 !important;
  justify-content: stretch !important;
  margin: 22px 0 4px !important;
  padding: 12px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 24px !important;
  background: rgba(12,15,22,.82) !important;
  backdrop-filter: saturate(180%) blur(22px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(22px) !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.28) !important;
}

.export-actions-shell {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
}

.export-actions-left,
.export-actions-secondary,
.export-actions-primary {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.export-actions-secondary {
  justify-content: center !important;
  min-width: 0 !important;
}

.export-actions-primary {
  justify-content: flex-end !important;
}

.step-actions-export button,
.step-actions-export a {
  min-height: 44px !important;
  white-space: nowrap !important;
}

#prev7,
.btn-share-cta,
.btn-letter-cta,
.btn-score-cta,
.btn-ai-cta,
.btn-pdf-cta {
  border-radius: 999px !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
}

#prev7 {
  padding-inline: 15px !important;
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.11) !important;
  color: rgba(245,245,247,.72) !important;
}

.btn-share-cta,
.btn-letter-cta,
.btn-score-cta {
  padding-inline: 14px !important;
  background: rgba(255,255,255,.055) !important;
  border-color: rgba(255,255,255,.1) !important;
  color: rgba(245,245,247,.76) !important;
  box-shadow: none !important;
}

.btn-ai-cta {
  padding-inline: 16px !important;
  background: rgba(10,132,255,.12) !important;
  border-color: rgba(10,132,255,.34) !important;
  color: #8bc5ff !important;
  box-shadow: none !important;
}

.btn-pdf-cta {
  min-width: 164px !important;
  justify-content: center !important;
  padding-inline: 22px !important;
  background: #0a84ff !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 12px 30px rgba(10,132,255,.34) !important;
}

#prev7:hover,
.btn-share-cta:hover,
.btn-letter-cta:hover,
.btn-score-cta:hover {
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(255,255,255,.18) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
}

.btn-ai-cta:hover {
  background: rgba(10,132,255,.2) !important;
  border-color: rgba(10,132,255,.55) !important;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(10,132,255,.18) !important;
}

.btn-pdf-cta:hover {
  background: #409cff !important;
  color: #fff !important;
  box-shadow: 0 16px 36px rgba(10,132,255,.4) !important;
  transform: translateY(-1px) !important;
}

.btn-pdf-cta:disabled {
  opacity: .52 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

html[data-theme="light"] .step-actions-export {
  border-color: rgba(15,23,42,.09) !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: 0 18px 54px rgba(22,38,67,.12) !important;
}

html[data-theme="light"] #prev7 {
  background: rgba(15,23,42,.045) !important;
  border-color: rgba(15,23,42,.09) !important;
  color: rgba(29,29,31,.62) !important;
}

html[data-theme="light"] .btn-share-cta,
html[data-theme="light"] .btn-letter-cta,
html[data-theme="light"] .btn-score-cta {
  background: rgba(15,23,42,.045) !important;
  border-color: rgba(15,23,42,.08) !important;
  color: rgba(29,29,31,.68) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .btn-ai-cta {
  background: rgba(0,113,227,.08) !important;
  border-color: rgba(0,113,227,.22) !important;
  color: #006edb !important;
  box-shadow: none !important;
}

html[data-theme="light"] .btn-pdf-cta {
  background: #0071e3 !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(0,113,227,.24) !important;
}

html[data-theme="light"] #prev7:hover,
html[data-theme="light"] .btn-share-cta:hover,
html[data-theme="light"] .btn-letter-cta:hover,
html[data-theme="light"] .btn-score-cta:hover {
  background: rgba(15,23,42,.07) !important;
  border-color: rgba(15,23,42,.14) !important;
  color: #1d1d1f !important;
  box-shadow: none !important;
}

html[data-theme="light"] .btn-ai-cta:hover {
  background: rgba(0,113,227,.13) !important;
  border-color: rgba(0,113,227,.34) !important;
  color: #0057b8 !important;
}

html[data-theme="light"] .btn-pdf-cta:hover {
  background: #0077ed !important;
  color: #fff !important;
  box-shadow: 0 16px 34px rgba(0,113,227,.3) !important;
}

@media (max-width: 980px) {
  #step7Content {
    padding-bottom: 42px !important;
  }

  .step-actions-export {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin: 18px 0 16px !important;
  }

  .export-actions-shell {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .export-actions-left {
    display: none !important;
  }

  .export-actions-secondary,
  .export-actions-primary {
    width: 100% !important;
  }

  .export-actions-secondary {
    order: 2 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    overflow: hidden !important;
    padding-bottom: 1px !important;
    scrollbar-width: none !important;
  }

  .export-actions-secondary .btn-share-cta,
  .export-actions-secondary .btn-letter-cta,
  .export-actions-secondary .btn-score-cta {
    width: 100% !important;
    justify-content: center !important;
    min-width: 0 !important;
  }

  .export-actions-secondary::-webkit-scrollbar {
    display: none !important;
  }

  .export-actions-primary {
    order: 1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) !important;
    gap: 8px !important;
  }

  .btn-ai-cta,
  .btn-pdf-cta {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
  }

  #exocv-support-fab {
    bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  }
}

@media (max-width: 640px) {
  #step7Content {
    padding-bottom: 34px !important;
  }

  .step-actions-export {
    position: static !important;
    inset: auto !important;
    margin: 16px 0 18px !important;
    padding: 12px !important;
    border-radius: 22px !important;
  }

  .step-actions-export button,
  .step-actions-export a {
    min-height: 46px !important;
    font-size: .82rem !important;
  }

  .export-actions-shell {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  .export-actions-primary {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  .export-actions-left {
    order: 3 !important;
    display: flex !important;
    width: 100% !important;
  }

  #prev7 {
    width: 100% !important;
    min-height: 46px !important;
    justify-content: center !important;
    padding-inline: 14px !important;
  }

  .btn-pdf-cta {
    order: 1 !important;
    min-height: 52px !important;
    width: 100% !important;
    font-size: .94rem !important;
  }

  .btn-ai-cta {
    order: 2 !important;
    min-height: 48px !important;
    width: 100% !important;
  }

  .export-actions-secondary {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  .btn-share-cta,
  .btn-letter-cta,
  .btn-score-cta {
    min-height: 52px !important;
    padding: 7px 5px !important;
    flex-direction: column !important;
    gap: 4px !important;
    font-size: .7rem !important;
    line-height: 1.1 !important;
  }

  .btn-share-cta svg,
  .btn-letter-cta svg,
  .btn-score-cta svg {
    width: 15px !important;
    height: 15px !important;
  }

  .btn-share-cta span,
  .btn-score-cta span,
  .btn-letter-cta span {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 981px) {
  .step-actions-export {
    position: static !important;
    inset: auto !important;
    transform: none !important;
  }
}

/* ==========================================================================
   Sidebar polish: calmer hierarchy + compact product actions
   ========================================================================== */
.sidebar {
  padding: 10px 0 12px !important;
}

.sb-section {
  padding: 14px 16px 12px !important;
}

.sb-section.sb-account {
  flex: 0 0 auto !important;
}

.sb-divider {
  margin: 2px 16px !important;
}

.sb-section-label {
  margin-bottom: 9px !important;
  font-size: .66rem !important;
  letter-spacing: .11em !important;
  opacity: 1 !important;
}

.sb-cv-btn {
  min-height: 62px !important;
  gap: 10px !important;
  padding: 10px !important;
  margin-bottom: 9px !important;
  border-radius: 14px !important;
}

.sb-cv-icon {
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  border-radius: 11px !important;
}

.sb-cv-meta {
  min-width: 0 !important;
  display: flex !important;
  flex: 1 !important;
  flex-direction: column !important;
  gap: 3px !important;
}

.sb-cv-btn .btn-profiles-name {
  display: block !important;
  font-size: .84rem !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
}

.sb-cv-sub {
  display: block !important;
  font-size: .68rem !important;
  font-weight: 600 !important;
}

.sb-cv-chevron {
  display: grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 auto !important;
  border-radius: 999px !important;
}

.sidebar .save-badge {
  padding: 5px 9px !important;
  font-size: .68rem !important;
  border-radius: 999px !important;
}

.sb-quick-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
}

.sb-quick-action {
  min-width: 0 !important;
  min-height: 54px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 8px 6px !important;
  border-radius: 14px !important;
  border: 1px solid transparent !important;
  text-decoration: none !important;
  font: 700 .72rem/1.15 -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Helvetica Neue', sans-serif !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important;
}

.sb-quick-action span {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sb-quick-action:hover,
.sb-interview-link:hover,
.sb-menu-item:hover {
  transform: translateY(-1px) !important;
}

.sb-interview-link {
  min-height: 46px !important;
  padding: 10px 11px !important;
  border-radius: 14px !important;
  font-weight: 700 !important;
}

.sb-user-card {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px !important;
  margin-bottom: 8px !important;
  border-radius: 14px !important;
  border: 1px solid transparent !important;
}

.sb-user-avatar {
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  border-radius: 999px !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.sb-user-meta {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.sb-user-email {
  padding: 0 !important;
  min-width: 0 !important;
  font-size: .72rem !important;
}

.sb-user-plan {
  display: flex !important;
}

.sb-plan-label {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 20px !important;
  padding: 3px 7px !important;
  border-radius: 999px !important;
  font-size: .64rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.sb-menu-item {
  min-height: 36px !important;
  border-radius: 11px !important;
  padding: 8px 9px !important;
  font-size: .76rem !important;
  font-weight: 650 !important;
}

.sb-theme-section {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.sb-theme-row {
  min-height: 44px !important;
  padding: 0 2px !important;
}

.theme-toggle {
  width: 42px !important;
  height: 34px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.sb-bottom {
  padding: 10px 16px 0 !important;
}

html[data-theme="light"] .sidebar {
  background: rgba(255,255,255,.9) !important;
}

html[data-theme="light"] .sb-section-label,
html[data-theme="light"] .sb-theme-label {
  color: rgba(29,29,31,.42) !important;
}

html[data-theme="light"] .sb-cv-btn,
html[data-theme="light"] .sb-user-card {
  background: rgba(245,245,247,.78) !important;
  border-color: rgba(15,23,42,.08) !important;
  color: #1d1d1f !important;
  box-shadow: 0 1px 2px rgba(15,23,42,.04) !important;
}

html[data-theme="light"] .sb-cv-btn:hover,
html[data-theme="light"] .sb-user-card:hover {
  background: #fff !important;
  border-color: rgba(0,113,227,.22) !important;
}

html[data-theme="light"] .sb-cv-icon {
  background: rgba(0,113,227,.09) !important;
  color: #0071e3 !important;
}

html[data-theme="light"] .sb-cv-sub {
  color: rgba(29,29,31,.45) !important;
}

html[data-theme="light"] .sb-cv-chevron {
  background: rgba(15,23,42,.045) !important;
  color: rgba(29,29,31,.48) !important;
}

html[data-theme="light"] .sb-quick-action {
  background: rgba(245,245,247,.78) !important;
  border-color: rgba(15,23,42,.08) !important;
  color: rgba(29,29,31,.72) !important;
}

html[data-theme="light"] .sb-quick-action:hover {
  background: rgba(0,113,227,.08) !important;
  border-color: rgba(0,113,227,.2) !important;
  color: #0071e3 !important;
}

html[data-theme="light"] .sb-interview-link {
  background: rgba(0,113,227,.08) !important;
  border-color: rgba(0,113,227,.16) !important;
  color: #006edb !important;
}

html[data-theme="light"] .sb-user-avatar {
  background: #0071e3 !important;
  color: #fff !important;
}

html[data-theme="light"] .sb-user-email {
  color: rgba(29,29,31,.72) !important;
}

html[data-theme="light"] .sb-plan-label {
  background: rgba(0,113,227,.08) !important;
  color: #0071e3 !important;
}

html[data-theme="light"] .sb-plan-max,
html[data-theme="light"] .sb-plan-pro {
  background: rgba(52,199,89,.1) !important;
  color: #218a3a !important;
}

html[data-theme="light"] .theme-toggle {
  background: #fff !important;
  border-color: rgba(15,23,42,.14) !important;
  color: #1d1d1f !important;
  box-shadow: 0 1px 2px rgba(15,23,42,.06) !important;
}

html[data-theme="light"] .theme-toggle:hover {
  background: rgba(0,113,227,.08) !important;
  border-color: rgba(0,113,227,.24) !important;
  color: #0071e3 !important;
}

html:not([data-theme="light"]) .sidebar {
  background: rgba(22,22,26,.94) !important;
  border-right-color: rgba(255,255,255,.07) !important;
}

html:not([data-theme="light"]) .sb-section-label,
html:not([data-theme="light"]) .sb-theme-label {
  color: rgba(235,235,245,.42) !important;
}

html:not([data-theme="light"]) .sb-cv-btn,
html:not([data-theme="light"]) .sb-user-card {
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.09) !important;
  color: #f5f5f7 !important;
}

html:not([data-theme="light"]) .sb-cv-btn:hover,
html:not([data-theme="light"]) .sb-user-card:hover {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(10,132,255,.26) !important;
}

html:not([data-theme="light"]) .sb-cv-icon {
  background: rgba(10,132,255,.14) !important;
  color: #6eb4ff !important;
}

html:not([data-theme="light"]) .sb-cv-sub {
  color: rgba(235,235,245,.45) !important;
}

html:not([data-theme="light"]) .sb-cv-chevron {
  background: rgba(255,255,255,.06) !important;
  color: rgba(235,235,245,.55) !important;
}

html:not([data-theme="light"]) .sb-quick-action {
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.08) !important;
  color: rgba(245,245,247,.74) !important;
}

html:not([data-theme="light"]) .sb-quick-action:hover {
  background: rgba(10,132,255,.12) !important;
  border-color: rgba(10,132,255,.28) !important;
  color: #8bc5ff !important;
}

html:not([data-theme="light"]) .sb-interview-link {
  background: rgba(10,132,255,.12) !important;
  border-color: rgba(10,132,255,.24) !important;
  color: #8bc5ff !important;
}

html:not([data-theme="light"]) .sb-user-avatar {
  background: rgba(10,132,255,.18) !important;
  color: #8bc5ff !important;
}

html:not([data-theme="light"]) .sb-user-email {
  color: rgba(245,245,247,.76) !important;
}

html:not([data-theme="light"]) .sb-plan-label {
  background: rgba(10,132,255,.13) !important;
  color: #8bc5ff !important;
}

html:not([data-theme="light"]) .sb-plan-max,
html:not([data-theme="light"]) .sb-plan-pro {
  background: rgba(52,199,89,.14) !important;
  color: #7ee09b !important;
}

html:not([data-theme="light"]) .theme-toggle {
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.11) !important;
  color: #f5f5f7 !important;
}

body.sidebar-open #exocv-support-fab {
  display: none !important;
}

body:not(.builder-seo-visible) .builder-seo {
  display: none !important;
}

@media (max-width: 900px) {
  .sidebar {
    padding-top: 12px !important;
  }

  .sb-section {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}
