/* ParsAbr theme for WHMCS, built on the Pars Abr "X-mono" design kit (portal-kit: DESIGN-SYSTEM.md,
   tokens.css, reference-ts). No brand hue in the interface: hierarchy comes from luminance, weight and
   elevation, and colour only means status. The second token block maps the parent theme's variables
   onto the kit tokens so inherited templates restyle without being copied. */

@font-face { font-family: "Peyda"; font-weight: 400; font-display: swap; src: url(../fonts/PeydaWeb-Regular.woff2) format("woff2"); }
@font-face { font-family: "Peyda"; font-weight: 500; font-display: swap; src: url(../fonts/PeydaWeb-Medium.woff2) format("woff2"); }
@font-face { font-family: "Peyda"; font-weight: 600; font-display: swap; src: url(../fonts/PeydaWeb-SemiBold.woff2) format("woff2"); }
@font-face { font-family: "Peyda"; font-weight: 700; font-display: swap; src: url(../fonts/PeydaWeb-Bold.woff2) format("woff2"); }
@font-face { font-family: "Peyda"; font-weight: 800; font-display: swap; src: url(../fonts/PeydaWeb-ExtraBold.woff2) format("woff2"); }
@font-face { font-family: "Peyda"; font-weight: 900; font-display: swap; src: url(../fonts/PeydaWeb-Black.woff2) format("woff2"); }

/* ---------- Tokens (kit tokens.css; light is the default, dark by attribute or OS) ---------- */
:root {
  --radius: 1rem; --radius-panel: 24px; --radius-sm: .8rem; --radius-input: .75rem; --radius-pill: 999px;
  --sec-pad: clamp(56px, 8vw, 104px); --head-h: 60px; --gutter: 24px;
  --ease: cubic-bezier(.2, .7, .3, 1);
  --font: "Peyda", "Vazirmatn", Tahoma, sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --ink-bg: linear-gradient(135deg, #1b1b1f, #0c0c0e 55%, #000);
  --text-on-ink: #e7e9ea; --text-2-on-ink: #767b85; --line-ink: rgba(255,255,255,.10);

  color-scheme: light;
  --paper: #eef1f4; --white: #ffffff; --input: #e8ecef;
  --line: rgba(15,20,25,.14); --line-soft: rgba(15,20,25,.09); --hair-2: rgba(15,20,25,.28);
  --text: #0f1419; --text-2: #49555e; --faint: #98a2ad; --strong: #0f1419;
  --ok: #15803d; --warn: #b45309; --danger: #e11d48;
  --btn-grad: linear-gradient(180deg, #30343a, #0f1113); --btn-fg: #fff; --btn-solid-hover: #24292f;
  --btn-glow: 0 10px 22px -14px rgba(15,20,25,.5);
  --ghost-bg: linear-gradient(180deg, rgba(15,20,25,.07), rgba(15,20,25,.02));
  --ghost-border: rgba(15,20,25,.13); --ghost-inset: inset 0 1px 0 rgba(255,255,255,.85);
  --header-glass: rgba(255,255,255,.78); --chip-bg: rgba(15,20,25,.06); --nav-hover: rgba(15,20,25,.07);
  --sel: rgba(15,20,25,.16); --grid-line: rgba(15,20,25,.07);
  --shadow-card: 0 1px 3px rgba(15,20,25,.08);
  --shadow-lift: 0 1px 2px rgba(15,20,25,.05), 0 10px 26px -16px rgba(15,20,25,.18);
  --shadow-pop: 0 1px 2px rgba(15,20,25,.06), 0 22px 44px -18px rgba(15,20,25,.3);
  --scroll-thumb: #c9ccd1;
}
:root[data-theme=dark] {
  color-scheme: dark;
  --paper: #000; --white: #0a0a0b; --input: #121214;
  --line: rgba(255,255,255,.10); --line-soft: rgba(255,255,255,.07); --hair-2: rgba(255,255,255,.18);
  --text: #e7e9ea; --text-2: #767b85; --faint: #494e56; --strong: #fff;
  --ok: #4ade80; --warn: #fbbf24; --danger: #fb7185;
  --btn-grad: linear-gradient(180deg, #fff, #dfe2e5); --btn-fg: #000; --btn-solid-hover: #eceef0;
  --btn-glow: 0 0 0 1px rgba(255,255,255,.06), 0 10px 26px -14px rgba(255,255,255,.28);
  --ghost-bg: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.07));
  --ghost-border: rgba(255,255,255,.14); --ghost-inset: inset 0 1px 0 rgba(255,255,255,.12);
  --header-glass: rgba(0,0,0,.65); --chip-bg: rgba(255,255,255,.045); --nav-hover: rgba(255,255,255,.10);
  --sel: rgba(255,255,255,.18); --grid-line: rgba(255,255,255,.045);
  --shadow-card: inset 0 1px 0 rgba(255,255,255,.04);
  --shadow-lift: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 30px -18px rgba(0,0,0,.85);
  --shadow-pop: inset 0 1px 0 rgba(255,255,255,.06), 0 24px 48px -16px rgba(0,0,0,.9);
  --scroll-thumb: #26262a;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) {
    color-scheme: dark;
    --paper: #000; --white: #0a0a0b; --input: #121214;
    --line: rgba(255,255,255,.10); --line-soft: rgba(255,255,255,.07); --hair-2: rgba(255,255,255,.18);
    --text: #e7e9ea; --text-2: #767b85; --faint: #494e56; --strong: #fff;
    --ok: #4ade80; --warn: #fbbf24; --danger: #fb7185;
    --btn-grad: linear-gradient(180deg, #fff, #dfe2e5); --btn-fg: #000; --btn-solid-hover: #eceef0;
    --btn-glow: 0 0 0 1px rgba(255,255,255,.06), 0 10px 26px -14px rgba(255,255,255,.28);
    --ghost-bg: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.07));
    --ghost-border: rgba(255,255,255,.14); --ghost-inset: inset 0 1px 0 rgba(255,255,255,.12);
    --header-glass: rgba(0,0,0,.65); --chip-bg: rgba(255,255,255,.045); --nav-hover: rgba(255,255,255,.10);
    --sel: rgba(255,255,255,.18); --grid-line: rgba(255,255,255,.045);
    --shadow-card: inset 0 1px 0 rgba(255,255,255,.04);
    --shadow-lift: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 30px -18px rgba(0,0,0,.85);
    --shadow-pop: inset 0 1px 0 rgba(255,255,255,.06), 0 24px 48px -16px rgba(0,0,0,.9);
    --scroll-thumb: #26262a;
  }
}
@media (max-width: 700px) { :root { --head-h: 54px; --gutter: 16px; } }

