/* Desktop Settings 2026
   Dedicated desktop settings design layer. Mobile workspace is intentionally untouched. */
#view-settings{padding:0!important}
#view-settings .settings-shell{display:grid!important;grid-template-columns:270px minmax(0,1fr);min-height:calc(100vh - 110px)!important;max-height:calc(100vh - 94px);border:1px solid rgba(255,255,255,.075)!important;border-radius:22px!important;overflow:hidden!important;background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.01))!important;box-shadow:0 22px 65px rgba(0,0,0,.18)}
#view-settings #settingsSidebar{width:auto!important;padding:0!important;border:0!important;border-right:1px solid rgba(255,255,255,.07)!important;background:linear-gradient(180deg,rgba(12,14,20,.94),rgba(9,10,15,.86))!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
.settings-nav-head{padding:22px 18px 14px}
.settings-nav-title{font-size:20px;font-weight:950;letter-spacing:-.55px;color:var(--text)}
.settings-nav-sub{font-size:10px;line-height:1.45;color:var(--muted);margin-top:4px}
.settings-user-chip{display:flex;align-items:center;gap:9px;margin-top:15px;padding:10px;border:1px solid rgba(255,255,255,.065);background:rgba(255,255,255,.025);border-radius:13px}
.settings-user-avatar{width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,var(--primary),#8f0714);display:grid;place-items:center;color:#fff;font-size:10px;font-weight:950}
.settings-user-copy{min-width:0;flex:1}.settings-user-name{font-size:11px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settings-user-role{font-size:9px;color:var(--muted);text-transform:capitalize;margin-top:2px}
.settings-search{position:relative;margin-top:12px}.settings-search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;fill:none;stroke:var(--muted);stroke-width:2}
.settings-search input{width:100%!important;height:36px!important;padding:0 10px 0 31px!important;border-radius:10px!important;background:rgba(255,255,255,.035)!important;border:1px solid rgba(255,255,255,.065)!important;font-size:11px!important;color:var(--text)!important}
.settings-search input:focus{border-color:rgba(235,10,30,.48)!important;box-shadow:0 0 0 3px rgba(235,10,30,.08)!important}
.settings-nav-scroll{flex:1;overflow:auto;padding:4px 10px 16px}
#view-settings #settingsSidebar .set-cat{display:block!important;margin:16px 9px 7px!important;font-size:8px!important;line-height:1!important;font-weight:950!important;letter-spacing:1.05px!important;color:var(--muted)!important;text-transform:uppercase!important;opacity:.78!important}
#view-settings #settingsSidebar .set-cat:first-child{margin-top:4px!important}
#view-settings #settingsSidebar .set-item,.settings-nav-link{width:100%!important;min-height:40px!important;margin:2px 0!important;padding:0 10px!important;display:flex!important;align-items:center!important;gap:10px!important;border:1px solid transparent!important;border-radius:11px!important;background:transparent!important;color:#8d93a3!important;font-size:11px!important;font-weight:780!important;letter-spacing:0!important;cursor:pointer!important;text-decoration:none!important;transform:none!important;box-shadow:none!important;transition:.14s ease!important}
#view-settings #settingsSidebar .set-item:before{display:none!important}
#view-settings #settingsSidebar .set-item:hover,.settings-nav-link:hover{color:var(--text)!important;background:rgba(255,255,255,.045)!important;border-color:rgba(255,255,255,.06)!important;transform:none!important}
#view-settings #settingsSidebar .set-item.active{color:#fff!important;background:linear-gradient(135deg,rgba(235,10,30,.17),rgba(235,10,30,.075))!important;border-color:rgba(235,10,30,.25)!important;box-shadow:inset 3px 0 0 var(--primary)!important}
.settings-nav-icon{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.045);flex:0 0 27px}
.settings-nav-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.set-item.active .settings-nav-icon{background:rgba(235,10,30,.12);border-color:rgba(235,10,30,.18);color:#ff737e}
.settings-nav-spacer{flex:1}.settings-nav-arrow{font-size:14px;color:rgba(255,255,255,.18)}
.settings-nav-empty{padding:18px 10px;color:var(--muted);font-size:10px;text-align:center}
#view-settings #settingsContent{padding:0!important;background:radial-gradient(circle at 90% 0,rgba(235,10,30,.045),transparent 30%),rgba(9,10,15,.16)!important;overflow:auto!important;min-width:0}
.settings-content-head{position:sticky;top:0;z-index:18;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:21px 28px 17px;border-bottom:1px solid rgba(255,255,255,.065);background:rgba(10,11,16,.87);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.settings-breadcrumb{font-size:8px;font-weight:950;letter-spacing:1px;color:var(--primary);text-transform:uppercase;margin-bottom:4px}
.settings-page-title{font-size:21px;font-weight:950;letter-spacing:-.55px;color:var(--text)}
.settings-page-desc{font-size:10px;line-height:1.45;color:var(--muted);margin-top:3px}
.settings-access-pill{display:flex;align-items:center;gap:7px;padding:7px 9px;border-radius:9px;border:1px solid rgba(255,255,255,.065);background:rgba(255,255,255,.025);font-size:9px;color:var(--muted);white-space:nowrap}.settings-access-dot{width:6px;height:6px;border-radius:50%;background:#10b981;box-shadow:0 0 8px rgba(16,185,129,.5)}
.settings-content-body{padding:24px 28px 42px;max-width:1220px;margin:0 auto}
#settingsContent>.tab-content{max-width:none!important}
#settingsContentBody>.tab-content>div:first-child[style*="margin-bottom:24px"]{display:none!important}
#view-settings .card{border-radius:15px!important;border:1px solid rgba(255,255,255,.075)!important;background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(255,255,255,.012))!important;box-shadow:0 8px 28px rgba(0,0,0,.08)!important;transition:border-color .15s ease,background .15s ease!important}
#view-settings .card:hover{border-color:rgba(255,255,255,.11)!important;background:linear-gradient(145deg,rgba(255,255,255,.038),rgba(255,255,255,.015))!important}
#view-settings .card h3{letter-spacing:-.15px}
#view-settings input,#view-settings select,#view-settings textarea{border-radius:9px!important;border-color:rgba(255,255,255,.085)!important;background:rgba(0,0,0,.19)!important}
#view-settings input:focus,#view-settings select:focus,#view-settings textarea:focus{outline:none!important;border-color:rgba(235,10,30,.5)!important;box-shadow:0 0 0 3px rgba(235,10,30,.075)!important}
#view-settings .btn{border-radius:9px!important}
.settings-system-nav{display:flex;align-items:center;gap:5px;margin-bottom:17px;padding:5px;width:max-content;max-width:100%;overflow:auto;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.022);border-radius:12px}
.settings-system-tab{border:0;background:transparent;color:var(--muted);padding:8px 12px;border-radius:8px;font-size:10px;font-weight:850;cursor:pointer;white-space:nowrap}.settings-system-tab:hover{color:var(--text);background:rgba(255,255,255,.04)}.settings-system-tab.active{color:#fff;background:rgba(235,10,30,.15);box-shadow:inset 0 0 0 1px rgba(235,10,30,.2)}
.settings-system-pane{display:none}.settings-system-pane.active{display:block}
.settings-system-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.settings-system-card{padding:17px;border:1px solid rgba(255,255,255,.075);border-radius:14px;background:rgba(255,255,255,.018);cursor:pointer;transition:.15s}.settings-system-card:hover{transform:translateY(-1px);border-color:rgba(235,10,30,.24);background:rgba(235,10,30,.035)}
.settings-system-card-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(235,10,30,.08);color:#ff6f7b;margin-bottom:13px}.settings-system-card-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}
.settings-system-card-title{font-size:12px;font-weight:900}.settings-system-card-desc{font-size:10px;color:var(--muted);line-height:1.5;margin-top:5px}
.settings-system-card-meta{font-size:8px;font-weight:850;color:var(--primary);text-transform:uppercase;letter-spacing:.55px;margin-top:13px}
.settings-system-pane .pc-admin-shell{border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important}
.settings-system-pane .pc-admin-head{border:1px solid rgba(255,255,255,.07);border-radius:14px 14px 0 0}
.settings-system-pane .pc-admin-tabs{border-left:1px solid rgba(255,255,255,.07);border-right:1px solid rgba(255,255,255,.07)}
.settings-system-pane .pc-admin-pane{border:1px solid rgba(255,255,255,.07);border-top:0;border-radius:0 0 14px 14px}
.settings-system-pane.settings-system-dealers{display:none;grid-template-columns:minmax(330px,.8fr) minmax(380px,1.2fr);gap:14px}.settings-system-pane.settings-system-dealers.active{display:grid}.settings-system-data{max-width:700px}
.settings-denied{padding:40px;text-align:center;color:var(--muted)}
[data-theme="light"] #view-settings .settings-shell{background:#fff!important;border-color:#dfe5ee!important;box-shadow:0 18px 50px rgba(15,23,42,.07)}
[data-theme="light"] #view-settings #settingsSidebar{background:linear-gradient(180deg,#f8fafc,#f4f7fb)!important;border-right-color:#e2e7ef!important}
[data-theme="light"] .settings-user-chip,[data-theme="light"] .settings-search input{background:#fff!important;border-color:#e1e7ef!important}
[data-theme="light"] #view-settings #settingsSidebar .set-item,[data-theme="light"] .settings-nav-link{color:#657186!important}
[data-theme="light"] #view-settings #settingsSidebar .set-item:hover,[data-theme="light"] .settings-nav-link:hover{background:#eef2f7!important;color:#1e293b!important;border-color:#e1e6ee!important}
[data-theme="light"] #view-settings #settingsSidebar .set-item.active{color:#b80a18!important;background:rgba(235,10,30,.075)!important;border-color:rgba(235,10,30,.16)!important}
[data-theme="light"] #view-settings #settingsContent{background:#fff!important}
[data-theme="light"] .settings-content-head{background:rgba(255,255,255,.91);border-bottom-color:#e6eaf0}
[data-theme="light"] #view-settings .card,[data-theme="light"] .settings-system-card{background:#fff!important;border-color:#e3e8ef!important;box-shadow:0 4px 18px rgba(15,23,42,.035)!important}
[data-theme="light"] #view-settings input,[data-theme="light"] #view-settings select,[data-theme="light"] #view-settings textarea{background:#f8fafc!important;border-color:#dde4ed!important}
@media(max-width:1100px){#view-settings .settings-shell{grid-template-columns:232px minmax(0,1fr)}.settings-system-overview{grid-template-columns:1fr 1fr}.settings-system-dealers{grid-template-columns:1fr}.settings-content-head{padding-left:20px;padding-right:20px}.settings-content-body{padding-left:20px;padding-right:20px}}
@media(max-width:820px){#view-settings .settings-shell{grid-template-columns:1fr;max-height:none}.settings-nav-head{padding-bottom:10px}.settings-nav-scroll{display:flex;gap:7px;overflow:auto;padding:0 12px 12px}.settings-nav-scroll .set-cat{display:none!important}#view-settings #settingsSidebar .set-item,.settings-nav-link{flex:0 0 auto!important;width:auto!important;padding:0 12px!important}.settings-user-chip,.settings-search{display:none}#view-settings #settingsSidebar{border-right:0!important;border-bottom:1px solid var(--line)!important}.settings-content-head{position:static}.settings-system-overview{grid-template-columns:1fr}}

#view-settings #settingsSidebar .settings-search-hidden{display:none!important}

.settings-section-label{margin:2px 0 10px;padding:0 2px}
.settings-section-label strong{display:block;font-size:9px;font-weight:950;letter-spacing:.85px;text-transform:uppercase;color:var(--text)}
.settings-section-label span{display:block;font-size:9px;color:var(--muted);margin-top:3px;line-height:1.45}
.settings-section-label:not(:first-child){margin-top:22px}


/* =========================================================
   SETTINGS VIEWPORT FIX v3
   The app already has its own top bar and .scroll-area. Settings must fill
   that available area instead of sizing itself from the browser viewport.
   This prevents the Settings header from being scrolled/clipped underneath
   the application top bar.
   ========================================================= */
.scroll-area:has(#view-settings:not([hidden])) {
  padding: 18px 18px 0 !important;
  overflow: hidden !important;
  overscroll-behavior: none;
}

#view-settings:not([hidden]) {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#view-settings:not([hidden]) .settings-shell {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
  border-radius: 18px 18px 0 0 !important;
}

#view-settings:not([hidden]) #settingsSidebar {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

#view-settings:not([hidden]) .settings-nav-scroll {
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

#view-settings:not([hidden]) #settingsContent {
  min-height: 0 !important;
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scroll-padding-top: 86px;
}

#view-settings:not([hidden]) .settings-content-head {
  top: 0 !important;
  z-index: 40 !important;
  flex: 0 0 auto;
  padding: 20px 28px 16px !important;
  background: rgba(10,11,16,.97) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.14);
}

#view-settings:not([hidden]) .settings-content-body {
  padding-top: 22px !important;
  padding-bottom: 72px !important;
}

#view-settings:not([hidden]) #tab-set-tv {
  scroll-margin-top: 92px;
}

@media (max-width: 980px) {
  .scroll-area:has(#view-settings:not([hidden])) {
    padding: 12px 10px 0 !important;
    overflow-y: auto !important;
  }
  #view-settings:not([hidden]),
  #view-settings:not([hidden]) .settings-shell {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  #view-settings:not([hidden]) #settingsSidebar,
  #view-settings:not([hidden]) #settingsContent {
    height: auto !important;
    overflow: visible !important;
  }
}


