/* ==== dashboard.css ==== */
/* Dashboard shell styles */
*{margin:0;padding:0;box-sizing:border-box}
#button_block{display:none}
html,body{height:100%;width:100%;overflow-x:hidden}
body{font-family:Arial,sans-serif;overflow-x:hidden}
.dashboard .messages{display:none !important}
.dashboard {
  display:flex;
  flex-direction:column;
  height:100vh;
  width:100vw;
  max-width:100vw;
  font-size:var(--theme-font);
  overflow:hidden;
  background:var(--theme-bg);
  color:var(--theme-text);
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
  position:relative;
}

/* Theme variables */
:root{
  --theme-color:#007BFF;
  --theme-font:14px;
  --theme-bg:#f0f0f0;
  --theme-surface:#ffffff;
  --theme-surface-raised:#f8f9fa;
  --theme-text:#111111;
  --theme-text-muted:#555555;
  --theme-border:#dbe3f5;
  --theme-input-bg:#ffffff;
  --theme-link:#152c66;
  --theme-shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --theme-shadow-md:0 4px 14px rgba(0,0,0,.12);
  --theme-shadow-lg:0 14px 40px rgba(0,0,0,.16)
}

/* Dark mode theme variable overrides */
html.theme-dark{
  --theme-bg:#0a0e16;
  --theme-surface:#151a23;
  --theme-surface-raised:#1e2530;
  --theme-text:#e0e0e0;
  --theme-text-muted:#aaa;
  --theme-border:#333842;
  --theme-input-bg:#1e2530;
  --theme-shadow-sm:0 1px 3px rgba(0,0,0,.4);
  --theme-shadow-md:0 4px 14px rgba(0,0,0,.5);
  --theme-shadow-lg:0 14px 40px rgba(0,0,0,.6)
}

html.theme-contrast{
  --theme-bg:#000;
  --theme-surface:#000;
  --theme-surface-raised:#111;
  --theme-text:#fff;
  --theme-text-muted:#aaa;
  --theme-border:#fff;
  --theme-input-bg:#000;
  --theme-shadow-sm:0 1px 3px rgba(255,255,255,.1);
  --theme-shadow-md:0 4px 14px rgba(255,255,255,.2);
  --theme-shadow-lg:0 14px 40px rgba(255,255,255,.3)
}

html.theme-colorblind{
  --theme-bg:#f0f0f0;
  --theme-surface:#ffffff;
  --theme-surface-raised:#f8f9fa;
  --theme-text:#111111;
  --theme-text-muted:#555555;
  --theme-border:#0072B2;
  --theme-input-bg:#ffffff;
  --theme-shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --theme-shadow-md:0 4px 14px rgba(0,0,0,.12);
  --theme-shadow-lg:0 14px 40px rgba(0,0,0,.16)
}

