/* xp-settings.css — Yarnball CDS theme "XP" (Luna), Settings-area extension.
   Ben, 2026-08-22: extends xp.css to the whole Settings surface (root list, Appearance,
   Account, Connections, Usage, History, Security, Memory space, Feedback, notification/
   profile rows) plus the account cards and connection tiles xp.css's own comment names
   as still owed. Sibling file to xp.css, same rules: THEME ONLY, every selector scoped
   under [data-theme="xp"], restyles real DS/app classes (grepped against settings.js,
   security-path.js, feedback.js, onboarding-steps.js, desktop-view.js and the DS bundle
   before use here) — no invented class names, no app-file edits.

   Live-lane pass (canvas.yarnball.ai, signed in) found five concrete defects on top of
   the base theme and they are fixed here by name:
   1. .ptitle h2 / .mhead .mh-t carry their own hardcoded font-size (22px / 18px display
      font) that a rule on the .ptitle/.mhead CONTAINER can never reach — targeted here.
   2. .setgh (the SettingsGroup caption -- "PERSONAL", "SECURITY & PRIVACY") is mono,
      uppercase, tracked, faint by default — restyled as a small bold Tahoma Luna-blue
      label, no tracking.
   3. .settings-wrap centers at max-width:584px; the SettingsGroup-to-SettingsGroup gap
      is a hardcoded 18-20px (#root .setgroup + .setgroup / div:has(>.setgroup) sibling
      rule) — both relaxed for a full-width, dense list.
   4. The Settings-close RoundIconButton renders as .icbtn, which xp.css's generic
      .btn/.icbtn rule turns into a square silver button (36x36 native size survives,
      only radius/face are touched) — re-cast here as real Luna close chrome, sized and
      coloured like strategy-xp.css's .gsp-titlebar-close.
   5. Row chevrons (.setlink .sl-ch) were never touched by xp.css (only .sl-ic/.sl-l/
      .sl-v were) and several icon tiles across Connections/Account hardcode rounded
      radii (conn-provider-glyph, profile-loc-glyph, mcp-symbol-icon) — flattened to the
      same flat #ECE9D8/#aca899 tile xp.css already uses for .sl-ic. */

/* ------------------------------------------------------------------ */
/* Settings shell: header, group boxes, row list                       */

/* the container rule in xp.css (.ptitle{font-size:12px;color:#0a246a}) never reaches the
   bare <h2> PageTitle renders inside itself — that h2 carries its own 22px display-font
   rule in _ds_bundle.css and wins by targeting the element directly. Same story for the
   mobile header's .mh-t. Fix both at the element that actually owns the font. */