/* Derived from the theme tokens above (focus = 45% of the text colour, soft fills for status) */
:root {
  --hair-focus: color-mix(in srgb, var(--text) 45%, transparent);
  --ring: color-mix(in srgb, var(--text) 12%, transparent);
  --ok-soft: color-mix(in srgb, var(--ok) 12%, transparent);
  --warn-soft: color-mix(in srgb, var(--warn) 12%, transparent);
  --danger-soft: color-mix(in srgb, var(--danger) 12%, transparent);
}

/* ---------- Parent (Nexus / twenty-one) variables mapped onto the tokens ---------- */
:root {
  --bg: var(--white); --bg-muted: var(--paper); --bg-lifted: var(--input); --bg-accented: var(--chip-bg); --bg-inverted: var(--strong);
  --text-muted: var(--text-2); --text-lifted: var(--text-2); --text-accented: var(--text); --text-inverted: var(--btn-fg);
  --border-muted: var(--line); --border: var(--hair-2); --border-lifted: var(--hair-2); --border-accented: var(--text-2);
  --primary: var(--strong); --primary-lifted: var(--btn-solid-hover); --primary-accented: var(--btn-solid-hover);
  --secondary: var(--text-2); --secondary-lifted: var(--text); --secondary-accented: var(--text);
  --grayscale: var(--strong); --grayscale-lifted: var(--text); --grayscale-accented: var(--text-2);
  --neutral: var(--text-2); --neutral-lifted: var(--text); --neutral-accented: var(--text);
  --success: var(--ok); --success-lifted: var(--ok); --success-accented: var(--ok);
  --warning: var(--warn); --warning-lifted: var(--warn); --warning-accented: var(--warn);
  --error: var(--danger); --error-lifted: var(--danger); --error-accented: var(--danger);
  /* the kit allows no blue or violet: "info" and "notice" are neutral */
  --info: var(--text-2); --info-lifted: var(--text); --info-accented: var(--text);
  --notice: var(--text-2); --notice-lifted: var(--text); --notice-accented: var(--text);
  --rounding-sm: .5rem; --rounding-md: var(--radius-sm); --rounding-lg: var(--radius);
  --text-xs: .7rem; --text-sm: .8rem; --text-md: .9rem; --text-lg: 1rem;
  --letter-spacing: 0; --disabled-opacity: 35%;
  --outline-sm: 1px; --outline-md: 2px; --outline-lg: 3px;
}

/* ---------- Base ---------- */
html, body { direction: rtl; }
html { background: var(--paper); scroll-padding-top: calc(var(--head-h) + 24px); }
body {
  background: var(--paper); color: var(--text);
  font-family: var(--font); font-weight: 400; font-size: 16px; line-height: 1.9;
  font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  transition: background-color .25s var(--ease), color .25s var(--ease);
}
body, body h1, body h2, body h3, body h4, body h5, body h6, body p, body a, body li, body button,
body input, body select, body textarea, body .btn, body .tooltip, body .popover { font-family: var(--font); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: var(--strong); line-height: 1.45; }
h1, .h1, h2, .h2 { font-weight: 800; letter-spacing: -.02em; }
h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-weight: 700; }
a { color: var(--strong); }
a:hover { color: var(--text); }
code, kbd, pre, samp, .pt-mono { font-family: var(--mono); direction: ltr; unicode-bidi: isolate; }
::selection { background: var(--sel); }
:focus-visible { outline: 2px solid var(--text); outline-offset: 2px; }
hr { border-color: var(--line); }
.container { max-width: 1180px; padding-inline: var(--gutter); }
.text-muted { color: var(--text-2) !important; }
.text-primary, a.text-primary:hover { color: var(--strong) !important; }
.bg-primary { background-color: var(--strong) !important; color: var(--btn-fg) !important; }
.border-primary { border-color: var(--strong) !important; }
.text-success { color: var(--ok) !important; }
.text-warning { color: var(--warn) !important; }
.text-danger { color: var(--danger) !important; }
.text-info { color: var(--text-2) !important; }
/* hero backdrop on every page (body.pt-grid): 56px hairline square grid and one soft monochrome glow from the
   top of the page, behind the header capsule, faded out downwards (kit .hero-bg) */
.pt-grid { position: relative; isolation: isolate; }
.pt-grid::before, .home-domain-search::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: min(900px, 100vh); z-index: -1; pointer-events: none;
  background-image:
    radial-gradient(70% 55% at 50% 0%, color-mix(in srgb, var(--text) 8%, transparent), transparent 70%),
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: auto, 56px 56px, 56px 56px; background-position: 0 0, center top, center top;
  -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent);
}
.home-domain-search { position: relative; isolation: isolate; background: transparent !important; }
.home-domain-search::before { height: 100%; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: var(--scroll-thumb); border-radius: 999px; }
::-webkit-scrollbar-track { background: transparent; }
html { scrollbar-color: var(--scroll-thumb) transparent; }

