/* assets/css/ua_global_glass_system.css
   Root visual layer: one shared background + transparent glass cards/bars across the authenticated admin program.
   Built from the Subscribers page background, loaded from both header and final footer position. */
:root{
  --ua-glass-bg-base:#122856;
  --ua-glass-bg-mid:#213f92;
  --ua-glass-bg-end:#1f3f93;
  --ua-glass-card:rgba(7,18,34,.44);
  --ua-glass-card-strong:rgba(7,18,34,.58);
  --ua-glass-bar:rgba(7,18,34,.38);
  --ua-glass-line:rgba(255,255,255,.135);
  --ua-glass-text:#f4f8ff;
  --ua-glass-shadow:0 18px 48px rgba(0,0,0,.18);
  --ua-glass-blur:18px;
  --ua-program-bg:
    radial-gradient(circle at 84% 2%, rgba(59,130,246,.30) 0 2px, transparent 3px),
    radial-gradient(circle at 5% 70%, rgba(34,197,94,.22) 0 1px, transparent 2px),
    radial-gradient(circle at 24% -10%, rgba(96,165,250,.18), transparent 36%),
    linear-gradient(135deg,var(--ua-glass-bg-base) 0%,var(--ua-glass-bg-mid) 52%,var(--ua-glass-bg-end) 100%);
}

html:has(body.ua-authed),
body.ua-authed,
body.ua-authed.ua-shell-chrome,
body.ua-authed.ua-shell-plain{
  min-height:100% !important;
  background:var(--ua-program-bg) fixed !important;
  color:var(--ua-glass-text) !important;
}

body.ua-authed::before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:0 !important;
  pointer-events:none !important;
  background-image:
    radial-gradient(circle,rgba(147,197,253,.30) 0 1px,transparent 2px),
    linear-gradient(115deg,transparent 0 46%,rgba(147,197,253,.10) 46.2% 46.5%,transparent 47%),
    linear-gradient(25deg,transparent 0 55%,rgba(147,197,253,.075) 55.2% 55.5%,transparent 56%);
  background-size:190px 190px,420px 260px,420px 260px !important;
  opacity:.58 !important;
}

body.ua-authed .ua-shell,
body.ua-authed .ua-main,
body.ua-authed .ua-page,
body.ua-authed .content-wrapper,
body.ua-authed .content-wrapper.ua-extracted-page,
body.ua-authed .content-wrapper.ua-manual-page,
body.ua-authed .content-wrapper.subs-page-shell,
body.ua-authed .content-wrapper > .content,
body.ua-authed section.content,
body.ua-authed .content,
body.ua-authed .container,
body.ua-authed .container-fluid,
body.ua-authed .nocx-main,
body.ua-authed .nocx-layout,
body.ua-authed .ua-extracted-content,
body.ua-authed .ua-manual-content{
  background:transparent !important;
  background-color:transparent !important;
  color:var(--ua-glass-text) !important;
}

body.ua-authed .ua-shell,
body.ua-authed .ua-main,
body.ua-authed .ua-page,
body.ua-authed .content-wrapper,
body.ua-authed .content{
  position:relative !important;
  z-index:1 !important;
}

/* Main page wrappers: keep page structure, remove opaque masks. */
body.ua-authed :where(.content-wrapper,.nocx-page,.ua-comms-page,.ua-net-page,.ua-extracted-page,.ua-manual-page,.ua-msg-page,.wrapper,.main-wrapper,.right-side,.main-sidebar,.content-page,.page-content,.page-wrapper,.main-content,.hold-transition){
  background:transparent !important;
  background-color:transparent !important;
  box-shadow:none !important;
}

/* Shared glass components: cards, panels, boxes, widgets and page-specific cards. */
body.ua-authed :where(
  .card,.box,.panel,.well,.callout,.small-box,.info-box,.modal-content,.dropdown-menu,
  .table-responsive,.ua-card,.ua-panel,.ua-box,.ua-widget,.ua-feature-card,.ua-studio-card,
  .ua-pro-card,.ua-pro-panel,.ua-stat-card,.ua-kpi,.ua-metric,.ua-tile,.ua-list-card,
  .nocx-panel,.nocx-card,.nocx-widget,.nocx-stat-card,.nocx-alert-popover,.nocx-user-menu-panel,
  .ua-comms-head,.ua-comms-card,.ua-comms-note,.ua-comms-alert,.ua-comms-modal__dialog,
  .ua-router-card,.ua-result-card,.ua-comms-results,.ua-net-window,.ua-net-card,
  .mtw-card,.mtw-panel,.mtkhub-card,.mtkhub-panel,.syshub-card,.syshub-panel,.vg-card,.vg-panel,
  .airmax-card,.airmax-panel,.airmax-note,.ua-compact-field,.ua-compact-hero,
  .subsx-body,.subsx-table-card,.subsx-gauge,.uaFixContentBox,#uaFixContentBox,#uaFixAuthBox,#uaFixConfirm > div,
  .ua-logout-card
):not(.ua-keep-plain):not(.ua-no-glass){
  background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.045)) !important;
  background-color:var(--ua-glass-card) !important;
  border-color:var(--ua-glass-line) !important;
  box-shadow:var(--ua-glass-shadow) !important;
  color:var(--ua-glass-text) !important;
  -webkit-backdrop-filter:blur(var(--ua-glass-blur)) saturate(132%) !important;
  backdrop-filter:blur(var(--ua-glass-blur)) saturate(132%) !important;
}

