/* GSMVanta UI Foundation — Dub style reference.
   Canonical source: DESIGN.md. All application surfaces consume these tokens;
   generated assets must be rebuilt with bin/build-assets.php. */
:root{
  --gv-font-body-weight:400;
  --gv-font-label-weight:500;
  --gv-font-strong-weight:600;
  --gv-font-delta:0px;

  --gv-color-canvas-white:#ffffff;
  --gv-color-paper-mist:#f5f5f5;
  --gv-color-ash:#e5e5e5;
  --gv-color-smoke:#d4d4d4;
  --gv-color-pebble:#c8c8c8;
  --gv-color-midnight-ink:#0a0a0a;
  --gv-color-charcoal:#171717;
  --gv-color-graphite:#262626;
  --gv-color-slate:#404040;
  --gv-color-steel:#525252;
  --gv-color-fog:#737373;
  --gv-color-silver:#a3a3a3;
  --gv-color-electric-blue:#2563eb;
  --gv-color-deep-sapphire:#1e40af;
  --gv-color-soft-mint:#dcfce7;
  --gv-color-vivid-green:#16a34a;
  --gv-color-tangerine:#ea580c;
  --gv-color-lavender:#7c3aed;

  --gv-spacing-4:4px;--gv-spacing-8:8px;--gv-spacing-12:12px;--gv-spacing-16:16px;
  --gv-spacing-20:20px;--gv-spacing-24:24px;--gv-spacing-28:28px;--gv-spacing-32:32px;
  --gv-spacing-36:36px;
  --gv-spacing-40:40px;--gv-spacing-48:48px;--gv-spacing-56:56px;--gv-spacing-64:64px;
  --gv-spacing-80:80px;--gv-spacing-96:96px;--gv-spacing-112:112px;

  --gv-radius-xs:6px;
  --gv-radius-sm:6px;
  --gv-radius-md:8px;
  --gv-radius-lg:12px;
  --gv-radius-xl:16px;
  --gv-radius-pill:9999px;
  --gv-radius-input:6px;
  --gv-radius-button:8px;
  --gv-radius-card:12px;
  --gv-radius-large-card:16px;

  --gv-control-height:36px;
  --gv-control-height-small:32px;
  --gv-control-height-touch:40px;
  --gv-control-radius:var(--gv-radius-input);
  --gv-panel-radius:var(--gv-radius-card);
  --gv-switch-on:var(--gv-color-electric-blue);
  --gv-page-max-width:1200px;
  --gv-section-gap:64px;
  --gv-card-padding:16px;
  --gv-element-gap:8px;
  --gv-page-gap:16px;
  --gv-type-caption:11px;
  --gv-type-small:12px;
  --gv-type-label:14px;
  --gv-type-body:14px;
  --gv-type-body-large:16px;
  --gv-type-subheading:20px;
  --gv-type-page-title:24px;
  --gv-leading-base:1.5;
  --gv-leading-heading:1.33;

  --gv-shadow-subtle:0 1px 2px rgba(0,0,0,.05);
  --gv-shadow-sm:0 1px 2px rgba(0,0,0,.06);
  --gv-shadow-md:0 4px 12px rgba(0,0,0,.08);
  --gv-shadow-lg:0 10px 24px rgba(0,0,0,.10);
  --gv-focus-ring:0 0 0 2px var(--gv-surface,#fff),0 0 0 4px var(--gv-color-electric-blue);
  --gv-fs-8:8px;
  --gv-fs-10:10px;
  --gv-fs-11:11px;
  --gv-fs-12:12px;
  --gv-fs-13:13px;
  --gv-fs-14:14px;
  --gv-fs-16:16px;
  --gv-fs-18:18px;
  --gv-fs-20:20px;
  --gv-fs-24:24px;
  --gv-fs-30:30px;
  --gv-fs-36:36px;
  --gv-fs-40:40px;
  --gv-fs-48:48px;
}

:root,html[data-theme="light"]{
  --gv-canvas:#ffffff;
  --gv-surface:#ffffff;
  --gv-surface-subtle:#f5f5f5;
  --gv-surface-muted:#f5f5f5;
  --gv-text:#171717;
  --gv-text-secondary:#525252;
  --gv-text-muted:#737373;
  --gv-border:#e5e5e5;
  --gv-border-strong:#d4d4d4;
  --gv-control-bg:#ffffff;
  --gv-input-border:#000000;
  --gv-accent:#2563eb;
  --gv-accent-strong:#1e40af;
  --gv-accent-soft:#dbeafe;
  --gv-primary:#000000;
  --gv-primary-hover:#171717;
  --gv-primary-text:#ffffff;
  --gv-service-type-imei:#2563eb;
  --gv-service-type-server:#16a34a;
  --gv-service-type-remote:#ea580c;
  --gv-service-type-file:#7c3aed;
}
html[data-theme="dark"]{
  --gv-canvas:#0a0a0a;
  --gv-surface:#111111;
  --gv-surface-subtle:#171717;
  --gv-surface-muted:#171717;
  --gv-text:#fafafa;
  --gv-text-secondary:#d4d4d4;
  --gv-text-muted:#a3a3a3;
  --gv-border:#262626;
  --gv-border-strong:#404040;
  --gv-control-bg:#111111;
  --gv-input-border:#737373;
  --gv-accent:#60a5fa;
  --gv-accent-strong:#93c5fd;
  --gv-accent-soft:#172554;
  --gv-primary:#fafafa;
  --gv-primary-hover:#e5e5e5;
  --gv-primary-text:#0a0a0a;
  --gv-service-type-imei:#60a5fa;
  --gv-service-type-server:#22c55e;
  --gv-service-type-remote:#fb923c;
  --gv-service-type-file:#a78bfa;
}

html[data-app-area="admin"],html[data-app-area="client"]{--gv-font-delta:0px}
html,body,input,button,select,textarea,optgroup{font-family:var(--gv-foundation-font-sans);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-size:14px;line-height:1.5;font-weight:400;letter-spacing:0}
:is(input,button,select,textarea,optgroup){font-size:14px;line-height:1.4}
:is(h1,h2,h3,h4,h5,h6){font-family:var(--gv-foundation-font-sans);font-weight:500;color:var(--gv-text)}
:is(b,strong){font-weight:600}
:is(label,.field-label,.form-label,.control-label,button,.button,.btn){font-weight:500}
:is(code,pre,kbd,samp,.mono,.system-code,.secret-code,.payload-box){font-family:var(--gv-font-mono);font-variant-numeric:tabular-nums}
@media (max-width:1024px),(hover:none) and (pointer:coarse){:is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),textarea,select,[contenteditable]:not([contenteditable="false"])){font-size:16px !important}}

