@charset "UTF-8";

:root {
  --accent: #ff4b00;
  --accent-rgb: 255, 75, 0;
  --bg: #08090a;
  --bg-elevated: #0d0f11;
  --surface: #111316;
  --surface-2: #16191d;
  --surface-3: #1c2025;
  --border: #292d33;
  --border-soft: #202329;
  --text: #f4f5f6;
  --muted: #9299a3;
  --muted-2: #68707b;
  --success: #44cf73;
  --warning: #f2aa3a;
  --danger: #f05757;
  --sidebar: 250px;
  --topbar: 70px;
  --radius: 14px;
  --shadow: 0 22px 65px rgba(0, 0, 0, .24);
  color-scheme: dark;
}

:root[data-theme="light"] {
  --bg: #f3f5f7;
  --bg-elevated: #ffffff;
  --surface: #ffffff;
  --surface-2: #f2f4f7;
  --surface-3: #e8edf2;
  --border: #d9dfe6;
  --border-soft: #e7ebef;
  --text: #171a1e;
  --muted: #687381;
  --muted-2: #8b95a1;
  --shadow: 0 22px 65px rgba(31, 39, 48, .1);
  color-scheme: light;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body { min-height: 100vh; margin: 0; color: var(--text); background: var(--bg); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }
p { margin: 0; }
h1, h2, h3 { margin: 0; letter-spacing: -.025em; }
.icon { display: block; flex: 0 0 auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 17px; border: 1px solid transparent; border-radius: 9px; font-weight: 700; font-size: 13px; letter-spacing: -.01em; cursor: pointer; transition: .18s ease; }
.button:hover { transform: translateY(-1px); }
.button.primary { color: #fff; background: var(--accent); border-color: var(--accent); box-shadow: 0 10px 30px rgba(var(--accent-rgb), .16); }
.button.primary:hover { filter: brightness(1.08); box-shadow: 0 12px 34px rgba(var(--accent-rgb), .24); }
.button.outline { color: var(--text); background: transparent; border-color: #3a3f46; }
.button.outline:hover { color: #fff; border-color: var(--accent); background: rgba(var(--accent-rgb), .07); }
.button.ghost { color: #c5cad0; background: var(--surface-2); border-color: var(--border); }
.button.ghost:hover { color: #fff; border-color: #414750; }
.button.light { color: #101113; background: #fff; }
.button.small { min-height: 35px; padding: 0 13px; font-size: 12px; border-radius: 8px; }
.button.large { width: 100%; min-height: 52px; font-size: 14px; }
.button.full { width: 100%; }
.theme-toggle-form { display: flex; margin: 0; }
.theme-toggle { border-color: var(--border); background: var(--surface); }
.theme-toggle .icon { color: var(--accent); }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr); }
.sidebar { z-index: 30; position: fixed; inset: 0 auto 0 0; width: var(--sidebar); display: flex; flex-direction: column; border-right: 1px solid var(--border-soft); background: linear-gradient(180deg, #0a0b0d 0%, #090a0c 100%); }
.sidebar-brand { height: 132px; display: flex; align-items: center; justify-content: center; padding: 22px 28px; border-bottom: 1px solid var(--border-soft); }
.sidebar-brand img { width: 178px; height: 92px; object-fit: contain; }
.sidebar-nav { flex: 1; overflow-y: auto; padding: 18px 12px; scrollbar-width: thin; }
.nav-label { display: block; margin: 0 13px 8px; color: #555c65; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.admin-label { margin-top: 25px; }
.nav-item { min-height: 44px; display: flex; align-items: center; gap: 13px; margin: 3px 0; padding: 0 13px; border: 1px solid transparent; border-radius: 9px; color: #a8aeb6; font-size: 13px; font-weight: 600; transition: .16s ease; }
.nav-item:hover { color: #fff; background: #13161a; }
.nav-item.active { color: #ff6a2b; background: linear-gradient(90deg, rgba(var(--accent-rgb), .18), rgba(var(--accent-rgb), .055)); border-color: rgba(var(--accent-rgb), .16); box-shadow: inset 3px 0 0 var(--accent); }
.nav-item.active .icon { stroke-width: 2.2; }
.sidebar-support { margin: 0 12px 14px; padding: 17px; border: 1px solid rgba(var(--accent-rgb), .55); border-radius: 12px; background: radial-gradient(circle at top right, rgba(var(--accent-rgb), .12), transparent 55%); }
.sidebar-support .support-kicker { display: block; margin-bottom: 8px; color: var(--accent); font-size: 10px; font-weight: 900; letter-spacing: .11em; }
.sidebar-support strong { display: block; margin-bottom: 7px; font-size: 12px; }
.sidebar-support p { margin-bottom: 14px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.sidebar-support .button { width: 100%; color: var(--accent); border-color: rgba(var(--accent-rgb), .55); }
.sidebar-profile { min-height: 68px; display: grid; grid-template-columns: 34px minmax(0, 1fr) 16px; align-items: center; gap: 10px; padding: 11px 14px; border-top: 1px solid var(--border-soft); }
.sidebar-profile:hover { background: var(--surface); }
.sidebar-profile span:not(.avatar) { min-width: 0; }
.sidebar-profile strong, .sidebar-profile small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-profile strong { font-size: 12px; }
.sidebar-profile small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.avatar { width: 34px; height: 34px; display: inline-grid; place-items: center; border: 1px solid #3b4047; border-radius: 50%; color: #fff; background: #1d2024; font-size: 12px; font-weight: 800; }
.avatar.small { width: 33px; height: 33px; }
.main-column { grid-column: 2; min-width: 0; display: flex; flex-direction: column; min-height: 100vh; }
.topbar { z-index: 20; position: sticky; top: 0; height: var(--topbar); display: flex; align-items: center; gap: 20px; padding: 0 28px; border-bottom: 1px solid var(--border-soft); background: rgba(8, 9, 10, .91); backdrop-filter: blur(16px); }
.global-search { width: min(460px, 46vw); height: 40px; display: flex; align-items: center; gap: 10px; padding: 0 13px; border: 1px solid var(--border); border-radius: 9px; background: #101215; color: var(--muted-2); }
.global-search:focus-within { border-color: #4a5058; box-shadow: 0 0 0 3px rgba(255,255,255,.025); }
.global-search input { width: 100%; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 12px; }
.global-search input::placeholder { color: #666d75; }
.topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.icon-button { width: 39px; height: 39px; display: inline-grid; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 9px; color: #aeb4bc; background: transparent; cursor: pointer; }
.icon-button:hover { color: #fff; border-color: var(--border); background: var(--surface-2); }
.notification-button { position: relative; }
.notification-count { position: absolute; top: 2px; right: 1px; min-width: 16px; height: 16px; display: grid; place-items: center; padding: 0 4px; border: 2px solid var(--bg); border-radius: 999px; color: #fff; background: var(--accent); font-size: 8px; font-weight: 900; }
.topbar-user { display: flex; align-items: center; gap: 9px; margin-left: 4px; padding: 5px 10px 5px 6px; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--surface); }
.topbar-user strong, .topbar-user small { display: block; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topbar-user strong { font-size: 12px; }
.topbar-user small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.menu-button, .mobile-only { display: none; }
.content { width: 100%; max-width: 1700px; flex: 1; margin: 0 auto; padding: 30px clamp(22px, 2.35vw, 42px) 42px; }
.app-footer { min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 clamp(22px, 2.35vw, 42px); border-top: 1px solid var(--border-soft); color: var(--muted-2); font-size: 10px; }
.app-footer span:last-child { display: flex; gap: 20px; }
.app-footer a:hover { color: var(--text); }
.sidebar-backdrop { display: none; }

.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.page-heading .eyebrow, .eyebrow { display: block; margin-bottom: 8px; color: var(--accent); font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.page-heading h1 { font-size: clamp(26px, 2.1vw, 34px); line-height: 1.08; }
.page-heading p { margin-top: 8px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.page-actions { display: flex; align-items: center; gap: 10px; }
.alert { position: relative; margin-bottom: 18px; padding: 13px 16px; border: 1px solid var(--border); border-radius: 10px; font-size: 12px; line-height: 1.6; }
.alert.success { color: #a6eeb9; border-color: rgba(68, 207, 115, .25); background: rgba(68, 207, 115, .08); }
.alert.warning { color: #ffd990; border-color: rgba(242, 170, 58, .28); background: rgba(242, 170, 58, .08); }
.alert.danger { color: #ffb2b2; border-color: rgba(240, 87, 87, .3); background: rgba(240, 87, 87, .08); }

.panel { border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(145deg, #14171a, #101214); box-shadow: 0 1px 0 rgba(255,255,255,.018) inset; }
.panel-heading { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 0 18px; border-bottom: 1px solid var(--border-soft); }
.panel-heading > div { display: flex; align-items: center; gap: 11px; }
.panel-heading h2 { font-size: 15px; }
.panel-heading span, .panel-heading > strong { color: var(--muted); font-size: 11px; font-style: normal; }
.panel-heading a { color: var(--accent); font-size: 11px; font-weight: 800; }
.panel-icon { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-2); }
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 17px; }
.stat-card { position: relative; min-height: 126px; display: flex; align-items: center; gap: 15px; padding: 20px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(135deg, #16191d, #111316); }
.stat-card::after { content: ""; position: absolute; width: 90px; height: 90px; right: -36px; top: -38px; border-radius: 50%; background: radial-gradient(circle, rgba(var(--accent-rgb), .07), transparent 70%); }
.stat-icon { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #363b42; border-radius: 50%; color: #e7e9eb; background: radial-gradient(circle at 35% 25%, #24282d, #17191c 72%); }
.stat-card > div:not(.sparkline) { min-width: 0; }
.stat-card span:not(.stat-icon), .stat-card small { display: block; }
.stat-card span:not(.stat-icon) { color: var(--muted); font-size: 11px; }
.stat-card strong { display: block; margin: 5px 0 3px; font-size: clamp(24px, 2vw, 31px); letter-spacing: -.04em; }
.stat-card small { overflow: hidden; color: var(--muted-2); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.positive { color: var(--success) !important; }
.accent-text { color: var(--accent) !important; }
.live-dot { position: absolute; top: 22px; right: 21px; width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(68,207,115,.06); }
.sparkline { height: 34px; display: flex; align-items: center; gap: 3px; margin-left: auto; }
.sparkline i { width: 3px; border-radius: 3px; background: var(--accent); }
.sparkline i:nth-child(1) { height: 30%; }.sparkline i:nth-child(2) { height: 65%; }.sparkline i:nth-child(3) { height: 45%; }.sparkline i:nth-child(4) { height: 88%; }.sparkline i:nth-child(5) { height: 52%; }.sparkline i:nth-child(6) { height: 74%; }
.service-overview-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 17px; margin-bottom: 17px; }
.service-overview { overflow: hidden; }
.compact-list { padding: 0 18px; }
.compact-service { min-height: 70px; display: grid; grid-template-columns: 8px minmax(0, 1fr) auto auto; align-items: center; gap: 12px; border-bottom: 1px solid var(--border-soft); }
.compact-service > div:nth-of-type(1) { min-width: 0; }
.compact-service strong, .compact-service small { display: block; }
.compact-service strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.compact-service small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted-2); }
.status-dot.success { background: var(--success); }.status-dot.warning { background: var(--warning); }.status-dot.danger { background: var(--danger); }
.service-health { min-width: 66px; text-align: right; }
.service-health strong { font-size: 12px; }.service-health small { color: var(--muted-2); }
.panel-link { min-height: 48px; display: flex; align-items: center; gap: 8px; padding: 0 18px; color: var(--accent); font-size: 11px; font-weight: 800; }
.panel-link:hover { background: rgba(var(--accent-rgb), .03); }
.mini-empty { min-height: 75px; display: grid; place-items: center; color: var(--muted); font-size: 11px; }
.stream-compact { border-bottom: 1px solid var(--border-soft); }
.stream-compact .compact-service { border: 0; }
.usage-line { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 0 0 12px 20px; }
.usage-line > span, .card-usage > span { height: 5px; overflow: hidden; border-radius: 99px; background: #25292e; }
.usage-line i, .card-usage i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--accent), #ff702f); }
.usage-line small { color: var(--muted); font-size: 9px; }
.bottom-grid { display: grid; grid-template-columns: .9fr .95fr 1.05fr; gap: 17px; }
.chart-panel { padding-bottom: 14px; overflow: hidden; }
.chart { height: 170px; display: flex; align-items: flex-end; gap: 5px; padding: 28px 18px 0; background-image: linear-gradient(to top, var(--border-soft) 1px, transparent 1px); background-size: 100% 42px; }
.chart i { flex: 1; min-width: 4px; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, var(--accent), rgba(var(--accent-rgb), .14)); }
.chart-labels { display: flex; justify-content: space-between; padding: 10px 18px 0; color: var(--muted-2); font-size: 8px; }
.data-list { padding: 0 18px; }
.data-list > a { min-height: 59px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid var(--border-soft); }
.data-list > a > span { min-width: 0; flex: 1; }
.data-list strong, .data-list small { display: block; }
.data-list strong { font-size: 11px; }
.data-list small { margin-top: 4px; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.data-list > a > strong { flex: 0 0 auto; }
.data-list > a:hover strong { color: #fff; }
.badge { display: inline-flex; align-items: center; justify-content: center; min-height: 24px; padding: 0 9px; border: 1px solid #3a3f45; border-radius: 6px; color: #b8bec5; background: rgba(255,255,255,.025); font-size: 9px; font-weight: 800; font-style: normal; white-space: nowrap; }
.badge.success { color: #70db8e; border-color: rgba(68,207,115,.28); background: rgba(68,207,115,.08); }
.badge.warning { color: #ffc56d; border-color: rgba(242,170,58,.3); background: rgba(242,170,58,.08); }
.badge.danger { color: #ff8787; border-color: rgba(240,87,87,.3); background: rgba(240,87,87,.08); }
.badge.large { min-height: 31px; padding: 0 13px; font-size: 10px; }

.filter-tabs { display: flex; gap: 6px; margin-bottom: 18px; padding: 5px; width: max-content; max-width: 100%; overflow-x: auto; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--surface); }
.filter-tabs a { min-height: 34px; display: grid; place-items: center; padding: 0 14px; border-radius: 7px; color: var(--muted); font-size: 11px; font-weight: 700; white-space: nowrap; }
.filter-tabs a.active { color: #fff; background: var(--surface-3); box-shadow: 0 1px 0 rgba(255,255,255,.04) inset; }
.service-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.service-card { display: flex; flex-direction: column; min-height: 390px; padding: 20px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(145deg, #15181b, #101214); }
.service-card header { display: flex; align-items: center; justify-content: space-between; }
.service-type-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid #373c43; border-radius: 13px; background: radial-gradient(circle at 35% 25%, #262b30, #171a1d 72%); }
.service-type-icon.large { width: 58px; height: 58px; }
.service-card-copy { margin: 24px 0 17px; }
.service-card-copy > span, .detail-service-header > div > span { color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.service-card-copy h2 { margin: 6px 0 4px; font-size: 20px; }
.service-card-copy p { color: var(--muted); font-size: 11px; }
.service-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin: 0 0 19px; padding: 15px 0; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); }
.service-meta dt, .service-meta dd { margin: 0; }
.service-meta dt { margin-bottom: 4px; color: var(--muted); font-size: 9px; }
.service-meta dd { font-size: 11px; font-weight: 700; }
.card-usage { margin: auto 0 18px; }
.card-usage > div { display: flex; justify-content: space-between; margin-bottom: 8px; color: var(--muted); font-size: 9px; }
.card-usage > div strong { color: #c7ccd2; }
.card-usage > span { display: block; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; }
.detail-main { padding: 22px; }
.detail-service-header { display: flex; align-items: center; gap: 15px; padding-bottom: 20px; border-bottom: 1px solid var(--border-soft); }
.detail-service-header h2 { margin-top: 6px; font-size: 23px; }
.detail-service-header .badge { margin-left: auto; }
.detail-properties { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: 8px; }
.detail-properties > div { padding: 17px 12px; border-bottom: 1px solid var(--border-soft); }
.detail-properties > div:nth-child(odd) { border-right: 1px solid var(--border-soft); }
.detail-properties span, .detail-properties strong { display: block; }
.detail-properties span { color: var(--muted); font-size: 9px; }
.detail-properties strong { margin-top: 5px; font-size: 12px; }
.service-notes { margin-top: 20px; padding: 16px; border-radius: 10px; background: var(--surface-2); }
.service-notes span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.service-notes p { margin-top: 7px; color: #c6cbd0; font-size: 11px; line-height: 1.65; }
.detail-aside { display: flex; flex-direction: column; gap: 17px; }
.renewal-card, .secure-card { display: flex; gap: 14px; padding: 19px; }
.renewal-card span:not(.stat-icon), .renewal-card strong { display: block; }
.renewal-card span:not(.stat-icon) { color: var(--muted); font-size: 9px; }
.renewal-card strong { margin: 5px 0; font-size: 17px; }
.renewal-card p { color: var(--accent); font-size: 12px; font-weight: 800; }
.secure-card h3, .secure-card strong { font-size: 12px; }
.secure-card p { margin-top: 7px; color: var(--muted); font-size: 10px; line-height: 1.6; }

.summary-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 17px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.summary-strip > div { padding: 19px 22px; border-right: 1px solid var(--border-soft); }
.summary-strip > div:last-child { border-right: 0; }
.summary-strip span, .summary-strip strong { display: block; }
.summary-strip span { color: var(--muted); font-size: 9px; }
.summary-strip strong { margin-top: 7px; font-size: 21px; }
.table-panel { overflow: hidden; }
.responsive-table { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 13px 16px; color: #747c86; background: rgba(255,255,255,.012); font-size: 9px; font-weight: 800; letter-spacing: .05em; text-align: left; text-transform: uppercase; }
td { padding: 14px 16px; border-top: 1px solid var(--border-soft); color: #bdc3ca; font-size: 11px; vertical-align: middle; }
td strong { color: #f1f2f3; }
td small { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
tbody tr:hover { background: rgba(255,255,255,.012); }
.table-action { display: inline-flex; align-items: center; gap: 6px; color: var(--accent); font-size: 10px; font-weight: 800; white-space: nowrap; }
.client-cell, .service-table-cell { display: flex; align-items: center; gap: 10px; }
.service-table-cell > span { width: 33px; height: 33px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); }
.invoice-view { padding: 28px; }
.invoice-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 30px; padding-bottom: 24px; border-bottom: 1px solid var(--border-soft); }
.invoice-head img { width: 185px; height: 86px; object-fit: contain; object-position: left center; }
.invoice-head p { margin-top: 8px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.invoice-head > div:last-child { text-align: right; }
.invoice-head dl { display: grid; grid-template-columns: auto auto; gap: 5px 16px; margin: 14px 0 0; font-size: 10px; }
.invoice-head dt { color: var(--muted); }.invoice-head dd { margin: 0; font-weight: 700; }
.invoice-client { margin: 24px 0; }
.invoice-client span { display: block; margin-bottom: 8px; color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.invoice-client strong { font-size: 14px; }
.invoice-client p { margin-top: 6px; color: var(--muted); font-size: 10px; line-height: 1.65; }
.invoice-items { border: 1px solid var(--border-soft); }
.invoice-totals { display: grid; grid-template-columns: 1fr 280px; gap: 50px; padding-top: 23px; }
.invoice-totals > div span { color: var(--muted); font-size: 9px; }.invoice-totals > div p { margin-top: 6px; color: #b7bdc4; font-size: 10px; line-height: 1.6; }
.invoice-totals dl { display: grid; grid-template-columns: 1fr auto; gap: 9px 20px; margin: 0; font-size: 11px; }
.invoice-totals dt { color: var(--muted); }.invoice-totals dd { margin: 0; font-weight: 700; text-align: right; }
.invoice-totals .grand { margin-top: 5px; padding-top: 12px; border-top: 1px solid var(--border); color: #fff; font-size: 16px; font-weight: 900; }

.support-intro-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, .5fr); gap: 17px; margin-bottom: 17px; }
.support-intro { display: flex; align-items: center; gap: 15px; padding: 19px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.support-intro > span { width: 47px; height: 47px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); }
.support-intro h2 { font-size: 15px; }.support-intro h3 { font-size: 11px; }.support-intro strong { display: block; margin: 5px 0; font-size: 14px; }
.support-intro p { margin-top: 5px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.support-intro .button { margin-left: auto; flex: 0 0 auto; }
.primary-support { border-color: rgba(var(--accent-rgb), .25); background: linear-gradient(110deg, rgba(var(--accent-rgb), .14), #15171a 55%); }
.form-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.form-panel { padding: 23px; }
.form-grid { display: grid; gap: 16px; }
.form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-grid label, .auth-form label, .install-form label, .reply-box label { display: grid; gap: 8px; color: #c3c8ce; font-size: 10px; font-weight: 700; }
.form-grid .full { grid-column: 1 / -1; }.form-grid .span-two { grid-column: span 2; }
input, select, textarea { width: 100%; min-height: 43px; padding: 0 12px; border: 1px solid #30353b; border-radius: 8px; outline: 0; color: var(--text); background: #0d0f11; font-size: 12px; transition: .15s ease; }
textarea { min-height: 110px; padding: 12px; resize: vertical; line-height: 1.6; }
input:focus, select:focus, textarea:focus { border-color: rgba(var(--accent-rgb), .75); box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .08); }
input:disabled { color: #777f88; background: #15171a; cursor: not-allowed; }
input[type="color"] { padding: 5px; cursor: pointer; }
label small { color: var(--muted-2); font-size: 9px; font-weight: 500; }
.form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 21px; padding-top: 18px; border-top: 1px solid var(--border-soft); }
.form-help { display: flex; flex-direction: column; gap: 17px; }
.form-help .panel { padding: 19px; }
.form-help h3 { margin: 14px 0 8px; font-size: 13px; }
.form-help p, .form-help li { color: var(--muted); font-size: 10px; line-height: 1.65; }
.form-help ul { margin: 0; padding-left: 17px; }
.form-section-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; padding-bottom: 19px; border-bottom: 1px solid var(--border-soft); }
.form-section-heading h2 { font-size: 15px; }.form-section-heading p { margin-top: 5px; color: var(--muted); font-size: 10px; }
.profile-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); gap: 18px; align-items: start; }
.large-avatar { width: 54px; height: 54px; font-size: 18px; }
.conversation-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 18px; align-items: start; }
.conversation { display: flex; flex-direction: column; gap: 18px; }
.message { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; }
.message-avatar { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; background: var(--surface-2); font-size: 11px; font-weight: 900; }
.message-body { padding: 16px; border: 1px solid var(--border); border-radius: 3px 12px 12px; background: var(--surface); }
.message.staff .message-body { border-color: rgba(var(--accent-rgb), .24); background: linear-gradient(135deg, rgba(var(--accent-rgb), .065), #121416 45%); }
.message-body header { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.message-body header strong { font-size: 11px; }.message-body header span { padding: 3px 6px; border-radius: 4px; color: var(--accent); background: rgba(var(--accent-rgb), .08); font-size: 7px; font-weight: 900; letter-spacing: .08em; }
.message-body time { margin-left: auto; color: var(--muted); font-size: 8px; }
.message-body p { color: #c6cbd0; font-size: 11px; line-height: 1.7; }
.reply-box { padding: 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.reply-actions { display: flex; align-items: flex-end; justify-content: flex-end; gap: 12px; margin-top: 13px; }
.reply-actions label { min-width: 150px; margin-right: auto; }
.ticket-sidebar { padding: 20px; }
.ticket-sidebar h3 { padding-bottom: 14px; border-bottom: 1px solid var(--border-soft); font-size: 13px; }
.ticket-sidebar dl { margin: 7px 0 0; }
.ticket-sidebar dt { margin-top: 13px; color: var(--muted); font-size: 9px; }.ticket-sidebar dd { margin: 4px 0 0; font-size: 11px; font-weight: 700; }
.closed-note { display: flex; align-items: center; gap: 9px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 10px; color: var(--muted); background: var(--surface); font-size: 10px; }
.wide-form { max-width: 1100px; }
.invoice-editor { margin: 22px 0; padding: 17px; border: 1px solid var(--border); border-radius: 11px; background: #0f1113; }
.invoice-editor > header { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.invoice-editor > header span { display: block; margin-bottom: 4px; color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .12em; }
.invoice-editor > header h3 { font-size: 13px; }
.invoice-editor-items { display: grid; gap: 9px; }
.invoice-item-row { display: grid; grid-template-columns: minmax(220px, 1fr) 110px 150px 36px; align-items: end; gap: 10px; padding: 12px; border: 1px solid var(--border-soft); border-radius: 9px; background: var(--surface); }
.invoice-item-row label { display: grid; gap: 7px; color: #c3c8ce; font-size: 9px; font-weight: 700; }
.remove-line { width: 36px; height: 43px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(240,87,87,.25); border-radius: 8px; color: #ff8484; background: rgba(240,87,87,.055); cursor: pointer; }
.remove-line:hover { border-color: var(--danger); background: rgba(240,87,87,.11); }
.admin-search { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 8px; max-width: 620px; margin-bottom: 17px; padding-left: 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
.admin-search input { border: 0; background: transparent; }.admin-search .button { border-radius: 0 9px 9px 0; }
.notification-list { overflow: hidden; }
.notification-row { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 13px; padding: 16px 19px; border-bottom: 1px solid var(--border-soft); }
.notification-row:last-child { border-bottom: 0; }.notification-row.unread { background: rgba(var(--accent-rgb), .045); }
.notification-icon { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); }
.notification-row strong { font-size: 11px; }.notification-row p { margin: 5px 0; color: var(--muted); font-size: 10px; }.notification-row small { color: var(--muted-2); font-size: 8px; }
.search-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.search-results article { padding: 18px; }
.search-results h2 { display: flex; align-items: center; gap: 8px; padding-bottom: 14px; border-bottom: 1px solid var(--border-soft); font-size: 13px; }
.search-results h2 span { margin-left: auto; color: var(--muted); font-size: 10px; }
.search-results article > a { min-height: 57px; display: flex; align-items: center; border-bottom: 1px solid var(--border-soft); }
.search-results article > a > span { min-width: 0; flex: 1; }.search-results article > a strong, .search-results article > a small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-results article > a strong { font-size: 10px; }.search-results article > a small, .search-results article > p { margin-top: 4px; color: var(--muted); font-size: 9px; }
.search-results article > p { padding-top: 15px; }
.empty-state { min-height: 260px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 35px 20px; text-align: center; }
.empty-icon { width: 62px; height: 62px; display: grid; place-items: center; margin-bottom: 15px; border: 1px solid var(--border); border-radius: 16px; color: var(--muted); background: var(--surface-2); }
.empty-state h3 { font-size: 15px; }.empty-state p { max-width: 460px; margin: 8px 0 17px; color: var(--muted); font-size: 10px; line-height: 1.6; }

.compact-check { padding: 13px 15px; }
.linked-provider { display: flex; align-items: center; gap: 10px; padding: 13px 15px; border: 1px solid rgba(68,207,115,.24); border-radius: 10px; color: #83dfa0; background: rgba(68,207,115,.06); }.linked-provider strong, .linked-provider small { display: block; }.linked-provider strong { font-size: 10px; }.linked-provider small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.integration-status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.integration-status { min-height: 92px; display: flex; align-items: center; gap: 13px; padding: 17px; }
.integration-status > div { min-width: 0; flex: 1; }.integration-status small { color: var(--muted); font-size: 8px; }.integration-status h2 { margin-top: 5px; font-size: 16px; }
.provider-mark { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #3b4047; border-radius: 11px; color: #fff; background: #1b1e22; font-size: 16px; font-weight: 900; }
.provider-mark.plesk { color: #80b8ff; border-color: rgba(65,139,255,.3); background: rgba(65,139,255,.1); }.provider-mark.stripe { color: #a9a6ff; border-color: rgba(99,91,255,.34); background: rgba(99,91,255,.1); }.provider-mark.paypal { color: #7cc4ff; border-color: rgba(0,156,222,.32); background: rgba(0,156,222,.1); }
.integration-stack { display: grid; gap: 17px; }
.integration-card { padding: 22px; }
.integration-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 21px; padding-bottom: 19px; border-bottom: 1px solid var(--border-soft); }
.integration-card > header > div { display: flex; align-items: center; gap: 13px; }.integration-card > header > div > div > span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.integration-card h2 { margin: 4px 0 5px; font-size: 18px; }.integration-card header p { color: var(--muted); font-size: 10px; line-height: 1.55; }
.switch { display: grid; grid-template-columns: 40px auto; align-items: center; gap: 8px; color: #c7ccd2; font-size: 10px; font-weight: 800; cursor: pointer; }
.switch input { position: absolute; width: 1px; min-height: 1px; opacity: 0; }.switch > span { position: relative; width: 40px; height: 22px; border: 1px solid #3a4047; border-radius: 99px; background: #181b1f; }.switch > span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #767e87; transition: .18s ease; }.switch input:checked + span { border-color: rgba(var(--accent-rgb), .65); background: rgba(var(--accent-rgb), .15); }.switch input:checked + span::after { left: 21px; background: var(--accent); }
.integration-actions { display: flex; gap: 9px; margin-top: 18px; padding-top: 17px; border-top: 1px solid var(--border-soft); }
.sticky-save { position: sticky; bottom: 16px; z-index: 8; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px 14px 13px 17px; border: 1px solid #3a4047; border-radius: 12px; background: rgba(17,19,22,.95); box-shadow: 0 18px 55px rgba(0,0,0,.38); backdrop-filter: blur(18px); }.sticky-save > span { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; }
.inventory-panel { margin-top: 18px; overflow: hidden; }.inventory-grid { display: grid; grid-template-columns: 1fr 1fr; }.inventory-grid > div { padding: 19px; }.inventory-grid > div + div { border-left: 1px solid var(--border-soft); }.inventory-grid h3 { margin-bottom: 8px; color: var(--accent); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }.inventory-grid p { display: flex; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--border-soft); font-size: 10px; }.inventory-grid p small { color: var(--muted); text-align: right; }
.payment-panel { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 17px; padding: 20px 22px; border-color: rgba(var(--accent-rgb), .28); background: linear-gradient(110deg, rgba(var(--accent-rgb), .1), #121417 55%); }.payment-panel > div:first-child { display: flex; align-items: center; gap: 14px; }.payment-lock { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(var(--accent-rgb), .35); border-radius: 13px; color: var(--accent); background: rgba(var(--accent-rgb), .08); }.payment-panel > div:first-child > div > span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.payment-panel h2 { margin: 5px 0; font-size: 18px; }.payment-panel p { color: var(--muted); font-size: 10px; }.payment-buttons { display: flex; gap: 9px; }.payment-buttons form { margin: 0; }.paypal-button { color: #fff; border-color: #0879c9; background: linear-gradient(135deg, #0070ba, #1546a0); }.paid-confirmation { display: flex; align-items: center; gap: 12px; margin-top: 17px; padding: 17px 20px; color: #8ae4a2; border-color: rgba(68,207,115,.25); background: rgba(68,207,115,.06); }.paid-confirmation strong, .paid-confirmation span { display: block; }.paid-confirmation strong { font-size: 12px; }.paid-confirmation span { margin-top: 4px; color: var(--muted); font-size: 9px; }

.store-body { min-height: 100vh; color: var(--text); background: #070809; }
.store-header { z-index: 40; position: sticky; top: 0; min-height: 78px; display: grid; grid-template-columns: 250px minmax(0, 1fr) auto; align-items: center; gap: 26px; padding: 0 clamp(22px, 4vw, 70px); border-bottom: 1px solid rgba(255,255,255,.075); background: rgba(7,8,9,.91); backdrop-filter: blur(20px); }
.store-brand { display: flex; align-items: center; gap: 10px; }.store-brand img { width: 156px; height: 62px; object-fit: contain; object-position: left center; }.store-brand > span { display: none; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.store-header > nav { display: flex; align-items: center; justify-content: center; gap: 7px; }.store-header > nav a { padding: 10px 12px; border-radius: 8px; color: #9ca3ab; font-size: 11px; font-weight: 700; }.store-header > nav a:hover, .store-header > nav a.active { color: #fff; background: #14171a; }
.store-account-actions { display: flex; align-items: center; gap: 9px; }.store-login-link { padding: 9px; color: #c4c9ce; font-size: 11px; font-weight: 700; }.store-cart-link { position: relative; display: flex; align-items: center; gap: 7px; padding: 10px 11px; border: 1px solid #292e34; border-radius: 9px; color: #c4c9cf; font-size: 10px; font-weight: 800; background: #101214; }.store-cart-link:hover, .store-cart-link.active { color: #fff; border-color: rgba(var(--accent-rgb),.5); }.store-cart-link em { position: absolute; top: -7px; right: -7px; min-width: 18px; height: 18px; display: grid; place-items: center; padding: 0 4px; border: 2px solid #070809; border-radius: 99px; color: #fff; background: var(--accent); font-size: 8px; font-style: normal; }
.store-main { width: min(100%, 1540px); min-height: calc(100vh - 160px); margin: 0 auto; padding: 0 clamp(22px, 4vw, 70px) 70px; }.store-main > .alert { margin-top: 20px; }
.store-hero { position: relative; min-height: 610px; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr); align-items: center; gap: clamp(45px, 7vw, 110px); overflow: hidden; padding: 80px 0 72px; }.store-hero::before { content: ""; position: absolute; width: 660px; height: 660px; right: -340px; top: -240px; border: 1px solid rgba(var(--accent-rgb),.14); border-radius: 50%; box-shadow: 0 0 0 90px rgba(var(--accent-rgb),.025),0 0 0 180px rgba(var(--accent-rgb),.015); pointer-events: none; }.store-hero::after { content: ""; position: absolute; width: 620px; height: 340px; left: -160px; top: 95px; background: radial-gradient(ellipse,rgba(var(--accent-rgb),.13),transparent 67%); filter: blur(35px); pointer-events: none; }
.store-hero-copy { z-index: 1; position: relative; max-width: 760px; }.store-hero-copy h1 { max-width: 760px; font-size: clamp(48px, 5.7vw, 88px); line-height: .98; letter-spacing: -.055em; }.store-hero-copy > p { max-width: 660px; margin-top: 24px; color: #9da4ac; font-size: clamp(13px, 1.2vw, 16px); line-height: 1.75; }.store-hero-actions { display: flex; gap: 10px; margin-top: 31px; }.store-trust { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 32px; color: #8f979f; font-size: 10px; }.store-trust span { display: flex; align-items: center; gap: 7px; }.store-trust .icon { color: var(--accent); }
.store-hero-panel { z-index: 1; position: relative; min-height: 430px; padding: 35px; border: 1px solid #30353b; border-radius: 22px; background: linear-gradient(145deg,rgba(26,29,33,.94),rgba(13,15,17,.94)); box-shadow: 0 35px 90px rgba(0,0,0,.4); }.store-hero-panel::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(130deg,rgba(var(--accent-rgb),.14),transparent 38%); pointer-events: none; }.store-hero-panel > span { position: relative; color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: .14em; }.store-hero-panel h2 { position: relative; margin: 12px 0 30px; font-size: clamp(30px,3vw,43px); line-height: 1.05; letter-spacing: -.04em; }.store-hero-panel > div { position: relative; display: grid; }.store-hero-panel p { min-height: 58px; display: grid; grid-template-columns: 40px 1fr; align-items: center; gap: 12px; border-top: 1px solid rgba(255,255,255,.08); }.store-hero-panel p strong { color: var(--accent); font-size: 11px; }.store-hero-panel p span { color: #c9cdd2; font-size: 11px; font-weight: 700; }
.store-value-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; overflow: hidden; margin-bottom: 105px; border: 1px solid #292e34; border-radius: 16px; background: #292e34; }.store-value-grid article { min-height: 128px; display: flex; align-items: center; gap: 15px; padding: 25px; background: #111315; }.store-value-grid article > span { width: 47px; height: 47px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #353b42; border-radius: 13px; color: var(--accent); background: #171a1e; }.store-value-grid strong { display: block; font-size: 13px; }.store-value-grid p { margin-top: 6px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.store-offers { scroll-margin-top: 95px; padding-bottom: 110px; }.store-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 36px; }.store-section-heading > div > span { color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: .14em; }.store-section-heading h2 { max-width: 680px; margin-top: 9px; font-size: clamp(30px,3.2vw,49px); line-height: 1.05; letter-spacing: -.04em; }.store-section-heading p { max-width: 610px; margin-top: 13px; color: var(--muted); font-size: 11px; line-height: 1.6; }.store-section-heading nav { display: flex; gap: 5px; padding: 5px; border: 1px solid #2d3238; border-radius: 11px; background: #101214; }.store-section-heading nav a { min-height: 36px; display: grid; place-items: center; padding: 0 13px; border-radius: 8px; color: #9299a2; font-size: 10px; font-weight: 800; white-space: nowrap; }.store-section-heading nav a.active { color: #fff; background: #252a30; }
.store-products { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }.store-product { position: relative; min-height: 560px; display: flex; flex-direction: column; padding: 27px; border: 1px solid #2c3137; border-radius: 16px; background: linear-gradient(150deg,#15181b,#0f1113 70%); }.store-product.featured { border-color: rgba(var(--accent-rgb),.55); background: linear-gradient(145deg,rgba(var(--accent-rgb),.11),#15181b 28%,#0f1113); box-shadow: 0 20px 60px rgba(var(--accent-rgb),.08); }.store-product.sold-out { opacity: .68; }.popular-label { position: absolute; top: -11px; right: 18px; padding: 6px 10px; border-radius: 6px; color: #fff; background: var(--accent); font-size: 7px; font-weight: 900; letter-spacing: .1em; }.popular-label.unavailable { background: #59616a; }.product-category { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }.store-product h3 { margin: 10px 0 7px; font-size: 23px; line-height: 1.1; }.store-product header p { min-height: 35px; color: var(--muted); font-size: 10px; line-height: 1.55; }.product-price { margin: 25px 0 20px; padding: 19px 0; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); }.product-price strong { font-size: 31px; letter-spacing: -.04em; }.product-price > span { margin-left: 5px; color: var(--muted); font-size: 10px; }.product-price small { display: block; margin-top: 7px; color: #b2b8be; font-size: 9px; }.store-product ul { display: grid; gap: 11px; margin: 0 0 27px; padding: 0; list-style: none; }.store-product li { display: flex; gap: 8px; color: #c4c9ce; font-size: 10px; line-height: 1.45; }.store-product li .icon { flex: 0 0 auto; color: var(--success); }.product-actions { margin-top: auto; }.product-actions form { margin: 0; }.product-actions > a { display: block; margin-top: 12px; color: var(--muted); font-size: 9px; text-align: center; }.product-actions > a:hover { color: var(--accent); }.button:disabled { opacity: .48; cursor: not-allowed; transform: none; }
.store-empty,.cart-empty { min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 35px; border: 1px solid #2b3036; border-radius: 16px; text-align: center; background: #111315; }.store-empty p,.cart-empty p { margin: 9px 0 18px; color: var(--muted); font-size: 11px; }.cart-empty > span { width: 64px; height: 64px; display: grid; place-items: center; margin-bottom: 16px; border: 1px solid #343a41; border-radius: 17px; color: var(--accent); background: #181b1f; }
.store-cta { min-height: 240px; display: flex; align-items: center; justify-content: space-between; gap: 40px; overflow: hidden; padding: 45px clamp(30px,5vw,70px); border: 1px solid rgba(var(--accent-rgb),.35); border-radius: 20px; background: radial-gradient(circle at 92% 25%,rgba(var(--accent-rgb),.25),transparent 32%),linear-gradient(125deg,rgba(var(--accent-rgb),.16),#16191d 45%,#101214); }.store-cta span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .14em; }.store-cta h2 { margin: 9px 0; font-size: clamp(27px,3vw,43px); }.store-cta p { color: #a7adb4; font-size: 11px; }.store-cta .button { flex: 0 0 auto; }
.store-footer { min-height: 130px; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 50px; padding: 25px clamp(22px,4vw,70px); border-top: 1px solid rgba(255,255,255,.075); color: var(--muted); background: #090a0b; }.store-footer img { width: 145px; height: 55px; object-fit: contain; object-position: left; }.store-footer p { margin-top: 4px; font-size: 9px; }.store-footer nav { display: flex; gap: 20px; font-size: 10px; }.store-footer nav a:hover { color: #fff; }.store-footer > span { font-size: 9px; }
.product-detail-page,.cart-page,.checkout-page { padding: 55px 0 30px; }.product-detail-grid { display: grid; grid-template-columns: minmax(0,1fr) 370px; gap: 25px; align-items: start; }.product-detail-grid > article { padding: 36px; border: 1px solid #2d3238; border-radius: 17px; background: #111315; }.product-detail-grid h1 { margin: 10px 0; font-size: clamp(34px,4vw,58px); }.product-detail-grid > article h2 { color: #b9bec4; font-size: 17px; font-weight: 500; }.product-detail-grid > article > p { margin: 22px 0; color: var(--muted); font-size: 12px; line-height: 1.75; }.product-detail-grid ul { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin: 0; padding: 20px 0 0; border-top: 1px solid var(--border-soft); list-style: none; }.product-detail-grid li { display: flex; gap: 8px; color: #c5cad0; font-size: 10px; }.product-detail-grid li .icon { color: var(--success); }.product-detail-grid > aside { position: sticky; top: 100px; padding: 27px; border: 1px solid rgba(var(--accent-rgb),.38); border-radius: 17px; background: linear-gradient(145deg,rgba(var(--accent-rgb),.1),#14171a 40%,#101214); }.product-detail-grid > aside > span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.product-detail-grid > aside h3 { margin-top: 9px; font-size: 21px; }.product-detail-grid > aside > p,.product-detail-grid > aside > small { display: block; margin: 12px 0; color: var(--muted); font-size: 9px; }.product-detail-grid > aside > small { display: flex; align-items: center; gap: 6px; }
.cart-page > header,.checkout-page > header { padding: 20px 0 30px; }.cart-page > header > span,.checkout-page > header > span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .13em; }.cart-page > header h1,.checkout-page > header h1 { margin: 8px 0; font-size: clamp(34px,4vw,54px); }.cart-page > header p,.checkout-page > header p { color: var(--muted); font-size: 11px; }.cart-layout,.checkout-layout { display: grid; grid-template-columns: minmax(0,1fr) 370px; gap: 18px; align-items: start; }.cart-items { display: grid; gap: 10px; }.cart-items article { display: grid; grid-template-columns: 48px minmax(0,1fr) 78px 130px 38px; align-items: center; gap: 15px; padding: 18px; border: 1px solid #2c3137; border-radius: 13px; background: #111315; }.cart-product-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid #363c43; border-radius: 12px; color: var(--accent); background: #191c20; }.cart-items article small { color: var(--muted); font-size: 8px; }.cart-items article h2 { margin: 4px 0; font-size: 14px; }.cart-items article p { color: var(--muted); font-size: 9px; }.cart-items article label { color: var(--muted); font-size: 8px; }.cart-items article label input { margin-top: 5px; }.cart-unit { color: var(--muted); font-size: 9px; font-weight: 800; text-align: center; }.cart-line-price { text-align: right; }.cart-line-price strong,.cart-line-price span { display: block; }.cart-line-price strong { font-size: 13px; }.cart-line-price span { margin-top: 4px; color: var(--muted); font-size: 8px; }.cart-update { display: flex; justify-content: space-between; gap: 10px; margin-top: 5px; }.cart-summary { position: sticky; top: 100px; padding: 25px; border: 1px solid #30363d; border-radius: 15px; background: linear-gradient(145deg,#171a1e,#101214); }.cart-summary > span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.cart-summary > h2 { margin: 8px 0 18px; font-size: 20px; }.cart-summary dl { display: grid; grid-template-columns: 1fr auto; gap: 12px 20px; margin: 0 0 21px; padding: 17px 0; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); font-size: 10px; }.cart-summary dt { color: var(--muted); }.cart-summary dd { margin: 0; font-weight: 800; text-align: right; }.cart-summary dt:last-of-type,.cart-summary dd:last-of-type { padding-top: 11px; border-top: 1px solid var(--border-soft); color: #fff; font-size: 15px; }.cart-summary > p { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 13px; color: var(--muted); font-size: 8px; text-align: center; }
.checkout-order-form { display: block; }.checkout-account { padding: 25px; border: 1px solid #2d3238; border-radius: 15px; background: #111315; }.checkout-title { display: flex; align-items: center; gap: 13px; padding-bottom: 19px; border-bottom: 1px solid var(--border-soft); }.checkout-title small { color: var(--accent); font-size: 8px; font-weight: 900; }.checkout-title h2 { margin: 5px 0; font-size: 17px; }.checkout-title p { color: var(--muted); font-size: 9px; }.checkout-account dl { display: grid; grid-template-columns: 180px 1fr; gap: 10px 25px; margin: 20px 0; font-size: 10px; }.checkout-account dt { color: var(--muted); }.checkout-account dd { margin: 0; line-height: 1.65; }.checkout-account > a { color: var(--accent); font-size: 10px; font-weight: 800; }.checkout-configuration { display: grid; gap: 11px; margin-top: 22px; padding: 20px; border: 1px solid rgba(var(--accent-rgb),.28); border-radius: 12px; background: rgba(var(--accent-rgb),.055); }.checkout-configuration > span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .1em; }.checkout-configuration label { color: #dce0e4; font-size: 10px; font-weight: 800; }.checkout-configuration input { margin-top: 8px; }.checkout-configuration small { display: block; margin-top: 7px; color: var(--muted); font-size: 8px; font-weight: 500; }.checkout-line { display: flex; justify-content: space-between; gap: 15px; padding: 10px 0; border-top: 1px solid var(--border-soft); font-size: 10px; }.checkout-line span strong,.checkout-line span small { display: block; }.checkout-line span small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.register-wrap { width: min(100%,680px); }.register-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.register-grid .full { grid-column: 1/-1; }.honeypot { position: absolute !important; left: -9999px; opacity: 0; pointer-events: none; }
.commerce-admin-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; margin-bottom: 17px; }.commerce-admin-summary article { display: flex; align-items: center; gap: 13px; padding: 18px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }.commerce-admin-summary article > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #373d44; border-radius: 11px; color: var(--accent); background: var(--surface-2); }.commerce-admin-summary small,.commerce-admin-summary strong { display: block; }.commerce-admin-summary small { color: var(--muted); font-size: 8px; }.commerce-admin-summary strong { margin-top: 3px; font-size: 21px; }.product-editor { max-width: 1180px; }
.order-detail-layout { display: grid; grid-template-columns: minmax(0,1fr) 330px; gap: 18px; align-items: start; }.order-detail-main { padding: 24px; }.order-detail-main > header { display: grid; grid-template-columns: 1fr auto; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--border-soft); }.order-detail-main > header span,.order-detail-main > header strong { display: block; }.order-detail-main > header span { margin-bottom: 5px; color: var(--muted); font-size: 8px; }.order-detail-main > header strong { font-size: 14px; }.order-detail-main > h2 { margin: 23px 0 10px; font-size: 15px; }.order-item { min-height: 76px; display: grid; grid-template-columns: 46px minmax(0,1fr) auto auto; align-items: center; gap: 13px; border-bottom: 1px solid var(--border-soft); }.order-item .service-type-icon { width: 46px; height: 46px; border-radius: 11px; }.order-item > div strong,.order-item > div small { display: block; }.order-item > div strong { font-size: 11px; }.order-item > div small { margin-top: 4px; color: var(--muted); font-size: 8px; }.order-item > strong { font-size: 11px; }.order-detail-main > footer { display: flex; justify-content: flex-end; padding-top: 20px; }.order-detail-main > footer dl { width: 280px; display: grid; grid-template-columns: 1fr auto; gap: 9px 18px; margin: 0; font-size: 10px; }.order-detail-main > footer dt { color: var(--muted); }.order-detail-main > footer dd { margin: 0; font-weight: 800; text-align: right; }.order-detail-main > footer dt:last-of-type,.order-detail-main > footer dd:last-of-type { padding-top: 10px; border-top: 1px solid var(--border-soft); color: #fff; font-size: 14px; }.order-detail-aside { display: grid; gap: 16px; }.order-detail-aside article { padding: 20px; }.order-detail-aside article > span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .1em; }.order-detail-aside h3 { margin: 8px 0; font-size: 15px; }.order-detail-aside p { margin-bottom: 15px; color: var(--muted); font-size: 9px; line-height: 1.6; }.order-status-form { display: grid; gap: 10px; margin-top: 11px; padding-top: 12px; border-top: 1px solid var(--border-soft); }.order-status-form label { color: var(--muted); font-size: 8px; }.order-status-form select { margin-top: 6px; }

.auth-page { background: #08090a; }
.auth-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(420px, .9fr) minmax(500px, 1.1fr); }
.auth-visual { position: relative; min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 48px clamp(38px, 5vw, 82px); border-right: 1px solid var(--border-soft); background: radial-gradient(circle at 13% 23%, rgba(var(--accent-rgb), .16), transparent 32%), linear-gradient(145deg, #111317, #08090a 65%); }
.auth-visual::before { content: ""; position: absolute; width: 420px; height: 420px; right: -160px; bottom: 8%; border: 1px solid rgba(var(--accent-rgb), .13); border-radius: 50%; box-shadow: 0 0 0 70px rgba(var(--accent-rgb), .025), 0 0 0 140px rgba(var(--accent-rgb), .018); }
.auth-logo { position: relative; width: 230px; height: 118px; object-fit: contain; object-position: left top; }
.auth-copy { position: relative; max-width: 560px; }
.auth-copy h1 { max-width: 520px; font-size: clamp(37px, 4.2vw, 67px); line-height: 1.02; }
.auth-copy p { max-width: 510px; margin-top: 20px; color: #9aa1aa; font-size: 14px; line-height: 1.75; }
.auth-proof-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; max-width: 540px; margin-top: 28px; }.auth-proof-grid article { padding: 14px; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; background: rgba(255,255,255,.025); }.auth-proof-grid strong,.auth-proof-grid span { display: block; }.auth-proof-grid strong { color: var(--accent); font-size: 17px; }.auth-proof-grid span { margin-top: 4px; color: #aeb5bd; font-size: 8px; }
.auth-trust { position: relative; display: flex; gap: 24px; color: var(--muted); font-size: 10px; }
.auth-trust span { display: flex; align-items: center; gap: 8px; }
.auth-panel { display: flex; align-items: center; justify-content: center; padding: 45px; background: #0b0c0e; }
.auth-form-wrap { width: min(100%, 440px); }
.auth-form-wrap.compact { width: min(100%, 470px); }
.auth-form-heading { margin-bottom: 29px; }
.auth-form-heading > span { color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.auth-form-heading h2 { margin: 9px 0 10px; font-size: 29px; }
.auth-form-heading p { color: var(--muted); font-size: 11px; line-height: 1.65; }
.auth-form { display: grid; gap: 17px; }
.password-field { position: relative; display: block; }
.password-field input { padding-right: 43px; }
.password-field button { position: absolute; top: 2px; right: 2px; bottom: 2px; width: 40px; display: grid; place-items: center; border: 0; color: var(--muted); background: transparent; cursor: pointer; }
.form-between { display: flex; align-items: center; justify-content: space-between; gap: 15px; color: var(--muted); font-size: 10px; }
.form-between a, .auth-help a, .back-link { color: var(--accent); font-weight: 800; }
.inline-check { display: flex !important; grid-template-columns: 15px auto; align-items: center; gap: 7px !important; font-weight: 500 !important; }
.inline-check input { width: 15px; min-height: 15px; }
.auth-help { margin-top: 26px; color: var(--muted); font-size: 10px; text-align: center; }
.back-link { display: inline-block; margin-bottom: 25px; font-size: 10px; }
.auth-theme-control { z-index: 60; position: fixed; top: 18px; right: 18px; }.auth-theme-control .theme-toggle { background: rgba(17,19,22,.88); backdrop-filter: blur(14px); }
.login-wrap { width: min(100%,480px); }.login-back { margin-bottom: 34px; }.login-wrap .auth-form-heading h2 { font-size: clamp(30px,3vw,39px); }.login-wrap .auth-form-heading p { max-width: 430px; font-size: 12px; }.auth-input-field { min-height: 52px; display: flex !important; align-items: center; gap: 10px; padding: 0 12px; border: 1px solid #30353b; border-radius: 10px; color: var(--muted); background: #0d0f11; transition: .15s ease; }.auth-input-field:focus-within { color: var(--accent); border-color: rgba(var(--accent-rgb),.75); box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.08); }.auth-input-field > input { min-width: 0; min-height: 50px; flex: 1; padding: 0; border: 0; background: transparent; box-shadow: none; }.password-field.auth-input-field { display: flex; }.password-field.auth-input-field input { padding-right: 0; }.password-field.auth-input-field button { position: static; width: 34px; height: 38px; flex: 0 0 auto; border-radius: 7px; }.secure-session { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); }.login-register-cta { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 11px; margin-top: 24px; padding: 15px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface); }.login-register-cta > span { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid rgba(var(--accent-rgb),.28); border-radius: 10px; color: var(--accent); background: rgba(var(--accent-rgb),.07); }.login-register-cta strong { display: block; font-size: 10px; }.login-register-cta p { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.5; }.login-register-cta > a { color: var(--accent); font-size: 9px; font-weight: 900; white-space: nowrap; }.login-privacy { display: flex; align-items: center; justify-content: center; gap: 5px; margin-top: 16px; color: var(--muted-2); font-size: 8px; }
.appearance-panel { grid-column: 1/-1; }.theme-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.theme-choice { position: relative; cursor: pointer; }.theme-choice > input { position: absolute; width: 1px; min-height: 1px; opacity: 0; }.theme-choice > span { display: grid; grid-template-columns: 115px minmax(0,1fr); grid-template-rows: auto auto; column-gap: 15px; align-items: center; padding: 14px; border: 2px solid var(--border); border-radius: 12px; background: var(--surface); transition: .16s ease; }.theme-choice > input:checked + span { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.08); }.theme-choice i { grid-row: 1/3; height: 72px; display: grid; grid-template-columns: 25px 1fr; grid-template-rows: 18px 1fr; gap: 5px; overflow: hidden; padding: 7px; border: 1px solid #d8dde3; border-radius: 8px; background: #f4f6f8; }.theme-choice i b { display: block; border-radius: 3px; background: #dce2e8; }.theme-choice i b:first-child { grid-row: 1/3; background: #24282d; }.theme-choice i b:nth-child(2) { background: #fff; }.theme-choice i b:nth-child(3) { background: #fff; }.theme-choice.dark-choice i { border-color: #343a41; background: #0c0e10; }.theme-choice.dark-choice i b { background: #20242a; }.theme-choice.dark-choice i b:first-child { background: #08090a; }.theme-choice strong,.theme-choice small { display: block; }.theme-choice strong { align-self: end; font-size: 13px; }.theme-choice small { align-self: start; margin-top: 5px; color: var(--muted); font-size: 9px; }

.install-page { background: #08090a; }
.install-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(330px, .72fr) minmax(620px, 1.28fr); }
.install-aside { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 46px clamp(32px, 4vw, 65px); border-right: 1px solid var(--border-soft); background: radial-gradient(circle at 25% 35%, rgba(var(--accent-rgb), .16), transparent 34%), #0a0b0d; }
.install-aside::after { content: ""; position: absolute; width: 350px; height: 350px; right: -210px; bottom: 12%; border: 1px solid rgba(var(--accent-rgb), .18); border-radius: 50%; box-shadow: 0 0 0 60px rgba(var(--accent-rgb), .03), 0 0 0 120px rgba(var(--accent-rgb), .02); }
.install-logo { position: relative; width: 220px; height: 112px; object-fit: contain; object-position: left top; }
.install-aside > div { position: relative; }
.install-aside h1 { max-width: 530px; font-size: clamp(35px, 3.6vw, 57px); line-height: 1.03; }
.install-aside p { max-width: 480px; margin-top: 18px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.install-benefits { position: relative; display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; color: #c8cdd3; font-size: 10px; }
.install-benefits li::first-letter { color: var(--accent); }
.install-card { min-height: 100vh; padding: 55px clamp(38px, 5vw, 85px); background: #0d0f11; }
.install-heading { max-width: 720px; margin-bottom: 25px; }
.install-heading > span { color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.install-heading h2 { margin: 8px 0; font-size: 27px; }.install-heading p { color: var(--muted); font-size: 11px; line-height: 1.6; }
.requirements { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 25px; }
.requirement { padding: 6px 9px; border: 1px solid var(--border); border-radius: 6px; color: var(--muted); background: var(--surface); font-size: 8px; font-weight: 700; }
.requirement.passed { color: #79dc94; border-color: rgba(68,207,115,.22); }.requirement.failed { color: #ff8d8d; border-color: rgba(240,87,87,.28); }
.install-form { max-width: 820px; display: grid; gap: 20px; }
.install-form fieldset { margin: 0; padding: 20px; border: 1px solid var(--border); border-radius: 12px; background: #121416; }
.install-form legend { padding: 0 8px; color: #fff; font-size: 11px; font-weight: 800; }
.install-form .form-grid { margin-top: 4px; }
.check-row { display: grid !important; grid-template-columns: 18px 1fr; align-items: start; gap: 11px !important; padding: 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); cursor: pointer; }
.check-row input { width: 17px; min-height: 17px; margin-top: 2px; accent-color: var(--accent); }
.check-row strong, .check-row small { display: block; }.check-row small { margin-top: 4px; color: var(--muted); }
.install-success { min-height: calc(100vh - 110px); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.success-mark { width: 70px; height: 70px; display: grid; place-items: center; margin-bottom: 20px; border: 1px solid rgba(68,207,115,.34); border-radius: 50%; color: var(--success); background: rgba(68,207,115,.09); font-size: 30px; }
.install-success h2 { font-size: 29px; }.install-success p { max-width: 520px; margin: 12px 0 22px; color: var(--muted); font-size: 12px; line-height: 1.7; }

.error-page { display: grid; place-items: center; padding: 30px; }
.error-page main { max-width: 590px; text-align: center; }
.error-page img { width: 240px; height: 130px; margin: 0 auto 20px; object-fit: contain; }
.error-page main > span { color: var(--accent); font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.error-page h1 { margin: 10px 0; font-size: 35px; }.error-page p { margin-bottom: 22px; color: var(--muted); font-size: 12px; line-height: 1.7; }

.print-page { color: #16181a; background: #e8eaed; font-family: Arial, sans-serif; }
.print-actions { padding: 18px; text-align: center; }
.print-actions button { padding: 11px 18px; border: 0; border-radius: 7px; color: #fff; background: #ff4b00; font-weight: 700; cursor: pointer; }
.print-invoice { width: 210mm; min-height: 297mm; margin: 0 auto 30px; padding: 18mm; background: #fff; box-shadow: 0 15px 60px rgba(0,0,0,.15); }
.print-invoice > header { display: flex; justify-content: space-between; padding-bottom: 17mm; border-bottom: 1px solid #e2e4e7; }
.print-invoice > header img { width: 62mm; height: 27mm; object-fit: contain; object-position: left top; }
.print-invoice > header div { text-align: right; }.print-invoice > header h1 { color: #ff4b00; font-size: 12px; letter-spacing: .15em; }.print-invoice > header strong { display: block; margin: 5px 0; font-size: 20px; }.print-invoice > header p { color: #6e747b; font-size: 10px; line-height: 1.6; }
.print-parties { display: grid; grid-template-columns: 1fr 1fr; gap: 30mm; padding: 13mm 0; }
.print-parties span { display: block; margin-bottom: 6px; color: #ff4b00; font-size: 8px; font-weight: 800; letter-spacing: .1em; }.print-parties strong { font-size: 12px; }.print-parties p { margin-top: 5px; color: #60666d; font-size: 9px; line-height: 1.6; }
.print-invoice table { border: 1px solid #e2e4e7; }.print-invoice th { color: #6e747b; background: #f4f5f6; }.print-invoice td { color: #33373b; border-color: #e2e4e7; }
.print-invoice footer { display: grid; grid-template-columns: 1fr 65mm; gap: 15mm; margin-top: 10mm; }.print-invoice footer dl { display: grid; grid-template-columns: 1fr auto; gap: 8px 15px; margin: 0; font-size: 10px; }.print-invoice footer dt:last-of-type, .print-invoice footer dd:last-of-type { padding-top: 8px; border-top: 1px solid #dfe2e5; font-size: 15px; font-weight: 800; }.print-invoice footer dd { margin: 0; text-align: right; }

/* Thème clair — appliqué à l’ensemble du portail, de la boutique et de l’authentification. */
html[data-theme="light"] body { color: var(--text); background: var(--bg); }
html[data-theme="light"] .sidebar { background: linear-gradient(180deg,#fff,#f7f9fb); box-shadow: 8px 0 30px rgba(42,51,61,.04); }
html[data-theme="light"] .nav-label { color: #8994a0; }
html[data-theme="light"] .nav-item { color: #56616d; }
html[data-theme="light"] .nav-item:hover { color: #171a1e; background: #eef2f5; }
html[data-theme="light"] .nav-item.active { color: #d84000; background: linear-gradient(90deg,rgba(var(--accent-rgb),.13),rgba(var(--accent-rgb),.035)); }
html[data-theme="light"] .sidebar-support { background: linear-gradient(145deg,#fff7f2,#fff); }
html[data-theme="light"] .avatar { color: #fff; border-color: #303843; background: #20252b; }
html[data-theme="light"] .topbar { background: rgba(255,255,255,.9); box-shadow: 0 8px 30px rgba(31,39,48,.04); }
html[data-theme="light"] .global-search { color: var(--muted); background: #fff; }
html[data-theme="light"] .global-search input::placeholder { color: #929ba6; }
html[data-theme="light"] .icon-button { color: #596470; }
html[data-theme="light"] .icon-button:hover { color: #171a1e; background: #edf1f4; }
html[data-theme="light"] .topbar-user,html[data-theme="light"] .theme-toggle { background: #fff; }
html[data-theme="light"] .button.outline { border-color: #cbd2d9; }
html[data-theme="light"] .button.outline:hover { color: var(--accent); background: rgba(var(--accent-rgb),.055); }
html[data-theme="light"] .button.ghost { color: #48535f; background: #f0f3f6; }
html[data-theme="light"] .button.ghost:hover { color: #171a1e; border-color: #b9c1ca; }
html[data-theme="light"] .alert.success { color: #176b32; border-color: #bfe5ca; background: #effaf2; }
html[data-theme="light"] .alert.warning { color: #875600; border-color: #ecd39e; background: #fff8e9; }
html[data-theme="light"] .alert.danger { color: #a52d2d; border-color: #efc5c5; background: #fff2f2; }
html[data-theme="light"] .panel,html[data-theme="light"] .stat-card,html[data-theme="light"] .service-card { background: #fff; box-shadow: 0 8px 28px rgba(33,42,52,.045); }
html[data-theme="light"] .stat-icon,html[data-theme="light"] .service-type-icon { color: #343c45; border-color: #d4dae1; background: linear-gradient(145deg,#fff,#edf1f4); }
html[data-theme="light"] .usage-line > span,html[data-theme="light"] .card-usage > span { background: #e5e9ed; }
html[data-theme="light"] .card-usage > div strong,html[data-theme="light"] .service-notes p,html[data-theme="light"] .message-body p,html[data-theme="light"] .invoice-totals > div p { color: #4b5662; }
html[data-theme="light"] .data-list > a:hover strong { color: #171a1e; }
html[data-theme="light"] .badge { color: #56616d; border-color: #ccd3da; background: #f4f6f8; }
html[data-theme="light"] .badge.success { color: #187b3a; }html[data-theme="light"] .badge.warning { color: #9a6108; }html[data-theme="light"] .badge.danger { color: #b62d2d; }
html[data-theme="light"] .filter-tabs a.active { color: #171a1e; }
html[data-theme="light"] th { color: #687481; background: #f4f6f8; }
html[data-theme="light"] td { color: #495560; }
html[data-theme="light"] td strong { color: #171a1e; }
html[data-theme="light"] tbody tr:hover { background: #f8fafb; }
html[data-theme="light"] .invoice-totals .grand,html[data-theme="light"] .cart-summary dt:last-of-type,html[data-theme="light"] .cart-summary dd:last-of-type,html[data-theme="light"] .order-detail-main > footer dt:last-of-type,html[data-theme="light"] .order-detail-main > footer dd:last-of-type { color: #171a1e; }
html[data-theme="light"] .primary-support,html[data-theme="light"] .payment-panel { background: linear-gradient(110deg,rgba(var(--accent-rgb),.09),#fff 58%); }
html[data-theme="light"] .form-grid label,html[data-theme="light"] .auth-form label,html[data-theme="light"] .reply-box label,html[data-theme="light"] .invoice-item-row label { color: #45515d; }
html[data-theme="light"] input,html[data-theme="light"] select,html[data-theme="light"] textarea { color: #171a1e; border-color: #cfd6dd; background: #fff; }
html[data-theme="light"] input:disabled { color: #7d8792; background: #eef1f4; }
html[data-theme="light"] .message.staff .message-body { background: linear-gradient(135deg,rgba(var(--accent-rgb),.065),#fff 48%); }
html[data-theme="light"] .invoice-editor { background: #f4f6f8; }
html[data-theme="light"] .sticky-save { background: rgba(255,255,255,.96); box-shadow: 0 18px 55px rgba(35,43,52,.14); }
html[data-theme="light"] .provider-mark { color: #303942; background: #f0f3f6; }
html[data-theme="light"] .linked-provider,html[data-theme="light"] .paid-confirmation { color: #187b3a; }
html[data-theme="light"] .commerce-admin-summary article > span { border-color: #d4dae1; background: #f2f4f7; }
html[data-theme="light"] .switch { color: #4a5560; }
html[data-theme="light"] .switch > span { border-color: #c7ced6; background: #e8ecf0; }

html[data-theme="light"] .store-body { background: #f6f7f9; }
html[data-theme="light"] .store-header { border-color: #e1e5e9; background: rgba(255,255,255,.92); box-shadow: 0 8px 30px rgba(35,43,51,.05); }
html[data-theme="light"] .store-header > nav a { color: #606b77; }
html[data-theme="light"] .store-header > nav a:hover,html[data-theme="light"] .store-header > nav a.active { color: #171a1e; background: #eef1f4; }
html[data-theme="light"] .store-login-link { color: #414c57; }
html[data-theme="light"] .store-cart-link { color: #46515c; border-color: #d4dae0; background: #fff; }
html[data-theme="light"] .store-cart-link:hover,html[data-theme="light"] .store-cart-link.active { color: #171a1e; }
html[data-theme="light"] .store-cart-link em { border-color: #fff; }
html[data-theme="light"] .store-hero::after { background: radial-gradient(ellipse,rgba(var(--accent-rgb),.11),transparent 67%); }
html[data-theme="light"] .store-hero-copy > p { color: #66727f; }
html[data-theme="light"] .store-trust { color: #687480; }
html[data-theme="light"] .store-hero-panel { border-color: #d7dde3; background: linear-gradient(145deg,#fff7f2,#fff 50%,#f3f5f7); box-shadow: 0 30px 70px rgba(35,43,51,.11); }
html[data-theme="light"] .store-hero-panel p { border-color: #e2e6ea; }
html[data-theme="light"] .store-hero-panel p span { color: #3f4a55; }
html[data-theme="light"] .store-value-grid { border-color: #d9dfe5; background: #d9dfe5; }
html[data-theme="light"] .store-value-grid article { background: #fff; }
html[data-theme="light"] .store-value-grid article > span { border-color: #d6dce2; background: #f3f5f7; }
html[data-theme="light"] .store-section-heading nav { border-color: #d5dbe1; background: #fff; }
html[data-theme="light"] .store-section-heading nav a.active { color: #171a1e; background: #e9edf1; }
html[data-theme="light"] .store-product { border-color: #d8dee4; background: linear-gradient(150deg,#fff,#f6f7f9); box-shadow: 0 12px 35px rgba(37,45,54,.055); }
html[data-theme="light"] .store-product.featured { background: linear-gradient(145deg,rgba(var(--accent-rgb),.09),#fff 30%,#fafbfc); }
html[data-theme="light"] .store-product li { color: #46515c; }
html[data-theme="light"] .product-price small { color: #66717c; }
html[data-theme="light"] .store-empty,html[data-theme="light"] .cart-empty,html[data-theme="light"] .product-detail-grid > article,html[data-theme="light"] .cart-items article,html[data-theme="light"] .checkout-account { border-color: #d7dde3; background: #fff; }
html[data-theme="light"] .cart-empty > span,html[data-theme="light"] .cart-product-icon { border-color: #d6dce2; background: #f2f4f6; }
html[data-theme="light"] .store-cta { background: radial-gradient(circle at 92% 25%,rgba(var(--accent-rgb),.18),transparent 32%),linear-gradient(125deg,rgba(var(--accent-rgb),.1),#fff 55%,#f2f4f6); }
html[data-theme="light"] .store-cta p { color: #596570; }
html[data-theme="light"] .store-footer { border-color: #e1e5e9; background: #fff; }
html[data-theme="light"] .store-footer nav a:hover { color: #171a1e; }
html[data-theme="light"] .product-detail-grid > article h2,html[data-theme="light"] .product-detail-grid li { color: #48535f; }
html[data-theme="light"] .product-detail-grid > aside,html[data-theme="light"] .cart-summary { background: linear-gradient(145deg,rgba(var(--accent-rgb),.07),#fff 42%,#f5f7f9); }
html[data-theme="light"] .checkout-configuration label { color: #303a44; }

html[data-theme="light"] .auth-page { background: #f2f4f7; }
html[data-theme="light"] .auth-visual { border-color: #dde2e7; background: radial-gradient(circle at 13% 23%,rgba(var(--accent-rgb),.12),transparent 34%),linear-gradient(145deg,#fff,#eef2f5 70%); }
html[data-theme="light"] .auth-copy p { color: #5e6a76; }
html[data-theme="light"] .auth-proof-grid article { border-color: #d9dfe5; background: rgba(255,255,255,.7); }
html[data-theme="light"] .auth-proof-grid span { color: #66727e; }
html[data-theme="light"] .auth-trust { color: #5c6874; }
html[data-theme="light"] .auth-panel { background: #fff; }
html[data-theme="light"] .auth-input-field { color: #687480; border-color: #cfd6dd; background: #fff; }
html[data-theme="light"] .auth-input-field > input { background: transparent; }
html[data-theme="light"] .auth-theme-control .theme-toggle { background: rgba(255,255,255,.9); }
html[data-theme="light"] .login-register-cta { background: #f7f9fa; }

@media (max-width: 1320px) {
  :root { --sidebar: 230px; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bottom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bottom-grid > :last-child { grid-column: 1 / -1; }
  .service-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-results { grid-template-columns: 1fr 1fr; }
  .store-header { grid-template-columns: 200px 1fr auto; gap: 14px; padding-inline: 25px; }
  .store-header > nav a { padding-inline: 8px; }
  .store-products { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 1020px) {
  :root { --sidebar: 270px; }
  .app-shell { display: block; }
  .main-column { grid-column: auto; }
  .integration-status-grid { grid-template-columns: 1fr; }
  .store-header { grid-template-columns: 1fr auto; }.store-header > nav { display: none; }
  .store-hero { grid-template-columns: 1fr; gap: 35px; padding-top: 55px; }.store-hero-panel { min-height: auto; }
  .store-value-grid { margin-bottom: 75px; }
  .store-section-heading { align-items: flex-start; flex-direction: column; }
  .cart-layout,.checkout-layout,.product-detail-grid { grid-template-columns: 1fr; }.cart-summary,.product-detail-grid > aside { position: static; }
  .order-detail-layout { grid-template-columns: 1fr; }
  .sidebar { transform: translateX(-102%); transition: transform .22s ease; box-shadow: 30px 0 70px rgba(0,0,0,.4); }
  .menu-open .sidebar { transform: translateX(0); }
  .sidebar-backdrop { z-index: 25; position: fixed; inset: 0; display: block; visibility: hidden; opacity: 0; background: rgba(0,0,0,.62); transition: .2s ease; }
  .menu-open .sidebar-backdrop { visibility: visible; opacity: 1; }
  .menu-open { overflow: hidden; }
  .menu-button, .mobile-only { display: inline-grid; }
  .sidebar-brand { justify-content: space-between; }
  .topbar { padding: 0 18px; }
  .service-overview-grid, .detail-grid, .form-layout, .profile-grid, .conversation-layout { grid-template-columns: 1fr; }
  .detail-aside, .form-help { display: grid; grid-template-columns: 1fr 1fr; }
  .ticket-sidebar { grid-row: 1; }
  .auth-shell { grid-template-columns: .8fr 1.2fr; }
  .auth-visual { padding: 35px; }
  .auth-copy h1 { font-size: 41px; }
  .install-shell { grid-template-columns: 1fr; }
  .install-aside { position: relative; height: auto; min-height: 420px; }
  .install-card { padding: 40px 28px; }
}

@media (max-width: 760px) {
  .content { padding: 22px 15px 32px; }
  .topbar { height: 62px; gap: 8px; padding: 0 12px; }
  .global-search { width: auto; min-width: 0; flex: 1; }
  .global-search input::placeholder { color: transparent; }
  .desktop-user { display: none; }
  .topbar-user { padding: 3px; border: 0; background: transparent; }
  .topbar-actions { gap: 1px; }
  .page-heading { align-items: flex-start; flex-direction: column; margin-bottom: 20px; }
  .page-actions { width: 100%; }
  .page-actions .button { width: 100%; }
  .integration-card > header, .payment-panel, .sticky-save { align-items: stretch; flex-direction: column; }
  .integration-card > header { gap: 15px; }.switch { width: max-content; }
  .integration-actions, .payment-buttons { flex-direction: column; }.integration-actions .button, .payment-buttons .button, .payment-buttons form { width: 100%; }
  .inventory-grid { grid-template-columns: 1fr; }.inventory-grid > div + div { border-top: 1px solid var(--border-soft); border-left: 0; }
  .store-header { min-height: 66px; padding: 0 15px; }.store-brand img { width: 125px; height: 52px; }.store-account-actions { gap: 5px; }.store-login-link,.store-cart-link span,.store-account-actions .button { display: none; }.store-cart-link { width: 41px; height: 41px; justify-content: center; padding: 0; }
  .store-main { padding-inline: 18px; padding-bottom: 40px; }.store-hero { min-height: 0; padding: 50px 0; }.store-hero-copy h1 { font-size: 43px; }.store-hero-copy > p { font-size: 12px; }.store-hero-actions { align-items: stretch; flex-direction: column; }.store-trust { gap: 12px; }.store-hero-panel { padding: 25px; border-radius: 16px; }.store-hero-panel h2 { font-size: 31px; }
  .store-value-grid { grid-template-columns: 1fr; margin-bottom: 65px; }.store-value-grid article { min-height: 105px; }
  .store-offers { padding-bottom: 70px; }.store-section-heading h2 { font-size: 34px; }.store-section-heading nav { width: 100%; overflow-x: auto; }.store-products { grid-template-columns: 1fr; }.store-product { min-height: 0; padding: 23px; }.store-cta { align-items: stretch; flex-direction: column; padding: 30px 25px; }.store-footer { grid-template-columns: 1fr; gap: 18px; text-align: center; }.store-footer img { margin: auto; object-position: center; }.store-footer nav { justify-content: center; }
  .product-detail-page,.cart-page,.checkout-page { padding-top: 35px; }.product-detail-grid > article { padding: 24px; }.product-detail-grid ul { grid-template-columns: 1fr; }.cart-items article { grid-template-columns: 44px minmax(0,1fr) 38px; }.cart-unit,.cart-line-price { grid-column: 2; text-align: left; }.cart-unit { text-align: left; }.cart-items article > .remove-line { grid-column: 3; grid-row: 1; }.cart-update { flex-direction: column-reverse; }.cart-update .button { width: 100%; }.checkout-account dl { grid-template-columns: 1fr; }.register-grid { grid-template-columns: 1fr; }.register-grid .full { grid-column: auto; }.commerce-admin-summary { grid-template-columns: 1fr; }.order-item { grid-template-columns: 42px minmax(0,1fr) auto; }.order-item > .badge { grid-column: 2/-1; width: max-content; }
  .stat-grid, .bottom-grid, .service-card-grid, .search-results { grid-template-columns: 1fr; }
  .bottom-grid > :last-child { grid-column: auto; }
  .stat-card { min-height: 112px; }
  .service-overview-grid { grid-template-columns: 1fr; }
  .compact-service { grid-template-columns: 7px minmax(0, 1fr) auto; padding: 8px 0; }
  .compact-service .button { grid-column: 2 / -1; width: 100%; }
  .service-health { min-width: 55px; }
  .summary-strip { grid-template-columns: 1fr; }
  .summary-strip > div { border-right: 0; border-bottom: 1px solid var(--border-soft); }
  .summary-strip > div:last-child { border-bottom: 0; }
  .support-intro-grid { grid-template-columns: 1fr; }
  .support-intro { align-items: flex-start; flex-wrap: wrap; }
  .support-intro .button { width: 100%; margin-left: 0; }
  .form-grid.two, .form-grid.three { grid-template-columns: 1fr; }
  .form-grid .span-two { grid-column: auto; }
  .form-actions { align-items: stretch; flex-direction: column-reverse; }
  .form-actions .button { width: 100%; }
  .form-help, .detail-aside { grid-template-columns: 1fr; }
  .detail-properties { grid-template-columns: 1fr; }.detail-properties > div:nth-child(odd) { border-right: 0; }
  .invoice-view { padding: 18px; }
  .invoice-head { flex-direction: column; }.invoice-head > div:last-child { width: 100%; text-align: left; }.invoice-head dl { width: max-content; }
  .invoice-totals { grid-template-columns: 1fr; gap: 25px; }
  .reply-actions { align-items: stretch; flex-direction: column; }.reply-actions label { width: 100%; margin-right: 0; }
  .message { grid-template-columns: 30px minmax(0, 1fr); gap: 8px; }.message-avatar { width: 30px; height: 30px; }.message-body { padding: 13px; }.message-body header { align-items: flex-start; flex-wrap: wrap; }.message-body time { width: 100%; margin-left: 0; }
  .app-footer { align-items: flex-start; flex-direction: column; padding-top: 17px; padding-bottom: 17px; }
  .app-footer span:last-child { flex-wrap: wrap; }
  .auth-shell { display: block; }
  .auth-visual { min-height: 280px; padding: 25px 22px; }
  .auth-logo { width: 178px; height: 82px; }
  .auth-copy h1 { font-size: 30px; }.auth-copy p { margin-top: 12px; font-size: 11px; }.auth-proof-grid,.auth-trust { display: none; }
  .auth-panel { min-height: calc(100vh - 280px); padding: 34px 20px; }
  .auth-form-heading h2 { font-size: 25px; }
  .auth-theme-control { top: 13px; right: 13px; }
  .login-back { margin-bottom: 25px; }
  .login-register-cta { grid-template-columns: 36px minmax(0,1fr); }
  .login-register-cta > span { width: 36px; height: 36px; }
  .login-register-cta > a { grid-column: 2; justify-self: start; }
  .theme-choice-grid { grid-template-columns: 1fr; }
  .theme-choice > span { grid-template-columns: 92px minmax(0,1fr); }
  .install-aside { min-height: 360px; padding: 28px 22px; }
  .install-logo { width: 180px; height: 90px; }.install-aside h1 { font-size: 33px; }.install-aside p { font-size: 11px; }
  .install-card { padding: 32px 17px; }
  .invoice-editor > header { align-items: stretch; flex-direction: column; }
  .invoice-item-row { grid-template-columns: 1fr 1fr 36px; }
  .invoice-item-row label:first-child { grid-column: 1 / -1; }
  .invoice-item-row .remove-line { grid-column: 3; grid-row: 2; }
  .install-form fieldset { padding: 16px; }
  .print-invoice { width: 100%; min-height: 0; margin: 0; padding: 22px; box-shadow: none; }
}

@media print {
  .print-page { background: #fff; }
  .print-actions { display: none; }
  .print-invoice { margin: 0; box-shadow: none; }
  @page { size: A4; margin: 0; }
}

/* Facturation avancée et automatisation v1.3 */
.store-addon-list { display: grid; gap: 8px; margin: 20px 0; padding: 0; border: 0; }
.store-addon-list legend { margin-bottom: 10px; color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.store-addon-option { min-height: 62px; display: grid; grid-template-columns: 20px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 10px; background: rgba(255,255,255,.025); cursor: pointer; }
.store-addon-option:hover { border-color: rgba(var(--accent-rgb),.45); background: rgba(var(--accent-rgb),.045); }
.store-addon-option input { width: 17px; height: 17px; accent-color: var(--accent); }
.store-addon-option > span:not(.addon-check),.store-addon-option strong,.store-addon-option small { display: block; }
.store-addon-option strong { font-size: 11px; }.store-addon-option small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.store-addon-option em { color: var(--accent); font-size: 10px; font-weight: 800; font-style: normal; white-space: nowrap; }
.addon-check { width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--accent); }
.required-addon { cursor: default; }.required-addon::after { content: "INCLUSE"; display: none; }
.product-config-form > .button { width: 100%; }
.cart-addon-summary { display: grid; gap: 4px; margin: 9px 0 0; padding: 0; color: var(--muted); font-size: 9px; list-style: none; }
.coupon-box { margin: 16px 0 4px; padding: 13px; border: 1px dashed var(--border); border-radius: 10px; background: rgba(255,255,255,.02); }
.coupon-box label { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.coupon-box label > div { display: flex; gap: 7px; margin-top: 7px; }.coupon-box input { min-width: 0; flex: 1; }
.coupon-box > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 11px; }
.text-button { padding: 0; border: 0; color: var(--accent); background: transparent; font-size: 10px; font-weight: 800; cursor: pointer; }
.discount-line { color: var(--success) !important; }
.coupon-applied { margin: 12px 0 0; padding: 9px 11px; border: 1px solid rgba(68,207,115,.25); border-radius: 8px; color: var(--success); background: rgba(68,207,115,.06); font-size: 10px; font-weight: 800; }
.order-addon-list { display: flex !important; flex-wrap: wrap; gap: 5px 10px; margin-top: 7px !important; color: var(--muted); }

.quote-decision { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 17px; padding: 20px; border-color: rgba(var(--accent-rgb),.3); }
.quote-decision > div:first-child { display: flex; align-items: center; gap: 13px; }.quote-decision > div:first-child > span { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--accent); }
.quote-decision strong { display: block; font-size: 13px; }.quote-decision p { margin-top: 5px; color: var(--muted); font-size: 10px; }
.quote-decision form { display: flex; gap: 8px; }
.subscription-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
.subscription-card { padding: 20px; }.subscription-card > header { display: grid; grid-template-columns: 45px minmax(0,1fr) auto; align-items: center; gap: 12px; padding-bottom: 17px; border-bottom: 1px solid var(--border-soft); }
.subscription-card .service-type-icon { width: 43px; height: 43px; }.subscription-card header small { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .1em; }.subscription-card h2 { margin-top: 4px; font-size: 16px; }
.subscription-card dl { display: grid; grid-template-columns: 1fr auto; gap: 12px 15px; margin: 18px 0; font-size: 10px; }.subscription-card dt { color: var(--muted); }.subscription-card dd { margin: 0; font-weight: 700; text-align: right; }
.subscription-actions { display: grid; gap: 8px; }.subscription-actions form { margin: 0; }.subscription-note { display: flex; align-items: center; gap: 7px; color: var(--success); font-size: 10px; }

.panel-title { min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 0 20px; border-bottom: 1px solid var(--border-soft); }
.panel-title span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.panel-title h2 { margin-top: 4px; font-size: 16px; }
.billing-admin-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(330px,.75fr); gap: 17px; margin-bottom: 17px; }
.billing-admin-grid > * { min-width: 0; }
.document-editor h2 { margin: 24px 0 13px; font-size: 16px; }
.document-lines { border: 1px solid var(--border-soft); border-radius: 10px; }.document-lines table { min-width: 840px; }.document-lines td { padding: 8px; }.document-lines td:first-child { min-width: 300px; }.document-lines input,.document-lines select,.addon-editor input,.addon-editor select { width: 100%; }
.document-lines input[type="number"] { min-width: 85px; }.document-lines select { min-width: 120px; }
.addon-editor td:first-child { min-width: 270px; }.addon-editor td:first-child input + input { margin-top: 6px; }.addon-editor input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--accent); }
.form-note { color: var(--muted); font-size: 10px; line-height: 1.6; }
.product-check-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 15px; border: 1px solid var(--border); border-radius: 10px; }
.product-check-grid legend { padding: 0 6px; color: var(--muted); font-size: 10px; font-weight: 800; }.product-check-grid label { display: flex; align-items: center; gap: 7px; font-size: 10px; }.product-check-grid input { width: 16px; height: 16px; accent-color: var(--accent); }
.coupon-code { display: inline-block; padding: 5px 8px; border: 1px dashed rgba(var(--accent-rgb),.45); border-radius: 6px; color: var(--accent); background: rgba(var(--accent-rgb),.06); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing: .06em; }

.automation-health { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; margin-bottom: 17px; }
.automation-health article { position: relative; min-height: 130px; padding: 20px; }.automation-health small,.automation-health strong { display: block; }.automation-health small { color: var(--muted); font-size: 9px; letter-spacing: .1em; }.automation-health strong { margin: 9px 0 6px; font-size: 18px; }.automation-health p { color: var(--muted); font-size: 10px; line-height: 1.5; }
.automation-status-dot { position: absolute; top: 19px; right: 19px; width: 8px; height: 8px; border-radius: 50%; background: var(--muted-2); box-shadow: 0 0 0 5px rgba(255,255,255,.025); }.automation-status-dot.active { background: var(--success); box-shadow: 0 0 0 5px rgba(68,207,115,.08); }
.automation-settings { margin: 0; }.danger-check { border-color: rgba(240,87,87,.28) !important; }
.cron-panel { padding: 22px; }.cron-panel .panel-title { margin: -22px -22px 20px; }.cron-panel p { margin: 15px 0 9px; color: var(--muted); font-size: 10px; line-height: 1.6; }.cron-panel code { display: block; overflow-x: auto; padding: 13px; border: 1px solid var(--border); border-radius: 9px; color: #ffc19f; background: #090a0b; font: 10px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; white-space: nowrap; }
.automation-timeline { padding: 21px; }.log-entry { position: relative; display: grid; grid-template-columns: 13px minmax(0,1fr); gap: 13px; padding: 0 0 22px; }.log-entry:last-child { padding-bottom: 0; }.log-entry::before { content:""; position: absolute; left: 5px; top: 12px; bottom: 0; width: 1px; background: var(--border); }.log-entry:last-child::before { display: none; }.log-entry > span { z-index: 1; width: 11px; height: 11px; margin-top: 3px; border: 2px solid var(--surface); border-radius: 50%; background: var(--muted-2); }.log-entry.success > span { background: var(--success); }.log-entry.warning > span { background: var(--warning); }.log-entry.error > span { background: var(--danger); }.log-entry header { display: flex; justify-content: space-between; gap: 15px; }.log-entry strong { font-size: 11px; }.log-entry time,.log-entry p { color: var(--muted); font-size: 9px; }.log-entry p { margin-top: 5px; }

.branding-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; }.branding-card { display: flex; flex-direction: column; gap: 18px; padding: 22px; }.branding-card header span { color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: .11em; }.branding-card h2 { margin: 5px 0; font-size: 19px; }.branding-card header p { color: var(--muted); font-size: 10px; }.brand-preview { min-height: 210px; display: grid; place-items: center; padding: 25px; border: 1px solid var(--border); border-radius: 12px; }.brand-preview img { width: min(290px,90%); max-height: 150px; object-fit: contain; }.dark-preview .brand-preview { background: #08090a; }.light-preview .brand-preview { background: #fff; }.branding-card > label { display: grid; gap: 7px; font-size: 11px; font-weight: 700; }.branding-card > label small { color: var(--muted); font-size: 9px; }.branding-actions { grid-column: 1/-1; display: flex; justify-content: flex-end; }.branding-actions .button { width: min(100%,360px); }

html[data-theme="light"] .store-addon-option,html[data-theme="light"] .coupon-box { background: #f8fafb; }
html[data-theme="light"] .store-addon-option:hover { background: #fff6f1; }
html[data-theme="light"] .cron-panel code { color: #b63800; border-color: #d8dde3; background: #f4f6f8; }
html[data-theme="light"] .log-entry > span { border-color: #fff; }

@media (max-width: 1180px) {
  .subscription-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .automation-health { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .billing-admin-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .subscription-grid,.automation-health,.branding-grid { grid-template-columns: 1fr; }
  .branding-actions { grid-column: auto; }
  .quote-decision { align-items: stretch; flex-direction: column; }.quote-decision form { flex-direction: column-reverse; }.quote-decision .button { width: 100%; }
  .product-check-grid { grid-template-columns: 1fr; }
  .store-addon-option { grid-template-columns: 20px minmax(0,1fr); }.store-addon-option em { grid-column: 2; white-space: normal; }
  .coupon-box label > div { align-items: stretch; flex-direction: column; }.coupon-box .button { width: 100%; }
  .subscription-card > header { grid-template-columns: 43px minmax(0,1fr); }.subscription-card > header .badge { grid-column: 2; width: max-content; }
  .page-actions form,.page-actions form .button { width: 100%; }
  .brand-preview { min-height: 160px; }
}

/* CODE STREAM 360 v1.4 */
.admin-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.admin-quick-grid a{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid var(--border);border-radius:14px;text-decoration:none;color:inherit;background:var(--panel)}.admin-quick-grid a:hover{border-color:var(--accent);transform:translateY(-1px)}.admin-quick-grid small{color:var(--muted)}
.admin-platform-form{display:grid;gap:18px}.domain-check-button{margin-top:10px;border:1px solid var(--border);background:transparent;color:inherit;border-radius:9px;padding:8px 12px;font-weight:700;cursor:pointer}.domain-check-result{display:block;margin-top:8px;font-size:13px;font-weight:700}.domain-check-result[data-state="available"]{color:#16a34a}.domain-check-result[data-state="taken"]{color:#dc2626}.domain-check-result[data-state="unknown"]{color:#d97706}
.ticket-attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.ticket-attachments a{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid var(--border);border-radius:9px;text-decoration:none;color:inherit;font-size:13px}.reply-attachment{display:flex;flex-direction:column;gap:6px;font-size:13px;margin-top:10px}.reply-attachment input{max-width:100%}
.status-page{max-width:900px;margin:0 auto;padding:42px 20px 70px}.status-page>header{text-align:center;margin-bottom:28px}.status-page>header span{font-weight:800;color:var(--accent);letter-spacing:.08em}.status-page>header h1{font-size:clamp(30px,5vw,48px);margin:8px 0}.status-list{display:grid;gap:10px}.status-list article{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;border:1px solid var(--border);border-radius:14px;background:var(--panel)}.status-list article div{display:flex;flex-direction:column;gap:4px}.status-list article small{color:var(--muted)}.status-dot{font-size:12px;font-weight:800;padding:7px 10px;border-radius:999px}.status-dot.operational{background:rgba(22,163,74,.12);color:#16a34a}.status-dot.degraded{background:rgba(220,38,38,.12);color:#dc2626}.status-dot.not_configured{background:rgba(120,120,120,.12);color:var(--muted)}
@media(max-width:760px){.admin-quick-grid{grid-template-columns:1fr}.status-list article{align-items:flex-start;flex-direction:column}.status-dot{align-self:flex-start}}

/* CODE STREAM 360 v1.5 */
.maintenance-banner{display:flex;align-items:center;justify-content:center;gap:12px;min-height:42px;padding:9px 18px;background:rgba(245,158,11,.11);border-bottom:1px solid rgba(245,158,11,.28);font-size:11px}.maintenance-banner strong{color:#f59e0b;letter-spacing:.08em}.maintenance-banner span{color:var(--text)}.maintenance-banner a{color:var(--accent);font-weight:800;text-decoration:none}.status-history-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}.status-history-grid .panel{padding:0 20px 20px}.status-event{padding:16px 0;border-bottom:1px solid var(--border-soft)}.status-event:last-child{border-bottom:0}.status-event strong{display:inline-block;margin-right:8px}.status-event p{margin:8px 0;color:var(--muted);font-size:11px;line-height:1.6}.status-event small{color:var(--muted);font-size:9px}.maintenance-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid var(--border-soft)}.maintenance-row:last-child{border-bottom:0}.maintenance-row div{display:flex;flex-direction:column;gap:5px}.maintenance-row small{color:var(--muted)}.status-service-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0 18px}
@media(max-width:760px){.maintenance-banner{align-items:flex-start;flex-direction:column;gap:4px}.status-history-grid,.status-service-checks{grid-template-columns:1fr}}