/* ---------- Buttons: soft-key pills, never outline-only ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: .35rem 22px;
  border-radius: var(--radius-pill); font-weight: 700; font-size: .95rem; line-height: 1.5; white-space: normal;
  transition: transform .12s var(--ease), box-shadow .15s ease, filter .15s ease, background-color .15s ease, border-color .15s ease;
}
.btn-block { display: flex; width: 100%; }
.btn-sm, .btn-group-sm > .btn { min-height: 38px; padding: .25rem 16px; font-size: .85rem; }
.btn-xs { min-height: 34px; padding: .2rem 12px; font-size: .8rem; gap: 6px; }
.btn-lg, .btn-group-lg > .btn { min-height: 54px; padding: .4rem 28px; font-size: 1.02rem; font-weight: 800; gap: 10px; }
.btn:active, .btn.active { transform: translateY(1px); box-shadow: none !important; }
.btn-primary, .btn-success, .pt-pill {
  background: var(--btn-grad) !important; color: var(--btn-fg) !important; border: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), var(--btn-glow);
}
.btn-primary:hover, .btn-success:hover, .pt-pill:hover { filter: brightness(1.06); color: var(--btn-fg) !important; }
.btn-default, .btn-secondary, .btn-light, .btn-info, .btn-outline-primary, .btn-outline-secondary, .btn-outline-light, .btn-outline-info, .pt-ghost {
  background: var(--ghost-bg) !important; color: var(--text) !important;
  border: 1px solid var(--ghost-border) !important; box-shadow: var(--ghost-inset);
}
.btn-default:hover, .btn-secondary:hover, .btn-light:hover, .btn-info:hover, .btn-outline-primary:hover,
.btn-outline-secondary:hover, .btn-outline-light:hover, .btn-outline-info:hover, .pt-ghost:hover { border-color: var(--hair-2) !important; filter: brightness(1.08); color: var(--strong) !important; }
.btn-danger, .btn-outline-danger { background: linear-gradient(180deg, #e11d48, #be123c) !important; color: #fff !important; border: 0 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.18); }
.btn-danger:hover, .btn-outline-danger:hover { filter: brightness(1.06); color: #fff !important; }
.btn-warning { background: var(--warn-soft) !important; color: var(--warn) !important; border: 1px solid var(--warn-soft) !important; }
.btn-link { color: var(--text) !important; min-height: 0; }
.btn:disabled, .btn.disabled { opacity: .45; }

/* ---------- Surfaces ---------- */
.card, .panel, .pt-card, .list-group-item, .modal-content, .popover, .tile, .sidebar .card, .tiles .tile {
  background: var(--white); color: var(--text); border: 1px solid var(--line);
}
.card, .panel, .pt-card, .modal-content { border-radius: var(--radius); box-shadow: var(--shadow-card); }
.card-body { padding: clamp(18px, 2.2vw, 28px); }
.card-header, .card-footer, .panel-heading, .panel-footer, .modal-header, .modal-footer { background: transparent !important; border-color: var(--line) !important; color: var(--text); }
.card-title, .panel-title { color: var(--strong); font-weight: 700; }
.list-group-item { border-color: var(--line); }
.list-group-item.active, .list-group-item-action.active { background: var(--nav-hover); color: var(--strong); border-color: var(--line); }
.list-group-item-action:hover, .list-group-item-action:focus { background: var(--chip-bg); color: var(--strong); }
/* dashboard panels: Nexus draws #ddd lines around and between list items */
.client-home-cards .list-group { border-top-color: var(--line) !important; border-bottom-color: var(--line) !important; }
.client-home-cards .list-group .list-group-item { border-bottom-color: var(--line) !important; } /* the parent script also sets it inline */
/* menus use the header's glass with a heavy tint, so the text under them never shows through */
.dropdown-menu {
  background: color-mix(in srgb, var(--paper) 96%, transparent); color: var(--text); border: 1px solid var(--line);
  -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3);
  border-radius: var(--radius-sm); box-shadow: var(--shadow-pop); padding: .35rem;
}
.dropdown-item { color: var(--text); border-radius: .55rem; font-weight: 500; }
.dropdown-item:hover, .dropdown-item:focus, .dropdown-item.active { background: var(--nav-hover); color: var(--strong); }
.dropdown-divider { border-color: var(--line); }
.popover-header { background: transparent; border-color: var(--line); color: var(--strong); }
.popover-body { color: var(--text); }
.modal-backdrop.show { opacity: .7; }
.close { color: var(--text); text-shadow: none; }

/* ---------- Forms ---------- */
.form-control, .custom-select, select.form-control, .input-group-text, .field {
  background-color: var(--input) !important; color: var(--text) !important; border: 1px solid var(--hair-2) !important; border-radius: var(--radius-input);
}
input.form-control, select.form-control, .custom-select, input.field { height: auto; min-height: 44px; }
.form-control-sm, .custom-select-sm { min-height: 38px; }
.form-control:focus, .custom-select:focus, .field:focus { background-color: var(--input) !important; color: var(--strong) !important; border-color: var(--hair-focus) !important; box-shadow: 0 0 0 3px var(--ring); }
.form-control::placeholder { color: var(--faint); }
.form-control:disabled, .form-control[readonly] { background-color: var(--chip-bg) !important; color: var(--text-2) !important; }
label, .control-label, .col-form-label { color: var(--text); font-weight: 600; }
.custom-control-label::before { background-color: var(--input); border-color: var(--hair-2); }
/* native checkboxes and radios in the kit's ink, not the browser's blue */
input[type=checkbox], input[type=radio] { accent-color: var(--strong); }
/* bootstrap-switch (e.g. the newsletter opt-in): kit surfaces; "on" is ink, not green, since it is not a status */
.bootstrap-switch { background: var(--input) !important; border: 1px solid var(--hair-2) !important; border-radius: var(--radius-pill) !important; }
.bootstrap-switch .bootstrap-switch-label { background: var(--white) !important; color: var(--text) !important; }
.bootstrap-switch .bootstrap-switch-handle-on, .bootstrap-switch .bootstrap-switch-handle-off { background: var(--chip-bg) !important; color: var(--text-2) !important; }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary { background: var(--strong) !important; color: var(--paper) !important; }
.custom-control-input:checked ~ .custom-control-label::before { background: var(--strong); border-color: var(--strong); }
/* iOS zooms into inputs under 16px */
@media (max-width: 700px) { .form-control, .custom-select, .field, textarea { font-size: 16px !important; } }

/* ---------- Tables ---------- */
.table, .dataTables_wrapper { color: var(--text); }
.table th, .table td, .table thead th { border-color: var(--line); }
.table thead th { color: var(--text-2); font-weight: 600; font-size: .85rem; }
.table-striped tbody tr:nth-of-type(odd) { background-color: var(--chip-bg); }
.table-hover tbody tr:hover, .table-list tbody tr:hover { background-color: var(--nav-hover); color: var(--strong); }
.dataTables_wrapper .dataTables_filter input, .dataTables_wrapper .dataTables_length select { background: var(--input); color: var(--text); border: 1px solid var(--hair-2); border-radius: var(--radius-input); }