/* Stronger glass for major popups and menus. */
body.ua-authed :where(.modal-content,.dropdown-menu,.nocx-alert-popover,.nocx-user-menu-panel,.ua-comms-modal__dialog,#uaFixContentBox,#uaFixAuthBox,#uaFixConfirm > div,.ua-logout-card){
  background:linear-gradient(180deg,rgba(8,20,38,.72),rgba(3,10,20,.62)) !important;
  background-color:var(--ua-glass-card-strong) !important;
}

/* Bars and strips: unified shell bars, page headers, tab bars, card headers and action strips. */
body.ua-authed :where(
  .ua-unified-shell-block,.ua-unified-stats,.ua-page-windowbar,.ua-shell-gold-line,
  .ua-topbar,.ua-search,.ua-subnav,.ua-ftabs,.nav-tabs,.nav-pills,.pagination,
  .content-header,.page-header,.ua-page-header,.ua-page-hero,.ua-extracted-head,.ua-manual-head,
  .card-header,.box-header,.panel-heading,.card-footer,.box-footer,.panel-footer,
  .ua-comms-modal__head,.ua-comms-modal__foot,.ua-comms-steps,.subsx-head,.subsx-tools,.subsx-search-line,
  .nocx-topbar,.nocx-dashboard-statsbar,.nocx-alert-popover__head,.ua-compact-actions,
  .mtw-head,.mtkhub-head,.syshub-head,.vg-head,.airmax-toolbar,.ua-windowbar
):not(.ua-keep-plain):not(.ua-no-glass){
  background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.035)) !important;
  background-color:var(--ua-glass-bar) !important;
  border-color:var(--ua-glass-line) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.13) !important;
  color:var(--ua-glass-text) !important;
  -webkit-backdrop-filter:blur(16px) saturate(126%) !important;
  backdrop-filter:blur(16px) saturate(126%) !important;
}

/* Sidebar and flyouts: transparent enough to show the shared background without losing readability. */
body.ua-authed :where(.ua-sb3,.ua-sb3-head,.ua-sb3-foot,.ua-sb3-flyout-host){
  background:linear-gradient(180deg,rgba(5,14,27,.64),rgba(3,8,17,.55)) !important;
  border-color:rgba(255,255,255,.08) !important;
  -webkit-backdrop-filter:blur(20px) saturate(128%) !important;
  backdrop-filter:blur(20px) saturate(128%) !important;
}
body.ua-authed :where(.ua-sb3-item,.ua-sb3-link,.ua-pill,.ua-item,.nav-link,.dropdown-item,.page-link){
  background-color:rgba(255,255,255,.045) !important;
  border-color:rgba(255,255,255,.09) !important;
}
body.ua-authed :where(.ua-sb3-item:hover,.ua-sb3-link:hover,.ua-sb3-item.is-active,.ua-sb3-item.is-open,.ua-sb3-link.is-active,.nav-link.active,.nav-pills .nav-link.active){
  background:linear-gradient(90deg,rgba(96,221,255,.16),rgba(243,186,47,.075)) !important;
}

/* Tables: do not let old dark/white table skins cover the page background. */
body.ua-authed :where(table,.table,.subsx-table){
  background:transparent !important;
  background-color:transparent !important;
  color:var(--ua-glass-text) !important;
}
body.ua-authed :where(.table thead,.table thead tr,.subsx-table thead,.subsx-table thead tr,thead,thead tr){
  background:rgba(255,255,255,.085) !important;
  background-color:rgba(255,255,255,.085) !important;
}
body.ua-authed :where(.table th,.table td,.subsx-table th,.subsx-table td,th,td){
  background-color:transparent !important;
  border-color:rgba(255,255,255,.105) !important;
  color:inherit !important;
}
body.ua-authed :where(.table tbody tr,.subsx-table tbody tr,tbody tr){
  background:rgba(255,255,255,.026) !important;
}
body.ua-authed :where(.table tbody tr:nth-child(even),.subsx-table tbody tr:nth-child(even),tbody tr:nth-child(even)){
  background:rgba(255,255,255,.043) !important;
}
body.ua-authed :where(.table-hover tbody tr:hover,.table tbody tr:hover,.subsx-table tbody tr:hover,tbody tr:hover){
  background:rgba(96,221,255,.08) !important;
}