/* Dub surfaces. A complete outer frame belongs to the surface; its children
   own only internal separators. Logical corners preserve the frame in RTL. */
.gv-ui-surface,
:where(body.app-admin,body.app-client) :is(.panel,.card,.box,.table-card,.panel-table-card,.directory-panel,.settings-section,.security-card,.updates-card,.dhru-card,.tg3-card,.telegram-card,.inventory-panel,.admin-sectioned-surface,.gv-admin-listing,.inventory-table-card,.admin-surface,.gv-client-listing,.metric-card,.stat-card,.api-overview-card,.api-key-reveal,.api-primary-connection,.dub-telegram-hero,.catalog-service-card,.gv-catalog-row,.gv-catalog-selector-row) {
  --gv-surface-radius:var(--gv-radius-card);
  min-width:0;
  border:1px solid var(--gv-border);
  border-radius:var(--gv-surface-radius);
  background:var(--gv-surface);
  color:var(--gv-text);
  background-clip:padding-box;
  box-shadow:none;
}
.gv-ui-surface--large{--gv-surface-radius:var(--gv-radius-large-card)}
.gv-ui-surface-head,.gv-ui-surface-body,.gv-ui-surface-foot{
  min-width:0;
  margin:0;
  padding:var(--gv-card-padding);
}
.gv-ui-surface-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--gv-element-gap);
  border-block-end:1px solid var(--gv-border);
  background:var(--gv-surface);
}
.gv-ui-surface-foot{
  border-block-start:1px solid var(--gv-border);
  background:var(--gv-surface-subtle);
}
.gv-ui-surface > :is(header,footer,section,article,div,form,table):nth-child(1 of :not([hidden],input[type="hidden"],script,template)){
  border-start-start-radius:calc(var(--gv-surface-radius) - 1px);
  border-start-end-radius:calc(var(--gv-surface-radius) - 1px);
}
.gv-ui-surface > :is(header,footer,section,article,div,form,table):nth-last-child(1 of :not([hidden],input[type="hidden"],script,template)),
.gv-ui-surface > form:last-child > .gv-ui-surface-foot:last-child{
  border-end-start-radius:calc(var(--gv-surface-radius) - 1px);
  border-end-end-radius:calc(var(--gv-surface-radius) - 1px);
}
.gv-ui-surface-head :is(h2,h3){font-size:var(--gv-type-label);font-weight:500;line-height:1.43}
@media(max-width:760px){
  .gv-ui-surface-head,.gv-ui-surface-body,.gv-ui-surface-foot{padding:var(--gv-spacing-16)}
}