/* ---------- Status ---------- */
.alert { border-radius: var(--radius-sm); line-height: 1.8; border: 1px solid var(--line); background: var(--chip-bg); color: var(--text); }
.alert-success { background: var(--ok-soft); border-color: var(--ok); color: var(--text); }
.alert-warning { background: var(--warn-soft); border-color: var(--warn); color: var(--text); }
.alert-danger { background: var(--danger-soft); border-color: var(--danger); color: var(--text); }
.alert-info { background: var(--chip-bg); border-color: var(--line); color: var(--text); }
.alert a { color: var(--strong); text-decoration: underline; }
.badge, .label { border-radius: var(--radius-pill); font-weight: 500; }
.badge-success, .label-success, .status-active, .status-paid, .status-open { background: var(--ok-soft); color: var(--ok); }
.badge-warning, .label-warning, .status-pending, .status-unpaid, .status-answered { background: var(--warn-soft); color: var(--warn); }
.badge-danger, .label-danger, .status-suspended, .status-terminated, .status-cancelled, .status-overdue { background: var(--danger-soft); color: var(--danger); }
.badge-info, .badge-dark, .badge-secondary, .label-default { background: var(--chip-bg); color: var(--text); border: 1px solid var(--line); }
.progress { background: var(--chip-bg); border-radius: var(--radius-pill); }
.progress-bar { background: var(--strong); }

/* ---------- Navigation bits ---------- */
.nav-tabs { border-color: var(--line); }
.nav-tabs .nav-link { color: var(--text-2); border: 0; border-bottom: 2px solid transparent; border-radius: 0; }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { background: transparent; color: var(--strong); border-bottom-color: var(--strong); }
.nav-pills .nav-link { color: var(--text-2); border-radius: var(--radius-pill); }
.nav-pills .nav-link.active { background: var(--nav-hover); color: var(--strong); }
.page-link { background: var(--white); border-color: var(--line); color: var(--text); }
.page-item.active .page-link { background: var(--strong); border-color: var(--strong); color: var(--btn-fg); }
.page-item.disabled .page-link { background: var(--white); border-color: var(--line); color: var(--text-2); }