/* Inputs/selects stay readable but no longer opaque blocks. */
body.ua-authed :where(.form-control,.form-select,.input-group-text,input[type="text"],input[type="password"],input[type="number"],input[type="date"],input[type="datetime-local"],input[type="email"],input[type="search"],select,textarea){
  background:rgba(255,255,255,.105) !important;
  background-color:rgba(255,255,255,.105) !important;
  border-color:rgba(255,255,255,.18) !important;
  color:#f8fbff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter:blur(12px) !important;
  backdrop-filter:blur(12px) !important;
}
body.ua-authed :where(input::placeholder,textarea::placeholder){color:rgba(229,238,255,.62) !important;}
body.ua-authed :where(select option){color:#07111f !important;background:#edf5ff !important;}

/* Alerts/badges/notes: transparent glass, not solid masks. */
body.ua-authed :where(.alert,.badge,.label,.ua-badge,.ua-chip,.nocx-stat-chip,.ua-comms-card__top span,.ua-compact-badge,.subsx-meta-chip b,.subsx-autorefresh-note){
  background-color:rgba(255,255,255,.105) !important;
  border-color:rgba(255,255,255,.13) !important;
  color:inherit !important;
}
body.ua-authed :where(.alert-success,.badge-success,.bg-success,.ua-ok){background-color:rgba(34,197,94,.17) !important;color:#d8ffe6 !important;}
body.ua-authed :where(.alert-warning,.badge-warning,.bg-warning,.ua-warn){background-color:rgba(243,186,47,.18) !important;color:#fff2bd !important;}
body.ua-authed :where(.alert-danger,.badge-danger,.bg-danger,.ua-bad){background-color:rgba(239,68,68,.18) !important;color:#ffd4d4 !important;}
body.ua-authed :where(.alert-info,.badge-info,.bg-info,.ua-info){background-color:rgba(59,130,246,.17) !important;color:#dcecff !important;}

/* Page-specific legacy classes seen in the original project. */
body.ua-authed.ua-p-automation-comms :where(.ua-comms-head,.ua-comms-card,.ua-comms-modal__dialog,.ua-router-card,.ua-result-card),
body.ua-authed.ua-p-airmax-monitor-settings :where(.card,.airmax-note,.table-responsive),
body.ua-authed.ua-p-wizard-network :where(.card,.box,.panel,.ua-net-window),
body.ua-authed.ua-p-mikrotik-dashboard :where(.card,.box,.panel,.table-responsive),
body.ua-authed.ua-p-system :where(.card,.box,.panel),
body.ua-authed.ua-p-vouchers :where(.card,.box,.panel,.table-responsive),
body.ua-authed.ua-p-invoices :where(.card,.box,.panel,.table-responsive),
body.ua-authed.ua-p-subscribers :where(.subsx-body,.subsx-table-card,.subsx-gauge,.subsx-head){
  background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.045)) !important;
  background-color:var(--ua-glass-card) !important;
  border-color:var(--ua-glass-line) !important;
}

/* Keep printable/plain pages readable when opened intentionally. */
body.ua-p-print-invoice,
body.ua-p-print-preview,
body.ua-p-vouchers-print,
body.ua-p-settings-print{
  background:#fff !important;
  color:#111 !important;
}
body.ua-p-print-invoice::before,
body.ua-p-print-preview::before,
body.ua-p-vouchers-print::before,
body.ua-p-settings-print::before{display:none !important;}

/* Final sidebar simplification: small icons, no nested icon frames. */
body.ua-authed .ua-sb3 .ua-sb3-item{
  min-height:40px !important;
  grid-template-columns:18px minmax(0,1fr) 26px !important;
  gap:8px !important;
  padding:7px 9px !important;
  margin-bottom:4px !important;
  border:0 !important;
  border-radius:9px !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.ua-authed .ua-sb3 .ua-sb3-item:hover,
body.ua-authed .ua-sb3 .ua-sb3-item.is-active,
body.ua-authed .ua-sb3 .ua-sb3-item.is-open{
  background:rgba(44,199,216,.10) !important;
  border:0 !important;
  box-shadow:inset 3px 0 0 #d9a321 !important;
}
html[dir="ltr"] body.ua-authed .ua-sb3 .ua-sb3-item:hover,
html[dir="ltr"] body.ua-authed .ua-sb3 .ua-sb3-item.is-active,
html[dir="ltr"] body.ua-authed .ua-sb3 .ua-sb3-item.is-open{
  box-shadow:inset -3px 0 0 #d9a321 !important;
}
body.ua-authed .ua-sb3 .ua-sb3-ic{
  width:26px !important;
  height:26px !important;
  min-width:26px !important;
  border:0 !important;
  border-radius:7px !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.ua-authed .ua-sb3 .ua-sb3-ic img{
  width:15px !important;
  height:15px !important;
  opacity:.88 !important;
}
body.ua-authed .ua-sb3 .ua-sb3-ic i{
  font-size:12px !important;
}
body.ua-authed .ua-sb3 .ua-sb3-t{
  font-size:12.5px !important;
}
body.ua-authed .ua-sb3 .ua-sb3-link{
  min-height:34px !important;
  padding:7px 9px !important;
  border:0 !important;
  border-radius:9px !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.ua-authed .ua-sb3 .ua-sb3-link:hover,
body.ua-authed .ua-sb3 .ua-sb3-link.is-active{
  background:rgba(217,163,33,.10) !important;
  border:0 !important;
}
body.ua-authed .ua-sb3 .ua-sb3-link .ua-sb3-ic{
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
}