[data-theme="xp"] .ptitle{
  margin:4px 0 6px; padding-bottom:4px; border-bottom:1px solid #ACA899; gap:8px;
}
[data-theme="xp"] .ptitle h2{
  font-family:var(--ui); font-weight:700; font-size:12px; letter-spacing:0;
  color:#0a246a; margin:0;
}
[data-theme="xp"] .ptitle .pt-sub{font-family:var(--ui); font-size:10px; color:#4a4a4a}
[data-theme="xp"] .mhead .mh-t{
  font-family:var(--ui); font-weight:700; font-size:12px; letter-spacing:0; color:#0a246a;
}

/* Settings-close RoundIconButton: only place .icbtn appears as a PageTitle/MobileHeader
   child (Projects' PageTitle only ever gets a Button child, grepped) — safe to re-cast
   here as real Luna close chrome instead of the generic silver .icbtn face, same recipe
   as strategy-xp.css's .gsp-titlebar-close / xp.css's own .mclosebtn. */
[data-theme="xp"] .ptitle .icbtn,
[data-theme="xp"] .mhead .icbtn{
  width:17px; height:15px; min-height:0; padding:0; flex:none;
  border:1px solid #7a1710; border-radius:2px;
  background:linear-gradient(180deg,#e2685f 0%,#c6362c 45%,#a32018 100%);
  color:#fff; box-shadow:none;
}
[data-theme="xp"] .ptitle .icbtn:hover,
[data-theme="xp"] .mhead .icbtn:hover{
  background:linear-gradient(180deg,#f08b83 0%,#d4483e 45%,#b32a21 100%); color:#fff; border-color:#7a1710;
}
[data-theme="xp"] .ptitle .icbtn:active,
[data-theme="xp"] .mhead .icbtn:active{background:#a32018}
[data-theme="xp"] .ptitle .icbtn svg,
[data-theme="xp"] .mhead .icbtn svg{width:9px;height:9px}

/* SettingsGroup caption ("Personal", "Security & privacy"...): mono/uppercase/tracked/
   faint by default: small bold Tahoma Luna-blue label instead, no tracking. */
[data-theme="xp"] .setgh{
  font-family:var(--ui); font-size:11px; font-weight:700; letter-spacing:0;
  text-transform:none; color:#0a246a; margin:8px 2px 2px;
}
/* group box itself: base tokens already square it (var(--r-sm)=0) and kill the shadow
   (var(--shadow-sm)=none) -- only the border colour needs to match the rest of the XP
   box family (#919b9c, not the token's #ACA899 hairline tan). */
[data-theme="xp"] .setgroup{border:1px solid #919b9c; background:#fff}
/* SettingsGroup-to-SettingsGroup gap: two different hardcoded values in app-extensions.css
   (18px on the .setgroup+.setgroup adjacent-sibling rule under #root, 20px on the
   div:has(>.setgroup) wrapper-sibling rule) — both named and beaten here by specificity,
   no !important needed since neither original carries one. */
[data-theme="xp"] #root .setgroup + .setgroup{margin-top:8px}
[data-theme="xp"] div:has(> .setgroup) + div:has(> .setgroup){margin-top:10px}

/* row list: dense XP rows. xp.css already sets padding/icon/label/value; this tightens
   further and finally reaches the chevron (.sl-ch), the one child xp.css never touched. */
[data-theme="xp"] .setlink{padding:2px 8px; gap:8px; min-height:0}
[data-theme="xp"] .setlink .sl-ic{width:16px; height:16px}
[data-theme="xp"] .setlink .sl-l{font-size:11px; line-height:1.15}
[data-theme="xp"] .setlink .sl-v{font-size:10px; line-height:1.15; margin-top:0}
[data-theme="xp"] .setlink .sl-ch{color:#0a246a}
[data-theme="xp"] .setlink .sl-ch svg{width:11px;height:11px}

/* the centred 584px column reads as a dashboard tile, not a dense working list — span the
   window's own work surface instead, same as every other XP pane in this theme. Shared by
   Settings (settings.js's own Wrap) and Projects (collaboration.js) — both want the same
   full-width dense-list treatment under this theme. */
[data-theme="xp"] .settings-wrap{max-width:none; margin-inline:0; padding-bottom:16px}

/* dense sub-view padding, divider colour to match XP hairlines */
[data-theme="xp"] .settings-row-pad{padding:4px 8px}
[data-theme="xp"] .settings-row-pad.is-divided{border-top:1px solid #ACA899}
[data-theme="xp"] .settings-value-email{font-size:11px}

/* inline text action + info notice: mono accent link / sunken notice box */
[data-theme="xp"] .inline-action{text-decoration:underline}
[data-theme="xp"] .inline-action.is-disabled{text-decoration:none}
[data-theme="xp"] .ds-notice{
  background:#fff7d6; border:1px solid #ACA899; border-radius:0; padding:5px 8px; font-size:11px;
}
[data-theme="xp"] .conn-disabled-note,
[data-theme="xp"] .conn-row-disabled{color:#a33; font-size:11px}
[data-theme="xp"] .select-native{border-radius:0; box-shadow:none}

/* SectionHeading (.seth) used inline within a group, eg "New linked folder" */
[data-theme="xp"] .seth{
  font-family:var(--ui); font-size:11px; font-weight:700; color:#0a246a; margin:10px 0 4px;
}

/* segmented Tabs (.atabs/.atab): base tokens already square the pill (var(--r-pill)=0)
   and app-extensions.css's !important rule already recolors .atab.on to var(--accent)
   (Luna blue under this theme) -- the one leftover is a hardcoded reddish glow shadow on
   the selected tab that never themes. Named rule: app-extensions.css's
   ".atab.on,.atab.is-active,... {box-shadow:0 1px 3px rgba(178,58,52,.35) !important}". */
[data-theme="xp"] .atab.on,
[data-theme="xp"] .atab.is-active,
[data-theme="xp"] .atab.is-selected{box-shadow:none !important; border:1px solid #0a246a}

/* ------------------------------------------------------------------ */
/* Connections                                                         */
[data-theme="xp"] .conn-row-head{gap:6px}
[data-theme="xp"] .conn-provider-glyph{
  width:20px; height:20px; border-radius:0; border:1px solid #aca899; background:#ECE9D8;
}
[data-theme="xp"] .conn-icon-btn{
  width:20px; height:20px; border-radius:0; border:1px solid #919b9c; background:#fff; color:#333;
}
[data-theme="xp"] .conn-icon-btn:hover:not(:disabled){border-color:#0a246a; color:#0a246a; background:#fff7d6}
[data-theme="xp"] .conn-sync-icon.is-done{border-color:#3f8f3f; color:#3f8f3f}
[data-theme="xp"] .conn-sync-icon.is-error{border-color:#c23b3b; color:#c23b3b}
[data-theme="xp"] .conn-disconnect-icon:hover{border-color:#c23b3b; color:#c23b3b}
[data-theme="xp"] .conn-account-card{
  border:1.5px solid #316ac5; border-radius:0; padding:4px 10px; margin-bottom:8px; background:#fff;
}
[data-theme="xp"] .conn-account-card .conn-row-head b{color:#0a246a; font-size:12px}
[data-theme="xp"] .conn-account-card .conn-icon-btn{border-color:#316ac5; color:#0a246a}
[data-theme="xp"] .conn-account-card .conn-icon-btn:hover:not(:disabled){background:#316ac5; color:#fff}

[data-theme="xp"] .conn-cap-groups{gap:4px; margin-top:5px}
[data-theme="xp"] .conn-cap-group-title{
  font-family:var(--ui); font-size:10px; font-weight:700; letter-spacing:0; text-transform:none; color:#4a4a4a;
}
[data-theme="xp"] .conn-cap-item{font-size:11px; color:#000}
[data-theme="xp"] .conn-cap-item-dot{border-radius:0; width:6px; height:6px; background:#3f8f3f}
[data-theme="xp"] .conn-cap-item.is-missing .conn-cap-item-dot{background:#aca899}
[data-theme="xp"] .conn-cap-item.is-missing{color:#7A7568}
[data-theme="xp"] .conn-cap-reconnect-link{color:#0a246a; font-size:11px; text-decoration:underline}

/* "+Connect another account" CTA (.section-gap-18 .picker-row-btn): the loudest control
   in Accounts, hardcodes an accent-red pill (border-radius:10px). Same solid-Luna recipe
   as .btn.solid in xp.css, square. */
[data-theme="xp"] .section-gap-18 .picker-row-btn{
  background:linear-gradient(180deg,#5aa0f2 0%,#1758c8 100%); border:1px solid #0a246a;
  color:#fff; font-weight:700; font-size:11px; border-radius:3px; padding:4px 12px;
  text-shadow:1px 1px 1px rgba(0,0,0,.3);
}
[data-theme="xp"] .section-gap-18 .picker-row-btn:hover:not(:disabled){
  background:linear-gradient(180deg,#7fb5ff 0%,#2a6ed6 100%); border-color:#0a246a; color:#fff;
}

[data-theme="xp"] .mcp-directory-grid{gap:5px}
[data-theme="xp"] .mcp-symbol-card{
  border:1px solid #919b9c; border-radius:0; background:#fff; padding:6px 4px; min-height:0;
}
[data-theme="xp"] .mcp-symbol-card:hover{border-color:#0a246a; background:#fff7d6; transform:none}
[data-theme="xp"] .mcp-symbol-name{font-size:10px; color:#000}

[data-theme="xp"] .sync-status-row{font-size:11px; color:#000}
[data-theme="xp"] .sync-status-row-dot{border-radius:0; background:#aca899}
[data-theme="xp"] .sync-status-row-dot.is-active,
[data-theme="xp"] .sync-status-row-dot.is-done{background:#0a5bc4}
[data-theme="xp"] .sync-status-row-dot.is-error{background:#c23b3b}
[data-theme="xp"] .sync-status-row-text{font-size:11px; color:#000}
[data-theme="xp"] .sync-progress-track{border-radius:0; background:#e4e2d8; border:1px solid #d8d4c8}
[data-theme="xp"] .sync-progress-runner{border-radius:0; background:#0a5bc4}

/* ------------------------------------------------------------------ */
/* Account                                                              */
[data-theme="xp"] .account-email-row{
  border:1px solid #919b9c; border-radius:0; background:#fff; padding:5px 9px; gap:7px;
}
[data-theme="xp"] .account-email-icon{color:#0a246a}
[data-theme="xp"] .account-email-text{font-size:11px}

/* embedded profile form (OnboardingProfileStep, rendered inline in Settings > Account) */
[data-theme="xp"] .profile-form-heading{
  font-family:var(--ui); font-size:12px; font-weight:700; color:#0a246a;
  border-bottom:1px solid #ACA899; padding-bottom:3px;
}
[data-theme="xp"] .profile-field-row{padding:4px 0; border-bottom:1px solid #e4e2d8}
[data-theme="xp"] .profile-field-label{font-size:11px; font-weight:700; color:#000}
[data-theme="xp"] .profile-field-helper{font-size:10px; color:#4a4a4a}
[data-theme="xp"] .profile-select{border-radius:0}
[data-theme="xp"] .onboarding-profile-field{border-radius:0; padding:2px 4px; font-size:11px}
[data-theme="xp"] .profile-loc-glyph{
  width:18px; height:18px; border-radius:0; border:1px solid #aca899; background:#ECE9D8; color:#0a246a;
}
[data-theme="xp"] .btn-save-profile{
  font-family:var(--ui); font-size:11px; font-weight:700; color:#fff;
  background:linear-gradient(180deg,#5aa0f2 0%,#1758c8 100%); border:1px solid #0a246a;
  border-radius:3px; padding:3px 12px; text-shadow:1px 1px 1px rgba(0,0,0,.3);
}
[data-theme="xp"] .btn-save-profile:hover:not(:disabled){background:linear-gradient(180deg,#7fb5ff 0%,#2a6ed6 100%)}

/* custom skills + scheduled-task delete affordance (Settings sub-view) */
[data-theme="xp"] .custom-skill-card{
  border:1px solid #919b9c; border-radius:0; background:#fff; padding:5px 8px; margin-bottom:5px;
}
[data-theme="xp"] .custom-skill-name{font-size:11px; font-weight:700; color:#000}
[data-theme="xp"] .custom-skill-tag{
  border-radius:0; border:1px solid #919b9c; background:#ECE9D8; color:#4a4a4a; font-size:9px;
}
[data-theme="xp"] .custom-skill-desc{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .scheduled-task-delete-btn{color:#4a4a4a; border-radius:0}
[data-theme="xp"] .scheduled-task-delete-btn:hover{color:#c23b3b; background:#f4c9c9}

/* ------------------------------------------------------------------ */
/* Usage & plan                                                        */
[data-theme="xp"] .usage-hero-plan{font-family:var(--ui); font-size:15px; font-weight:700; color:#0a246a}
[data-theme="xp"] .usage-hero-sub{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .usage-meter-spent{font-size:11px; font-weight:700; color:#000}
[data-theme="xp"] .usage-meter-left{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .usage-meter{border-radius:0; height:8px; border:1px solid #919b9c; background:#fff}
[data-theme="xp"] .usage-meter::-webkit-progress-bar{background:#fff; border-radius:0}
[data-theme="xp"] .usage-meter::-webkit-progress-value{background:#316ac5; border-radius:0}
[data-theme="xp"] .usage-meter::-moz-progress-bar{background:#316ac5; border-radius:0}
[data-theme="xp"] .usage-spend-meter{
  height:8px; border-radius:0; border:1px solid #919b9c; background:#fff; overflow:hidden;
}
[data-theme="xp"] .usage-spend-meter-fill{
  background:repeating-linear-gradient(90deg,#316ac5 0,#316ac5 6px,#4f83d4 6px,#4f83d4 8px); border-radius:0;
}
[data-theme="xp"] .usage-stat{font-size:11px; color:#4a4a4a}
[data-theme="xp"] .usage-stat b{color:#000}
[data-theme="xp"] .usage-stat-sep{background:#aca899}

[data-theme="xp"] .plan-row{
  border:1px solid #919b9c; border-radius:0; background:#fff; padding:6px 9px; margin:5px 0 0; min-height:0;
}
[data-theme="xp"] .plan-row.is-current{border-color:#0a246a; background:#eaf1fc}
[data-theme="xp"] .plan-row-name{font-size:12px; font-weight:700; color:#000}
[data-theme="xp"] .plan-row-desc{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .plan-row-price{font-size:11px; color:#000}
[data-theme="xp"] .plan-row-cta{font-size:11px; color:#0a246a}

/* ------------------------------------------------------------------ */
/* History / storage (file + version rows use the shared ServerRow .srv) */
[data-theme="xp"] .srv{
  border:1px solid #919b9c; border-radius:0; background:#fff; padding:4px 8px; margin-bottom:4px; font-size:11px;
}
[data-theme="xp"] .srv:hover{background:#fff7d6}
[data-theme="xp"] .storage-usage-text{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .storage-usage-meter{height:8px}
[data-theme="xp"] .storage-file-row.is-hidden{opacity:.55}

/* ------------------------------------------------------------------ */
/* Getting-started wizard (root list checklist)                        */
[data-theme="xp"] .wizard-progress{font-size:11px; font-weight:700; color:#0a246a}
[data-theme="xp"] .wizard-progress-meter{
  height:8px; border-radius:0; border:1px solid #919b9c; background:#fff; overflow:hidden;
}
[data-theme="xp"] .wizard-progress-meter-fill{
  background:repeating-linear-gradient(90deg,#316ac5 0,#316ac5 6px,#4f83d4 6px,#4f83d4 8px); border-radius:0;
}
[data-theme="xp"] .wizard-step-row{padding:5px 0; gap:7px}
[data-theme="xp"] .wizard-step-glyph{border-radius:0; width:14px; height:14px; border:1px solid #919b9c; background:#fff}
[data-theme="xp"] .wizard-step-glyph.is-done{background:#3f8f3f; border-color:#3f8f3f}
[data-theme="xp"] .wizard-step-title{font-size:11px; font-weight:700; color:#000}
[data-theme="xp"] .wizard-step-desc{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .wizard-step-done-label{font-size:10.5px; color:#3f8f3f}
[data-theme="xp"] .wizard-step-sep{background:#e4e2d8}
[data-theme="xp"] .onboarding-step-action{
  border:1px solid #003c74; border-radius:3px; background:var(--xp-face); box-shadow:inset 1px 1px 0 #fff;
  color:#000; font-size:10.5px; padding:2px 9px;
}
[data-theme="xp"] .onboarding-step-action:hover:not(:disabled){background:var(--xp-face-hot)}
[data-theme="xp"] .onboarding-step-optional{color:#4a4a4a; font-size:9.5px}

/* ------------------------------------------------------------------ */
/* Appearance / Design                                                 */
[data-theme="xp"] .fontscale-btn{
  border:1px solid #003c74; border-radius:3px; background:var(--xp-face); box-shadow:inset 1px 1px 0 #fff;
  color:#000; font-size:11px; font-weight:700; min-width:32px; padding:3px 7px;
}
[data-theme="xp"] .fontscale-btn:hover{background:var(--xp-face-hot)}
[data-theme="xp"] .fontscale-btn.is-on{
  background:linear-gradient(180deg,#5aa0f2 0%,#1758c8 100%); border-color:#0a246a; color:#fff;
}

/* ------------------------------------------------------------------ */
/* Feedback                                                             */
[data-theme="xp"] .feedback-kicker{
  font-family:var(--ui); font-size:10px; font-weight:700; letter-spacing:0; text-transform:none; color:#4a4a4a;
}
[data-theme="xp"] .feedback-status{font-family:var(--mono); font-size:10px; color:#4a4a4a}
[data-theme="xp"] .feedback-preview-box{border:1px solid #d8d4c8; border-radius:0; background:#f6f5ef; padding:5px 7px}
[data-theme="xp"] .feedback-preview-line{font-size:11px; color:#000}
[data-theme="xp"] .feedback-console-tail{font-family:var(--mono); font-size:10px; color:#4a4a4a}
[data-theme="xp"] .feedback-empty-note{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .feedback-consent-row{font-size:11px}
[data-theme="xp"] .form-textarea{border:1px solid #7F9DB9; border-radius:0; font-size:11px}
[data-theme="xp"] .form-textarea:focus{outline:1px dotted #0a246a; outline-offset:1px; border-color:#0a5bc4; box-shadow:none}

/* ------------------------------------------------------------------ */
/* Security                                                             */
[data-theme="xp"] .sec-panel{padding:6px 8px}
[data-theme="xp"] .sec-summary{font-size:11px; color:#4a4a4a; padding:0}
[data-theme="xp"] .sec-summary-state{color:#000; font-weight:700}
[data-theme="xp"] .sec-summary.is-fail .sec-summary-state{color:#c23b3b}
[data-theme="xp"] .sec-summary-when{color:#4a4a4a}

[data-theme="xp"] .secfact-list{gap:5px; margin:6px 0 2px}
[data-theme="xp"] .secfact{border:1px solid #919b9c; border-radius:0; background:#fff; padding:6px 9px}
[data-theme="xp"] .secfact:hover{border-color:#0a246a; background:#fff7d6}
[data-theme="xp"] .secfact-label{font-size:11.5px; font-weight:700; color:#000}
[data-theme="xp"] .secfact-value{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .secfact.is-fail .secfact-value{color:#c23b3b}
[data-theme="xp"] .secfact.is-ok .secfact-value{color:#333}
[data-theme="xp"] .secfact-chev{color:#0a246a}

/* pure-CSS padlock: currentColor/var(--surface) already theme-correct via tokens; only
   the rounded-XP-era corners need squaring. */
[data-theme="xp"] .sec-lock-body{border-radius:2px}
[data-theme="xp"] .sec-lock-keyhole{border-radius:0; width:5px; height:5px}
[data-theme="xp"] .sec-lock-shackle{border-radius:3px 3px 0 0}

[data-theme="xp"] .secfact-back{
  border:1px solid #919b9c; border-radius:3px; background:var(--xp-face); box-shadow:inset 1px 1px 0 #fff;
  color:#000; font-size:11px; padding:3px 10px 3px 8px;
}
[data-theme="xp"] .secfact-back:hover{background:var(--xp-face-hot)}
[data-theme="xp"] .secfact-detail-title{font-family:var(--ui); font-size:14px; font-weight:700; color:#0a246a; letter-spacing:0}
[data-theme="xp"] .secfact-detail-answer{font-size:12px; font-weight:700; color:#000}
[data-theme="xp"] .secfact-detail-answer.is-fail{color:#c23b3b}
[data-theme="xp"] .secfact-detail-answer.is-ok{color:#3f8f3f}
[data-theme="xp"] .secfact-detail-note{font-size:11.5px; color:#333}
[data-theme="xp"] .secfact-detail-card{border:1px solid #d8d4c8; border-radius:0; background:#f6f5ef; padding:6px 8px}
[data-theme="xp"] .secfact-detail-card-label{font-family:var(--mono); font-size:9px; color:#7A7568}
[data-theme="xp"] .secfact-line{font-size:11px; border-bottom:1px solid #e4e2d8}
[data-theme="xp"] .secfact-line-k{color:#4a4a4a}
[data-theme="xp"] .secfact-line-v{color:#000}
[data-theme="xp"] .secfact-line-v.is-ok{color:#3f8f3f}
[data-theme="xp"] .secfact-line-v.is-fail{color:#c23b3b}
[data-theme="xp"] .secfact-ev{font-size:11px; color:#333}
[data-theme="xp"] .secfact-receipt-toggle{font-size:11px; color:#0a246a}
[data-theme="xp"] .secfact-receipt{
  background:#f6f5ef; border:1px solid #d8d4c8; border-radius:0; font-family:var(--mono); font-size:10.5px;
}

[data-theme="xp"] .sec-privacy{border-top:1px solid #ACA899}
[data-theme="xp"] .sec-privacy-kicker{font-family:var(--mono); font-size:9px; color:#7A7568}
[data-theme="xp"] .sec-privacy-open{border:1px solid #919b9c; border-radius:0; background:#fff; padding:6px 9px}
[data-theme="xp"] .sec-privacy-open:hover{border-color:#0a246a; background:#fff7d6}
[data-theme="xp"] .sec-privacy-open-title{font-size:11.5px; font-weight:700; color:#000}
[data-theme="xp"] .sec-privacy-open-sub{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .sec-privacy-item{font-size:11px; color:#333}
[data-theme="xp"] .sec-privacy-footer{font-size:10.5px; color:#4a4a4a}

[data-theme="xp"] .sec-claim{border-top:1px solid #e4e2d8; padding:6px 9px}
[data-theme="xp"] .sec-claim:hover{background:#fff7d6}
[data-theme="xp"] .sec-claim-lock,
[data-theme="xp"] .sec-lock-row .sl-ic{color:#3f8f3f}
[data-theme="xp"] .sec-claim-title{font-size:11.5px; font-weight:700; color:#000}
[data-theme="xp"] .sec-claim-line{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .sec-claim-more{color:#7A7568}
[data-theme="xp"] .sec-detail-p{font-size:11.5px; color:#333}
[data-theme="xp"] .sec-detail-live{font-size:10.5px; color:#4a4a4a}

/* live per-hop probe diagram (top-bar lock modal, same SecurityPathView Settings links to) */
[data-theme="xp"] .sec-diagram-row{border-radius:0; padding:4px 6px}
[data-theme="xp"] .sec-diagram-row:hover{background:#fff7d6}
[data-theme="xp"] .sec-diagram-node{border-radius:0; width:32px; height:32px; border-color:#919b9c; color:#4a4a4a}
[data-theme="xp"] .sec-diagram-row.is-ok .sec-diagram-node{border-color:#3f8f3f; color:#3f8f3f; background:#eaf5ea}
[data-theme="xp"] .sec-diagram-row.is-fail .sec-diagram-node{border-color:#c23b3b; color:#c23b3b; background:#fdeeee}
[data-theme="xp"] .sec-diagram-row.is-active .sec-diagram-node{border-color:#0a5bc4; color:#0a5bc4; box-shadow:0 0 0 2px #d6dff7}
[data-theme="xp"] .sec-diagram-label{font-size:11.5px; font-weight:700; color:#000}
[data-theme="xp"] .sec-diagram-sub{font-size:10.5px; color:#4a4a4a}
[data-theme="xp"] .sec-diagram-row.is-fail .sec-diagram-sub{color:#c23b3b}
[data-theme="xp"] .sec-diagram-state{border-radius:0; width:18px; height:18px}
[data-theme="xp"] .sec-diagram-state.is-ok{background:#3f8f3f}
[data-theme="xp"] .sec-diagram-state.is-fail{background:#c23b3b}
[data-theme="xp"] .sec-diagram-spin{border-color:#d8d4c8; border-top-color:#0a5bc4}
[data-theme="xp"] .sec-diagram-link{background:#d8d4c8}
[data-theme="xp"] .sec-diagram-link.is-done{background:#3f8f3f}
[data-theme="xp"] .sec-diagram-link.is-fail{background:#c23b3b}
[data-theme="xp"] .sec-e2e-only-row{border:1px solid #919b9c; border-radius:0; background:#f6f5ef; padding:6px 9px}
[data-theme="xp"] .sec-e2e-only-text{font-size:11px; color:#333}
[data-theme="xp"] .sec-e2e-only-text b{color:#000}

[data-theme="xp"] .confirm-row-question{font-size:11.5px; color:#000}
[data-theme="xp"] .confirm-row-confirm{border-color:#c23b3b; color:#c23b3b}
[data-theme="xp"] .confirm-row-cancel{color:#4a4a4a}