/* ---------- Header: floating frosted capsule (kit: .header / .header-in) ---------- */
.pt-header { position: sticky; top: 0; z-index: 1030; padding: 12px 0 8px; pointer-events: none; background: transparent; }
.pt-header > .container { max-width: 1228px; }
.pt-header__in {
  pointer-events: auto; display: flex; align-items: center; gap: 6px; height: var(--head-h); padding-inline: 20px 8px;
  border-radius: var(--radius-pill); background: var(--header-glass); border: 1px solid var(--line);
  box-shadow: var(--ghost-inset), 0 10px 28px -18px rgba(0,0,0,.35);
  -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3);
  transition: border-color .2s var(--ease);
}
.pt-header.scrolled .pt-header__in { border-color: var(--hair-2); }
/* the logo is one fixed lockup: coloured on light, white on dark (no separate white file) */
.pt-logo { display: inline-flex; align-items: center; flex: 0 0 auto; border-radius: 8px; }
.pt-logo img { height: 30px; width: auto; }
:root[data-theme=dark] .pt-logo img { filter: brightness(0) invert(1); opacity: .92; }
@media (prefers-color-scheme: dark) { :root:not([data-theme=light]) .pt-logo img { filter: brightness(0) invert(1); opacity: .92; } }
.pt-header__main { display: flex; min-width: 0; margin-inline-start: 18px; }
.pt-nav { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.pt-nav > li { position: relative; }
.pt-nav__link {
  display: inline-flex; align-items: center; gap: .35rem; height: 38px; padding: 0 16px; border-radius: var(--radius-pill);
  color: var(--text-2); font-size: .92rem; font-weight: 600; text-decoration: none; white-space: nowrap;
  background: none; border: 0; transition: background-color .15s ease, color .15s ease;
}
.pt-nav__link:hover, .pt-nav__link:focus, .pt-nav > li.show > .pt-nav__link { background: var(--nav-hover); color: var(--text); text-decoration: none; }
.pt-nav__link.is-active, .pt-nav__link[aria-current] { background: var(--strong); color: var(--paper); }
.pt-nav .dropdown-toggle::after { border: 0; content: "\f107"; font-family: "Font Awesome 6 Pro", "Font Awesome 5 Pro", "Font Awesome 5 Free"; font-weight: 400; font-size: .75rem; vertical-align: 0; margin: 0; }
/* Size header menus to their longest label (Nexus pins them to 160px and items do not wrap) */
.pt-nav .dropdown-menu, .pt-header__tools .dropdown-menu { width: max-content; max-width: min(20rem, calc(100vw - 2rem)); }
.pt-nav .dropdown-item, .pt-header__tools .dropdown-item { white-space: normal; }
.pt-header__tools { display: flex; align-items: center; gap: 6px; margin-inline-start: auto; }
.pt-secondary { display: flex; align-items: center; gap: 2px; }
.pt-icon-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 auto;
  border-radius: var(--radius-pill); color: var(--text); background: var(--ghost-bg); border: 1px solid var(--ghost-border);
  box-shadow: var(--ghost-inset); text-decoration: none; transition: border-color .15s ease, filter .15s ease;
}
.pt-icon-btn:hover, .pt-icon-btn:focus { border-color: var(--hair-2); filter: brightness(1.08); color: var(--strong); text-decoration: none; }
.pt-icon-btn .badge { position: absolute; top: -4px; inset-inline-end: -4px; min-width: 18px; height: 18px; padding: 0 5px; font-size: .7rem; line-height: 18px; background: var(--strong); color: var(--paper); border: 0; }
.ico { width: 18px; height: 18px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pt-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.pt-theme-btn { min-height: 44px; padding: 0 14px; gap: 8px; font-size: .85rem; }
/* theme keys show the sun on dark and the moon on light */
[data-pt-toggle-theme] .i-moon { display: none; }
:root[data-theme=light] [data-pt-toggle-theme] .i-moon { display: block; }
:root[data-theme=light] [data-pt-toggle-theme] .i-sun { display: none; }
.pt-drawer-open { display: none; }
.pt-drawer-open .i-x, .pt-drawer-open[aria-expanded=true] .i-bars { display: none; }
.pt-drawer-open[aria-expanded=true] .i-x { display: inline-block; }

@media (max-width: 1023.98px) { .pt-nav__link { padding: 0 12px; } }
@media (max-width: 1199.98px) {
  .pt-header__main, .pt-secondary { display: none; }
  .pt-drawer-open { display: inline-flex; }
}
@media (max-width: 860px) { .pt-theme-l { display: none; } .pt-theme-btn { width: 44px; padding: 0; } }
@media (max-width: 700px) { .pt-header__in { padding-inline: 16px 6px; } }
@media (max-width: 380px) { .pt-logo img { height: 28px; } }

/* ---------- Mobile menu: a rounded glass sheet under the capsule ---------- */
.pt-drawer-overlay { position: fixed; inset: 0; z-index: 1025; background: rgba(0,0,0,.35); opacity: 0; visibility: hidden; transition: opacity .18s var(--ease), visibility .18s; }
.pt-drawer {
  position: fixed; z-index: 1031; inset-inline: 12px; top: calc(var(--head-h) + 28px);
  max-height: calc(100dvh - var(--head-h) - 40px); overflow-y: auto; overscroll-behavior: contain; padding: 10px;
  border-radius: var(--radius-panel); border: 1px solid var(--hair-2);
  background: color-mix(in srgb, var(--paper) 96%, transparent);
  -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3);
  box-shadow: var(--ghost-inset), 0 24px 60px -24px rgba(0,0,0,.6);
  opacity: 0; transform: translateY(-8px); visibility: hidden;
  transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
.pt-drawer.is-open { opacity: 1; transform: none; visibility: visible; transition: opacity .18s var(--ease), transform .18s var(--ease), visibility 0s; }
.pt-drawer-overlay.is-open { opacity: 1; visibility: visible; }
.pt-drawer .pt-nav { flex-direction: column; align-items: stretch; gap: 2px; }
.pt-drawer .pt-nav__link { width: 100%; height: auto; min-height: 44px; white-space: normal; overflow-wrap: anywhere; justify-content: space-between; padding: .5rem 16px; }
.pt-drawer .dropdown-menu { position: static !important; transform: none !important; float: none; box-shadow: none; border: 0; background: var(--chip-bg); -webkit-backdrop-filter: none; backdrop-filter: none; margin: 2px 0 6px; width: 100%; max-width: none; }
.pt-drawer .dropdown-item { white-space: normal; overflow-wrap: anywhere; padding: .5rem 1rem; }
.pt-drawer__section { padding-top: 8px; margin-top: 8px; border-top: 1px solid var(--line); }
body.pt-drawer-lock { overflow: hidden; }

/* ---------- Mobile dock (700px and below) ---------- */
.pt-dock { display: none; }
@media (max-width: 700px) {
  .pt-dock {
    display: flex; position: fixed; z-index: 1020; inset-inline: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    height: 56px; padding: 6px; gap: 4px; border-radius: var(--radius-pill);
    background: color-mix(in srgb, var(--paper) 82%, transparent); border: 1px solid var(--hair-2);
    box-shadow: var(--ghost-inset), 0 16px 40px -18px rgba(0,0,0,.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3);
  }
  .pt-dock a { flex: 1 1 0; min-width: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-pill);
    font-weight: 700; font-size: .9rem; color: var(--text-2); text-decoration: none; white-space: nowrap; transition: background-color .15s ease, color .15s ease; }
  .pt-dock a:hover { color: var(--text); text-decoration: none; }
  .pt-dock a[aria-current="true"] { background: var(--strong); color: var(--paper); }
  body { padding-bottom: 84px; }
  .pt-drawer { max-height: calc(100dvh - var(--head-h) - 40px - 84px); }
}

/* ---------- Main body (the .sidebar rules below style the order form's category sidebar) ---------- */
#main-body { background: transparent !important; padding: 1.25rem 0 3rem; min-height: 50vh; overflow-x: clip; }
.bg-white { background-color: var(--white) !important; }

/* Parent homepage blocks that hard-code white backgrounds */
.home-domain-search { border-bottom: 1px solid var(--line); }
.home-domain-search .input-group-wrapper { background: var(--white) !important; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-lift); }
.home-domain-search p, .home-domain-search .text-muted { color: var(--text-2) !important; }
[class*="card-accent-"] {
  background: var(--white) !important; color: var(--text-2) !important; border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important; box-shadow: var(--shadow-card) !important;
  transition: box-shadow .2s var(--ease), transform .2s var(--ease), color .2s var(--ease);
}
[class*="card-accent-"]:hover, [class*="card-accent-"]:focus { color: var(--strong) !important; box-shadow: var(--shadow-lift) !important; transform: translateY(-1px); text-decoration: none; }
[class*="card-accent-"] i, [class*="card-accent-"] svg { color: var(--strong) !important; }
.primary-content > h1:first-child, .primary-content > .header-lined h1 { font-size: 1.5rem; }
.sidebar .card { border-radius: var(--radius); margin-bottom: 1rem; }
.sidebar .card-header .card-title { font-size: .95rem; margin: 0; }
.sidebar .list-group-item { background: transparent; border-width: 0; border-radius: .55rem !important; margin: 0 .35rem .1rem; width: auto; color: var(--text-2); }
.sidebar .card > .list-group { padding: .35rem 0 .25rem; }
.sidebar .list-group-item.active, .sidebar .list-group-item:hover { background: var(--nav-hover); color: var(--strong); }