/* =========================================================
   ACCOUNT SECURITY UI
   ========================================================= */
.account-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:18px}
.account-card-head h3{margin:0;font-size:14px!important}.account-card-head p{margin:4px 0 0;color:var(--muted);font-size:10px;line-height:1.45}
.account-security-lock{padding:5px 7px;border-radius:7px;border:1px solid rgba(35,209,139,.20);background:rgba(35,209,139,.07);color:#34d399;font-size:8px;font-weight:950;letter-spacing:.7px}
.account-security-list{border:1px solid rgba(255,255,255,.07);border-radius:13px;overflow:hidden;background:rgba(0,0,0,.12)}
.account-security-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:11px;align-items:center;padding:14px}
.account-security-row+.account-security-row{border-top:1px solid rgba(255,255,255,.065)}
.account-security-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.055);font-size:10px;font-weight:950;color:#d7dbe5}
.account-security-copy{min-width:0}.account-security-label{font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.55px;color:var(--muted)}
.account-security-value{margin-top:3px;font-size:12px;font-weight:850;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-security-note{margin-top:4px;font-size:9px;color:var(--muted);line-height:1.4}.account-security-note[hidden]{display:none!important}
.account-action-btn{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.035);color:var(--text);padding:8px 11px;border-radius:9px;font-size:10px;font-weight:850;cursor:pointer}
.account-action-btn:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16)}
.account-verify-badge{display:inline-flex;align-items:center;margin-left:5px;padding:3px 6px;border-radius:999px;border:1px solid rgba(35,209,139,.22);background:rgba(35,209,139,.08);color:#34d399;font-size:8px;font-weight:900;vertical-align:1px}
.account-verify-badge.pending{border-color:rgba(245,158,11,.26);background:rgba(245,158,11,.08);color:#fbbf24}
.account-recovery-note{margin-top:11px;padding:10px 11px;border-radius:10px;background:rgba(59,130,246,.055);border:1px solid rgba(59,130,246,.10);color:var(--muted);font-size:9px;line-height:1.45}

.account-sec-overlay{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:22px;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.account-sec-overlay[hidden]{display:none!important}
.account-sec-dialog{position:relative;width:min(440px,100%);padding:25px;border:1px solid rgba(255,255,255,.10);border-radius:18px;background:linear-gradient(145deg,#14161d,#0b0c11);box-shadow:0 28px 80px rgba(0,0,0,.62)}
.account-sec-dialog h2{margin:4px 0 7px;font-size:20px;letter-spacing:-.5px}.account-sec-kicker{font-size:8px;font-weight:950;text-transform:uppercase;letter-spacing:.9px;color:var(--primary)}
.account-sec-desc{margin:0 0 18px;color:var(--muted);font-size:11px;line-height:1.55}.account-sec-dialog label{margin-top:12px}.account-sec-dialog input{margin-top:6px}
.account-sec-close{position:absolute;right:15px;top:14px;width:32px;height:32px;border-radius:9px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);color:var(--muted);font-size:19px;cursor:pointer}
.account-sec-error{min-height:18px;margin:10px 0 4px;color:#f87171;font-size:10px;line-height:1.4}
.account-password-meter{display:flex;gap:5px;margin-top:7px}.account-password-meter span{height:4px;flex:1;border-radius:999px;background:rgba(255,255,255,.08);transition:.16s}
.account-password-meter[data-score="1"] span:nth-child(-n+1),.account-password-meter[data-score="2"] span:nth-child(-n+2),.account-password-meter[data-score="3"] span:nth-child(-n+3),.account-password-meter[data-score="4"] span:nth-child(-n+4){background:#34d399}

[data-theme="light"] .account-security-list{background:#f8fafc;border-color:#e3e8ef}
[data-theme="light"] .account-security-row+.account-security-row{border-color:#e3e8ef}
[data-theme="light"] .account-security-icon{background:#fff;border-color:#e3e8ef;color:#334155}
[data-theme="light"] .account-action-btn{background:#fff;border-color:#dfe5ed;color:#1e293b}
[data-theme="light"] .account-sec-dialog{background:#fff;border-color:#dfe5ed;box-shadow:0 28px 80px rgba(15,23,42,.22)}