/* Carbon fiber theme — neon cyan weave + 3D depth */
html.theme-carbon{
  --theme-bg:#0a0a0a;
  --theme-surface:#111;
  --theme-surface-raised:#1a1a1a;
  --theme-text:#fff;
  --theme-text-muted:#aaa;
  --theme-border:#1a1a1a;
  --theme-input-bg:#111;
  --theme-link:#00ffff;
  --theme-accent:#00ffff;
  --theme-accent-dim:#0a0a0a;
  --theme-shadow-sm:0 0 10px rgba(0,255,255,.3);
  --theme-shadow-md:0 0 20px rgba(0,255,255,.4),0 0 40px rgba(0,255,255,.2);
  --theme-shadow-lg:0 0 30px rgba(0,255,255,.5),0 0 60px rgba(0,255,255,.3),0 0 90px rgba(0,255,255,.15);
  /* carbon fiber weave: tight diagonal stripe alternation like the reference */
  --theme-bg-image:
    repeating-linear-gradient(45deg, #0a0a0a 0px, #0a0a0a 2px, #151515 2px, #151515 4px),
    repeating-linear-gradient(-45deg, #0a0a0a 0px, #0a0a0a 2px, #151515 2px, #151515 4px);
  background-image: var(--theme-bg-image);
  background-size: 6px 6px, 6px 6px;
}
/* subtle vignette so the weave feels inset */
html.theme-carbon .dashboard{
  background: radial-gradient(ellipse at center, var(--theme-bg) 40%, #050608 100%);
}
html.theme-carbon .dashboard,
html.theme-carbon html.theme-carbon body{
  background-attachment: fixed;
}
.theme-no-anim *{transition:none !important;animation:none !important}

/* Page border per theme on root dashboard only */
.dashboard{border:2mm solid}
.theme-dark .dashboard{border-color:#101010}
.theme-contrast .dashboard{border-color:#FFFFFF}
.theme-colorblind .dashboard{border-color:#FFAA00}
.theme-light .dashboard{border-color:#00DDFF}
/* Carbon: header + footer — dark gradient strips with multi-layer neon cyan glow */
.theme-carbon .header{
  background: linear-gradient(to bottom, #1a1a1a, #000);
  border-bottom:2px solid var(--theme-accent);
  box-shadow:0 0 10px var(--theme-accent),0 0 20px var(--theme-accent),0 0 40px var(--theme-accent),inset 0 0 10px var(--theme-accent),0 2px 5px rgba(0,0,0,.5);
}
.theme-carbon .footer{
  background: linear-gradient(to top, #1a1a1a, #000);
  border-top:2px solid var(--theme-accent);
  box-shadow:0 0 10px var(--theme-accent),0 0 20px var(--theme-accent),0 0 40px var(--theme-accent),inset 0 0 10px var(--theme-accent),0 -2px 5px rgba(0,0,0,.5);
}
/* Dashboard page: neon cyan border + glow + 3D inset depth on content area */
.theme-carbon .dashboard{
  border:2mm solid var(--theme-accent);
  box-shadow:0 0 10px rgba(0,255,255,.5),0 0 24px rgba(0,255,255,.3),0 0 40px rgba(0,255,255,.15),inset 0 0 30px rgba(0,0,0,.6);
}
.theme-carbon .middle-section{
  box-shadow:inset 0 10px 20px rgba(0,0,0,.7);
}
.theme-carbon .dashboard-widget{
  border-color:rgba(0,255,255,.4);
  box-shadow:0 0 8px rgba(0,255,255,.3),var(--theme-shadow-md);
}
/* Carbon mode: Sani device SVG glow */
.theme-carbon .sani-device-full{
  box-shadow:0 0 18px rgba(0,255,255,.35),0 0 40px rgba(0,255,255,.15),0 8px 32px rgba(0,0,0,.35);
}
.theme-carbon .sani-device-full svg{
  filter:drop-shadow(0 0 10px rgba(0,255,255,.4)) drop-shadow(0 0 24px rgba(0,255,255,.15));
}

/* QR page mobile optimizations */
@media (max-width: 600px) {
  .qr-stat-blocks{
    flex-direction: column;
    align-items: stretch;
  }
  .qr-stat-block{
    min-width: auto;
    text-align: left;
  }
  .qr-card-title{
    font-size: 18px;
  }
  .qr-card-actions{
    flex-direction: column-reverse;
  }
  .qr-card-actions .btn{
    width: 100%;
  }
  .qr-divider{
    margin: 12px 0;
  }
  .qr-section-title{
    font-size: 18px;
    margin-top: 16px;
  }
  .qr-form{
    padding: 8px;
  }
  .qr-field{
    flex-direction: column;
    gap: 4px;
  }
  .qr-field label{
    font-size: 13px;
  }
  .qr-input{
    font-size: 16px;
    padding: 10px;
  }
  .qr-input--sm{
    font-size: 16px;
    padding: 10px;
  }
  .dialog-buttons{
    flex-direction: column;
    gap: 8px;
  }
  .dialog-buttons .primary,.dialog-buttons .secondary{
    width: 100%;
  }
  .qr-badge{
    font-size: 12px;
  }
  /* Hide columns on mobile - prioritize essential info */
  .qr-col-hidden{
    display: none !important;
  }
  .qr-table th, .qr-table td{
    padding: 8px 6px;
    font-size: 12px;
  }
  .qr-table th{
    position: static !important;
    background: var(--theme-surface-raised);
  }
  .qr-table tr{
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
    border: 1px solid var(--theme-border);
    border-radius: 8px;
    overflow: hidden;
  }
  .qr-table tr td{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    padding: 8px 10px;
    font-size: 13px;
  }
  .qr-table tr td::before{
    content: attr(data-column);
    font-weight: 600;
    color: var(--theme-text-muted);
    margin-right: 8px;
  }
  /* Action buttons at bottom on mobile */
  .qr-table tr .qr-col-action{
    flex-direction: column;
    gap: 4px;
    width: 100%;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--theme-border);
  }
  .qr-table tr .qr-col-action .btn{
    width: 100%;
    justify-content: center;
  }
  /* Bulk actions on mobile */
  .qr-bulk-actions{
    flex-direction: column;
    gap: 8px;
  }
  .qr-bulk-actions .btn{
    width: 100%;
  }
}

@media (max-width: 400px) {
  .qr-stat-num{
    font-size: 22px;
  }
  .qr-card{
    padding: 12px 16px;
  }
}

/* Header / footer: same glass shell, reliable stacking context */
.header, .footer{background:var(--theme-color);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);color:#fff;position:relative}
.header{border-bottom:1px solid rgba(255,255,255,.3);display:flex;align-items:center;padding:0 12px;gap:10px;box-shadow:0 2px 5px rgba(0,0,0,.1);z-index:50}
/* Footer sits at viewport bottom; the dashboard body scrolls above it. */
.footer{border-top:1px solid rgba(255,255,255,.3);display:flex;justify-content:space-between;align-items:center;padding:0 15px;box-shadow:0 -2px 5px rgba(0,0,0,.1);z-index:5;position:absolute;left:0;right:0;bottom:0;height:56px}
/* Reserve footer height inside the dashboard body so content never slides under it. */
.dashboard{padding-bottom:56px}
.dashboard .footer{position:absolute;left:0;right:0;bottom:0;height:56px}
.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.u-hidden{display:none}
.icon-btn{background:none;border:none;cursor:pointer;font-size:16px;color:inherit}
.ghost-btn{background:transparent;border:none;color:inherit;cursor:pointer}
.inline-form{display:inline}

/* Tray toggle */
#trayToggle{background:rgba(0,0,0,.25);color:#fff;border:1px solid rgba(255,255,255,.85);width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:18px;display:inline-flex;align-items:center;justify-content:center;padding:0;line-height:1}
.tray-toggle{background:rgba(0,0,0,.2);color:#fff;border:1px solid #fff;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center}
.theme-dark #trayToggle{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.6)}
.theme-contrast #trayToggle{background:#000;color:#fff;border:2px solid #fff}

/* Header buttons */
.logout-button{background:#dc3545;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:12px;text-decoration:none}
.logout-button:hover{background:#a71d2a}
.notifications{background:#ff6b6b;color:#fff;padding:5px 10px;border-radius:15px;font-size:12px}

/* Theme quick menu: must stack above everything */
.theme-dropdown{position:relative;display:inline-flex;z-index:60}
.theme-quick{background:rgba(255,255,255,.15);border:1px solid #fff;color:#fff;width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;line-height:1}
.theme-quick:hover{background:rgba(255,255,255,.35)}
.theme-menu{display:none;position:absolute;top:34px;right:0;background:#fff;color:#222;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.25);overflow:hidden;min-width:130px;z-index:70}
.theme-menu div{padding:8px 14px;font-size:13px;cursor:pointer;white-space:nowrap}
.theme-menu div:hover{background:#f0f0f0}

/* Middle section depths */
.middle-section-wrapper{position:relative;overflow:auto;min-height:0;flex:1 1 auto}
#display-area{position:relative;height:100%;padding:0 15px 56px 15px;box-sizing:border-box;z-index:1}
.middle-section{position:relative;background:var(--theme-bg);display:flex;align-items:flex-start;justify-content:flex-start;padding:15px 15px 0 15px;font-size:18px;color:var(--theme-text);overflow-y:auto;overflow-x:hidden}
.middle-section.has-bg{color:var(--theme-text)}
#dashboardLayer{position:absolute;top:0;left:0;right:0;bottom:100px;pointer-events:none;z-index:2}
.dashboard-widget{position:absolute;background:var(--theme-surface);border-radius:8px;box-shadow:var(--theme-shadow-md);padding:10px;pointer-events:auto;cursor:move;user-select:none;min-width:120px;max-width:calc(100% - 20px);min-height:90px;max-height:calc(100% - 10px);transition:box-shadow .3s ease;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--theme-border)}

/* Theme: background/text/surfaces */
/* =========================================================
   THEME: backgrounds, surfaces, widgets, parity overrides
   ========================================================= */
.theme-dark .dashboard,.dashboard.theme-dark{background:var(--theme-bg);color:var(--theme-text)}
.theme-contrast .dashboard,.dashboard.theme-contrast{background:var(--theme-bg);color:var(--theme-text)}
.theme-light .dashboard,.dashboard.theme-light{background:var(--theme-bg);color:var(--theme-text)}
.theme-colorblind .dashboard,.dashboard.theme-colorblind{background:var(--theme-bg);color:var(--theme-text)}

.theme-dark .content-overlay,.theme-contrast .content-overlay{background:rgba(255,255,255,.04)}

/* Content overlay scrim */
.content-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.05);transition:opacity .3s ease;opacity:0;pointer-events:none;z-index:1}
.content-overlay.active{opacity:1;pointer-events:all}

/* Slider tray */
.slider-tray{position:absolute;top:0;left:-40%;width:40%;height:100%;background:rgba(120,120,120,.8);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);transition:left .3s ease;display:flex;flex-direction:column;padding:15px;gap:10px;overflow-y:auto;border-right:1px solid rgba(255,255,255,.2);z-index:40}
.slider-tray.visible{left:0}
.slider-tray .accordion-button,.slider-tray .subfolder-button{color:#fff}
.accordion-button{padding:10px;background:rgba(80,80,80,.5);border:1px solid rgba(255,255,255,.15);border-radius:5px;cursor:pointer;text-align:left;font-size:14px;width:100%;color:#fff}
.accordion-button:hover{background:rgba(100,100,100,.6)}
.subfolder-button{padding-left:20px;background:rgba(60,60,60,.4);border:none;width:100%;text-align:left;cursor:pointer;font-size:13px;display:none;padding:8px;color:#fff;border-radius:3px}
.subfolder-button:hover{background:rgba(100,100,100,.5)}
.subfolder-button.sep{border-top:1px solid rgba(255,255,255,.2);margin-top:6px;padding-top:14px}
.settings-section{margin-top:auto;padding:10px;border-top:1px solid rgba(255,255,255,.3);color:#fff}
/* Native dropdown/option popups follow OS dark rendering unless told otherwise;
   this keeps <select> option lists legible in every non-light theme. */
html.theme-dark,html.theme-contrast,html.theme-colorblind{color-scheme:dark}
html.theme-light{color-scheme:light}

/* Bootstrap theme overrides for unified look */
.theme-dark body,.theme-contrast body{background:var(--theme-bg);color:var(--theme-text)}
.theme-dark .card,.theme-contrast .card{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border);box-shadow:var(--theme-shadow-md)}
.theme-dark .btn-primary,.theme-contrast .btn-primary{background:#0d6efd;border-color:#0d6efd;color:#fff}
.theme-dark .btn-outline-primary,.theme-contrast .btn-outline-primary{color:#0d6efd;border-color:#0d6efd}
.theme-dark .btn-secondary,.theme-contrast .btn-secondary{background:#6c757d;border-color:#6c757d;color:#fff}
.theme-dark .btn-outline-secondary,.theme-contrast .btn-outline-secondary{color:#6c757d;border-color:#6c757d}
.theme-dark .form-control,.theme-contrast .form-control,.theme-colorblind .form-control{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .form-select,.theme-contrast .form-select,.theme-colorblind .form-select{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .table,.theme-contrast .table{color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark thead tr,.theme-contrast thead tr{background:var(--theme-surface-raised)}
.theme-dark th,.theme-contrast th{color:var(--theme-text);border-bottom-color:var(--theme-border)}
.theme-dark td,.theme-contrast td{border-bottom-color:var(--theme-border)}
.theme-dark .alert,.theme-contrast .alert{background:var(--theme-surface-raised);color:var(--theme-text);border-color:var(--theme-border)}
.theme-colorblind .form-control,.theme-colorblind .form-select{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-colorblind .table{color:var(--theme-text);border-color:var(--theme-border)}
.theme-colorblind .btn-primary{background:#0072B2;border-color:#0072B2;color:#fff}
.theme-colorblind .btn-outline-primary{color:#0072B2;border-color:#0072B2}


/* Public QR/tracker pages */
body.public-page{background:var(--theme-bg);color:var(--theme-text)}
body.public-page .card{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border);box-shadow:var(--theme-shadow-md)}
body.public-page .badge{background:var(--theme-badge-bg,#e9ecef);color:var(--theme-text)}
body.public-page .muted{color:var(--theme-text-muted)}
body.public-page table th{background:var(--theme-surface-raised);color:var(--theme-text);border-bottom-color:var(--theme-border)}
body.public-page table td{border-bottom-color:var(--theme-border)}
body.public-page .sec{border-top-color:var(--theme-border)}
body.public-page .modal{background:var(--theme-surface);color:var(--theme-text);border:1px solid var(--theme-border)}
body.public-page .modal input{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
body.public-page .role-card{background:var(--theme-surface);border-color:var(--theme-border)}
body.public-page .login-note{background:var(--theme-surface-raised);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark body.public-page .card{background:#111827;border-color:#374151}
.theme-dark body.public-page table th{background:#0f172a}
.theme-contrast body.public-page .card{background:#000;border:2px solid #fff}
.theme-contrast body.public-page .modal{background:#000;border:2px solid #fff}





/* Html-level theme support: applyTheme now also tags <html> */
html.theme-light{background:var(--theme-bg);color:var(--theme-text)}
html.theme-dark{background:var(--theme-bg);color:var(--theme-text)}
html.theme-contrast{background:var(--theme-bg);color:var(--theme-text)}
html.theme-colorblind{background:var(--theme-bg);color:var(--theme-text)}
html.theme-dark body,html.theme-contrast body,html.theme-colorblind body{background:transparent;color:inherit}

/* Body-level theme support for pages without .dashboard wrapper */
body.theme-light{background:var(--theme-bg);color:var(--theme-text)}
body.theme-dark{background:var(--theme-bg);color:var(--theme-text)}
body.theme-contrast{background:var(--theme-bg);color:var(--theme-text)}
body.theme-colorblind{background:var(--theme-bg);color:var(--theme-text)}
body.theme-dark .card,body.theme-contrast .card,body.theme-colorblind .card{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border);box-shadow:var(--theme-shadow-md)}
body.theme-dark .btn-primary,body.theme-contrast .btn-primary,body.theme-colorblind .btn-primary{background:#0d6efd;border-color:#0d6efd;color:#fff}
body.theme-dark .btn-outline-primary,body.theme-contrast .btn-outline-primary,body.theme-colorblind .btn-outline-primary{color:#0d6efd;border-color:#0d6efd}
body.theme-dark .btn-secondary,body.theme-contrast .btn-secondary,body.theme-colorblind .btn-secondary{background:#6c757d;border-color:#6c757d;color:#fff}
body.theme-dark .btn-outline-secondary,body.theme-contrast .btn-outline-secondary,body.theme-colorblind .btn-outline-secondary{color:#6c757d;border-color:#6c757d}
body.theme-dark .form-control,body.theme-contrast .form-control,body.theme-colorblind .form-control{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
html.theme-dark .form-control,html.theme-contrast .form-control,html.theme-colorblind .form-control{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
html[data-bs-theme="dark"] .form-control,html[data-bs-theme="contrast"] .form-control,html[data-bs-theme="colorblind"] .form-control{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
body.theme-dark .form-select,body.theme-contrast .form-select,body.theme-colorblind .form-select{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
html.theme-dark .form-select,html.theme-contrast .form-select,html.theme-colorblind .form-select{background-color:#1e1e1e !important;color:#f0f0f0 !important;border-color:#555 !important;background-image:none !important}
html[data-bs-theme="dark"] .form-select,html[data-bs-theme="contrast"] .form-select,html[data-bs-theme="colorblind"] .form-select{background-color:#1e1e1e !important;color:#f0f0f0 !important;border-color:#555 !important;background-image:none !important}
body.theme-dark .table,body.theme-contrast .table,body.theme-colorblind .table{color:var(--theme-text);border-color:var(--theme-border)}
body.theme-dark thead tr,body.theme-contrast thead tr,body.theme-colorblind thead tr{background:var(--theme-surface-raised)}
body.theme-dark th,body.theme-contrast th,body.theme-colorblind th{color:var(--theme-text);border-bottom-color:var(--theme-border)}
body.theme-dark td,body.theme-contrast td,body.theme-colorblind td{border-bottom-color:var(--theme-border)}
body.theme-dark .alert,body.theme-contrast .alert,body.theme-colorblind .alert{background:var(--theme-surface-raised);color:var(--theme-text);border-color:var(--theme-border)}
body.theme-dark .modal-content,body.theme-contrast .modal-content,body.theme-colorblind .modal-content{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border)}
body.theme-dark .modal-header,body.theme-contrast .modal-header,body.theme-colorblind .modal-header{border-bottom-color:var(--theme-border)}
body.theme-dark .modal-footer,body.theme-contrast .modal-footer,body.theme-colorblind .modal-footer{border-top-color:var(--theme-border)}
body.theme-dark .text-muted,body.theme-contrast .text-muted,body.theme-colorblind .text-muted{color:var(--theme-text-muted) !important}
body.theme-dark .border,body.theme-contrast .border,body.theme-colorblind .border{border-color:var(--theme-border) !important}
body.theme-dark .header,body.theme-contrast .header,body.theme-colorblind .header{background:var(--theme-color);color:#fff}
body.theme-dark .footer,body.theme-contrast .footer,body.theme-colorblind .footer{background:var(--theme-color);color:#fff}

/* Sidebar category accents */
.sb-border-business{border-left-color:#0F62FE}
.theme-dark .sb-border-business,.theme-contrast .sb-border-business{border-left-color:#6d9eeb}
.theme-colorblind .sb-border-business{border-left-color:#0072B2}

.sb-border-business-alt{border-left-color:#F1A21E}
.theme-dark .sb-border-business-alt,.theme-contrast .sb-border-business-alt{border-left-color:#f5b454}
.theme-colorblind .sb-border-business-alt{border-left-color:#E69F00}

.sb-border-location{border-left-color:#F1A21E}
.theme-dark .sb-border-location,.theme-contrast .sb-border-location{border-left-color:#f5b454}
.theme-colorblind .sb-border-location{border-left-color:#E69F00}

.sb-border-partners{border-left-color:#198038}
.theme-dark .sb-border-partners,.theme-contrast .sb-border-partners{border-left-color:#4caf50}
.theme-colorblind .sb-border-partners{border-left-color:#0072B2}

.sb-border-tools{border-left-color:#0F62FE}
.theme-dark .sb-border-tools,.theme-contrast .sb-border-tools{border-left-color:#6d9eeb}
.theme-colorblind .sb-border-tools{border-left-color:#0072B2}

.sb-border-messenger{border-left-color:#8a3ffc}
.theme-dark .sb-border-messenger,.theme-contrast .sb-border-messenger{border-left-color:#b78dfc}
.theme-colorblind .sb-border-messenger{border-left-color:#0072B2}

.sb-border-admin{border-left-color:#da1e28}
.theme-dark .sb-border-admin,.theme-contrast .sb-border-admin{border-left-color:#ff5f68}
.theme-colorblind .sb-border-admin{border-left-color:#D55E00}

.sb-border-storage{border-left-color:#4B32C3}
.theme-dark .sb-border-storage,.theme-contrast .sb-border-storage{border-left-color:#8c75d8}
.theme-colorblind .sb-border-storage{border-left-color:#0072B2}

.sb-border-settings{border-left-color:#C62E7D}
.theme-dark .sb-border-settings,.theme-contrast .sb-border-settings{border-left-color:#e8789d}
.theme-colorblind .sb-border-settings{border-left-color:#D55E00}

.sb-issue-white{color:#fff}

.active-device-link{border-left-color:#198038}
.theme-dark .active-device-link,.theme-contrast .active-device-link{border-left-color:#4caf50}
.theme-colorblind .active-device-link{border-left-color:#0072B2}
.theme-dark .sb-issue-white,.theme-contrast .sb-issue-white{color:#fff}
.theme-colorblind .sb-issue-white{color:#fff}

.settings-section h3{font-size:14px;margin-bottom:10px;color:var(--theme-text)}
.settings-button{display:block;width:100%;padding:8px;margin-bottom:5px;background:#0d6efd;color:#fff;border:none;border-radius:3px;cursor:pointer;font-size:13px}
.settings-button:hover{background:#138496}
.scroll-text{height:100px;overflow-y:auto;border:1px solid var(--theme-border);padding:10px;background:var(--theme-surface-raised);margin-top:10px;font-size:12px;color:var(--theme-text)}

/* QR toggle */
#qrTableToggle{background:rgba(255,255,255,.15);border:2px solid #fff;color:#fff;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;padding:0}
#qrTableToggle:hover{background:rgba(255,255,255,.35)}

/* Notifications */
.notification-panel{position:fixed;top:60px;right:20px;width:360px;max-height:420px;background:var(--theme-surface);border:1px solid var(--theme-border);border-radius:8px;box-shadow:var(--theme-shadow-md);display:none;flex-direction:column;overflow:hidden;z-index:20;color:var(--theme-text)}
.notification-panel.visible{display:flex}
.notification-panel-header{padding:12px;border-bottom:1px solid var(--theme-border);font-weight:bold;display:flex;justify-content:space-between;align-items:center}
.notification-list{overflow-y:auto;max-height:340px;padding:8px}
.notification-item{padding:10px;border-radius:6px;margin-bottom:8px;border-left:4px solid var(--theme-border);background:var(--theme-surface-raised);color:var(--theme-text);cursor:pointer;transition:background .2s}
.notification-item:hover{background:var(--theme-border)}
.notification-item.success{border-left-color:#28a745;background:rgba(40,167,69,.15)}
.notification-item.warning{border-left-color:#ffc107;background:rgba(255,193,7,.15)}
.notification-item.error{border-left-color:#dc3545;background:rgba(220,53,69,.15)}
.notification-item.info{border-left-color:#17a2b8;background:rgba(23,162,184,.15)}
.notification-item.messenger{border-left-color:#6c63ff;background:rgba(108,99,255,.15)}
.notification-time{font-size:11px;color:var(--theme-text-muted);margin-top:4px}

/* Toasts */
.toast{position:fixed;bottom:70px;right:20px;padding:12px 18px;border-radius:6px;color:#fff;font-size:13px;box-shadow:0 4px 12px rgba(0,0,0,.2);animation:slideIn .3s ease,fadeOut .3s ease 2.7s forwards;max-width:320px;cursor:pointer}
.toast.success{background:#28a745}
.toast.warning{background:#ffc107;color:#212529}
.toast.error{background:#dc3545}
.toast.info{background:#17a2b8}
@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes fadeOut{to{opacity:0;transform:translateY(-10px)}}

/* Widgets */
.add-widget-btn{background:rgba(255,255,255,.15);border:1px solid #fff;color:#fff;padding:5px 12px;border-radius:15px;cursor:pointer;font-size:12px;margin-right:12px}
.add-widget-btn:hover{background:rgba(255,255,255,.3)}
.dashboard-layer{position:absolute;top:0;left:0;right:0;bottom:100px;pointer-events:none}
.dashboard-widget:hover{box-shadow:var(--theme-shadow-md)}
.dashboard-widget-header{display:flex;justify-content:space-between;padding-bottom:5px;margin-bottom:8px;border-bottom:1px solid var(--theme-border);font-weight:bold;font-size:13px;color:var(--theme-text)}
.dashboard-widget-controls span{cursor:pointer;margin-left:8px}
.widget-body{overflow-y:auto;flex:1;display:flex;flex-direction:column;min-height:0;font-size:12px;color:var(--theme-text)}
.dashboard-widget a{color:var(--theme-color);text-decoration:none}
.widget-resize-handle{position:absolute;right:2px;bottom:2px;width:16px;height:16px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 50%,rgba(0,0,0,.25) 50%);border-radius:0 0 6px 0}

/* Widget internals */
.widget-messenger{display:flex;flex-direction:column;flex:1;min-height:0}
.widget-messenger .messenger-log{position:relative;flex:1;min-height:60px}
/* composer follows the widget width; input grows, send button stays pinned inside */
.widget-messenger .messenger-form{display:flex;align-items:center;gap:6px;width:100%;padding:0}
.widget-messenger .messenger-form .messenger-input{flex:1 1 auto;min-width:0;width:100%}
.widget-messenger .messenger-form .btn,
.widget-messenger .messenger-form button{flex:0 0 auto}
.dashboard-widget.widget-todo{width:min(720px, calc(100vw - 40px)) !important;max-width:calc(100vw - 40px)}
.widget-todo{display:flex;flex:1;flex-direction:column;min-height:0;font-size:12px;overflow:hidden}
.todo-items{flex:1;min-height:0;overflow-y:auto;padding-right:2px}
.todo-item{display:flex;align-items:center;gap:7px;min-height:28px;padding:3px 0;border-bottom:1px solid rgba(128,128,128,.16)}
.todo-item span{flex:1;min-width:0;overflow-wrap:anywhere}
.todo-item input[type=checkbox]{flex:none}
.todo-remove,.todo-add,.todo-import,.todo-clear{display:inline-flex;align-items:center;justify-content:center;width:28px;height:26px;margin:0;padding:0;border:1px solid var(--theme-border);border-radius:4px;background:var(--theme-surface-raised);color:var(--theme-text);cursor:pointer;font-size:16px;line-height:1}
.todo-remove{width:22px;height:22px;border-color:transparent;background:transparent;color:var(--theme-text-muted);font-size:18px}
.todo-remove:hover{background:var(--theme-border);color:var(--theme-text)}
.todo-toolbar{display:flex;align-items:center;gap:5px;padding-top:7px;border-top:1px solid var(--theme-border)}
.todo-toolbar input[type=text]{flex:1;min-width:0;margin:0;box-sizing:border-box;padding:5px 7px;border:1px solid var(--theme-border);border-radius:4px;background:var(--theme-input-bg);color:var(--theme-text)}
.todo-add{background:var(--theme-color);border-color:var(--theme-color);color:#fff}
.widget-chart{display:flex;align-items:flex-end;justify-content:space-between;height:150px;gap:4px;padding:6px 2px}
.widget-chart .bar{flex:1;background:#17a2b8;border-radius:3px 3px 0 0;min-width:8px}
.chart-controls{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:6px}
.chart-controls label{color:var(--theme-text-muted);font-size:10px;font-weight:700}
.chart-controls select{display:block;width:100%;margin-top:2px;padding:3px;border:1px solid var(--theme-border);border-radius:3px;background:var(--theme-input-bg);color:var(--theme-text);font-size:10px}
.widget-chart-canvas{display:block;width:100%;height:170px;min-height:100px}
.chart-status{margin:4px 0 0;font-size:10px}
.todo-import{color:var(--theme-color)}
.todo-clear{border-color:#dc3545;color:#dc3545}
.widget-cap{font-size:10px;color:#666;margin:4px 0 0;text-align:center}
.issue-widget-row{cursor:pointer}
.issue-widget-row:focus-visible{outline:2px solid var(--theme-color);outline-offset:2px}
.widget-counter{text-align:center;padding:8px}
.widget-counter .num{font-size:34px;font-weight:bold;color:var(--theme-color)}
.widget-counter div:last-child{font-size:11px;color:#555;margin-top:4px}
.qr-widget-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;text-align:center}
.qr-widget-stats>div{padding:8px 4px;border:1px solid var(--theme-border);border-radius:5px;background:var(--theme-surface-raised)}
.qr-widget-stats .num{display:block;font-size:26px;font-weight:700;color:var(--theme-color)}
.qr-widget-stats span:last-child{display:block;font-size:10px;color:var(--theme-text-muted)}
.qr-widget-link{display:block;margin-top:8px;text-align:center;font-size:11px}

/* Analog clock */
.analog-clock{width:90px;height:90px;border-radius:50%;background:#fff;border:2px solid #333;position:relative;margin:0 auto}
.clock-center{position:absolute;top:50%;left:50%;width:8px;height:8px;margin:-4px 0 0 -4px;background:#333;border-radius:50%}
.clock-hour,.clock-minute,.clock-second{position:absolute;top:50%;left:50%;transform-origin:50% 0%}
.clock-hour{width:4px;height:26px;margin:0 0 0 -2px;background:#333}
.clock-minute{width:3px;height:36px;margin:0 0 0 -1.5px;background:#666}
.clock-second{width:1px;height:40px;margin:0 0 0 -0.5px;background:#f00}

/* Add Widget dialog */
.add-widget-dialog{display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:320px;background:#fff;border-radius:8px;box-shadow:0 5px 20px rgba(0,0,0,.3);padding:20px;color:#333;z-index:4}
.add-widget-dialog.active{display:block}
.add-widget-dialog h3{margin-top:0;color:#333}
.widget-type-list{display:flex;flex-wrap:wrap;gap:10px;margin:15px 0}

/* Generic modal shell: used by QR modal-root if active class applied */
.modal-root{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:stretch;justify-content:stretch;z-index:80;padding:0}
.modal-root.active{display:flex}
/* Extension modal: draggable + resizable — panel uses fixed positioning */
#extensionModal .modal-panel{
  position:fixed;left:0;top:0;right:0;bottom:0;
  width:auto;height:auto;min-width:280px;min-height:200px;
}
#extensionModal.drag-moving .modal-panel{cursor:grabbing}
#extensionModal .modal-header{cursor:move;user-select:none}
.modal-resize-handles{position:absolute;inset:-6px;z-index:10}
.modal-resize-handle{position:absolute;pointer-events:auto;width:14px;height:14px;font-size:9px;line-height:1;color:#888;text-align:center;background:rgba(0,0,0,.15);border-radius:2px;cursor:default}
.modal-resize-handle.dir-n{top:-7px;left:50%;transform:translateX(-50%);cursor:ns-resize}
.modal-resize-handle.dir-s{bottom:-7px;left:50%;transform:translateX(-50%);cursor:ns-resize}
.modal-resize-handle.dir-w{left:-7px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.modal-resize-handle.dir-e{right:-7px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.modal-resize-handle.dir-nw{top:-7px;left:-7px;cursor:nwse-resize}
.modal-resize-handle.dir-ne{top:-7px;right:-7px;cursor:nwse-resize}
.modal-resize-handle.dir-sw{bottom:-7px;left:-7px;cursor:nwse-resize}
.modal-resize-handle.dir-se{bottom:-7px;right:-7px;cursor:nwse-resize}
.theme-dark .modal-root{background:rgba(10,14,22,0.96)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid #eee;font-weight:700;font-size:14px}
.modal-close{background:none;border:none;font-size:18px;cursor:pointer;color:#666;line-height:1}
.modal-body{padding:14px}
.dialog-buttons{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.dialog-buttons .primary{background:#17a2b8;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer}
.dialog-buttons .secondary{background:#ccc;color:#333;border:none;padding:6px 12px;border-radius:4px;cursor:pointer}

/* =========================================================
   THEME: dark/contrast surface, text, widget, and WCAG fixes
   ========================================================= */
.theme-dark :focus-visible,.theme-contrast :focus-visible{outline:2px solid var(--theme-color);outline-offset:2px}
.theme-dark .dashboard-widget,.theme-contrast .dashboard-widget{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border);box-shadow:var(--theme-shadow-md)}
.theme-contrast .dashboard-widget{background:#000;border:2px solid #fff;color:#fff;box-shadow:none}
.theme-dark .dashboard-widget-header,.theme-contrast .dashboard-widget-header{border-bottom-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .dashboard-widget .widget-body,.theme-contrast .dashboard-widget .widget-body{color:var(--theme-text)}
.theme-dark .dashboard-widget a,.theme-contrast .dashboard-widget a{color:var(--theme-link)}
.theme-dark textarea.widget-notes,.theme-contrast textarea.widget-notes,.theme-colorblind textarea.widget-notes{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .widget-todo input[type=text],.theme-contrast .widget-todo input[type=text],.theme-colorblind .widget-todo input[type=text]{background:var(--theme-input-bg);color:var(--theme-text);border:1px solid var(--theme-border)}
.theme-dark .widget-chart .bar,.theme-contrast .widget-chart .bar{background:var(--theme-color)}

.messages{list-style:none;padding:10px;margin:0;background:#fff;border-bottom:1px solid #ddd}
.messages li{margin:4px 0}
.messages .error{color:#b00020}
.messages .success{color:#1b5e20}
.errorlist{list-style:none;margin:6px 0 0;padding:6px 10px;background:#3a1212;color:#ffb4b4;border:1px solid #b00020;border-radius:8px;font-size:13px;font-weight:700}
.errorlist li:before{content:"\26a0 ";font-weight:900}
.theme-dark .errorlist,.theme-contrast .errorlist{background:#2a1414;color:#ffc1c1;border-color:#ff5252}

.theme-dark .notification-panel,.theme-contrast .notification-panel{background:var(--theme-surface);color:var(--theme-text);border:1px solid var(--theme-border)}
.theme-dark .notification-panel-header,.theme-contrast .notification-panel-header{color:var(--theme-text);border-bottom-color:var(--theme-border)}
.theme-dark .notification-item,.theme-contrast .notification-item{background:var(--theme-surface-raised);color:var(--theme-text)}
.theme-dark .notification-item:hover,.theme-contrast .notification-item:hover{background:var(--theme-border)}
.theme-dark .notification-time,.theme-contrast .notification-time{color:var(--theme-text-muted)}
.theme-dark .theme-menu,.theme-contrast .theme-menu,.theme-colorblind .theme-menu{background:var(--theme-surface);color:var(--theme-text)}
.theme-dark .theme-menu div:hover,.theme-contrast .theme-menu div:hover,.theme-colorblind .theme-menu div:hover{background:var(--theme-surface-raised)}

.theme-dark p,.theme-contrast p{color:var(--theme-text-muted)}
.theme-dark a,.theme-contrast a{color:var(--theme-link)}
.theme-dark input,.theme-contrast input,.theme-dark select,.theme-contrast select,.theme-dark textarea,.theme-contrast textarea,.theme-colorblind input,.theme-colorblind select,.theme-colorblind textarea{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark table,.theme-contrast table,.theme-dark tbody,.theme-contrast tbody{background:transparent;color:var(--theme-text)}
.theme-dark tbody tr:nth-child(even),.theme-contrast tbody tr:nth-child(even){background:var(--theme-surface-raised)}
.theme-dark thead tr,.theme-contrast thead tr{background:var(--theme-surface-raised)}
.theme-dark th,.theme-contrast th{color:var(--theme-text);border-bottom:1px solid var(--theme-border)}
.theme-dark td,.theme-contrast td{border-bottom:1px solid var(--theme-border)}
.theme-dark .card,.theme-contrast .card{background:var(--theme-surface);color:var(--theme-text);box-shadow:var(--theme-shadow-md)}
.theme-contrast .card{background:#000;border:2px solid #fff;box-shadow:none}
.theme-dark .card h2,.theme-dark .card h3,.theme-contrast .card h2,.theme-contrast .card h3{color:var(--theme-text)}

.theme-dark .widget-device,.theme-contrast .widget-device{color:var(--theme-text)}
.theme-dark .widget-device td,.theme-contrast .widget-device td{color:var(--theme-text);border:none}
.widget-device .muted-text{color:var(--theme-text-muted) !important}

.theme-dark .widget-type-option,.theme-contrast .widget-type-option,.theme-colorblind .widget-type-option{background:var(--theme-surface-raised);color:var(--theme-text)}
.theme-dark .widget-type-option:hover,.theme-contrast .widget-type-option:hover,.theme-colorblind .widget-type-option:hover{background:var(--theme-border)}
.theme-dark .widget-refresh,.theme-contrast .widget-refresh{color:var(--theme-text)}
.theme-dark .settings-button,.theme-contrast .settings-button{color:var(--theme-text)}
.theme-dark .dialog-buttons .secondary,.theme-contrast .dialog-buttons .secondary{background:var(--theme-surface-raised);color:var(--theme-text)}
.theme-dark .messenger-older-btn,.theme-contrast .messenger-older-btn{background:var(--theme-surface-raised);color:var(--theme-text-muted);border-color:var(--theme-border)}
.theme-dark .messenger-form input:disabled,.theme-contrast .messenger-form input:disabled,.theme-colorblind .messenger-form input:disabled{background:var(--theme-surface-raised)}

.theme-dark .display-area,.theme-dark .widget-body,.theme-dark .settings-panel,.theme-dark .middle-section{color:var(--theme-text)}
.theme-dark .content-overlay{background:rgba(255,255,255,.04)}

/* High-contrast mode: solid black + white borders */
.theme-contrast .dashboard,.dashboard.theme-contrast{background:#000 !important;color:#fff !important;border-color:#fff !important}
.theme-contrast .content-overlay{background:rgba(255,255,255,.08) !important}
.theme-contrast .dashboard-widget{background:#000 !important;border:2px solid #fff !important;color:#fff !important;box-shadow:none !important}
.theme-contrast .dashboard-widget-header{border-bottom:2px solid #fff !important;color:#fff !important}
.theme-contrast .dashboard-widget .widget-body{color:#fff !important}
.theme-contrast .dashboard-widget a{color:#7ec8ff !important;text-decoration:underline !important}
.theme-contrast textarea.widget-notes,.theme-contrast .widget-todo input[type=text]{background:#000 !important;color:#fff !important;border:2px solid #fff !important}
.theme-contrast .widget-chart .bar{background:#fff !important;outline:2px solid #000 !important}
.theme-contrast .widget-cap,.theme-contrast .widget-counter .num,.theme-contrast .widget-counter div:last-child{color:#fff !important}
.theme-contrast .messages{background:#000 !important;border-bottom:2px solid #fff !important;color:#fff !important}
.theme-contrast .errorlist{background:#000 !important;border:2px solid #fff !important;color:#ff8a8a !important}
.theme-contrast .notification-panel{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .notification-panel-header{border-bottom:2px solid #fff !important;color:#fff !important}
.theme-contrast .notification-list{background:transparent !important}
.theme-contrast .notification-item{background:#000 !important;border-left:4px solid #fff !important;color:#fff !important}
.theme-contrast .notification-item.success{background:#002200 !important;border-left-color:#00ff66 !important;color:#d7f0dc !important}
.theme-contrast .notification-item.warning{background:#332200 !important;border-left-color:#ffdd00 !important;color:#fff3c2 !important}
.theme-contrast .notification-item.error{background:#330000 !important;border-left-color:#ff3333 !important;color:#ffd7df !important}
.theme-contrast .notification-item.info{background:#002233 !important;border-left-color:#00ddff !important;color:#cff2ff !important}
.theme-contrast .notification-item.messenger{background:#111122 !important;border-left-color:#aa99ff !important;color:#ededff !important}
.theme-contrast .notification-time{color:#fff !important}
.theme-contrast .theme-menu{background:#000 !important;color:#fff !important;border:2px solid #fff !important}
.theme-contrast .theme-menu div:hover{background:#111 !important;color:#fff !important}
.theme-contrast p{color:#fff !important}
.theme-contrast a{color:#7ec8ff !important;text-decoration:underline !important}
.theme-contrast input,.theme-contrast select,.theme-contrast textarea{background:#000 !important;color:#fff !important;border:2px solid #fff !important}
.theme-contrast table,.theme-contrast tbody{background:transparent !important;color:#fff !important}
.theme-contrast tbody tr:nth-child(even){background:#111 !important}
.theme-contrast thead tr{background:#111 !important;color:#fff !important}
.theme-contrast th{color:#fff !important;border-bottom:2px solid #fff !important}
.theme-contrast td{border-bottom:2px solid #fff !important}
/* COMMENTED OUT .theme-contrast .card{background:#000 !important;border:2px solid #fff !important;color:#fff !important;box-shadow:none !important} */
/* COMMENTED OUT .theme-contrast .card h2,.theme-contrast .card h3{color:#fff !important} */
.theme-contrast .widget-device{color:#fff !important}
.theme-contrast .widget-device td{border:none !important;color:#fff !important}
.theme-contrast .widget-type-option{background:#000 !important;color:#fff !important;border:2px solid #fff !important}
.theme-contrast .widget-type-option:hover{background:#111 !important;color:#fff !important}
.theme-contrast .widget-refresh,.theme-contrast .settings-button{color:#fff !important}
.theme-contrast .dialog-buttons .secondary{background:#000 !important;color:#fff !important;border:2px solid #fff !important}
.theme-contrast .messenger-older-btn{background:#000 !important;color:#fff !important;border:2px solid #fff !important}
.theme-contrast .messenger-form input:disabled{background:#000 !important;color:#fff !important;border:2px solid #555 !important}
.theme-contrast .display-area,.theme-contrast .widget-body,.theme-contrast .settings-panel,.theme-contrast .middle-section{color:#fff !important}
.theme-contrast .login-wrap{background:#000 !important}
.theme-contrast .qr-codes img{background:#000 !important;border:2px solid #fff !important}

.theme-contrast .qr-bulk-form{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .qr-info-box{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .qr-btn{border-color:#fff !important}
.theme-contrast .slider-tray{background:rgba(0,0,0,.96) !important;border-right:2px solid #fff !important}
.theme-contrast .accordion-button{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .subfolder-button{color:#fff !important}
.theme-contrast .settings-section{border-top:2px solid #fff !important}
.theme-contrast .settings-section h3{color:#fff !important}
.theme-contrast .scroll-text{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .modal-panel{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .modal-header{border-bottom:2px solid #fff !important}
.theme-contrast .modal-close{color:#fff !important}
.theme-contrast .toast{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .toast.success{background:#002200 !important;border-color:#00ff66 !important;color:#d7f0dc !important}
.theme-contrast .toast.warning{background:#332200 !important;border-color:#ffdd00 !important;color:#fff3c2 !important}
.theme-contrast .toast.error{background:#330000 !important;border-color:#ff3333 !important;color:#ffd7df !important}
.theme-contrast .toast.info{background:#002233 !important;border-color:#00ddff !important;color:#cff2ff !important}
.theme-contrast .dashboard-widget:hover{outline:2px solid #fff !important}
/* COMMENTED OUT .theme-contrast .card table{border:2px solid #fff !important} */
.theme-contrast .add-widget-btn{background:#000 !important;border:2px solid #fff !important;color:#fff !important}
.theme-contrast .add-widget-btn:hover{background:#111 !important;color:#fff !important}

/* Colorblind accent tokens */
.theme-colorblind{filter:url(#cb-filter)}
.theme-colorblind{--theme-color:#0072B2;--cb-ok:#0072B2;--cb-warn:#E69F00;--cb-err:#D55E00}
.theme-colorblind .notifications{background:var(--cb-warn)}
.theme-colorblind .logout-button,.theme-colorblind .toast.error{background:var(--cb-err)}
.theme-colorblind .toast.success{background:var(--cb-ok)}
.theme-colorblind .online-dot,.theme-colorblind .status-online{background:var(--cb-ok) !important}
.theme-colorblind .widget-chart .bar{background:var(--theme-color)}
.theme-colorblind .dashboard-widget a,.theme-colorblind a{color:var(--theme-color) !important}

/* Theme parity — inline style overrides across pages */
.theme-dark .partner-meta-sep,.theme-contrast .partner-meta-sep,.theme-colorblind .partner-meta-sep{color:var(--theme-text) !important;opacity:1}
.theme-dark .qr-codes img,.theme-contrast .qr-codes img{background:#fff !important}
.theme-dark .widget-counter div:last-child,.theme-contrast .widget-counter div:last-child{color:var(--theme-text-muted)}

/* Forms/required markers */
.product-form label:after,.profile-form label:after{content:""}
.product-form .required label:after,.profile-form label.required:after,.product-form label.required:after,.profile-form label.required:after{content:" * (required)";color:#b00020;font-weight:700;font-size:12px}
.theme-dark .product-form label.required:after,.theme-contrast .product-form label.required:after,.theme-dark .profile-form label.required:after,.theme-contrast .profile-form label.required:after{color:#ff8a8a}

/* QR scroll */
.middle-section.qr-scroll{overflow-y:scroll !important;align-items:flex-start !important;justify-content:flex-start !important}
.qr-page .middle-section-wrapper{min-height:100% !important}
.qr-page .middle-section{overflow-y:scroll !important;height:100% !important;align-items:flex-start !important;justify-content:flex-start !important}

/* Card base */
.card{background:#fff;padding:28px;border-radius:16px;box-shadow:0 4px 18px rgba(0,0,0,.22);margin:0 auto;max-width:900px}
.card table{border-radius:12px;overflow:hidden}
.card th,.card td{padding:11px 14px}
.card form label{min-width:90px}
.card form select,.card form input[type=text]{border-radius:8px}
.card hr{opacity:.4}

/* Admin dashboard content wrapper centers cards */
.dashboard-content{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}

/* Messaging helpers */
.widget-body textarea.widget-notes{width:100%;height:90px;border:1px solid #ddd;resize:none;box-sizing:border-box;font-family:inherit;font-size:12px}
.messenger-delete-btn{position:absolute;right:6px;bottom:6px;cursor:pointer;padding:2px 8px;font-size:11px;color:#fff;background:#c0392b;border:1px solid #a93226;border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.messenger-delete-btn:hover{background:#a93226}
.messenger-form input:disabled{background:#eee;cursor:not-allowed}
.messenger-older-btn{display:block;width:100%;margin:0 0 6px;padding:4px;font-size:11px;color:#666;background:#f3f3f3;border:1px solid #ddd;border-radius:5px;cursor:pointer}
.messenger-older-btn:hover{background:#e8e8e8}
.dialog-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:15px}
.dialog-buttons button{padding:5px 12px;cursor:pointer;border:none;border-radius:4px}
.dialog-buttons .primary{background:#17a2b8;color:#fff}
.dialog-buttons .secondary{background:#ccc;color:#333}
.widget-type-option{padding:8px 12px;background:#f0f0f0;border-radius:4px;cursor:pointer}
.widget-type-option:hover{background:#e0e0e0}
.widget-refresh{margin-top:8px;padding:4px 10px;font-size:11px;border:1px solid #007BFF;background:#007BFF;color:#fff;border-radius:4px;cursor:pointer}
.widget-refresh:hover{background:#0062cc}


.theme-contrast .profile-card{background:#000;border:2px solid #fff;color:#fff}
.theme-contrast .profile-card-tag{color:#fff}
.theme-contrast .profile-card-title{color:#fff}
.theme-contrast .profile-card-text{color:#ddd}
.theme-contrast .profile-logo{background:#000;border:2px solid #fff}
.theme-contrast .profile-form input,.theme-contrast .profile-form textarea{background:#000;color:#fff;border:2px solid #fff}
.theme-contrast .profile-cta{border:2px solid #fff}
.theme-contrast .profile-cta-text h2{color:#fff}
.theme-contrast .profile-cta-text p{color:#ddd}

.theme-dark .qr-codes img,.theme-contrast .qr-codes img{background:#fff !important}
.theme-dark .small,.theme-contrast .small{color:#aaa !important}
.theme-dark [style*="border:1px solid #d6dbe6"],.theme-contrast [style*="border:1px solid #d6dbe6"],.theme-dark [style*="border: 1px solid #d6dbe6"],.theme-contrast [style*="border: 1px solid #d6dbe6"]{border-color:#555 !important}
.theme-dark [style*="background:#e9ecef"],.theme-contrast [style*="background:#e9ecef"],.theme-dark [style*="background: #e9ecef"],.theme-contrast [style*="background: #e9ecef"],
.theme-dark input[type=text],.theme-contrast input[type=text],.theme-dark select,.theme-contrast select,.theme-dark textarea,.theme-contrast textarea,.theme-colorblind input[type=text],.theme-colorblind select,.theme-colorblind textarea{background:#1e1e1e !important;color:#f0f0f0 !important;border:1px solid #555 !important}
.theme-dark button[type=submit],.theme-contrast button[type=submit]{color:#fff}
.theme-dark .messages .error,.theme-contrast .messages .error{color:#ff8a8a}
.theme-dark .messages .success,.theme-contrast .messages .success{color:#8af0a0}

.theme-dark .middle-section-wrapper,.theme-contrast .middle-section-wrapper,.theme-dark .middle-section,.theme-contrast .middle-section{background-color:transparent}
.theme-dark .middle-section-wrapper{min-height:100%}

/* central table parity handled under dark/contrast section */

/* 3D depth */
.dashboard-layer{perspective:1400px;perspective-origin:50% 38%}
.dashboard-widget{box-shadow:0 2px 4px rgba(0,0,0,.20),0 12px 26px rgba(0,0,0,.24),0 24px 50px rgba(0,0,0,.22);transform:translateZ(0);transition:box-shadow .35s ease,transform .35s ease;transform-style:preserve-3d}
.dashboard-widget:hover{box-shadow:0 2px 4px rgba(0,0,0,.20),0 12px 26px rgba(0,0,0,.24),0 24px 50px rgba(0,0,0,.22)}
.dashboard-widget .widget-resize-handle{transform:translateZ(48px)}
.card{box-shadow:0 3px 8px rgba(0,0,0,.18),0 16px 36px rgba(0,0,0,.20)}
.add-widget-dialog,.notification-panel{box-shadow:0 8px 20px rgba(0,0,0,.20),0 28px 60px rgba(0,0,0,.26)}
.header,.footer{box-shadow:0 6px 18px rgba(0,0,0,.24)}
.slider-tray{box-shadow:inset -10px 0 26px rgba(0,0,0,.34),inset 0 0 30px rgba(0,0,0,.20),0 0 40px rgba(0,0,0,.35)}

.theme-dark .dashboard-widget{box-shadow:0 2px 6px rgba(0,0,0,.50),0 14px 30px rgba(0,0,0,.55),0 26px 54px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.10)}
.theme-dark .dashboard-widget:hover{box-shadow:0 2px 6px rgba(0,0,0,.50),0 14px 30px rgba(0,0,0,.55),0 26px 54px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.10)}
.theme-dark .card,.theme-dark .add-widget-dialog,.theme-dark .notification-panel{box-shadow:0 4px 10px rgba(0,0,0,.50),0 18px 40px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08)}
.theme-dark .header,.theme-dark .footer{box-shadow:0 8px 22px rgba(0,0,0,.50)}
.theme-dark .slider-tray{box-shadow:inset -12px 0 30px rgba(0,0,0,.60),inset 0 0 34px rgba(0,0,0,.40),0 0 40px rgba(0,0,0,.40)}

/* (inset box-shadow removed from middle-section — clean content area) */

/* Mobile */
@media (max-width:820px){
  .middle-section{overflow-x:hidden !important}
  .middle-section > *{min-width:0 !important;max-width:100% !important}
  .card{max-width:100% !important;width:100% !important;padding:18px !important}
  .slider-tray{width:82% !important}
  .slider-tray:not(.visible){left:-82% !important}
}
@media (max-width:600px){
  .header{padding:0 8px !important}
  .header > div{gap:6px !important;flex-wrap:wrap !important;justify-content:flex-end}
  .add-widget-btn{font-size:11px !important;padding:4px 8px !important;margin-right:6px !important}
  .logo{font-size:12px !important}
  .middle-section form > div{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:10px !important}
  .middle-section input,.middle-section select,.middle-section textarea{max-width:100% !important;width:100% !important;font-size:16px !important;padding:12px !important}
  .middle-section form > label{display:block !important}
  .notification-panel{width:calc(100% - 24px) !important;right:12px !important}
  .middle-section table{min-width:0 !important;width:100% !important;table-layout:fixed !important}
  .middle-section table th,.middle-section table td{word-break:break-word !important}
  .middle-section table td:first-child{word-break:break-all !important}
  .product-view-row{grid-template-columns:1fr !important}
}
@media (max-width:380px){
  .card{padding:14px !important}
  .middle-section{padding:10px !important}
  .middle-section h1,.middle-section h2{font-size:20px !important}
}

/* Extensions grid */
.extension-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:20px}
.extension-card{display:flex;flex-direction:column;gap:6px;padding:14px;background:var(--theme-surface-raised,#f8f9fa);border:1px solid var(--theme-border,#dbe3f5);border-radius:10px;box-shadow:var(--theme-shadow-sm,0 1px 3px rgba(0,0,0,.08));color:var(--theme-text,#111);text-decoration:none;transition:transform .08s ease,box-shadow .2s ease}
.extension-card:hover{transform:translateY(-1px);box-shadow:var(--theme-shadow-md,0 4px 14px rgba(0,0,0,.12))}
.extension-card strong{font-size:14px}
.extension-desc{font-size:12px;color:var(--theme-text-muted,#555);line-height:1.35}
.theme-contrast .extension-card{background:#000;border:2px solid #fff;box-shadow:none;color:#fff}
.theme-contrast .extension-desc{color:#fff}
.theme-dark .extension-card{background:#2b2b2b;border-color:#555;color:#f0f0f0}
.theme-dark .extension-desc{color:#bbb}


/* QR table modal */
#qrTableModal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:80;padding:1rem}
#qrTableModal.active{display:flex}
#qrTableModal .qr-table-panel{background:#fff;color:#222;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.25);width:100%;max-width:1200px;max-height:calc(100vh - 120px);display:flex;flex-direction:column;overflow:hidden;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
#qrTableModal .qr-table-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid #eee;font-weight:700;font-size:14px;cursor:move;user-select:none}
#qrTableModal .qr-table-wrap{flex:1 1 auto;overflow:auto;max-height:calc(100vh - 180px)}
#qrTableModal.dragging .qr-table-panel{transition:none}
#qrTableModal .qr-table{width:100%;border-collapse:collapse;font-size:12px;table-layout:auto}
#qrTableModal .qr-table th,#qrTableModal .qr-table td{border:1px solid #ddd;padding:6px 8px;text-align:left;white-space:nowrap;min-width:80px}
#qrTableModal .qr-table th{background:#f5f5f5;font-weight:700;position:sticky;top:0;position:relative;resize:horizontal;overflow:hidden;min-width:80px;max-width:50vw}
#qrTableModal .qr-table th.qr-sort{user-select:none}
#qrTableModal .qr-table th.qr-sort-active{background:#e8f0fe}
#qrTableModal .qr-table th.qr-sort-active::after{content:' ▾';font-size:10px}
.theme-dark #qrTableModal .qr-table th.qr-sort-active::after{content:' ▾';color:#fff}
.theme-contrast #qrTableModal .qr-table th.qr-sort-active::after{content:' ▾';color:#fff}
#qrTableModal .qr-table th::after{content:'';position:absolute;top:0;right:0;bottom:0;width:6px;cursor:col-resize}
#qrTableModal .dialog-buttons{display:flex;gap:8px}
#qrTableModal .qr-batch-header{background:#f5f5f5}
.theme-dark #qrTableModal .qr-batch-header{background:#2b2b2b}
.theme-contrast #qrTableModal .qr-batch-header{background:#000;color:#fff}
#qrTableModal .qr-batch-toggle{background:transparent;border:0;padding:8px 10px;font-weight:700;cursor:pointer;text-align:left;width:100%}
#qrTableModal .qr-transfer-trigger{background:#0d6efd;color:#fff;border:0;padding:6px 10px;border-radius:6px;cursor:pointer;width:100%}
#qrTableModal .qr-transfer-trigger:hover{background:#0b5ed7}
.theme-dark #qrTableModal .qr-transfer-trigger{background:#3a7cff;color:#fff}
.theme-contrast #qrTableModal .qr-transfer-trigger{background:#fff;color:#000}
#qrTableTray{position:fixed;bottom:16px;right:16px;z-index:79;box-shadow:0 2px 8px rgba(0,0,0,.25);border-radius:6px}

/* QR transfer modal */
#qrTransferModal .modal-panel{background:#fff;color:#222;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.25);width:100%;max-width:520px;max-height:calc(100vh - 120px);display:flex;flex-direction:column;overflow:hidden;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.theme-dark #qrTransferModal{background:rgba(0,0,0,.65)}
.theme-dark #qrTransferModal .modal-panel{background:#1f1f1f;color:#f0f0f0;border:1px solid #555}
.theme-contrast #qrTransferModal{background:rgba(0,0,0,.85)}
.theme-contrast #qrTransferModal .modal-panel{background:#000;color:#fff;border:2px solid #fff}
.theme-dark #qrTableModal{background:rgba(0,0,0,.65)}
.theme-dark #qrTableModal .qr-table-panel{background:#1f1f1f;color:#f0f0f0;border:1px solid #555}
.theme-dark #qrTableModal .qr-table-header{border-bottom-color:#555}
.theme-dark #qrTableModal .qr-table th{background:#2b2b2b;color:#f0f0f0;border-color:#555}
.theme-dark #qrTableModal .qr-table th.qr-sort-active{background:#383838;color:#fff}
.theme-contrast #qrTableModal .qr-table th{background:#000;color:#fff;border-color:#fff}
.theme-contrast #qrTableModal .qr-table th.qr-sort-active{background:#000;color:#fff;border-color:#fff}
.theme-dark #qrTableModal .qr-table td{color:#f0f0f0;border-color:#555}
.theme-dark #qrTableTray{background:#2b2b2b;color:#f0f0f0;border-color:#555}
.theme-contrast #qrTableModal{background:rgba(0,0,0,.85)}
.theme-contrast #qrTableModal .qr-table-panel{background:#000;color:#fff;border:2px solid #fff}
.theme-contrast #qrTableModal .qr-table-header{border-bottom-color:#fff}
.theme-contrast #qrTableModal .qr-table th{background:#000;color:#fff;border-color:#fff}
.theme-contrast #qrTableModal .qr-table td{color:#fff;border-color:#fff}
/* Carbon theme: QR table modal uses carbon dark aesthetic */
.theme-carbon #qrTableModal .qr-table-panel{background:#1A1A1A;color:var(--theme-text);border:1px solid #1F2A44}
.theme-carbon #qrTableModal .qr-table-header{border-bottom-color:#1F2A44}
.theme-carbon #qrTableModal .qr-table th{background:#1A1A1A;color:var(--theme-text);border:1px solid #1F2A44}
.theme-carbon #qrTableModal .qr-table th.qr-sort-active{background:#1A1A1A;color:var(--theme-text);border:1px solid #1F2A44}
.theme-carbon #qrTableModal .qr-table td{color:var(--theme-text);border:1px solid #1F2A44;background:#1A1A1A}
.theme-carbon #qrTableModal .qr-table th.qr-sort-active::after{color:var(--theme-text)}
.theme-carbon #qrTableTray{background:#1A1A1A;color:var(--theme-text);border:1px solid #1F2A44}
.theme-carbon #qrTableModal{background:var(--theme-bg)}

/* Edit modal */
.edit-modal{
  position:fixed;
  inset:0;
  z-index:80;
  display:none;
  align-items:center;
  justify-content:center;
  padding:1rem;
  background:rgba(0,0,0,.45)
}
.edit-modal[open]{
  display:flex
}
.edit-modal.active{
  display:flex
}
.modal-backdrop{
  position:fixed;
  inset:0;
  z-index:70;
  background:rgba(0,0,0,.5);
  opacity:0;
  pointer-events:none;
  transition:opacity .15s ease
}
.modal-backdrop.active{
  opacity:1;
  pointer-events:auto
}
.edit-modal-dialog{
  background:var(--theme-surface,#fff);
  color:var(--theme-text,#222);
  border-radius:.5rem;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  width:100%;
  max-width:640px;
  max-height:90vh;
  display:flex;
  flex-direction:column;
  overflow:hidden
}
.theme-dark .edit-modal-dialog{
  background:#1e1e1e;
  color:#f0f0f0;
  border:1px solid #555
}
.theme-contrast .edit-modal-dialog{
  background:#000;
  color:#fff;
  border:2px solid #fff
}
.edit-modal-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  padding:1rem;
  border-bottom:1px solid rgba(128,128,128,.25)
}
.edit-modal-title{
  margin:0;
  font-size:1.1rem;
  font-weight:700
}
.edit-modal-close{
  background:transparent;
  border:0;
  font-size:1.1rem;
  line-height:1;
  cursor:pointer
}
.edit-modal-body{
  padding:1rem;
  min-height:0;
  flex:1 1 auto;
  max-height:calc(90vh - 130px);
  overflow-y:auto;
  overflow-x:hidden
}
#screenshot{
  min-height:0;
  max-height:35vh;
  overflow-y:auto;
  overflow-x:hidden
}
.edit-modal-footer{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.5rem;
  padding:1rem;
  border-top:1px solid rgba(128,128,128,.25)
}

/* Dark/contrast text visibility fixes for commonly broken surfaces */
.theme-dark .middle-section,
.theme-contrast .middle-section{color:var(--theme-text);background:transparent}
.theme-dark .add-widget-dialog,
.theme-contrast .add-widget-dialog{background:var(--theme-surface);color:var(--theme-text);border:1px solid var(--theme-border)}
.theme-dark .card,
.theme-contrast .card{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .card table,
.theme-contrast .card table{color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .widget-body textarea.widget-notes,
.theme-contrast .widget-body textarea.widget-notes{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .messenger-older-btn,
.theme-contrast .messenger-older-btn{background:var(--theme-surface-raised);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .widget-type-option,
.theme-contrast .widget-type-option{background:var(--theme-surface-raised);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .widget-type-option:hover,
.theme-contrast .widget-type-option:hover{background:var(--theme-border)}
.theme-dark .analog-clock,
.theme-contrast .analog-clock{background:var(--theme-surface);border:2px solid var(--theme-border)}
.theme-dark .clock-hour,.theme-dark .clock-minute,.theme-dark .clock-second,
.theme-contrast .clock-hour,.theme-contrast .clock-minute,.theme-contrast .clock-second{background:var(--theme-text)}
.theme-dark .dialog-buttons .secondary,
.theme-contrast .dialog-buttons .secondary{background:var(--theme-surface-raised);color:var(--theme-text);border:1px solid var(--theme-border)}
.theme-dark .widget-cap,
.theme-contrast .widget-cap{color:var(--theme-text-muted)}

.inline-issue-picker-highlight{outline:3px solid #ffd600;outline-offset:2px}

.issue-picker-overlay{position:fixed;inset:0;z-index:90;cursor:crosshair;touch-action:none}
#issueSelectionRect{position:fixed;z-index:91;border:2px solid #0f62fe;background:rgba(15,98,254,.16);pointer-events:none;box-sizing:border-box}


/* ==== site.css ==== */
/* ===== EvilEdge consolidated site styles ===== */
/* Source: migrated from inline styles across templates + existing static/css/*.css */

/* ===== Base / Reset ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { font-family: Inter, system-ui, Arial, sans-serif; color: #111111; }
html.theme-carbon, body.theme-carbon { color: #fff; }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; }
img { max-width: 100%; height: auto; display: block; }

/* ===== Global profile-style buttons ===== */
.profile-btn-primary,
.profile-btn-outline,
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 800;
  font-size: 15px;
  border: 1.5px solid #162c66;
  cursor: pointer;
  text-decoration: none;
}
.profile-btn-primary,
.btn {
  background: #152c66;
  color: #fff;
}
.profile-btn-outline {
  background: transparent;
  color: #152c66;
}
.btn-outline {
  background: transparent;
  color: #152c66;
}
.btn-danger {
  background: #dc3545;
  color: #fff;
  border-color: #dc3545;
}
.btn-danger-outline {
  background: transparent;
  color: #dc3545;
  border-color: #dc3545;
}
.btn-secondary {
  background: #6c757d;
  color: #fff;
  border-color: #6c757d;
}
.btn-secondary-outline {
  background: transparent;
  color: #6c757d;
  border-color: #6c757d;
}
.profile-modal-close {
  background: none;
  border: none;
  font-size: 1.75rem;
  line-height: 1;
  cursor: pointer;
  color: #555;
}

/* ===== Layout utilities ===== */
.container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.max-width-900 { max-width: 900px; }
.max-width-980 { max-width: 980px; }
.mx-auto { margin-left: auto; margin-right: auto; }
.mt-0 { margin-top: 0; }
.mt-6 { margin-top: 6px; }
.mt-8 { margin-top: 8px; }
.mt-10 { margin-top: 10px; }
.mt-12 { margin-top: 12px; }
.mt-14 { margin-top: 14px; }
.mt-16 { margin-top: 16px; }
.mt-18 { margin-top: 18px; }
.mt-20 { margin-top: 20px; }
.mt-24 { margin-top: 24px; }
.mb-6 { margin-bottom: 6px; }
.mb-8 { margin-bottom: 8px; }
.mb-10 { margin-bottom: 10px; }
.mb-12 { margin-bottom: 12px; }
.mb-14 { margin-bottom: 14px; }
.mb-18 { margin-bottom: 18px; }
.mb-20 { margin-bottom: 20px; }
.mb-24 { margin-bottom: 24px; }
.ml-8 { margin-left: 8px; }
.mr-4 { margin-right: 4px; }
.mx-auto { margin-left: auto; margin-right: auto; }
.p-6 { padding: 6px; }
.p-8 { padding: 8px; }
.p-10 { padding: 10px; }
.p-12 { padding: 12px; }
.p-14 { padding: 14px; }
.p-20 { padding: 20px; }
.pt-6 { padding-top: 6px; }
.pt-8 { padding-top: 8px; }
.gap-6 { gap: 6px; }
.gap-8 { gap: 8px; }
.gap-10 { gap: 10px; }
.gap-12 { gap: 12px; }


/* ===== Mobile ===== */
@media (max-width: 768px){
  .dashboard{border-width:1px}
  #trayToggle{width:34px !important;height:34px !important;font-size:17px !important}
  .header{padding:0 8px;gap:6px}
  .header-actions{gap:6px}
  .slider-tray{width:85vw;left:-85vw}
  .slider-tray.visible{left:0}
  #display-area{padding:0 10px 90px 10px}
  .middle-section-wrapper{height:78%}
  .notification-panel{right:8px;left:8px;width:auto;max-width:100vw}
  .theme-menu{right:-6px;left:auto;min-width:120px}
  .dashboard-widget{min-width:auto;max-width:100%}
  .footer{padding:0 10px;font-size:12px}
  .profile-hero{grid-template-columns:1fr}
  .profile-stats{grid-template-columns:1fr}
  @media (min-width:720px){.profile-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
  
  /* Global table improvements for mobile */
  table{display:block;overflow-x:auto}
  th, td{
    padding: 8px 10px;
    font-size: 13px;
  }
  thead tr{background: var(--theme-surface-raised)}
  th{background: var(--theme-surface-raised);font-weight:600}
  
  /* Card padding adjustments for mobile */
  .card{padding:16px}
  
  /* Button sizing for touch targets */
  .btn{
    min-height: 40px;
    padding: 8px 16px;
    font-size: 14px;
  }
  .btn-sm{
    min-height: 36px;
    padding: 6px 12px;
  }
  
  /* Form input sizing for touch */
  .form-control, .form-select{
    min-height: 44px;
    font-size: 16px;
    padding: 10px;
  }
}

/* ===== Display / Flex ===== */
.d-flex { display: flex; }
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.flex-1 { flex: 1; }
.flex-shrink-0 { flex-shrink: 0; }
.min-w-0 { min-width: 0; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.block { display: block; }
.inline-flex { display: inline-flex; }
.relative { position: relative; }
.overflow-hidden { overflow: hidden; }
.overflow-y-auto { overflow-y: auto; }

/* ===== Typography ===== */
.text-xs { font-size: 12px; }
.text-sm { font-size: 13px; }
.text-base { font-size: 14px; }
.text-lg { font-size: 18px; }
.text-xl { font-size: 20px; }
.font-600 { font-weight: 600; }
.font-700 { font-weight: 700; }
.font-800 { font-weight: 800; }
.font-bold { font-weight: bold; }
.uppercase { text-transform: uppercase; }
.truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nowrap { white-space: nowrap; }
.line-height-1-4 { line-height: 1.4; }
.letter-spacing-02 { letter-spacing: .02em; }

/* ===== Colors ===== */
.text-muted { color: #555; }
.text-muted-dark { color: #5b6470; }
.text-danger { color: #dc3545; }
.text-error { color: #ff8a8a; }
.text-success { color: #8af0a0; }
.text-link { color: #7ec8ff; }
.text-white { color: #fff; }
.text-black { color: #111; }
.bg-white { background: #fff; }
.bg-light { background: #f0f0f0; }
.bg-dark { background: #1e1e1e; }
.bg-card-dark { background: #2b2b2b; }
.bg-header-dark { background: #262626; }
.bg-error { background: #f8d7da; }
.bg-success { background: #d4edda; }
.bg-warn { background: #fff3cd; }
.border-light { border-color: #e5e9f2; }
.border-medium { border-color: #d6dbe6; }
.border-dark { border-color: #555; }
.border-dashed { border-style: dashed; }
.border-error { border-color: #dc3545; }

/* ===== Borders / Radius ===== */
.border { border: 1px solid; }
.border-2 { border-width: 2px; }
.rounded-6 { border-radius: 6px; }
.rounded-8 { border-radius: 8px; }
.rounded-10 { border-radius: 10px; }

/* ===== Shadows / Depth ===== */
.shadow-sm { box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.shadow-md { box-shadow: 0 1px 4px rgba(0,0,0,.15); }
.shadow-depth { box-shadow: inset 0 3px 14px rgba(0,0,0,.65), inset 0 12px 46px rgba(0,0,0,.50); }

/* ===== Cards ===== */
.card {
  background: var(--theme-surface);
  border: 1px solid var(--theme-border);
  border-radius: 8px;
  padding: 20px;
}
.card-dark {
  background: var(--theme-surface-raised);
  color: var(--theme-text);
  border-color: var(--theme-border);
}

/* ===== Buttons ===== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 6px;
  border: 1px solid transparent;
  font-size: 13px;
  line-height: 1.2;
}
.btn-sm { padding: 6px 10px; font-size: 12px; }
.btn-primary {
  background: #0d6efd;
  border-color: #0d6efd;
  color: #fff;
}
.btn-secondary {
  background: #6c757d;
  border-color: #6c757d;
  color: #fff;
}
.btn-success {
  background: #198754;
  border-color: #198754;
  color: #fff;
}
.btn-danger {
  background: #dc3545;
  border-color: #dc3545;
  color: #fff;
}
.btn-outline {
  background: transparent;
  border-color: var(--theme-border);
  color: var(--theme-text);
}
.btn-ghost {
  background: transparent;
  border-color: transparent;
  color: inherit;
}
.btn:disabled { opacity: .6; cursor: not-allowed; }

/* ===== Forms ===== */
.form-label {
  font-weight: 600;
  font-size: 13px;
  display: block;
  margin-bottom: 6px;
  color: var(--theme-text);
}
.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--theme-border);
  border-radius: 6px;
  background: var(--theme-input-bg);
  color: var(--theme-text);
}
.form-input-sm { padding: 8px; }
.form-hint {
  font-size: 12px;
  color: var(--theme-text-muted);
  margin-top: 4px;
}

/* ===== Messages / Alerts ===== */
.messages { list-style: none; margin: 12px 0; padding: 0; }
.messages li {
  padding: 8px;
  border-radius: 6px;
  margin-bottom: 6px;
  font-size: 13px;
  color: var(--theme-text);
  background: var(--theme-surface-raised);
  border: 1px solid var(--theme-border);
}

/* Password change guidance panel */
.password-guidance {
  background: var(--theme-surface-raised);
  border: 1px solid var(--theme-border);
  border-radius: 8px;
  padding: 10px 12px;
  margin-bottom: 12px;
  color: var(--theme-text);
}
.password-guidance ul {
  margin: 0;
  padding-left: 18px;
}
.password-guidance li {
  margin: 4px 0;
}

/* Fallback: on this page classes may be normalized to "small". */
.profile-form > .small {
  background: #eef2f7;
  border: 1px solid #d6dbe6;
  border-radius: 8px;
  padding: 10px 12px;
  margin-bottom: 12px;
}
.profile-form > .small ul {
  margin: 0;
  padding-left: 18px;
}
.msg-success { background: #d4edda; color: #333; }
.msg-error { background: #f8d7da; color: #333; }
.msg-warn { background: #fff3cd; color: #333; }

/* ===== Product questions ===== */
.question-card {
  padding: 12px;
  border: 1px solid #e5e9f2;
  border-radius: 8px;
  background: #fff;
}
.question-card-instructions { font-size: 13px; color: #333; }
.drag-handle { cursor: grab; color: #5b6470; user-select: none; }
.product-form label { font-weight: 600; font-size: 13px; display: block; margin-bottom: 6px; }
.product-form .required label:after,
.profile-form label.required:after {
  content: " * (required)";
  color: #b00020;
  font-weight: 700;
  font-size: 12px;
}

/* ===== Partner list ===== */
.partner-meta-sep { margin: 0 4px; }

/* ===== Modal ===== */
.modal-root { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); align-items: center; justify-content: center; z-index: 1000; }
.modal-panel {
  background: #fff;
  border: 1px solid #e5e9f2;
  border-radius: 10px;
  width: 90%;
  max-width: 520px;
  max-height: 90vh;
  overflow-y: auto;
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid #f3f5f9;
}
.modal-header span { font-weight: 700; font-size: 15px; }
.modal-close {
  background: transparent;
  border: 0;
  font-size: 22px;
  line-height: 1;
  color: #555;
}
.modal-body { padding: 16px; }
.dialog-buttons { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }

/* ===== Calendar ===== */
.calendar-card {
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 12px;
  background: #fff;
}

/* ===== Widgets / Dashboard extras ===== */
.widget { background: #fff; border: 1px solid #e5e9f2; border-radius: 8px; padding: 12px; }
.widget-header { font-weight: 700; margin-bottom: 8px; }
.widget-body { color: #333; }

/* ===== Notifications / Toasts ===== */
.notifications { background: #fff3cd; color: #333; border: 1px solid #ffeeba; border-radius: 8px; padding: 10px; }
.toast { padding: 10px 12px; border-radius: 8px; color: #fff; }
.toast-success { background: #198754; }
.toast-error { background: #dc3545; }
.logout-button { background: #dc3545; border-color: #dc3545; color: #fff; }

/* ===== Print ===== */
@media print {
  .no-print { display: none !important; }
  @page { margin: 10mm; size: A4; }
}

/* ===== Layout helpers ===== */
.m-0 { margin: 0; }
.max-width-480px { max-width: 480px; }
.max-width-520px { max-width: 520px; }
.max-width-720px { max-width: 720px; }
.max-width-980px { max-width: 980px; }
.mt-10 { margin-top: 10px; }
.mt-12 { margin-top: 12px; }
.mt-14 { margin-top: 14px; }
.w-24px { width: 24px; }
.d-none { display: none; }

/* ===== Calendar helpers ===== */
.calendar-day-title { font-size: 18px; }
.appt-checkbox { width: 18px; height: 18px; }
.calendar-empty-hint { color: #666; }
.issue-attachment-icon { display:inline-block; margin-left:6px; color:var(--theme-color,#007bff); font-size:14px; vertical-align:middle; }

/* Outlook-style month calendar */
.calendar-page { width:100%; max-width:100%; }
.calendar-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; margin:0 0 14px; }
.calendar-toolbar h2 { margin:0; font-size:20px; font-weight:700; }
.calendar-navigation { display:flex; gap:6px; }
.calendar-month-grid { display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); width:100%; border:1px solid var(--theme-border, #dbe3f5); background:var(--theme-border, #dbe3f5); gap:1px; overflow:hidden; }
.calendar-weekday { padding:9px 8px; background:var(--theme-surface-raised, #f8f9fa); color:var(--theme-text-muted, #555); font-size:11px; font-weight:700; letter-spacing:.08em; text-align:right; text-transform:uppercase; }
.calendar-day-block { min-height:112px; padding:8px; background:var(--theme-surface, #fff); }
.calendar-day-block.is-empty { background:var(--theme-surface-raised, #f8f9fa); }
.calendar-day-block.is-today { box-shadow:inset 0 3px 0 var(--theme-color, #007bff); }
.calendar-day-number { display:flex; align-items:center; justify-content:flex-end; width:26px; height:26px; margin-left:auto; color:var(--theme-text-muted, #555); font-size:12px; font-weight:700; }
.is-today .calendar-day-number { justify-content:center; border-radius:50%; background:var(--theme-color, #007bff); color:#fff; }
.calendar-events { display:flex; flex-direction:column; gap:4px; margin-top:4px; }
.calendar-event { min-width:0; border-left:3px solid var(--theme-color, #007bff); border-radius:2px; background:color-mix(in srgb, var(--theme-color, #007bff) 14%, var(--theme-surface, #fff)); }
.calendar-event a { display:block; padding:4px 5px; overflow:hidden; color:var(--theme-text, #222); font-size:12px; line-height:1.25; text-decoration:none; text-overflow:ellipsis; white-space:nowrap; }
.calendar-event a:hover { background:color-mix(in srgb, var(--theme-color, #007bff) 22%, var(--theme-surface, #fff)); }
.calendar-event-time { margin-right:4px; color:var(--theme-text-muted, #555); font-size:10px; font-weight:700; }

@media (max-width: 700px) {
  .calendar-toolbar { align-items:stretch; flex-wrap:wrap; }
  .calendar-toolbar h2 { order:-1; width:100%; }
  .calendar-day-block { min-height:92px; padding:5px; }
  .calendar-weekday { padding:7px 3px; font-size:9px; }
  .calendar-event { border-left-width:2px; }
  .calendar-event a { padding:3px; font-size:10px; }
  .calendar-event-time { display:block; font-size:9px; }
}

/* ===== Dashboard online users ===== */
.online-page-card { max-width:900px; margin:15px auto 0; overflow-y:auto; }
.online-page-padding { padding:20px; }
.online-page-title { margin:0 0 12px 0; }
.online-messages { margin-bottom:10px; }
.online-msg { padding:8px; border-radius:6px; margin-bottom:6px; background:#fff3cd; color:#333; }
.online-list { display:flex; flex-direction:column; gap:12px; }
.online-card { border:1px solid #ddd; border-radius:10px; padding:12px; background:#fff; display:flex; align-items:center; gap:12px; }
.online-status { font-size:18px; }
.online-name { font-weight:600; }
.online-meta { font-size:12px; color:#555; }
.online-empty { color:#666; }

/* ===== Component helpers ===== */
.settings-button { padding: 8px 12px; border-radius: 6px; border: 1px solid transparent; font-size: 13px; line-height: 1.2; }
.settings-button-danger { background:#dc3545;border-color:#dc3545;color:#fff; }
.settings-button-delete { background:#c00;border-color:#c00;color:#fff; }
.partner-card { border:1px solid #ddd;border-radius:8px;padding:12px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px; }
.partner-card-body { display:flex;align-items:center;gap:10px;flex:1;min-width:0; }
.partner-name { display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.partner-meta { font-size:12px;color:#555; }

.reseller-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.reseller-back-link { font-size:12px; text-decoration:none; background:#e9ecef; padding:6px 10px; border-radius:6px; }
.reseller-form { display:grid; gap:10px; max-width:720px; margin-bottom:24px; }
.reseller-form-row { display:flex; gap:10px; align-items:center; }
.reseller-label { min-width:110px; font-size:13px; }
.reseller-input { flex:1; padding:10px; border:1px solid #d6dbe6; border-radius:6px; }
.reseller-textarea { flex:1; padding:10px; border:1px solid #d6dbe6; border-radius:6px; min-height:80px; }
.reseller-submit { justify-self:start; padding:10px 14px; border:0; border-radius:8px; background:#0b74ff; color:white; cursor:pointer; }
.reseller-bulk-header { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:8px; }
.reseller-table { width:100%; border-collapse:collapse; margin-top:8px; }
.reseller-table-header { text-align:left; border-bottom:2px solid #e1e4e8; }
.reseller-table th, .reseller-table td { padding:8px; }
.reseller-table th { font-weight:600; border-bottom:1px solid #e5e9f2; }
.reseller-table-row { border-bottom:1px solid #f3f5f9; }
.reseller-delete-btn { padding:6px 10px; border:0; border-radius:6px; background:#c00; color:white; cursor:pointer; }
.reseller-empty { color:#888; margin-top:12px; }

.card-header{background:#0f172a;color:#e5e7eb;border-bottom:1px solid #1f2937}


/* ==== products.css ==== */
/* QR page layout + modals */
.qr-card{background:var(--theme-surface);border-radius:12px;box-shadow:var(--theme-shadow-md);padding:20px 24px;max-width:1100px;margin:0 auto;color:var(--theme-text);border:1px solid var(--theme-border)}
.theme-dark .qr-card,.theme-contrast .qr-card,.theme-carbon .qr-card{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border)}
.theme-contrast .qr-card{background:#000;border:2px solid #fff;box-shadow:none}
.theme-carbon .qr-card{border-color:var(--theme-accent);box-shadow:0 0 8px rgba(0,255,255,.3),var(--theme-shadow-md)}
.theme-dark .qr-card,.theme-contrast .qr-card{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border)}
.theme-contrast .qr-card{background:#000;border:2px solid #fff;box-shadow:none}
.qr-card-body{display:flex;flex-direction:column;gap:14px}
.qr-card-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.qr-card-title{margin:0;font-size:22px;font-weight:800}
.qr-card-actions{display:flex;gap:8px;flex-wrap:wrap}
.qr-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.qr-form{display:flex;flex-direction:column;gap:12px}
.qr-field{display:flex;flex-direction:column;gap:4px}
.qr-field-label{font-size:13px;font-weight:700;color:#333}
.qr-input,.qr-select{padding:8px 10px;border:1px solid #dbe3f5;border-radius:8px;background:#fff;color:#111;font-size:14px;width:100%;box-sizing:border-box}
.qr-textarea{width:100%;padding:8px 10px;border:1px solid #dbe3f5;border-radius:8px;background:#fff;color:#111}
.qr-input--sm{max-width:120px}
.qr-inline-inputs{display:flex;align-items:center;gap:8px}
.qr-hint{font-size:12px;color:#6c757d}
.qr-info-box{background:#f8f9fa;border:1px solid #e5e9f2;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:6px}
.qr-muted{color:#6c757d;font-size:12px}
.qr-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;border:1.5px solid transparent;text-decoration:none;transition:filter .15s ease}
.qr-btn:disabled{opacity:.55;cursor:not-allowed}
.qr-btn-primary{background:#152c66;color:#fff;border-color:#152c66}
.qr-btn-secondary{background:#fff;color:#111;border-color:#dbe3f5}
.qr-btn-outline{background:transparent;color:#111;border-color:#1f2d47}
.qr-btn-ghost{background:transparent;color:#111;border-color:transparent}
.qr-btn-danger-ghost{background:transparent;color:#b00020;border-color:#ffd7d7}
.qr-btn-danger-outline{background:transparent;color:#b00020;border-color:#ffd7d7}
.qr-btn:hover{filter:brightness(1.05)}
.qr-divider{border:0;border-top:1px solid #e5e9f2;margin:18px 0}
.qr-section-title{margin:0 0 10px;font-size:18px;font-weight:800}
.qr-section-subtitle{margin:0 0 10px;font-size:15px;font-weight:700;color:#333}
.qr-bulk-form{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 12px;background:#fff;border:1px solid #e5e9f2;border-radius:10px;margin-bottom:14px}
.qr-bulk-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.qr-table{width:100%;border-collapse:collapse;font-size:13px;background:#fff;border:1px solid #e5e9f2;border-radius:12px;overflow:hidden}
.qr-table thead{background:#0f172a;color:#e5e7eb;border-bottom:1px solid #1f2937}
.qr-table th,.qr-table td{padding:10px 12px;border-bottom:1px solid #e5e9f2;text-align:left;vertical-align:middle}
.qr-table tbody tr:last-child td{border-bottom:none}
.qr-table .qr-col-hidden{display:none;}
.qr-link{color:#152c66;font-weight:700;text-decoration:none;margin-right:10px}
.qr-visuals .qr-visual-btn{display:inline-block;padding:4px 10px;border-radius:999px;border:1px solid #152c66;background:#152c66;color:#fff;text-decoration:none;font-size:12px;margin-right:6px}
.installer-light{display:inline-block;width:14px;height:14px;border-radius:50%;background:#777;}.installer-light--on{background:#facc15;box-shadow:0 0 8px #facc15;}
.package-dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:#555;}.package-dot--on{background:#3b82f6;box-shadow:0 0 8px #3b82f6;}
.client-dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:#555;}.client-dot--on{background:#22c55e;box-shadow:0 0 8px #22c55e;}
.transfer-dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:#555;}.transfer-dot--sent{background:#f97316;box-shadow:0 0 8px #f97316;}.transfer-dot--received{background:#06b6d4;box-shadow:0 0 8px #06b6d4;}
.theme-colorblind .package-dot--on{background:#0072B2;box-shadow:0 0 8px #0072B2}
.theme-colorblind .client-dot--on{background:#0072B2;box-shadow:0 0 8px #0072B2}
.theme-colorblind .transfer-dot--sent{background:#E69F00;box-shadow:0 0 8px #E69F00}
.theme-colorblind .transfer-dot--received{background:#0072B2;box-shadow:0 0 8px #0072B2}
.qr-inline-form{display:inline}
.qr-batch-group{margin-bottom:16px;border:1px solid #e5e9f2;border-radius:12px;background:#fff;overflow:hidden}
.qr-batch-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:#f8f9fa;border-bottom:1px solid #e5e9f2}
.qr-batch-header-left{display:flex;align-items:center;gap:10px}
.qr-batch-header-right{display:flex;align-items:center;gap:12px}
.qr-batch-body{padding:10px 12px}
.qr-batch-toggle{cursor:pointer;user-select:none;color:#333;font-size:12px}
.qr-table-tight{width:40px;text-align:center !important}
.qr-checkbox-label{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}
.messages{list-style:none;padding:10px;margin:0 0 10px;background:#fff;border-bottom:1px solid #ddd}
.messages li{margin:4px 0;font-size:13px}
.messages .success{color:#1b5e20}
.messages .error{color:#b00020}
.messages .warning{color:#856404}
.messages .info{color:#0c5460}
.dashboard-content > .card{max-width:1100px;width:100%}
.product-view-img{max-width:600px;max-height:300px;width:auto;height:auto;object-fit:contain;display:block;margin:0 auto}
.question-card{transition:transform .1s ease,opacity .1s ease}
.question-card[draggable=true]{cursor:grab}
.question-card:active{cursor:grabbing}
.drag-handle{padding:2px 6px;border-radius:6px;background:#f3f5f9;border:1px solid #e5e9f2;color:#5b6470;font-size:12px}
.theme-dark .drag-handle{background:#262626;border-color:#555;color:#bbb}
.datasheet-hero{display:flex;gap:18px;align-items:flex-start;justify-content:space-between}
.datasheet-description-block{flex:1 1 auto;min-width:0}
.datasheet-hero-image{flex:0 0 auto;width:260px;max-width:40vw;margin-left:auto}
.datasheet-hero-image img{width:100%;height:auto;border:1px solid #e5e9f2;border-radius:10px;display:block;background:#fafafa}
.theme-dark .datasheet-hero-image img{background:#262626;border-color:#555}
.datasheet-hero-placeholder{width:100%;min-height:180px;border:1px dashed #c7cdd8;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#777;font-size:13px;background:#fafafa}
.theme-dark .datasheet-hero-placeholder{background:#262626;border-color:#555;color:#bbb}
.datasheet-thumbnails{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px}
.datasheet-thumb{flex:0 0 auto;width:140px}
.datasheet-thumb img{width:100%;height:auto;border:1px solid #e5e9f2;border-radius:10px;display:block;background:#fafafa}
.theme-dark .datasheet-thumb img{background:#262626;border-color:#555}
.datasheet-footer{display:flex;flex-direction:column;align-items:center;gap:10px}
.datasheet-footer-qr{display:flex;flex-direction:column;align-items:center;gap:6px}
@media (max-width:760px){
  .datasheet-hero{flex-direction:column-reverse}
  .datasheet-hero-image{width:100%;max-width:100%}
  .datasheet-header{flex-direction:column}.datasheet-spec-row{flex-direction:column;gap:4px}.datasheet-spec-value{text-align:left}}
.modal-root{position:fixed;inset:0;background:rgba(0,0,0,.4);display:none;align-items:center;justify-content:center;z-index:80;padding:1rem}
.modal-root.active{display:flex}
.modal-panel{background:#fff;color:#222;border-radius:12px;box-shadow:0 12px 35px rgba(0,0,0,.25);width:100%;max-width:520px;max-height:calc(100vh - 40px);overflow:auto}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #eee;font-weight:700;font-size:15px}
.modal-close{background:none;border:none;font-size:20px;cursor:pointer;color:#666;line-height:1;padding:4px}
.modal-body{padding:16px}

/* Theme variables */
.theme-dark :focus-visible,.theme-contrast :focus-visible{outline:2px solid var(--theme-color);outline-offset:2px}
.theme-dark .qr-card,.theme-contrast .qr-card{background:var(--theme-surface);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .modal-panel,.theme-contrast .modal-panel{background:var(--theme-surface);color:var(--theme-text);border:1px solid var(--theme-border)}
.theme-dark .qr-field-label,.theme-contrast .qr-field-label{color:var(--theme-text)}
.theme-dark .qr-input,.theme-contrast .qr-input,.theme-dark .qr-select,.theme-contrast .qr-select,.theme-colorblind .qr-input,.theme-colorblind .qr-select{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .qw-input,.theme-contrast .qw-input,.theme-colorblind .qw-input{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .widget-workgroup-select,.theme-contrast .widget-workgroup-select,.theme-colorblind .widget-workgroup-select{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .chart-metric,.theme-contrast .chart-metric,.theme-dark .chart-type,.theme-contrast .chart-type,.theme-dark .chart-window,.theme-contrast .chart-window,.theme-dark .chart-interval,.theme-contrast .chart-interval,.theme-colorblind .chart-metric,.theme-colorblind .chart-type,.theme-colorblind .chart-window,.theme-colorblind .chart-interval{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .messenger-target,.theme-contrast .messenger-target,.theme-colorblind .messenger-target{background:var(--theme-input-bg);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .qr-table,.theme-contrast .qr-table{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border)}

.theme-dark .qr-table th,.theme-contrast .qr-table th{color:#fff !important;border-bottom:1px solid #444 !important}
.theme-dark .qr-batch-header,.theme-contrast .qr-batch-header{background:var(--theme-surface-raised);border-color:var(--theme-border);color:#fff !important}
.theme-dark .qr-bulk-form,.theme-contrast .qr-bulk-form{background:var(--theme-surface);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .qr-link,.theme-contrast .qr-link{color:var(--theme-link)}
.theme-contrast .package-dot--on{background:#fff;box-shadow:0 0 0 2px #000}
.theme-contrast .client-dot--on{background:#fff;box-shadow:0 0 0 2px #000}
.theme-contrast .transfer-dot--sent{background:#ffdd00;box-shadow:0 0 0 2px #000}
.theme-contrast .transfer-dot--received{background:#00ddff;box-shadow:0 0 0 2px #000}
.theme-dark .qr-info-box,.theme-carbon .qr-info-box,.theme-contrast .qr-info-box{background:var(--theme-surface-raised);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .qr-batch-header,.theme-carbon .qr-batch-header,.theme-contrast .qr-batch-header{background:var(--theme-surface-raised);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .qr-bulk-form,.theme-carbon .qr-bulk-form,.theme-contrast .qr-bulk-form{background:var(--theme-surface);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .qr-hint,.theme-carbon .qr-hint,.theme-contrast .qr-hint{color:var(--theme-text-muted)}
.theme-dark .qr-muted,.theme-carbon .qr-muted,.theme-contrast .qr-muted{color:var(--theme-text-muted)}
.theme-dark .qr-divider,.theme-carbon .qr-divider,.theme-contrast .qr-divider{border-top-color:var(--theme-border)}
.theme-dark .qr-inline-inputs,.theme-carbon .qr-inline-inputs,.theme-contrast .qr-inline-inputs{color:var(--theme-text)}
.theme-dark .qr-section-title,.theme-carbon .qr-section-title{color:var(--theme-text)}
.theme-dark .qr-section-subtitle,.theme-carbon .qr-section-subtitle{color:var(--theme-text-muted)}

/* Product questions page overrides */
.product-form label,.product-form input,.product-form textarea,.product-form select{color:#111}
.theme-dark .product-form label,.theme-dark .product-form input,.theme-dark .product-form textarea,.theme-dark .product-form select{color:var(--theme-text);background:var(--theme-input-bg);border-color:var(--theme-border)}
.theme-dark .question-card{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border)}
.theme-dark .question-card .muted-text{color:var(--theme-text-muted)}

/* Product datasheet */
.datasheet{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:14px;background:#fff;border:1px solid #e5e9f2;border-radius:12px;box-shadow:0 4px 18px rgba(0,0,0,.15);padding:20px 24px}
.datasheet-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.datasheet-branding{display:flex;align-items:center;flex-shrink:0}
.datasheet-title-block{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.datasheet-partner-logo{max-height:64px;max-width:160px;object-fit:contain;margin-bottom:8px}
.datasheet-partner-id{font-size:14px;font-weight:800;color:#152c66;background:#eef2ff;border:2px solid #152c66;padding:8px 16px;border-radius:10px;display:inline-flex;align-items:center;gap:8px;letter-spacing:.02em;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.theme-dark .datasheet-partner-id{color:var(--theme-link);background:var(--theme-surface-raised);border-color:var(--theme-link)}
.datasheet-product-name{margin:0;font-size:22px;font-weight:800;line-height:1.25}
.datasheet-meta-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.datasheet-meta-item{background:#f3f5f9;border:1px solid #e5e9f2;color:#222;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:700}
.datasheet-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.datasheet-section{background:#fff;border:1px solid #e5e9f2;border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.datasheet-section-title{margin:0;font-size:15px;font-weight:800;color:#111;text-transform:uppercase;letter-spacing:.04em}
.datasheet-description{margin:0;font-size:14px;color:#222;line-height:1.6;padding-left:18px}
.datasheet-description li+li{margin-top:4px}
.datasheet-specs{display:flex;flex-direction:column;gap:10px}
.datasheet-spec-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:8px 0;border-bottom:1px solid #f3f5f9}
.datasheet-spec-row:last-child{border-bottom:none}
.datasheet-spec-label{font-size:13px;font-weight:700;color:#5b6470;min-width:140px;flex-shrink:0}
.datasheet-spec-value{font-size:14px;color:#111;text-align:right;word-break:break-word}
.datasheet-link{color:#152c66;text-decoration:none;font-weight:700}
.datasheet-link:hover{text-decoration:underline}
.datasheet-tags{display:flex;gap:8px;flex-wrap:wrap}
.datasheet-tag{background:#eef2ff;color:#152c66;border:1px solid #dbe3f5;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:700}
.datasheet-footer{display:flex;justify-content:flex-start;margin-top:4px}
.datasheet-reseller{display:flex;align-items:center;gap:8px;font-size:13px;color:#5b6470}
.datasheet-reseller a{color:#152c66;text-decoration:none;font-weight:700}
.datasheet-reseller-logo{max-height:48px;max-width:160px;object-fit:contain;margin-right:8px}
.datasheet-gallery{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px}
.datasheet-gallery-item{flex:0 0 auto;width:220px}
.datasheet-gallery-item img{width:100%;height:auto;border:1px solid #e5e9f2;border-radius:10px;display:block;background:#fafafa}
.theme-dark .datasheet-gallery-item img{background:#262626;border-color:#555}
@media (max-width:760px){.datasheet-header{flex-direction:column}.datasheet-spec-row{flex-direction:column;gap:4px}.datasheet-spec-value{text-align:left}}

/* Theme variables */
.theme-dark .datasheet,.theme-contrast .datasheet{background:var(--theme-surface);border-color:var(--theme-border);color:var(--theme-text);box-shadow:var(--theme-shadow-md)}
.theme-dark .datasheet-product-name{color:var(--theme-text)}
.theme-dark .datasheet-meta-item{background:var(--theme-surface-raised);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .datasheet-section{background:var(--theme-surface);border-color:var(--theme-border);color:var(--theme-text)}
.theme-dark .datasheet-section-title{color:var(--theme-text)}
.theme-dark .datasheet-description{color:var(--theme-text)}
.theme-dark .datasheet-spec-row{border-bottom-color:var(--theme-border)}
.theme-dark .datasheet-spec-label{color:var(--theme-text-muted)}
.theme-dark .datasheet-spec-value{color:var(--theme-text)}
.theme-dark .datasheet-link{color:var(--theme-link)}
.theme-dark .datasheet-tag{background:var(--theme-surface-raised);color:var(--theme-link);border-color:var(--theme-border)}
.theme-dark .datasheet-reseller{color:var(--theme-text-muted)}
.theme-dark .datasheet-reseller a{color:var(--theme-link)}
.theme-dark .datasheet-partner-id{color:var(--theme-link);background:var(--theme-surface-raised);border-color:var(--theme-link)}
.theme-dark .datasheet-gallery-item img{background:var(--theme-surface)}
.theme-dark .datasheet-hero-image img{background:var(--theme-surface);border-color:var(--theme-border)}
.theme-dark .datasheet-hero-placeholder{background:var(--theme-surface);border-color:var(--theme-border);color:var(--theme-text-muted)}
.theme-dark .datasheet-thumb img{background:var(--theme-surface);border-color:var(--theme-border)}
.qr-select-wrap select#id_transfer_user{max-height:220px;overflow-y:auto}

/* QR Ecosystem Modal - dark theme replica */
.theme-dark .modal-root { background: rgba(10,14,22,0.96); color: var(--foreground); }
.qr-table-panel { max-width: 1200px; margin: 24px auto; background: #0b1220; border: 1px solid #1f2a3a; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
.qr-table-header { display:flex; justify-content:space-between; align-items:center; padding:12px 14px; border-bottom:1px solid #1f2a3a; }
.qr-table-header h3 { margin:0; color:#fff; }
.qr-select, #qrSearch { background:#0f1726; color:#fff; border:1px solid #243044; padding:6px 8px; border-radius:6px; }
.qr-table-wrap { padding:10px 14px 14px; }
.qr-eco-summary { display:grid; grid-template-columns: repeat(4, 1fr); gap:10px; margin-bottom:12px; }
.qr-eco-stages { display:grid; grid-template-columns: repeat(4, 1fr); gap:10px; }
.qr-eco-stage { background:#0f1726; border:1px solid #243044; color:#fff; padding:10px; border-radius:8px; text-align:center; cursor:pointer; }
.qr-eco-stage:hover { border-color:#0F62FE; }
.qr-eco-layout { display:grid; grid-template-columns: 1.4fr 0.6fr; gap:12px; }
.qr-eco-pipeline { background:#0f1726; border:1px solid #243044; padding:10px; border-radius:8px; margin-bottom:10px; }
.qr-eco-pipeline-stages { display:grid; grid-template-columns: repeat(4, 1fr); gap:8px; }
.qr-eco-pipe-step { background:#162032; color:#fff; border:1px solid #243044; padding:10px; border-radius:8px; text-align:center; cursor:pointer; }
.qr-eco-pipe-step:hover { border-color:#0F62FE; }
.qr-eco-registry { background:#0f1726; border:1px solid #243044; padding:10px; border-radius:8px; }
.qr-eco-registry-header { display:flex; justify-content:space-between; color:#fff; margin-bottom:8px; }
.qr-eco-table-wrap { overflow:auto; }
.qr-table { width:100%; border-collapse: collapse; color:#e5e5e5; }
.qr-table th, .qr-table td { padding:8px; border-bottom:1px solid #1b273a; text-align:left; }
.qr-table th { color:#fff !important; background:#0d1525; }
.qr-eco-aside { display:flex; flex-direction:column; gap:10px; }
.qr-eco-map, .qr-eco-tasks, .qr-eco-tickets { background:#0f1726; border:1px solid #243044; padding:10px; border-radius:8px; min-height:120px; }
.qr-eco-section-title { color:#fff; font-weight:bold; margin-bottom:6px; }
.qr-eco-task, .qr-eco-ticket { background:#162032; border:1px solid #243044; padding:8px; border-radius:6px; margin-bottom:6px; color:#e5e5e5; }
.qr-eco-task ul { margin:6px 0 0 16px; padding:0; }
.qr-eco-empty { color:#8a9bb8; padding:10px 0; }

/* Carbon theme: QR ecosystem table/panel elements match carbon dark aesthetic */
.theme-carbon .qr-table-panel { background: #1A1A1A; border-color: var(--theme-border); }
.theme-carbon .qr-table-header h3 { color: var(--theme-text); }
.theme-carbon .qr-select, .theme-carbon #qrSearch { background: var(--theme-input-bg); color: var(--theme-text); border-color: var(--theme-border); }
.theme-carbon .qr-table { color: var(--theme-text); background: #1A1A1A; border-color: var(--theme-border); }
.theme-carbon .qr-table th { color: var(--theme-text) !important; background: #1A1A1A; border: 1px solid #1F2A44; }
.theme-carbon .qr-table td { border-bottom: 1px solid #1F2A44; background: #1A1A1A; }
.theme-carbon .qr-eco-stage { background: #1A1A1A; border-color: var(--theme-border); color: var(--theme-text); }
.theme-carbon .qr-eco-pipeline { background: #1A1A1A; border-color: var(--theme-border); }
.theme-carbon .qr-eco-pipe-step { background: #1A1A1A; border-color: var(--theme-border); color: var(--theme-text); }
.theme-carbon .qr-eco-registry { background: #1A1A1A; border-color: var(--theme-border); }
.theme-carbon .qr-eco-registry-header { color: var(--theme-text); }
.theme-carbon .qr-eco-section-title { color: var(--theme-text-muted); }
.theme-carbon .qr-eco-task, .theme-carbon .qr-eco-ticket { background: #1A1A1A; border-color: var(--theme-border); color: var(--theme-text); }
.theme-carbon .qr-eco-empty { color: var(--theme-text-muted); }

/* QR stat blocks (on stock / transferred / total) */
.qr-stat-blocks{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.qr-stat-block{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px;border:1px solid var(--theme-border);border-radius:10px;background:var(--theme-surface-raised);color:var(--theme-text);text-decoration:none;transition:transform .08s ease,box-shadow .2s ease;min-width:110px}
.qr-stat-block:hover{transform:translateY(-2px);box-shadow:var(--theme-shadow-md);border-color:var(--theme-border)}
.qr-stat-block.active{background:#eaf1ff;border-color:#3b6fe0;box-shadow:0 4px 14px rgba(59,111,224,.18)}
.theme-dark .qr-stat-block.active{background:#1a3a5c;border-color:#6d9eeb;box-color:#6d9eeb}
.theme-contrast .qr-stat-block.active{background:#002244;border-color:#fff;box-shadow:0 0 0 2px #fff}
.qr-stat-num{font-size:28px;font-weight:800;line-height:1.1}
.qr-stat-label{font-size:12px;font-weight:600;color:#5a6b86;margin-top:4px;text-transform:uppercase;letter-spacing:.4px}
.theme-dark .qr-stat-label,.theme-contrast .qr-stat-label{color:var(--theme-text-muted)}
.qr-stat-block--total{background:#1f2a44;border-color:#1f2a44;color:#fff}
.theme-dark .qr-stat-block--total{background:#262626;border-color:#555;color:var(--theme-text)}
.theme-contrast .qr-stat-block--total{background:#000;border:2px solid #fff;color:#fff}
.qr-stat-block--total .qr-stat-label{color:#b9c4dc}
.theme-dark .qr-stat-block--total .qr-stat-label,.theme-contrast .qr-stat-block--total .qr-stat-label{color:var(--theme-text-muted)}
.qr-filter-note{font-size:13px;color:#5a6b86;margin:2px 0 0}
.qr-filter-note a{color:#3b6fe0;font-weight:600}



/* ==== utilities.css ==== */
/* ===== Utility helpers for migrated inline styles ===== */
/* These complement static/css/site.css and avoid inline style= attributes. */

/* ===== Layout helpers ===== */
.grid { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-auto-fit { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.grid-gap-8 { gap: 8px; }
.grid-gap-10 { gap: 10px; }
.grid-gap-12 { gap: 12px; }

.flex { display: flex; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.flex-1 { flex: 1; }
.flex-shrink-0 { flex-shrink: 0; }
.min-w-0 { min-width: 0; }
.truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.relative { position: relative; }
.overflow-hidden { overflow: hidden; }
.overflow-y-auto { overflow-y: auto; }

/* ===== Spacing helpers ===== */
.mt-0 { margin-top: 0; }
.mt-6 { margin-top: 6px; }
.mt-8 { margin-top: 8px; }
.mt-10 { margin-top: 10px; }
.mt-12 { margin-top: 12px; }
.mt-16 { margin-top: 16px; }
.mt-18 { margin-top: 18px; }
.mt-20 { margin-top: 20px; }
.mt-24 { margin-top: 24px; }
.mb-6 { margin-bottom: 6px; }
.mb-8 { margin-bottom: 8px; }
.mb-10 { margin-bottom: 10px; }
.mb-12 { margin-bottom: 12px; }
.mb-14 { margin-bottom: 14px; }
.mb-18 { margin-bottom: 18px; }
.mb-20 { margin-bottom: 20px; }
.mb-24 { margin-bottom: 24px; }
.ml-8 { margin-left: 8px; }
.mx-auto { margin-left: auto; margin-right: auto; }

.p-0 { padding: 0; }
.p-6 { padding: 6px; }
.p-8 { padding: 8px; }
.p-10 { padding: 10px; }
.p-12 { padding: 12px; }
.p-14 { padding: 14px; }
.p-20 { padding: 20px; }
.pt-6 { padding-top: 6px; }
.pt-8 { padding-top: 8px; }

/* ===== Typography helpers ===== */
.text-xs { font-size: 12px; }
.text-sm { font-size: 13px; }
.text-base { font-size: 14px; }
.text-lg { font-size: 18px; }
.font-600 { font-weight: 600; }
.font-700 { font-weight: 700; }
.font-800 { font-weight: 800; }
.font-bold { font-weight: bold; }
.uppercase { text-transform: uppercase; }
.nowrap { white-space: nowrap; }
.line-height-1-4 { line-height: 1.4; }
.letter-spacing-02 { letter-spacing: .02em; }

/* ===== Color helpers ===== */
.text-muted { color: #555; }
.text-muted-dark { color: #5b6470; }
.text-danger { color: #dc3545; }
.text-error { color: #ff8a8a; }
.text-success { color: #8af0a0; }
.text-link { color: #7ec8ff; }
.text-white { color: #fff; }

/* ===== Border helpers ===== */
.border { border: 1px solid; }
.border-2 { border-width: 2px; }
.rounded-6 { border-radius: 6px; }
.rounded-8 { border-radius: 8px; }
.rounded-10 { border-radius: 10px; }

/* ===== Button helpers ===== */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 12px; border-radius: 6px; border: 1px solid transparent; font-size: 13px; line-height: 1.2; }
.btn-sm { padding: 6px 10px; font-size: 12px; }
.btn-primary { background: #0d6efd; border-color: #0d6efd; color: #fff; }
.btn-secondary { background: #6c757d; border-color: #6c757d; color: #fff; }
.btn-success { background: #198754; border-color: #198754; color: #fff; }
.btn-danger { background: #dc3545; border-color: #dc3545; color: #fff; }
.btn-outline { background: transparent; border-color: #d6dbe6; color: #111; }
.btn-ghost { background: transparent; border-color: transparent; color: inherit; }

/* ===== QR-specific component helpers ===== */
.qr-card { background: var(--theme-surface); border: 1px solid var(--theme-border); border-radius: 8px; color: var(--theme-text); }
.theme-dark .qr-card, .theme-contrast .qr-card, .theme-carbon .qr-card { background: var(--theme-surface); border-color: var(--theme-border); color: var(--theme-text); }
.theme-contrast .qr-card { background: #000; border: 2px solid #fff; box-shadow: none; }
.qr-card-body { padding: 20px; }
.qr-card-header { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.qr-card-title { font-size: 18px; margin: 0; }
.qr-divider { border: 0; border-top: 1px solid #e5e9f2; margin: 12px 0; }
.qr-section-title { font-size: 18px; margin: 0 0 8px; }
.qr-section-subtitle { font-size: 14px; margin-bottom: 8px; }
.qr-hint { font-size: 12px; color: #555; }
.qr-muted { font-size: 12px; color: #5b6470; }
.qr-info-box { background: #f3f5f9; border: 1px solid #e5e9f2; border-radius: 8px; padding: 10px; }
.qr-inline-inputs { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.qr-bulk-form { background: #fff; border: 1px solid #e5e9f2; border-radius: 8px; padding: 10px; margin-bottom: 10px; }
.qr-bulk-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.qr-table { width: 100%; border-collapse: collapse; margin-top: 8px; }
.qr-table th, .qr-table td { padding: 8px; border-bottom: 1px solid #f3f5f9; text-align: left; }
.qr-table th { font-weight: 600; color: #333; border-bottom: 1px solid #e5e9f2; }
.qr-table-tight { width: 40px; text-align: center; }
.qr-batch-group { margin-bottom: 10px; }
.qr-batch-header { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; background: #f8f9fa; border: 1px solid #e5e9f2; border-radius: 8px; }
.qr-batch-header-left { display: flex; align-items: center; gap: 8px; }
.qr-batch-toggle { cursor: pointer; user-select: none; color: #5b6470; }
.qr-batch-body { padding: 10px 0; }
.qr-ungrouped { margin-top: 12px; }
.qr-link { color: #0d6efd; }

/* Auto-generated inline style migration */

.css__webkit_overflow_scrolling_tou_482fad { -webkit-overflow-scrolling: touch; overflow-y: auto }

.css_align_items_center_background__f7eddc { align-items: center; background: #f4f4f4; border-radius: 6px; color: #888; display: flex; height: 140px; justify-content: center; width: 100% }

.css_align_items_center_background__ded41e { align-items: center; background: rgba(0,0,0,.45); display: none; inset: 0; justify-content: center; position: fixed; z-index: 10 }

.css_align_items_center_background__055b10 { align-items: center; background: rgba(0,0,0,.5); display: none; inset: 0; justify-content: center; position: fixed }

.css_align_items_center_background__747dee { align-items: center; background: rgba(0,0,0,.5); display: none; inset: 0; justify-content: center; position: fixed; z-index: 1 }

.css_align_items_center_background__89d3ca { align-items: center; background: rgba(0,0,0,.5); display: none; inset: 0; justify-content: center; position: fixed; z-index: 2 }

.css_align_items_center_border_bott_20b628 { align-items: center; border-bottom: 1px solid #f0f0f0; display: flex; gap: 6px; padding: 5px 2px }

.css_align_items_center_border_bott_9b409b { align-items: center; border-bottom: 1px solid #f0f0f0; display: flex; gap: 8px; padding: 6px 4px }

.css_align_items_center_border_1px__8d8eb2 { align-items: center; border: 1px solid #cfe1ff; border-radius: 8px; color: #0b74ff; display: inline-flex; padding: 10px 14px; text-decoration: none }

.css_align_items_center_border_1px__f0591d { align-items: center; border: 1px solid #e1e1e1; border-radius: 8px; color: #555; display: inline-flex; padding: 10px 14px; text-decoration: none }

.css_align_items_center_border_1px__ecaa24 { align-items: center; border: 1px solid #e5e9f2; border-radius: 8px; display: flex; gap: 10px; padding: 8px }

.css_align_items_center_border_1px__aa17c5 { align-items: center; border: 1px solid #eef1f6; border-radius: 8px; display: flex; gap: 10px; padding: 10px }

.css_align_items_center_box_sizing__302504 { align-items: center; box-sizing: border-box; display: flex; justify-content: center; min-height: 100vh; padding: 20px }

.css_align_items_center_cursor_poin_8d3db1 { align-items: center; cursor: pointer; display: inline-flex; font-size: 13px; gap: 6px }

.css_align_items_center_display_fle_88ad70 { align-items: center; display: flex; flex-direction: column; gap: 10px }

.css_align_items_center_display_fle_070dc7 { align-items: center; display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between }

.css_align_items_center_display_fle_09e613 { align-items: center; display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px }

.css_align_items_center_display_fle_036232 { align-items: center; display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px }

.css_align_items_center_display_fle_5ec7af { align-items: center; display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 12px }

.css_align_items_center_display_fle_269798 { align-items: center; display: flex; flex-wrap: wrap; gap: 8px }

.css_align_items_center_display_fle_31e28b { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px }

.css_align_items_center_display_fle_c6320f { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px }

.css_align_items_center_display_fle_666585 { align-items: center; display: flex; font-weight: bold; justify-content: space-between }

.css_align_items_center_display_fle_0aa041 { align-items: center; display: flex; gap: 10px; margin-bottom: 10px }

.css_align_items_center_display_fle_0b9a9b { align-items: center; display: flex; gap: 12px; justify-content: space-between; margin-bottom: 12px }

.css_align_items_center_display_fle_6b5515 { align-items: center; display: flex; gap: 8px }

.css_align_items_center_display_fle_36838c { align-items: center; display: flex; gap: 8px; margin-bottom: 6px }

.css_align_items_center_display_fle_0d5c70 { align-items: center; display: flex; gap: 8px; margin-bottom: 8px }

.css_align_items_center_display_fle_78c20b { align-items: center; display: flex; gap: 8px; margin-top: 4px }

.css_align_items_center_display_fle_527344 { align-items: center; display: flex; justify-content: center; margin: 0 auto 16px }

.css_align_items_center_display_fle_8e25f0 { align-items: center; display: flex; justify-content: space-between; margin-bottom: 10px }

.css_align_items_center_display_fle_814532 { align-items: center; display: flex; justify-content: space-between; margin-bottom: 12px }

.css_align_items_center_display_fle_fd9d2c { align-items: center; display: flex; justify-content: space-between; margin-top: 14px }

.css_align_items_center_display_inl_1001c5 { align-items: center; display: inline-flex; font-size: 13px; gap: 6px }

.css_align_items_center_display_inl_719eef { align-items: center; display: inline-flex; font-size: 13px; gap: 6px; margin-left: 8px; text-decoration: none }

.css_align_items_center_display_inl_cb8dc5 { align-items: center; display: inline-flex; font-size: 13px; gap: 6px; text-decoration: none }

.css_align_self_flex-start_backgrou_f5bd61 { align-self: flex-start; background: #dc3545; border: 0; border-radius: 6px; color: #fff; cursor: pointer; font-size: 12px; padding: 6px 10px }



.css_background_000_border_radius_8_afa450 { background: #000; border-radius: 8px; display: none; width: 100% }

.css_background_007BFF_border_radiu_592e09 { background: #007BFF; border-radius: 4px; color: #fff; display: inline-block; font-weight: 600; margin-top: 14px; padding: 10px 14px; text-decoration: none }

.css_background_0b74ff_border_radiu_b28239 { background: #0b74ff; border-radius: 6px; color: #fff; display: inline-block; font-size: 13px; padding: 6px 12px; text-decoration: none }

.css_background_0b74ff_border_radiu_873f50 { background: #0b74ff; border-radius: 6px; color: white; display: inline-block; font-size: 12px; padding: 5px 10px; text-decoration: none }

.css_background_0b74ff_border_0_bor_35d07d { background: #0b74ff; border: 0; border-radius: 6px; color: #fff; cursor: pointer; margin-left: auto; padding: 8px 12px }

.css_background_0b74ff_border_0_bor_e3c6fa { background: #0b74ff; border: 0; border-radius: 6px; color: white; cursor: pointer; font-size: 13px; padding: 6px 12px }

.css_background_0b74ff_border_0_bor_802883 { background: #0b74ff; border: 0; border-radius: 8px; color: #fff; cursor: pointer; padding: 10px 14px }

.css_background_0b74ff_border_0_bor_15eee8 { background: #0b74ff; border: 0; border-radius: 8px; color: #fff; cursor: pointer; padding: 10px 14px; width: max-content }

.css_background_0b74ff_border_0_bor_8be1fe { background: #0b74ff; border: 0; border-radius: 8px; color: white; cursor: pointer; padding: 10px 14px }

.css_background_0b74ff_border_1px_s_9edecd { background: #0b74ff; border: 1px solid #0b74ff; border-radius: 8px; color: #fff; cursor: pointer; flex: 1; padding: 10px }

.css_background_0b74ff_border_1px_s_b99207 { background: #0b74ff; border: 1px solid #0b74ff; border-radius: 8px; color: #fff; cursor: pointer; margin-top: 8px; padding: 8px 14px }

.css_background_0d6efd_border_0_bor_b40701 { background: #0d6efd; border: 0; border-radius: 6px; color: #fff; cursor: pointer; font-size: 13px; padding: 6px 10px }

.css_background_152c66_border_color_28a06e { background: #152c66; border-color: #152c66; color: #fff }

.css_background_16a34a_border_radiu_f63b4e { background: #16a34a; border-radius: 50%; display: inline-block; height: 10px; width: 10px }

.css_background_17a2b8_277f15 { background: #17a2b8 }

.css_background_17a2b8_color_fff_8d012a { background: #17a2b8; color: #fff }

.css_background_17a2b8_color_white_e0e165 { background: #17a2b8; color: white }

.css_background_17a2b8_margin_top_1_bcb823 { background: #17a2b8; margin-top: 10px }

.css_background_198754_border_0_bor_564228 { background: #198754; border: 0; border-radius: 6px; color: #fff; cursor: pointer; font-size: 13px; padding: 6px 10px }

.css_background_1abc9c_border_radiu_413f4f { background: #1abc9c; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_2563eb_border_color_2eabe5 { background: #2563eb; border-color: #2563eb; color: #fff; flex: 1; font-size: 13px; text-align: center }

.css_background_2563eb_border_radiu_df5182 { background: #2563eb; border-radius: 50%; display: inline-block; height: 10px; margin-left: 10px; width: 10px }

.css_background_2ecc71_border_radiu_aec98c { background: #2ecc71; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_34495e_border_radiu_dea8c3 { background: #34495e; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_3498db_border_radiu_5c66ac { background: #3498db; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_495057_32a4bb { background: #495057 }

.css_background_6c757d_155fb5 { background: #6c757d }

.css_background_6c757d_border_color_7b66d5 { background: #6c757d; border-color: #6c757d; color: #fff }

.css_background_6c757d_border_color_01f638 { background: #6c757d; border-color: #6c757d; color: #fff; display: none; padding: 10px 14px }

.css_background_6c757d_border_color_3a7a97 { background: #6c757d; border-color: #6c757d; color: #fff; padding: 10px 14px }

.css_background_6c757d_border_radiu_1bd611 { background: #6c757d; border-radius: 6px; color: #fff; display: inline-block; padding: 8px 10px; text-decoration: none }

.css_background_6c757d_margin_left__5ec666 { background: #6c757d; margin-left: 8px }

.css_background_7f8c8d_border_radiu_73b73d { background: #7f8c8d; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_9b59b6_border_radiu_7d0337 { background: #9b59b6; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_9ca3af_border_radiu_0243c9 { background: #9ca3af; border-radius: 50%; display: inline-block; height: 10px; margin-left: 10px; width: 10px }

.css_background_c00_color_fff_width_762a0c { background: #c00; color: #fff; width: auto }

.css_background_c0392b_border_color_1bc341 { background: #c0392b; border-color: #c0392b; width: auto }

.css_background_dc3545_border_color_550441 { background: #dc3545; border-color: #dc3545 }

.css_background_dc3545_border_color_5d5f13 { background: #dc3545; border-color: #dc3545; color: #fff }

.css_background_dc3545_border_color_22c34e { background: #dc3545; border-color: #dc3545; font-size: 13px; width: 100% }

.css_background_dc3545_border_0_bor_8e04c8 { background: #dc3545; border: 0; border-radius: 6px; color: #fff; cursor: pointer; font-size: 13px; padding: 6px 10px }

.css_background_dc3545_border_none__89c9cf { background: #dc3545; border: none; border-radius: 4px; color: white; cursor: pointer; font-size: 11px; margin-top: 6px; padding: 4px 8px }

.css_background_e74c3c_border_radiu_57c175 { background: #e74c3c; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_e9ecef_border_radiu_79bf00 { background: #e9ecef; border-radius: 6px; color: #222; display: inline-block; font-size: 13px; margin-bottom: 16px; padding: 6px 10px; text-decoration: none }

.css_background_e9ecef_border_radiu_c63f2f { background: #e9ecef; border-radius: 6px; color: #222; font-size: 12px; padding: 6px 10px; text-decoration: none }

.css_background_e9ecef_border_radiu_c3d6af { background: #e9ecef; border-radius: 6px; color: #222; font-size: 13px; margin-left: 8px; padding: 8px 14px; text-decoration: none }

.css_background_e9ecef_border_radiu_dc333c { background: #e9ecef; border-radius: 6px; font-size: 12px; padding: 6px 10px; text-decoration: none }

.css_background_eef2f7_border_radiu_e6aafb { background: #eef2f7; border-radius: 10px; color: #555; font-size: 12px; padding: 2px 8px }

.css_background_eef_border_radius_4_04f532 { background: #eef; border-radius: 4px; display: inline-block; font-size: 12px; margin: 2px; padding: 2px 6px }

.css_background_f39c12_border_radiu_a05cd0 { background: #f39c12; border-radius: 50%; cursor: pointer; height: 28px; width: 28px }

.css_background_f3f5f9_border_1px_s_cf1600 { background: #f3f5f9; border: 1px solid #e5e9f2; border-radius: 10px; color: #222; display: block; padding: 14px 10px; text-align: center; text-decoration: none }

.css_background_f3f5f9_text_align_l_1c15c5 { background: #f3f5f9; text-align: left }

.css_background_fafafa_border_1px_s_5ad595 { background: #fafafa; border: 1px solid #ddd; border-radius: 8px; height: 420px; margin: 10px 0; overflow-y: auto; padding: 10px }

.css_background_fafafa_border_1px_s_b65e94 { background: #fafafa; border: 1px solid #e5e9f2; border-radius: 8px; display: flex; flex-direction: column; gap: 6px; padding: 10px }

.css_background_fafafa_border_1px_s_dc6b9a { background: #fafafa; border: 1px solid #eee; border-radius: 6px; font-size: 12px; overflow-y: auto; padding: 6px }

.css_background_fff_border_color_d6_213910 { background: #fff; border-color: #d6dbe6; color: #111; margin-top: 8px; padding: 8px 12px }

.css_background_fff_border_radius_1_e6fed9 { background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.25); max-width: 92vw; padding: 18px; width: 420px }

.css_background_fff_border_radius_1_8525f7 { background: #fff; border-radius: 10px; max-height: 90vh; max-width: 520px; overflow: auto; padding: 18px; width: 92% }

.css_background_fff_border_radius_1_f30e10 { background: #fff; border-radius: 10px; max-width: 420px; padding: 18px; width: 92% }

.css_background_fff_border_1px_soli_6a85c6 { background: #fff; border: 1px solid #0b74ff; border-radius: 8px; color: #0b74ff; cursor: pointer; flex: 1; padding: 10px }

.css_background_fff_border_1px_soli_8c27e2 { background: #fff; border: 1px solid #ccc; border-radius: 6px; color: #333; font-size: 13px; padding: 6px 12px; text-decoration: none }

.css_background_fff_border_1px_soli_92ea84 { background: #fff; border: 1px solid #ccc; border-radius: 6px; cursor: pointer; margin-top: 12px; padding: 8px 12px }

.css_background_fff_border_1px_soli_e42f8e { background: #fff; border: 1px solid #ccc; border-radius: 8px; color: #333; cursor: pointer; padding: 10px 14px }

.css_background_fff_border_1px_soli_25daa0 { background: #fff; border: 1px solid #d6dbe6; border-radius: 6px; cursor: pointer; padding: 8px 12px }

.css_background_fff_border_1px_soli_b0a9c2 { background: #fff; border: 1px solid #d6dbe6; border-radius: 6px; flex: 1; font-size: 13px; padding: 8px }

.css_background_fff_border_1px_soli_3f1a13 { background: #fff; border: 1px solid #ddd; border-radius: 10px; padding: 12px }

.css_background_fff_border_1px_soli_bd300a { background: #fff; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.06); margin: 10vh auto; max-width: 700px; padding: 24px }

.css_background_fff_border_1px_soli_14c894 { background: #fff; border: 1px solid #ddd; border-radius: 8px; margin-bottom: 10px; max-width: 520px; padding: 12px }

.css_background_fff_border_1px_soli_738788 { background: #fff; border: 1px solid #e1e1e1; border-radius: 12px; overflow: auto }

.css_background_fff_border_1px_soli_b503c6 { background: #fff; border: 1px solid #e1e4e8; border-radius: 12px; max-width: 340px; padding: 16px }

.css_background_fff_border_1px_soli_ab310c { background: #fff; border: 1px solid #e5e5e5; border-radius: 10px; padding: 18px }

.css_background_fff_border_1px_soli_540d11 { background: #fff; border: 1px solid #e5e9f2; border-radius: 8px; padding: 12px }



.css_background_none_border_0_curso_61ef0e { background: none; border: 0; cursor: pointer; padding: 0 }

.css_background_none_border_none_cu_51efb1 { background: none; border: none; cursor: pointer; height: 30px; width: 34px }

.css_background_transparent_border__df012a { background: transparent; border: 0; color: #666; cursor: pointer; font-size: 18px }

.css_background_transparent_border__c0802a { background: transparent; border: 1px solid #0b74ff; border-radius: 8px; color: #0b74ff; cursor: pointer; padding: 8px 12px }

.css_background_white_border_radius_c90f08 { background: white; border-radius: 8px; box-sizing: border-box; height: auto; max-width: 100%; padding: 8px; width: 120px }

.css_background_white_border_radius_bfbc47 { background: white; border-radius: 8px; box-sizing: border-box; height: auto; max-width: 100%; padding: 8px; width: 200px }



.css_border_bottom_1px_solid_ddd_te_102656 { border-bottom: 1px solid #ddd; text-align: left }

.css_border_bottom_1px_solid_e5e9f2_2aec89 { border-bottom: 1px solid #e5e9f2; padding: 8px }

.css_border_bottom_1px_solid_f3f5f9_408cc5 { border-bottom: 1px solid #f3f5f9; padding: 8px }

.css_border_collapse_collapse_font__06104a { border-collapse: collapse; font-size: 13px; min-width: 560px; width: 100% }

.css_border_collapse_collapse_font__0ed22b { border-collapse: collapse; font-size: 14px; min-width: 560px; width: 100% }

.css_border_collapse_collapse_margi_674109 { border-collapse: collapse; margin-top: 12px; width: 100% }

.css_border_collapse_collapse_margi_1cde05 { border-collapse: collapse; margin-top: 16px; width: 100% }

.css_border_collapse_collapse_margi_9a23b4 { border-collapse: collapse; margin-top: 8px; width: 100% }

.css_border_radius_6px_height_140px_378b25 { border-radius: 6px; height: 140px; object-fit: cover; width: 100% }

.css_border_1px_solid_ccc_border_ra_f6e438 { border: 1px solid #ccc; border-radius: 6px; flex: 1; padding: 10px }

.css_border_1px_solid_ccc_border_ra_03ecb7 { border: 1px solid #ccc; border-radius: 6px; flex: 1; padding: 6px }

.css_border_1px_solid_ced4da_border_63a115 { border: 1px solid #ced4da; border-radius: 6px; padding: 10px; width: 100% }

.css_border_1px_solid_cfe1ff_border_d09ab1 { border: 1px solid #cfe1ff; border-radius: 8px; color: #0b74ff; padding: 10px 14px; text-decoration: none }

.css_border_1px_solid_d6dbe6_border_6528e7 { border: 1px solid #d6dbe6; border-radius: 6px; margin-bottom: 10px; padding: 10px; width: 100% }

.css_border_1px_solid_d6dbe6_border_a9a5ca { border: 1px solid #d6dbe6; border-radius: 6px; margin-top: 6px; padding: 8px; width: 100% }

.css_border_1px_solid_d6dbe6_border_d2e1ef { border: 1px solid #d6dbe6; border-radius: 6px; margin-top: 8px; max-height: 140px; max-width: 100% }

.css_border_1px_solid_d6dbe6_border_4ea11a { border: 1px solid #d6dbe6; border-radius: 6px; padding: 10px }

.css_border_1px_solid_d6dbe6_border_f45ea5 { border: 1px solid #d6dbe6; border-radius: 6px; padding: 10px; width: 100% }

.css_border_1px_solid_d6dbe6_border_a27034 { border: 1px solid #d6dbe6; border-radius: 6px; padding: 8px }

.css_border_1px_solid_d6dbe6_border_9fbe4a { border: 1px solid #d6dbe6; border-radius: 6px; padding: 8px; width: 100% }

.css_border_1px_solid_d6dbe6_border_d7d56c { border: 1px solid #d6dbe6; border-radius: 6px; padding: 8px; width: 72px }

.css_border_1px_solid_d6dbe6_border_f8725c { border: 1px solid #d6dbe6; border-radius: 8px; padding: 10px; width: 100% }

.css_border_1px_solid_ddd_border_ra_e42743 { border: 1px solid #ddd; border-radius: 8px; height: 520px; width: 100% }

.css_border_1px_solid_e1e1e1_border_b10046 { border: 1px solid #e1e1e1; border-radius: 10px; min-width: 240px; padding: 10px 12px }

.css_border_1px_solid_e1e1e1_border_a8c09b { border: 1px solid #e1e1e1; border-radius: 8px; color: #555; padding: 10px 14px; text-decoration: none }

.css_border_1px_solid_e5e9f2_border_11d2ce { border: 1px solid #e5e9f2; border-radius: 6px; max-height: 120px }

.css_border_1px_solid_e5e9f2_border_657004 { border: 1px solid #e5e9f2; border-radius: 6px; padding: 8px }

.css_border_1px_solid_e5e9f2_border_09f9cb { border: 1px solid #e5e9f2; border-radius: 8px; display: block; height: auto; width: 100% }

.css_border_1px_solid_e5e9f2_border_73550c { border: 1px solid #e5e9f2; border-radius: 8px; margin-bottom: 8px; padding: 10px }

.css_border_2px_solid_007BFF_border_1fc5c1 { border: 2px solid #007BFF; border-radius: 6px; display: block; height: 90px; object-fit: cover; width: 140px }

.css_border_2px_solid_ddd_border_ra_6450d6 { border: 2px solid #ddd; border-radius: 6px; display: block; height: 90px; object-fit: cover; width: 140px }

.css_color_0b74ff_display_inline-bl_530b08 { color: #0b74ff; display: inline-block; font-size: 13px; margin-top: 12px }

.css_color_0b74ff_font_weight_600_t_730791 { color: #0b74ff; font-weight: 600; text-decoration: none }

.css_color_16a34a_f723e7 { color: #16a34a }

.css_color_25b865_font_size_10px_6bbde7 { color: #25b865; font-size: 10px }

.css_color_25b865_font_size_10px_fo_d9a9f2 { color: #25b865; font-size: 10px; font-weight: 700 }

.css_color_28a745_font_size_12px_c41971 { color: #28a745; font-size: 12px }

.css_color_28a745_font_size_12px_ma_e5d58d { color: #28a745; font-size: 12px; margin-left: 8px }

.css_color_333_ef0990 { color: #333 }

.css_color_333_font_size_12px_width_6edc74 { color: #333; font-size: 12px; width: 100% }

.css_color_333_font_size_13px_margi_9bd829 { color: #333; font-size: 13px; margin-top: 8px }

.css_color_444_margin_top_10px_3405ee { color: #444; margin-top: 10px }

.css_color_555_font_size_12px_9c2fcb { color: #555; font-size: 12px }

.css_color_555_font_size_12px_font__080150 { color: #555; font-size: 12px; font-weight: 400; margin-top: 6px }

.css_color_555_font_size_12px_line__082ab8 { color: #555; font-size: 12px; line-height: 1.4 }

.css_color_555_font_size_12px_margi_534c1d { color: #555; font-size: 12px; margin-top: 8px }

.css_color_555_font_size_13px_margi_07eda4 { color: #555; font-size: 13px; margin: 0 }

.css_color_555_font_size_13px_margi_20c75a { color: #555; font-size: 13px; margin: 0 0 14px }

.css_color_5b6470_cursor_grab_user__bff475 { color: #5b6470; cursor: grab; user-select: none }

.css_color_5b6470_font_size_11px_dc5132 { color: #5b6470; font-size: 11px }

.css_color_5b6470_font_size_12px_ma_b1f632 { color: #5b6470; font-size: 12px; margin-bottom: 8px }

.css_color_5b6470_font_size_12px_ma_068b1c { color: #5b6470; font-size: 12px; margin-top: 4px }

.css_color_5b6470_font_size_13px_ma_fb959c { color: #5b6470; font-size: 13px; margin-left: 10px }

.css_color_666_7b6573 { color: #666 }

.css_color_666_display_none_margin__a9cf34 { color: #666; display: none; margin-top: 14px }

.css_color_666_font_size_12px_e1449c { color: #666; font-size: 12px }

.css_color_666_font_size_12px_margi_26e7ac { color: #666; font-size: 12px; margin-top: 4px }

.css_color_666_margin_top_14px_55a6f3 { color: #666; margin-top: 14px }

.css_color_666_padding_12px_text_al_274930 { color: #666; padding: 12px; text-align: center }

.css_color_666_padding_2px_4px_d7a9fa { color: #666; padding: 2px 4px }

.css_color_777_font_size_12px_9903f5 { color: #777; font-size: 12px }

.css_color_888_57e0e3 { color: #888 }

.css_color_888_font_size_11px_7ff380 { color: #888; font-size: 11px }

.css_color_888_font_size_12px_72ce7b { color: #888; font-size: 12px }

.css_color_888_font_size_12px_paddi_f459c9 { color: #888; font-size: 12px; padding: 6px }

.css_color_888_font_size_13px_26ca9c { color: #888; font-size: 13px }

.css_color_888_padding_8px_9210f7 { color: #888; padding: 8px }

.css_color_999_padding_6px_d3949d { color: #999; padding: 6px }

.css_color_9ca3af_82e89f { color: #9ca3af }

.css_color_aaa_font_size_10px_4f87e5 { color: #aaa; font-size: 10px }

.css_color_c33_font_size_12px_paddi_1abc20 { color: #c33; font-size: 12px; padding: 6px }

.css_color_d33_font_size_11px_margi_ed94a1 { color: #d33; font-size: 11px; margin-top: 6px }

.css_color_dc3545_font_size_12px_ma_58b078 { color: #dc3545; font-size: 12px; margin-top: 4px }

.css_color_red_eb1fbe { color: red }

.css_color_white_text_decoration_no_118e2b { color: white; text-decoration: none }

.css_display_block_96ce7e { display: block }

.css_display_block_font_size_13px_f_fb0ea2 { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px }

.css_display_block_font_weight_bold_54f0c6 { display: block; font-weight: bold; margin-bottom: 6px }

.css_display_block_height_120px_wid_e89f9f { display: block; height: 120px; width: 120px }

.css_display_block_opacity_.6_54a8a0 { display: block; opacity: .6 }

.css_display_block_opacity_.7_e9c785 { display: block; opacity: .7 }

.css_display_flex_flex_direction_co_7f123e { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; max-width: 480px }

.css_display_flex_flex_direction_co_1f16f5 { display: flex; flex-direction: column; gap: 10px; max-width: 420px }

.css_display_flex_flex_direction_co_2fc7fa { display: flex; flex-direction: column; gap: 16px; max-width: 480px }

.css_display_flex_flex_direction_co_60496a { display: flex; flex-direction: column; gap: 8px }

.css_display_flex_flex_direction_co_d86302 { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px }

.css_display_flex_flex_direction_co_8d879e { display: flex; flex-direction: column; gap: 8px; max-height: 260px; overflow: auto }

.css_display_flex_flex_wrap_wrap_ga_cf5638 { display: flex; flex-wrap: wrap; gap: 10px }

.css_display_flex_flex_wrap_wrap_ga_bb6bed { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 10px; margin-top: 10px }

.css_display_flex_flex_wrap_wrap_ga_920dba { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px }

.css_display_flex_flex_wrap_wrap_ga_316a78 { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px }

.css_display_flex_flex_wrap_wrap_ga_35832a { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px }

.css_display_flex_flex_wrap_wrap_ga_7f032f { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 16px }

.css_display_flex_flex_wrap_wrap_ga_9a317d { display: flex; flex-wrap: wrap; gap: 8px }

.css_display_flex_flex_wrap_wrap_ga_fb55ff { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px }

.css_display_flex_flex_wrap_wrap_ga_d16412 { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px }

.css_display_flex_gap_10px_margin_t_d5a0cd { display: flex; gap: 10px; margin-top: 18px }

.css_display_flex_gap_6px_margin_to_71d2c1 { display: flex; gap: 6px; margin-top: 6px }

.css_display_flex_gap_8px_8ac551 { display: flex; gap: 8px }

.css_display_flex_gap_8px_justify_c_5dfaf6 { display: flex; gap: 8px; justify-content: flex-end }

.css_display_flex_gap_8px_margin_to_387c0c { display: flex; gap: 8px; margin-top: 12px }

.css_display_flex_gap_8px_margin_to_2ddd7d { display: flex; gap: 8px; margin-top: 8px }

.css_display_grid_gap_10px_1863c8 { display: grid; gap: 10px }

.css_display_grid_gap_10px_grid_tem_6b3dc2 { display: grid; gap: 10px; grid-template-columns: 1fr 1fr }

.css_display_grid_gap_10px_grid_tem_e018ef { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); margin-bottom: 12px }

.css_display_grid_gap_10px_grid_tem_63ad25 { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); margin-bottom: 16px }

.css_display_grid_gap_10px_grid_tem_0d2b95 { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)) }

.css_display_grid_gap_10px_margin_t_663b6b { display: grid; gap: 10px; margin-top: 12px }

.css_display_grid_gap_10px_max_widt_38f634 { display: grid; gap: 10px; max-width: 480px }

.css_display_grid_gap_10px_max_widt_6b83e2 { display: grid; gap: 10px; max-width: 640px }

.css_display_grid_gap_10px_max_widt_5942cd { display: grid; gap: 10px; max-width: 720px }

.css_display_grid_gap_12px_grid_tem_84d3fd { display: grid; gap: 12px; grid-template-columns: repeat(3,1fr); margin-top: 12px }

.css_display_grid_gap_12px_grid_tem_94d56d { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); margin-top: 12px }

.css_display_grid_gap_12px_margin_t_0da47a { display: grid; gap: 12px; margin-top: 12px }

.css_display_grid_gap_12px_max_widt_257ad4 { display: grid; gap: 12px; max-width: 720px }

.css_display_grid_gap_14px_grid_tem_918f23 { display: grid; gap: 14px; grid-template-columns: 1fr 1fr }

.css_display_grid_gap_14px_grid_tem_39393e { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)) }

.css_display_grid_gap_18px_e7d650 { display: grid; gap: 18px }

.css_display_inline_2d150e { display: inline }

.css_display_inline-block_font_size_833688 { display: inline-block; font-size: 13px; margin-bottom: 10px; padding: 6px 12px }

.css_display_inline-block_margin_le_c5451f { display: inline-block; margin-left: 8px; padding: 8px 14px; text-decoration: none; width: auto }

.css_display_inline-block_margin_le_5db519 { display: inline-block; margin-left: 8px; text-decoration: none }

.css_display_inline-block_padding_8_2ba44b { display: inline-block; padding: 8px 14px; text-decoration: none; width: auto }

.css_display_inline-flex_93adc2 { display: inline-flex }

.css_display_inline-flex_width_auto_93fbfb { display: inline-flex; width: auto }

.css_display_none_9c7663 { display: none }

.css_display_none_gap_8px_grid_temp_19a969 { display: none; gap: 8px; grid-template-columns: 1fr 1fr; margin-top: 6px }



.css_flex_1_d2dc0a { flex: 1 }

.css_flex_1_font_size_13px_9cf5ab { flex: 1; font-size: 13px }

.css_flex_1_font_size_13px_text_ali_17fd84 { flex: 1; font-size: 13px; text-align: center }

.css_flex_1_min_width_0_694287 { flex: 1; min-width: 0 }

.css_font_size_13px_645e82 { font-size: 13px }

.css_font_size_13px_font_weight_600_67ff96 { font-size: 13px; font-weight: 600 }

.css_font_size_13px_font_weight_600_42647c { font-size: 13px; font-weight: 600; margin-bottom: 6px }

.css_font_size_13px_font_weight_600_444852 { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }

.css_font_size_13px_margin_top_10px_844047 { font-size: 13px; margin-top: 10px }

.css_font_size_13px_margin_top_6px_d07b2b { font-size: 13px; margin-top: 6px }

.css_font_size_13px_padding_6px_10p_ef5c2c { font-size: 13px; padding: 6px 10px }

.css_font_size_14px_1c639f { font-size: 14px }

.css_font_size_14px_text_decoration_c909ff { font-size: 14px; text-decoration: none }

.css_font_size_16px_margin_10px_0_4_228ac9 { font-size: 16px; margin: 10px 0 4px 0 }

.css_font_size_18px_margin_0_cac344 { font-size: 18px; margin: 0 }

.css_font_size_20px_margin_0_0_12px_7dbbf3 { font-size: 20px; margin: 0 0 12px 0 }

.css_font_size_22px_margin_0_afb4ad { font-size: 22px; margin: 0 }

.css_font_weight_600_93d1d3 { font-weight: 600 }

.css_font_weight_700_47e5cc { font-weight: 700 }

.css_font_weight_700_margin_bottom__8781dd { font-weight: 700; margin-bottom: 6px }

.css_font_weight_bold_2dfdc7 { font-weight: bold }

.css_font_weight_bold_margin_bottom_f42783 { font-weight: bold; margin-bottom: 6px }

.css_font_weight_bold_margin_6px_0_e0b51e { font-weight: bold; margin: 6px 0 }

.css_font_weight_bold_padding_2px_4_eadc91 { font-weight: bold; padding: 2px 4px }

.css_grid_column_1/-1_990e0e { grid-column: 1/-1 }

.css_height_18px_width_18px_8b96f8 { height: 18px; width: 18px }

.css_height_40%_ab4b9f { height: 40% }

.css_height_45%_082171 { height: 45% }

.css_height_50%_2e6a62 { height: 50% }

.css_height_60%_45e6f2 { height: 60% }

.css_height_65%_9fe187 { height: 65% }

.css_height_75%_f54a75 { height: 75% }

.css_height_85%_bc88ff { height: 85% }

.css_height_auto_max_width_100%_47de2f { height: auto; max-width: 100% }

.css_justify_self_start_padding_10p_feffd9 { justify-self: start; padding: 10px 14px }

.css_list_style_none_padding_0_1c278f { list-style: none; padding: 0 }

.css_margin_bottom_10px_273e41 { margin-bottom: 10px }

.css_margin_bottom_12px_f98fef { margin-bottom: 12px }

.css_margin_bottom_12px_text_align__b7b703 { margin-bottom: 12px; text-align: left }

.css_margin_bottom_16px_efb699 { margin-bottom: 16px }

.css_margin_bottom_5px_9d616a { margin-bottom: 5px }

.css_margin_bottom_6px_width_100%_2d92ce { margin-bottom: 6px; width: 100% }

.css_margin_bottom_8px_margin_top_2_4fd96e { margin-bottom: 8px; margin-top: 24px }

.css_margin_left_8px_padding_8px_12_d429ea { margin-left: 8px; padding: 8px 12px }

.css_margin_left_auto_width_auto_42cd4c { margin-left: auto; width: auto }

.css_margin_top_0_b8f7c9 { margin-top: 0 }

.css_margin_top_10px_8ced3a { margin-top: 10px }

.css_margin_top_12px_5bcd7a { margin-top: 12px }

.css_margin_top_12px_width_auto_642139 { margin-top: 12px; width: auto }

.css_margin_top_14px_0dc91c { margin-top: 14px }

.css_margin_top_16px_4de99d { margin-top: 16px }

.css_margin_top_18px_fc696d { margin-top: 18px }

.css_margin_top_24px_5e029f { margin-top: 24px }

.css_margin_top_4px_07c6a7 { margin-top: 4px }

.css_margin_top_6px_f254cb { margin-top: 6px }

.css_margin_top_6px_width_100%_c11e9c { margin-top: 6px; width: 100% }

.css_margin_top_6px_width_auto_dccc23 { margin-top: 6px; width: auto }

.css_margin_top_8px_bccd11 { margin-top: 8px }

.css_margin_0_1c244e { margin: 0 }

.css_margin_0_0_10px_bc9562 { margin: 0 0 10px }

.css_margin_0_0_12px_876199 { margin: 0 0 12px }

.css_margin_0_0_12px_0_c5686f { margin: 0 0 12px 0 }

.css_margin_0_0_6px_a6053e { margin: 0 0 6px }

.css_margin_0_0_8px_4b2b60 { margin: 0 0 8px }

.css_margin_0_auto_margin_top_6vh_m_72ee21 { margin: 0 auto; margin-top: 6vh; max-width: 720px }

.css_margin_0_auto_max_width_1200px_324af0 { margin: 0 auto; max-width: 1200px }

.css_margin_0_auto_max_width_520px_51981d { margin: 0 auto; max-width: 520px }

.css_margin_0_auto_max_width_720px_0b68e2 { margin: 0 auto; max-width: 720px }

.css_margin_0_auto_max_width_880px_63a4a4 { margin: 0 auto; max-width: 880px }

.css_margin_0_auto_max_width_960px_d03758 { margin: 0 auto; max-width: 960px }

.css_margin_0_auto_max_width_980px_7be912 { margin: 0 auto; max-width: 980px }

.css_margin_10px_0_18px_000b73 { margin: 10px 0 18px }

.css_margin_12px_0_65e0a2 { margin: 12px 0 }

.css_margin_15px_auto_0_max_height__b1d653 { margin: 15px auto 0; max-height: calc(100vh - 130px); max-width: 1100px; overflow-y: auto }

.css_margin_15px_auto_0_max_height__65951a { margin: 15px auto 0; max-height: calc(100vh - 130px); max-width: 900px; overflow-y: auto }

.css_margin_15px_auto_0_max_height__fc0483 { margin: 15px auto 0; max-height: calc(100vh - 130px); max-width: 960px; overflow-y: auto }

.css_margin_15px_auto_0_max_width_8_2ec549 { margin: 15px auto 0; max-width: 820px }

.css_margin_15px_auto_0_max_width_9_928f4f { margin: 15px auto 0; max-width: 980px }

.css_margin_16px_0_47100c { margin: 16px 0 }

.css_margin_6px_0_22f146 { margin: 6px 0 }

.css_max_width_100%_2361ed { max-width: 100% }

.css_max_width_220px_padding_10px_t_8046ae { max-width: 220px; padding: 10px; text-align: center; width: 100% }

.css_max_width_420px_text_align_cen_c0f28e { max-width: 420px; text-align: center; width: 100% }

.css_object_fit_contain_792706 { object-fit: contain }

.css_overflow_auto_39ee16 { overflow: auto }

.css_padding_10px_7fd0fd { padding: 10px }

.css_padding_10px_14px_509bdf { padding: 10px 14px }

.css_padding_10px_14px_text_decorat_b74cd2 { padding: 10px 14px; text-decoration: none }

.css_padding_10px_16px_d7f5b3 { padding: 10px 16px }

.css_padding_10px_width_100%_333ac5 { padding: 10px; width: 100% }

.css_padding_14px_5d2ba2 { padding: 14px }

.css_padding_20px_23a200 { padding: 20px }

.css_padding_6px_10px_width_auto_56b1a4 { padding: 6px 10px; width: auto }

.css_padding_8px_8cd4e7 { padding: 8px }

.css_padding_8px_14px_b0eeb4 { padding: 8px 14px }

.css_position_absolute_dd0d0e { position: absolute }

.css_text_align_center_7023da { text-align: center }

.css_width_120px_d44c18 { width: 120px }

.css_width_auto_a12bcd { width: auto }

.css_width_max-content_fa368d { width: max-content }


/* ==== Part 2: consolidated inline styles extracted from dashboard-shell templates ==== */
/* Simple one-off utility classes (kept alongside the auto-generated css_* set above) */
.css_display_inline { display: inline }
.css_max-width_640px { max-width: 640px }
.css_max-width_560px { max-width: 560px }
.css_max-width_280px { max-width: 280px }
.css_width_50pct { width: 50% }
.css_white-space_pre-wrap { white-space: pre-wrap }
.css_margin-top_10px { margin-top: 10px }
.css_margin-top_12px { margin-top: 12px }
.css_margin-left_10px { margin-left: 10px }
.css_border-radius_6px { border-radius: 6px }
.css_height_120px_width_120px { width: 120px; height: 120px }
.css_max-height_40px { max-height: 40px }
.css_height_520px { height: 520px }
.css_height_520px_width_100pct { width: 100%; height: 520px }
.css_text-decoration_none_color_inherit { text-decoration: none; color: inherit }
.css_inline-flex_min-w-auto_pad_12_14 { display: inline-flex; min-width: auto; padding: 12px 14px }
.icon-mr-6 { margin-right: 6px }
.css_visibility_hidden { visibility: hidden }

/* Image preview thumbnails (issue capture / inline issue modal) */
.img-preview-issue { max-width: 100%; margin-top: 8px; border: 1px solid var(--theme-border); border-radius: 4px }
.img-preview-220 { max-width: 220px; border: 1px solid var(--theme-border) }

/* Product questions modal (extensions/product_questions.html) */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; z-index: 9999; padding: 16px }
.modal-box { background: var(--theme-surface); color: var(--theme-text); max-width: 720px; width: 100%; max-height: 92vh; overflow: auto; border: 1px solid var(--theme-border); padding: 16px; border-radius: 8px }
.modal-box h2 { margin: 0 0 12px; font-size: 18px }
.product-form { max-width: 720px; margin: 0 auto }
.question-card { max-width: 720px; margin: 0 auto }
.product-grid .tile-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center }
.product-grid .tile-actions .settings-button { text-align: center; justify-content: center }
.product-grid { justify-items: center }
.product-view-row { justify-content: center }

/* Meetings dashboard (meetings/dashboard.html) */
.mtg-hero { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: linear-gradient(135deg, #2268ff 0%, #5a3fd4 100%); border-radius: 14px; padding: 22px 24px; margin-bottom: 20px; color: #fff }
.mtg-hero h2 { margin: 0; font-size: 20px }
.mtg-hero p { margin: 4px 0 0; opacity: .85; font-size: 13px; width: 100% }
.mtg-start-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--theme-surface); border: 1px solid var(--theme-border); border-radius: 12px; padding: 14px 16px; margin-bottom: 20px; color: var(--theme-text) }
.mtg-start-bar .form-input { flex: 1 1 240px; max-width: none !important; height: 40px; border-radius: 9px }
.mtg-start-bar .btn { height: 40px; border-radius: 9px; padding: 0 18px }
.mtg-check { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; color: inherit; cursor: pointer }
.mtg-action-group { display: inline-flex; gap: 6px }
.mtg-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; margin-bottom: 8px }
.mtg-item { display: flex; flex-direction: column; gap: 12px; background: var(--theme-surface); color: var(--theme-text); border: 1px solid var(--theme-border); border-radius: 12px; padding: 16px; transition: box-shadow .15s ease, transform .15s ease }
.mtg-item:hover { box-shadow: var(--theme-shadow-md); transform: translateY(-1px) }
.mtg-item-top { display: flex; align-items: flex-start; gap: 10px; min-width: 0 }
.mtg-item-top input[type="checkbox"] { margin-top: 3px }
.mtg-item-name { min-width: 0 }
.mtg-item-name strong { display: block; font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.mtg-item-name .slug { display: block; font-size: 11.5px; color: var(--theme-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.mtg-item-actions { display: flex; justify-content: space-between; align-items: center; gap: 8px }
.mtg-live-dot { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--theme-text-muted) }
.mtg-live-dot::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #46a758 }
.btn-sm-round { border-radius: 9px }
.mtg-section-head { display: flex; justify-content: space-between; align-items: center; margin: 28px 0 12px }
.mtg-section-head h3 { margin: 0; font-size: 16px }
.mtg-history-list { background: var(--theme-surface); border: 1px solid var(--theme-border); border-radius: 12px; overflow: hidden }
.mtg-history-row { display: grid; grid-template-columns: minmax(140px, 2fr) minmax(120px, 1.4fr) minmax(110px, 1fr) auto; gap: 12px; align-items: center; padding: 11px 16px; font-size: 13px; border-bottom: 1px solid var(--theme-border) }
.mtg-history-row:last-child { border-bottom: none }
.mtg-history-row:hover { background: var(--theme-surface-raised) }
.mtg-history-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.mtg-history-slug { font-size: 11.5px; color: var(--theme-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.mtg-history-meta { color: var(--theme-text-muted); font-size: 12.5px }
.mtg-empty { text-align: center; padding: 48px 20px; color: var(--theme-text-muted); background: transparent; border: 1px dashed var(--theme-border); border-radius: 12px }
.mtg-empty-span-all { grid-column: 1 / -1 }
.mtg-invite-list { max-height: 280px; overflow-y: auto; margin-bottom: 14px }
.mtg-modal-actions { display: flex; gap: 8px; justify-content: flex-end }
.mtg-online-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; flex: 0 0 9px; background: #198754; box-shadow: 0 0 0 3px rgba(25,135,84,.35) }
.mtg-online-name { margin-left: 2px }
.mtg-online-status { color: var(--theme-text-muted); font-size: 12px; margin-left: 6px }
.share-overlay { position: fixed; inset: 0; z-index: 100; background: rgba(0,0,0,.45); display: none; align-items: center; justify-content: center }
.share-overlay.open { display: flex }
.share-modal { background: var(--theme-surface); color: var(--theme-text); border-radius: 14px; width: min(480px, calc(100vw - 32px)); padding: 22px 24px; box-shadow: var(--theme-shadow-lg) }
.share-modal h3 { margin: 0 0 6px; font-size: 16px }
.share-modal p { margin: 0 0 14px; font-size: 12.5px; color: var(--theme-text-muted) }
.share-link-box { display: flex; gap: 8px; align-items: stretch }
.share-link-box input { flex: 1; height: 40px; border-radius: 9px; border: 1px solid var(--theme-border); padding: 0 12px; font-size: 13px; min-width: 0; background: var(--theme-input-bg); color: var(--theme-text) }
@media (max-width: 600px) {
  .tag-detail-card { padding: 14px !important }
  .tag-detail-header { align-items: stretch; flex-direction: column }
  .tag-detail-header-actions { justify-content: flex-start }
  .qr-codes { grid-template-columns: 1fr }
  .qr-code-card img { width: 60vw; max-width: 260px }
  .tag-record-stop-form { grid-template-columns: 1fr }
  .tag-record-stop-form .tag-record-stop-notes { grid-column: auto }
  .tag-record-stop-actions { align-items: stretch }
}

/* QR tag detail page (qr/tag_detail.html) */
.tag-detail-card { width: 100%; max-width: 980px; margin: 0 auto; padding: 24px }
.tag-detail-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px }
.tag-detail-header h2 { margin: 0; min-width: 0; overflow-wrap: anywhere }
.tag-detail-header-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px }
.tag-detail-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px,1fr)); gap: 14px; margin-bottom: 24px }
.tag-detail-meta > div { min-width: 0; padding: 12px; border: 1px solid var(--theme-border); border-radius: 8px }
.tag-detail-meta form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px }
.tag-detail-meta select { min-width: 0; flex: 1 1 140px }
.tag-detail-section { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--theme-border) }
.tag-detail-section > h3 { margin: 0 0 8px }
.qr-codes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 20px; align-items: start }
.qr-code-card { min-width: 0; padding: 16px; border: 1px solid var(--theme-border); border-radius: 10px; text-align: center }
.qr-code-card img { display: block; width: min(100%,360px); height: auto; margin: 0 auto 10px }
.qr-code-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 10px }
.qr-code-actions form { margin: 0 }
.tag-detail-card #scanModal { margin-top: 24px; padding: 16px }
.tag-detail-card #scanVideo { display: none; width: 100%; max-width: 520px; max-height: 300px; margin: 12px auto; object-fit: contain }
.tag-detail-card table { display: block; max-width: 100%; overflow-x: auto }
.tag-detail-card input, .tag-detail-card select, .tag-detail-card textarea { max-width: 100% }
.tag-record-stop-form { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; max-width: 680px }
.tag-record-stop-form label { display: flex; flex-direction: column; gap: 6px; color: var(--theme-text-muted); font-size: 13px; font-weight: 600 }
.tag-record-stop-form input, .tag-record-stop-form select, .tag-record-stop-form textarea { width: 100%; padding: 9px 10px; border: 1px solid var(--theme-border); border-radius: 6px; background: var(--theme-input-bg); color: var(--theme-text); font: inherit; font-weight: 400 }
.tag-record-stop-form .tag-record-stop-notes { grid-column: 1 / -1 }
.tag-record-stop-actions { display: flex; align-items: end }

/* Dashboard shell: messenger widget header, leaflet map, meeting invite bell */
.messenger-widget-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px }
.messenger-widget-label { font-size: 11px; color: var(--theme-text-muted) }
.messenger-rt-badge { font-size: 10px; padding: 1px 6px; border-radius: 10px; background: var(--theme-text-muted); color: var(--theme-surface) }
.qr-leaflet-map { height: 220px; border-radius: 8px; background: var(--theme-color) }
.mtg-invite-bell { position: fixed; bottom: 18px; right: 18px; z-index: 1050 }
.mtg-bell-btn { width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.12); background: var(--theme-color); color: #fff; font-size: 22px; cursor: pointer; box-shadow: 0 6px 20px rgba(0,0,0,0.35); position: relative }
.mtg-bell-count { position: absolute; top: -4px; right: -4px; background: #dc3545; color: #fff; font-size: 11px; font-weight: 700; border-radius: 999px; min-width: 18px; height: 18px; line-height: 18px; text-align: center }
.mtg-bell-menu { position: absolute; bottom: 62px; right: 0; width: 300px; max-height: 320px; overflow-y: auto; background: var(--theme-surface); color: var(--theme-text); border: 1px solid var(--theme-border); border-radius: 12px; box-shadow: var(--theme-shadow-lg); padding: 8px }
.mtg-bell-empty { padding: 10px; color: var(--theme-text-muted); font-size: 13px }
.mtg-bell-item { display: block; padding: 10px 12px; border-radius: 8px; text-decoration: none; color: var(--theme-text); font-size: 13px }
.mtg-bell-item:hover { background: var(--theme-surface-raised) }
.mtg-bell-item-meta { color: var(--theme-text-muted); font-size: 12px }



/* Removed legacy profile.css; profile now uses Bootstrap */


/* ==== Final theme cascade overrides ==== */
/* Applies theme variables to Bootstrap's own custom-property surface so any
   Bootstrap component (cards, tables, etc.) that reads --bs-* vars picks up
   the active theme automatically, site-wide. */
:root.theme-dark,
:root.theme-contrast,
:root.theme-colorblind{--bs-body-bg:var(--theme-bg)!important;--bs-body-color:var(--theme-text)!important;--bs-card-bg:var(--theme-surface)!important;--bs-card-color:var(--theme-text)!important;--bs-border-color:var(--theme-border)!important;--bs-emphasis-color:var(--theme-text)!important;--bs-secondary-color:var(--theme-text-muted)!important;--bs-tertiary-bg:var(--theme-surface-raised)!important;--bs-tertiary-color:var(--theme-text-muted)!important}
html.theme-dark,html.theme-contrast,html.theme-colorblind{background:var(--theme-bg)!important;color:var(--theme-text)!important}
body.theme-dark,body.theme-contrast,body.theme-colorblind{background:var(--theme-bg)!important;color:var(--theme-text)!important}
html.theme-dark .card,html.theme-contrast .card,html.theme-colorblind .card,
.theme-dark .card,.theme-contrast .card,.theme-colorblind .card{background:var(--theme-surface)!important;color:var(--theme-text)!important;border-color:var(--theme-border)!important;box-shadow:var(--theme-shadow-md)!important}
html.theme-dark .card *,html.theme-contrast .card *,html.theme-colorblind .card *,
.theme-dark .card *,.theme-contrast .card *,.theme-colorblind .card *{background-color:transparent!important;color:inherit!important;border-color:inherit!important}
html.theme-dark .card select,html.theme-dark .card input,html.theme-dark .card textarea,
html.theme-contrast .card select,html.theme-contrast .card input,html.theme-contrast .card textarea,
html.theme-colorblind .card select,html.theme-colorblind .card input,html.theme-colorblind .card textarea,
.theme-dark .card select,.theme-dark .card input,.theme-dark .card textarea,
.theme-contrast .card select,.theme-contrast .card input,.theme-contrast .card textarea,
.theme-colorblind .card select,.theme-colorblind .card input,.theme-colorblind .card textarea{background-color:var(--theme-input-bg)!important;color:var(--theme-text)!important;border-color:var(--theme-border)!important}
html.theme-dark .card .btn-primary,html.theme-contrast .card .btn-primary,
.theme-dark .card .btn-primary,.theme-contrast .card .btn-primary{background-color:#0d6efd!important;color:#fff!important;border-color:#0d6efd!important}
html.theme-colorblind .card .btn-primary,.theme-colorblind .card .btn-primary{background-color:#0072B2!important;color:#fff!important;border-color:#0072B2!important}
:root.theme-carbon{--bs-body-bg:var(--theme-bg)!important;--bs-body-color:var(--theme-text)!important;--bs-card-bg:var(--theme-surface)!important;--bs-card-color:var(--theme-text)!important;--bs-border-color:var(--theme-border)!important;--bs-emphasis-color:var(--theme-text)!important;--bs-secondary-color:var(--theme-text-muted)!important;--bs-tertiary-bg:var(--theme-surface-raised)!important;--bs-tertiary-color:var(--theme-text-muted)!important}
html.theme-carbon{background:var(--theme-bg)!important;color:var(--theme-text)!important}
body.theme-carbon{background:var(--theme-bg)!important;color:var(--theme-text)!important}
html.theme-carbon .card,.theme-carbon .card{background:var(--theme-surface)!important;color:var(--theme-text)!important;border-color:var(--theme-border)!important;box-shadow:var(--theme-shadow-md)!important}
html.theme-carbon .card *,.theme-carbon .card *{background-color:transparent!important;color:inherit!important;border-color:inherit!important}
html.theme-carbon .card select,html.theme-carbon .card input,html.theme-carbon .card textarea,
.theme-carbon .card select,.theme-carbon .card input,.theme-carbon .card textarea{background-color:var(--theme-input-bg)!important;color:var(--theme-text)!important;border-color:var(--theme-border)!important}
html.theme-carbon .card .btn-primary,.theme-carbon .card .btn-primary{background-color:var(--theme-accent)!important;color:#04101a!important;border-color:var(--theme-accent)!important;box-shadow:0 0 8px rgba(0,255,255,.5)}
html.theme-carbon input[type=text],html.theme-carbon input[type=email],html.theme-carbon input[type=password],html.theme-carbon input[type=number],
html.theme-carbon select,html.theme-carbon textarea{border-color:var(--theme-accent-dim)!important}
html.theme-carbon input:focus,html.theme-carbon select:focus,html.theme-carbon textarea:focus{border-color:var(--theme-accent)!important;box-shadow:0 0 0 2px rgba(0,255,255,.35) inset!important}