/* ---------- Dashboard ---------- */
.pt-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1.25rem; }
.pt-stat {
  display: flex; flex-direction: column; gap: .25rem; padding: 1rem 1.1rem; border-radius: var(--radius);
  /* frosted glass over the page grid, the same material as the header capsule */
  background: color-mix(in srgb, var(--white) 60%, transparent); border: 1px solid var(--line);
  -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3);
  box-shadow: var(--ghost-inset), var(--shadow-card); color: var(--text); text-decoration: none;
  transition: box-shadow .2s var(--ease), transform .2s var(--ease), border-color .2s var(--ease);
}
.pt-stat:hover { border-color: var(--hair-2); box-shadow: var(--ghost-inset), var(--shadow-lift); transform: translateY(-1px); color: var(--strong); text-decoration: none; }
.pt-stat__icon { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: .7rem; background: var(--chip-bg); border: 1px solid var(--line); color: var(--strong); }
.pt-stat__value { font-size: 1.6rem; font-weight: 600; color: var(--strong); line-height: 1.2; }
.pt-stat__label { color: var(--text-2); font-size: .85rem; }
@media (max-width: 767.98px) { .pt-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pt-notice { display: flex; gap: .75rem; align-items: flex-start; }
.pt-notice__body { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.pt-notice__title { font-weight: 600; color: var(--strong); margin-bottom: .15rem; }

/* ---------- Auth & error pages ---------- */
.pt-auth { min-height: calc(100vh - var(--head-h)); display: flex; align-items: flex-start; justify-content: center; padding: 3rem 1rem; }
.pt-auth .pt-card { width: 100%; max-width: 440px; padding: 1.75rem; box-shadow: var(--shadow-lift); }
.pt-auth h1, .pt-auth h2, .pt-auth h3 { font-size: 1.35rem; margin-bottom: .35rem; }
.pt-auth__sub { color: var(--text-2); font-size: .9rem; margin-bottom: 1.25rem; }
.pt-error { text-align: center; padding: 4rem 1rem; }
.pt-error__code { font-size: 4rem; font-weight: 600; color: var(--strong); line-height: 1; }

/* ---------- Password meter ---------- */
.pt-pwmeter { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: .4rem; }
.pt-pwmeter span { height: 4px; border-radius: 2px; background: var(--chip-bg); transition: background .2s; }
.pt-pwmeter[data-score="1"] span:nth-child(-n+1) { background: var(--danger); }
.pt-pwmeter[data-score="2"] span:nth-child(-n+2) { background: var(--warn); }
.pt-pwmeter[data-score="3"] span:nth-child(-n+3) { background: var(--ok); }
.pt-pwmeter[data-score="4"] span { background: var(--ok); }

/* ---------- Page frame (docs/superpowers/specs/2026-10-25-page-frame-design.md) ---------- */
/* no isolation/stacking context here: it would trap the «بیشتر» menu under the sticky content below;
   the grid backdrop comes from body.pt-grid, from the top of the page */
.pt-pagehead { padding: 32px 0 24px; }
.pt-pagehead__crumbs { display: flex; flex-wrap: wrap; gap: 0 8px; margin: 0 0 6px; padding: 0; list-style: none; font-size: .82rem; color: var(--text-2); }
.pt-pagehead__crumbs li { min-width: 0; overflow-wrap: anywhere; } /* a long Latin token must not widen the page */
.pt-pagehead__crumbs li + li::before { content: "/"; color: var(--faint); margin-inline-end: 8px; }
.pt-pagehead__crumbs a { color: var(--text-2); }
.pt-pagehead__crumbs a:hover { color: var(--strong); text-decoration: none; }
.pt-pagehead__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.pt-pagehead__title { margin: 0; min-width: 0; overflow-wrap: anywhere; font-size: clamp(1.7rem, 1.2rem + 1.9vw, 2.35rem); font-weight: 800; line-height: 1.45; letter-spacing: -.02em; color: var(--strong); }
.pt-pagehead__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pt-pagehead__actions .btn .fa-fw { width: auto; }
.pt-more { position: relative; }
/* the button sits at the row's far (left) end in RTL, so the menu opens from its left edge into the page */
.pt-more .dropdown-menu { min-width: 14rem; max-width: min(20rem, calc(100vw - 2rem)); top: calc(100% + 6px); inset-inline-start: auto; inset-inline-end: 0; margin: 0; }
.pt-more .dropdown-item { white-space: normal; display: flex; align-items: center; gap: 8px; }
.pt-more__label { margin: 0; padding: 8px 12px 2px; font-size: .72rem; font-weight: 700; color: var(--text-2); }
@media (max-width: 560px) {
  .pt-pagehead__actions, .pt-pagehead__actions > .btn, .pt-more, .pt-more > .btn { width: 100%; }
}

/* tabs: one scrolling row of pills per sidebar filter panel; .active moves with in-page (list) tabs */
.pt-tabs { display: flex; flex-wrap: nowrap; gap: 4px; overflow-x: auto; scrollbar-width: none; margin-top: 18px; padding: 0; }
.pt-tabs::-webkit-scrollbar { display: none; }
.pt-tabs.is-scrolling { -webkit-mask-image: linear-gradient(to left, transparent, #000 24px, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(to left, transparent, #000 24px, #000 calc(100% - 24px), transparent); }
.pt-tabs__label { margin: 14px 0 6px; font-size: .78rem; font-weight: 700; color: var(--text-2); }
.pt-tabs__label + .pt-tabs { margin-top: 0; }
.pt-tabs .pt-tab, .pt-tabs .pt-tab.list-group-item { display: inline-flex; width: auto; margin: 0; border: 0; background: none; line-height: 1; align-items: center; gap: 8px; flex: 0 0 auto; height: 38px; padding: 0 16px; border-radius: var(--radius-pill);
  font-size: .92rem; font-weight: 600; color: var(--text-2); white-space: nowrap; text-decoration: none; transition: background-color .15s ease, color .15s ease; }
.pt-tabs .pt-tab:hover, .pt-tabs .pt-tab:focus { background: var(--nav-hover); color: var(--text); text-decoration: none; }
.pt-tabs .pt-tab.active { background: var(--strong); color: var(--paper); }
.pt-tabs .pt-tab.disabled { opacity: .45; pointer-events: none; }
.pt-tab__badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px;
  border-radius: var(--radius-pill); background: var(--chip-bg); font-size: .72rem; font-weight: 700; line-height: 1; color: inherit; }
.pt-tab.active .pt-tab__badge { background: color-mix(in srgb, var(--paper) 20%, transparent); }

/* content beside an optional side column for panels with content */
.pt-frame { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
@media (min-width: 1024px) {
  .pt-frame--aside { grid-template-columns: minmax(0, 1fr) 320px; }
  .pt-frame--aside .pt-frame__main { grid-column: 1; grid-row: 1; }
  /* sticky, but never taller than the screen: on a short laptop the lower cards (e.g. the ticket CC form) stay reachable */
  .pt-aside { grid-column: 2; grid-row: 1; position: sticky; top: calc(var(--head-h) + 28px); align-self: start;
    max-height: calc(100dvh - var(--head-h) - 44px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
}
.pt-aside-card { margin-bottom: 16px; padding: 20px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-card); }
.pt-aside-card:last-child { margin-bottom: 0; }
.pt-aside-card__title { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 1rem; font-weight: 700; line-height: 1.6; color: var(--strong); letter-spacing: 0; }
.pt-aside-card__body { font-size: .9rem; color: var(--text); overflow-wrap: anywhere; }
.pt-aside-card__rows { display: grid; border-top: 1px solid var(--line); border-radius: 0; }
.pt-aside-card__rows:not(:has(> *)) { display: none; }
.pt-aside-card__rows > .list-group-item { padding: 8px 4px; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0 !important; font-size: .9rem; }
.pt-aside-card__rows > :last-child { border-bottom: 0; }
.pt-aside-card__body + .pt-aside-card__rows { margin-top: 12px; }
.pt-aside-card__row { display: flex; align-items: center; gap: 8px; padding: 8px 4px; border-bottom: 1px solid var(--line); font-size: .9rem; color: var(--text); overflow-wrap: anywhere; }
a.pt-aside-card__row:hover { background: var(--nav-hover); color: var(--strong); text-decoration: none; }
.pt-aside-card__row.pt-row { display: block; color: var(--text-2); }
.pt-aside-card__foot { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.pt-link__label { min-width: 0; }

/* ---------- Pars Abr services: the same panel on every site (kit CROSS-SITE.md, .credit/.svc) ---------- */
.pt-svc-section { padding-block: clamp(24px, 4vw, 48px) 0; }
.pt-credit { display: grid; grid-template-columns: minmax(0, 1fr); border-radius: var(--radius-panel); overflow: hidden;
  background: var(--white); border: 1px solid var(--line); box-shadow: var(--shadow-card); }
.pt-credit-main { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); justify-items: start; align-items: end;
  gap: 18px 40px; padding: clamp(24px, 4.4vw, 48px); isolation: isolate; }
.pt-credit-main::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(80% 100% at 100% 0%, #000, transparent 75%); mask-image: radial-gradient(80% 100% at 100% 0%, #000, transparent 75%); }
.pt-credit-logo { height: 38px; width: auto; }
:root[data-theme=dark] .pt-credit-logo { filter: brightness(0) invert(1); opacity: .92; }
@media (prefers-color-scheme: dark) { :root:not([data-theme=light]) .pt-credit-logo { filter: brightness(0) invert(1); opacity: .92; } }
.pt-credit-h { max-width: 18em; margin: 0; font-size: clamp(1.7rem, 1.2rem + 1.9vw, 2.35rem); font-weight: 800; line-height: 1.45; letter-spacing: -.02em; color: var(--strong); }
@media (min-width: 900px) {
  .pt-credit-main { grid-template-columns: minmax(0, 1fr) auto; }
  .pt-credit-logo { grid-column: 1 / -1; }
  .pt-credit-main .btn { justify-self: end; margin-bottom: 6px; }
}
.pt-svc-head { padding: 18px clamp(24px, 4.4vw, 48px) 6px; border-top: 1px solid var(--line); color: var(--text-2); font-size: .82rem; margin: 0; }
.pt-svc-head b { font-weight: 700; letter-spacing: .02em; }
.pt-svc { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pt-svc li { border-top: 1px solid var(--line); }
.pt-svc li:nth-child(even) { border-inline-start: 1px solid var(--line); }
.pt-svc li:last-child:nth-child(odd) { grid-column: 1 / -1; }
.pt-svc-i { display: flex; align-items: center; gap: 16px; padding: 18px clamp(24px, 4.4vw, 48px); height: 100%; line-height: 1.7; color: var(--text); text-decoration: none; }
a.pt-svc-i:hover { background: var(--nav-hover); color: var(--text); text-decoration: none; }
.pt-svc-ico { width: 40px; height: 40px; padding: 10px; flex: none; border-radius: 12px; background: var(--white); border: 1px solid var(--line); color: var(--strong); }
.pt-svc-t { display: grid; flex: 1 1 auto; min-width: 0; }
.pt-svc-t b { color: var(--strong); font-weight: 800; }
.pt-svc-t span { color: var(--text-2); font-size: .86rem; }
.pt-svc-go { color: var(--text-2); width: 18px; height: 18px; flex: none; }
a.pt-svc-i:hover .pt-svc-go { color: var(--strong); }
.pt-svc .is-cur { background: var(--chip-bg); }
.pt-chip { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: var(--radius-pill); background: var(--chip-bg);
  border: 1px solid var(--line); font-size: .82rem; font-weight: 600; color: var(--text-2); user-select: none; white-space: nowrap; flex: none; }
@media (max-width: 700px) {
  .pt-svc { grid-template-columns: minmax(0, 1fr); }
  .pt-svc li:nth-child(even) { border-inline-start: 0; }
  .pt-svc-i { flex-wrap: wrap; }
}

/* ---------- Footer: rounded closing card ---------- */
.pt-footer { padding: clamp(24px, 4vw, 48px) 0 32px; background: transparent; }
.pt-footer > .container > .pt-foot-card { display: grid; gap: 28px; padding: clamp(22px, 3.4vw, 40px);
  background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-panel); box-shadow: var(--shadow-card); }
.pt-foot-top { display: grid; gap: 28px 40px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .pt-foot-top { grid-template-columns: minmax(0, 1.4fr) repeat(4, minmax(0, 1fr)); } }
@media (max-width: 899.98px) { .pt-foot-top { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pt-foot-brand { grid-column: 1 / -1; } }
.pt-foot-brand { display: grid; gap: 12px; align-content: start; justify-items: start; }
.pt-foot-brand .pt-logo img { height: 34px; }
.pt-foot-brand p { color: var(--text-2); font-size: .92rem; max-width: 34ch; line-height: 1.9; margin: 0; }
.pt-foot-k { font-size: .78rem; font-weight: 800; color: var(--text); margin: 0 0 6px; }
.pt-foot-k a { color: inherit; }
.pt-foot-col { display: grid; align-content: start; justify-items: start; gap: 2px; }
.pt-foot-col a { color: var(--text-2); font-weight: 600; font-size: .9rem; padding: 4px 0; text-decoration: none; transition: color .15s ease; }
.pt-foot-col a:hover { color: var(--strong); }
.pt-foot-bot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px;
  padding-top: 20px; border-top: 1px solid var(--line); font-size: .88rem; color: var(--text); }
.pt-foot-bot p { margin: 0; }
.pt-foot-bot a { color: var(--strong); }
.pt-foot-tools { display: flex; flex-wrap: wrap; gap: 8px; }
.pt-dim { color: var(--text-2); }
.pt-foot-legal { flex: 1 1 100%; font-size: .72rem; color: var(--text-2); }
@media (max-width: 560px) { .pt-foot-tools, .pt-foot-tools .btn { width: 100%; } }

/* ---------- Motion ---------- */
@keyframes rv-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* Ticket markdown editor (bootstrap-markdown) and rendered markdown: Nexus paints both white */
.md-editor { border: 1px solid var(--line) !important; border-radius: var(--radius-sm); background: var(--input); overflow: hidden; }
div.md-editor.active { border-color: var(--hair-focus) !important; box-shadow: 0 0 0 3px var(--ring); }
.md-editor > .md-header, .md-editor > .btn-toolbar { background: var(--chip-bg) !important; padding: .4rem .5rem; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; }
.md-editor .md-header .btn-group { margin: 0 !important; }
.md-editor .md-header .btn { background: transparent !important; box-shadow: none !important; border: 0 !important; border-radius: .55rem !important; color: var(--text-muted) !important; min-height: 34px; padding: .25rem .6rem; font-size: .85rem; font-weight: 600; }
.md-editor .md-header .btn:hover, .md-editor .md-header .btn:focus, .md-editor .md-header .btn.active { background: var(--nav-hover) !important; color: var(--strong) !important; transform: none; }
.md-editor .md-controls { margin-inline-start: auto; }
.md-editor .md-controls .md-control { color: var(--text-muted); }
.md-editor .md-controls .md-control:hover { color: var(--strong); }
.md-editor > textarea.markdown-editor, .md-editor > textarea, .md-editor > textarea:focus, .md-editor > .md-preview {
  background: var(--input) !important; color: var(--text) !important; border: 0 !important;
  border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important;
  font-family: var(--font);
}
.md-editor .md-footer { background: var(--chip-bg); color: var(--text-muted); padding: .4rem .8rem; }
.md-editor .markdown-editor-status { color: var(--text-muted); }
.md-editor.md-fullscreen-mode { background: var(--bg) !important; }
.md-editor.md-fullscreen-mode .md-input, .md-editor.md-fullscreen-mode .md-input:focus, .md-editor.md-fullscreen-mode .md-input:hover, .md-editor.md-fullscreen-mode .md-preview { background: var(--input) !important; color: var(--text) !important; }
.md-editor.md-fullscreen-mode .md-fullscreen-controls a { color: var(--text-muted); }
.md-editor.md-fullscreen-mode .md-fullscreen-controls a:hover { color: var(--strong); }
.md-preview h1, .md-preview h2, .md-preview h3, .md-preview h4, .markdown-content h1, .markdown-content h2, .markdown-content h3, .markdown-content h4 { color: var(--strong); }
.md-preview blockquote, .markdown-content blockquote { border-right-color: var(--line); color: var(--text-2); }
.md-preview table, .markdown-content table { background: transparent; border-color: var(--line); }
.md-preview table th, .markdown-content table th { background: var(--chip-bg); border-color: var(--line); color: var(--strong); }
.md-preview table td, .markdown-content table td { border-color: var(--line); }

/* DataTables lists (tickets, services, invoices, domains): Nexus paints header and cells white */
.dataTables_wrapper table.table-list { border: 1px solid var(--line) !important; background: var(--white); }
table.table-list thead th, body .dataTables_wrapper table.table-list thead th, body .dataTables_wrapper table.table-list thead th:first-child, body .dataTables_wrapper table.table-list thead th:last-child, .dataTables_wrapper table.table-list thead th.sorting_asc, .dataTables_wrapper table.table-list thead th.sorting_desc {
  background-color: transparent !important; color: var(--text-2); border-bottom: 1px solid var(--line) !important;
}
.table-list > tbody > tr > td { background-color: transparent !important; border-color: var(--line); }
.table-list > tbody > tr:first-child > td { border-top: 0; }
.table-list > tbody > tr:hover > td { background-color: var(--nav-hover) !important; color: var(--strong); }
.table-list > tbody > tr > td a.border-left { border-right-color: var(--line) !important; }
/* Nexus enables DataTables Responsive but never loads it, so wide lists scroll inside their box on phones */
.dataTables_wrapper .listtable { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--hair-2) transparent; }
/* The search box and row count live in the same box; keep them in place while the table scrolls */
.dataTables_wrapper .listtable > .dataTables_filter, .dataTables_wrapper .listtable > .dataTables_info { position: sticky; left: 0; right: 0; }

/* Service details status card: Nexus gives the icon panel a fixed #efefef background */
div.product-details div.product-icon { background-color: var(--white); border: 1px solid var(--line); }
div.product-details div.product-icon .fa-stack .fa-circle { color: var(--nav-hover); }
div.product-details div.product-icon .fa-stack .fa-inverse { color: var(--strong); }
div.product-details div.product-icon h4 { color: var(--text-2); }