/* ==========================================================================
   INDIGO HARVEST — COMPONENTS
   Standardized UI primitives consumed by every module.
   Strategy: target attribute selectors so legacy per-module class names
   (mgmt-btn-primary, p2-pay-btn, adm-card, ...) inherit one grammar
   without editing 20+ PHP files.
   ========================================================================== */

/* ============================================================
   1. UNIVERSAL FONT ENFORCEMENT
   ============================================================ */
body.glass-ui #wrapper *:not(i):not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.fad):not([class*="bi-"]):not([class*="material-icons"]):not(.icon):not([class^="icon-"]):not([class*=" icon-"]) {
    font-family: var(--font-body) !important;
}
body.glass-ui #wrapper .display-1,
body.glass-ui #wrapper .display-2,
body.glass-ui #wrapper .ds-display,
body.glass-ui #wrapper h1,
body.glass-ui #wrapper .h1 {
    font-family: var(--font-display) !important;
}
body.glass-ui #wrapper code,
body.glass-ui #wrapper kbd,
body.glass-ui #wrapper pre,
body.glass-ui #wrapper samp,
body.glass-ui #wrapper .ds-mono,
body.glass-ui #wrapper .kpi-value,
body.glass-ui #wrapper [class*="-stat-num"],
body.glass-ui #wrapper [class*="-stat-value"],
body.glass-ui #wrapper [class*="-kpi-num"] {
    font-family: var(--font-mono) !important;
}

/* ============================================================
   2. PER-MODULE TOKEN NEUTRALIZATION
   Force module roots to inherit the global background and the
   global brand tokens, defeating their internal --brand vars.
   ============================================================ */
body.glass-ui #op-root,
body.glass-ui #rc-menu,
body.glass-ui #kds-root,
body.glass-ui #admins-root,
body.glass-ui #ordenes-root,
body.glass-ui .pos2-wrap,
body.glass-ui .mp-wrap,
body.glass-ui .cc-wrap,
body.glass-ui .at-wrap,
body.glass-ui .mgmt-page,
body.glass-ui .fp,
body.glass-ui .inicio-dashboard,
body.glass-ui .sup-page,
body.glass-ui .pur-page {
    background: transparent !important;
    --brand:    var(--ih-indigo);
    --brand-2:  var(--ih-indigo-mid);
    --brand-3:  var(--ih-indigo-deep);
    --brand-4:  var(--ih-midnight);
    --ink:      var(--ink-1);
    --ink-2:    var(--ink-2);
    --ink-3:    var(--ink-3);
    --bg:       transparent;
    --bg-2:     var(--bg-surface);
    --line:     var(--line-1);
    --m-accent: var(--ih-indigo);
    --obrand:   var(--ih-indigo);
    --rc-green: var(--ih-lime);
    --fp-accent:var(--ih-indigo);
    --dash-blue:var(--ih-indigo);
}

/* ============================================================
   3. BUTTONS — single source of truth
   Sizes (sm / md / lg / xl) via [data-size] or .btn-sm/lg.
   Variants applied via Bootstrap classes AND via attribute
   selectors that match legacy module class names.
   ============================================================ */

/* Base shared by all buttons */
body.glass-ui .btn,
body.glass-ui button[type="button"],
body.glass-ui button[type="submit"],
body.glass-ui [class*="-btn"]:not(.btn-close):not(input):not(select) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-2);
    height: var(--control-h-md);
    padding: 0 var(--sp-4);
    font-family: var(--font-body);
    font-size: var(--fs-body);
    font-weight: var(--fw-semibold);
    line-height: 1;
    letter-spacing: 0.01em;
    border-radius: var(--r-md);
    border: 1px solid transparent;
    cursor: pointer;
    user-select: none;
    text-decoration: none;
    transition: background-color var(--d-fast) var(--ease-standard),
                border-color var(--d-fast) var(--ease-standard),
                color var(--d-fast) var(--ease-standard),
                box-shadow var(--d-fast) var(--ease-standard),
                transform var(--d-fast) var(--ease-standard);
    white-space: nowrap;
}
body.glass-ui .btn:focus-visible,
body.glass-ui button:focus-visible,
body.glass-ui [class*="-btn"]:focus-visible {
    outline: none;
    box-shadow: var(--el-focus);
}
body.glass-ui .btn:disabled,
body.glass-ui button:disabled,
body.glass-ui [class*="-btn"][disabled],
body.glass-ui [class*="-btn"].is-disabled {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none !important;
    transform: none !important;
}

/* Sizes */
body.glass-ui .btn-sm,
body.glass-ui [class*="-btn"][data-size="sm"] {
    height: var(--control-h-sm);
    padding: 0 var(--sp-3);
    font-size: var(--fs-body-sm);
    border-radius: var(--r-sm);
}
body.glass-ui .btn-lg,
body.glass-ui [class*="-btn"][data-size="lg"] {
    height: var(--control-h-lg);
    padding: 0 var(--sp-5);
    font-size: var(--fs-body-lg);
    border-radius: var(--r-lg);
}
body.glass-ui [class*="-btn"][data-size="xl"] {
    height: var(--control-h-xl);
    padding: 0 var(--sp-6);
    font-size: var(--fs-body-lg);
    border-radius: var(--r-lg);
}
body.glass-ui [class*="-btn"][data-block],
body.glass-ui .btn-block {
    width: 100%;
}

/* PRIMARY — solid índigo */
body.glass-ui .btn-primary,
body.glass-ui [class*="-btn-primary"],
body.glass-ui [class*="-pay-btn"],
body.glass-ui [class*="-save-btn"],
body.glass-ui [class*="-cash-open-btn"],
body.glass-ui [class*="-btn-blue"],
body.glass-ui [class*="-btn-pos"],
body.glass-ui [class*="-cta-primary"],
body.glass-ui [class*="-action-primary"],
body.glass-ui [class*="-btn-add"]:not([class*="-btn-add-row"]) {
    background-color: var(--ih-indigo) !important;
    border-color: var(--ih-indigo) !important;
    color: var(--ink-on-brand) !important;
    box-shadow: var(--el-brand);
}
body.glass-ui .btn-primary:hover,
body.glass-ui [class*="-btn-primary"]:hover,
body.glass-ui [class*="-pay-btn"]:hover,
body.glass-ui [class*="-save-btn"]:hover,
body.glass-ui [class*="-cash-open-btn"]:hover,
body.glass-ui [class*="-btn-blue"]:hover,
body.glass-ui [class*="-btn-pos"]:hover {
    background-color: var(--ih-indigo-hover) !important;
    border-color: var(--ih-indigo-hover) !important;
    box-shadow: var(--el-brand-strong);
    transform: translateY(-1px);
}
body.glass-ui .btn-primary:active,
body.glass-ui [class*="-btn-primary"]:active {
    transform: translateY(0);
    box-shadow: var(--el-brand);
}

/* SECONDARY — outline índigo */
body.glass-ui .btn-secondary,
body.glass-ui .btn-outline-primary,
body.glass-ui [class*="-btn-secondary"],
body.glass-ui [class*="-btn-outline"],
body.glass-ui [class*="-btn-ghost"],
body.glass-ui [class*="-btn-g"]:not([class*="-btn-green"]):not([class*="-btn-gray"]) {
    background-color: transparent !important;
    border: 1.5px solid var(--ih-indigo) !important;
    color: var(--ih-indigo) !important;
    box-shadow: none !important;
}
body.glass-ui .btn-secondary:hover,
body.glass-ui .btn-outline-primary:hover,
body.glass-ui [class*="-btn-secondary"]:hover,
body.glass-ui [class*="-btn-outline"]:hover,
body.glass-ui [class*="-btn-ghost"]:hover {
    background-color: var(--ih-info-tint) !important;
    color: var(--ih-indigo-mid) !important;
}
body.dark-mode.glass-ui .btn-secondary,
body.dark-mode.glass-ui .btn-outline-primary,
body.dark-mode.glass-ui [class*="-btn-secondary"],
body.dark-mode.glass-ui [class*="-btn-outline"],
body.dark-mode.glass-ui [class*="-btn-ghost"] {
    border-color: var(--ih-indigo-tint) !important;
    color: var(--ih-indigo-tint) !important;
}

/* TERTIARY / TEXT-ONLY */
body.glass-ui .btn-link,
body.glass-ui [class*="-btn-link"],
body.glass-ui [class*="-btn-text"] {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--ih-indigo) !important;
    box-shadow: none !important;
    padding: 0 var(--sp-2);
}
body.glass-ui .btn-link:hover,
body.glass-ui [class*="-btn-link"]:hover,
body.glass-ui [class*="-btn-text"]:hover {
    background: var(--ih-info-tint) !important;
    color: var(--ih-indigo-mid) !important;
    text-decoration: none;
}

/* DANGER */
body.glass-ui .btn-danger,
body.glass-ui [class*="-btn-danger"],
body.glass-ui [class*="-btn-red"],
body.glass-ui [class*="-cancel-btn"],
body.glass-ui [class*="-delete-btn"],
body.glass-ui [class*="-btn-delete"] {
    background-color: var(--ih-error) !important;
    border-color: var(--ih-error) !important;
    color: var(--ink-on-brand) !important;
    box-shadow: 0 4px 14px rgba(192,48,48,.28);
}
body.glass-ui .btn-danger:hover,
body.glass-ui [class*="-btn-danger"]:hover,
body.glass-ui [class*="-cancel-btn"]:hover,
body.glass-ui [class*="-delete-btn"]:hover {
    background-color: var(--ih-error-deep) !important;
    border-color: var(--ih-error-deep) !important;
    transform: translateY(-1px);
}
body.glass-ui .btn-outline-danger,
body.glass-ui [class*="-btn-outline-danger"] {
    background: transparent !important;
    border: 1.5px solid var(--ih-error) !important;
    color: var(--ih-error) !important;
    box-shadow: none !important;
}

/* SUCCESS */
body.glass-ui .btn-success,
body.glass-ui [class*="-btn-success"],
body.glass-ui [class*="-btn-green"],
body.glass-ui [class*="-confirm-btn"] {
    background-color: var(--ih-success) !important;
    border-color: var(--ih-success) !important;
    color: var(--ink-on-brand) !important;
    box-shadow: 0 4px 14px rgba(64,160,64,.26);
}
body.glass-ui .btn-success:hover,
body.glass-ui [class*="-btn-success"]:hover,
body.glass-ui [class*="-btn-green"]:hover {
    background-color: var(--ih-success-deep) !important;
    border-color: var(--ih-success-deep) !important;
    transform: translateY(-1px);
}

/* WARNING */
body.glass-ui .btn-warning,
body.glass-ui [class*="-btn-warning"],
body.glass-ui [class*="-btn-yellow"],
body.glass-ui [class*="-btn-orange"] {
    background-color: var(--ih-warning) !important;
    border-color: var(--ih-warning) !important;
    color: var(--ink-on-brand) !important;
    box-shadow: 0 4px 14px rgba(208,144,32,.26);
}

/* INFO == primary visual but semantic synonym */
body.glass-ui .btn-info { background-color: var(--ih-indigo) !important; border-color: var(--ih-indigo) !important; color: var(--ink-on-brand) !important; }

/* Icon-only buttons */
body.glass-ui [class*="-btn-icon"],
body.glass-ui .btn-icon {
    width: var(--control-h-md);
    height: var(--control-h-md);
    padding: 0;
    border-radius: var(--r-md);
}
body.glass-ui .btn-icon.btn-sm,
body.glass-ui [class*="-btn-icon"][data-size="sm"] {
    width: var(--control-h-sm);
    height: var(--control-h-sm);
    border-radius: var(--r-sm);
}

/* Loading state */
body.glass-ui .btn.is-loading,
body.glass-ui [class*="-btn"].is-loading {
    color: transparent !important;
    pointer-events: none;
    position: relative;
}
body.glass-ui .btn.is-loading::after,
body.glass-ui [class*="-btn"].is-loading::after {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 14px; height: 14px;
    margin: -7px 0 0 -7px;
    border: 2px solid currentColor;
    border-bottom-color: transparent;
    border-radius: 50%;
    color: var(--ink-on-brand);
    animation: ds-spin .7s linear infinite;
}
@keyframes ds-spin { to { transform: rotate(360deg); } }

/* ============================================================
   4. FORMS — inputs, selects, textarea, checkbox, radio, switch
   ============================================================ */
body.glass-ui .form-control,
body.glass-ui .form-select,
body.glass-ui input[type="text"],
body.glass-ui input[type="search"],
body.glass-ui input[type="email"],
body.glass-ui input[type="number"],
body.glass-ui input[type="password"],
body.glass-ui input[type="tel"],
body.glass-ui input[type="url"],
body.glass-ui input[type="date"],
body.glass-ui input[type="time"],
body.glass-ui input[type="datetime-local"],
body.glass-ui select,
body.glass-ui textarea {
    width: 100%;
    height: var(--control-h-md);
    padding: 0 var(--sp-3);
    background: var(--bg-surface) !important;
    color: var(--ink-1) !important;
    font-family: var(--font-body);
    font-size: var(--fs-body);
    line-height: 1.4;
    border: 1px solid var(--line-2) !important;
    border-radius: var(--r-md) !important;
    box-shadow: none !important;
    transition: border-color var(--d-fast) var(--ease-standard),
                box-shadow var(--d-fast) var(--ease-standard);
}
body.glass-ui textarea {
    height: auto;
    min-height: 88px;
    padding: var(--sp-2) var(--sp-3);
    line-height: var(--lh-normal);
    resize: vertical;
}
body.glass-ui .form-control:focus,
body.glass-ui .form-select:focus,
body.glass-ui input:focus,
body.glass-ui select:focus,
body.glass-ui textarea:focus {
    border-color: var(--ih-indigo) !important;
    box-shadow: var(--el-focus) !important;
    outline: none !important;
}
body.glass-ui .form-control::placeholder,
body.glass-ui input::placeholder,
body.glass-ui textarea::placeholder {
    color: var(--ink-4);
    opacity: 1;
}
body.glass-ui .form-control:disabled,
body.glass-ui input:disabled,
body.glass-ui select:disabled,
body.glass-ui textarea:disabled {
    background: var(--bg-surface-2) !important;
    color: var(--ink-3) !important;
    cursor: not-allowed;
    opacity: .8;
}
body.glass-ui .form-control.is-invalid,
body.glass-ui input[aria-invalid="true"] {
    border-color: var(--ih-error) !important;
}
body.glass-ui .form-control.is-invalid:focus,
body.glass-ui input[aria-invalid="true"]:focus {
    box-shadow: var(--el-focus-error) !important;
}
body.glass-ui .form-control.is-valid {
    border-color: var(--ih-success) !important;
}
body.glass-ui .form-control.is-valid:focus {
    box-shadow: var(--el-focus-success) !important;
}

/* Dark mode inputs */
body.dark-mode.glass-ui .form-control,
body.dark-mode.glass-ui .form-select,
body.dark-mode.glass-ui input[type="text"],
body.dark-mode.glass-ui input[type="search"],
body.dark-mode.glass-ui input[type="email"],
body.dark-mode.glass-ui input[type="number"],
body.dark-mode.glass-ui input[type="password"],
body.dark-mode.glass-ui select,
body.dark-mode.glass-ui textarea {
    background: rgba(16,18,42,.55) !important;
    border-color: var(--line-3) !important;
    color: var(--ink-1) !important;
}

/* Form labels */
body.glass-ui .form-label,
body.glass-ui label.control-label {
    font-size: var(--fs-caption);
    font-weight: var(--fw-semibold);
    color: var(--ink-2);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
    margin-bottom: var(--sp-1);
    display: block;
}

/* Helper / error text */
body.glass-ui .form-text,
body.glass-ui .helper-text {
    font-size: var(--fs-caption);
    color: var(--ink-3);
    margin-top: var(--sp-1);
}
body.glass-ui .invalid-feedback,
body.glass-ui .error-text {
    font-size: var(--fs-caption);
    color: var(--ih-error);
    margin-top: var(--sp-1);
}

/* Checkbox & radio — custom-styled */
body.glass-ui .form-check-input,
body.glass-ui input[type="checkbox"]:not(.form-switch input),
body.glass-ui input[type="radio"] {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    background-color: var(--bg-surface);
    border: 1.5px solid var(--line-3);
    cursor: pointer;
    transition: all var(--d-fast) var(--ease-standard);
}
body.glass-ui input[type="checkbox"] { border-radius: var(--r-xs); }
body.glass-ui input[type="radio"]    { border-radius: 50%; }
body.glass-ui .form-check-input:checked,
body.glass-ui input[type="checkbox"]:checked,
body.glass-ui input[type="radio"]:checked {
    background-color: var(--ih-indigo) !important;
    border-color: var(--ih-indigo) !important;
}
body.glass-ui .form-check-input:focus-visible,
body.glass-ui input[type="checkbox"]:focus-visible,
body.glass-ui input[type="radio"]:focus-visible {
    box-shadow: var(--el-focus);
    outline: none;
}
body.glass-ui .form-check-label {
    font-size: var(--fs-body);
    color: var(--ink-1);
    margin-left: var(--sp-2);
    cursor: pointer;
}

/* Switch (Bootstrap form-switch enhanced) */
body.glass-ui .form-switch .form-check-input {
    width: 36px;
    height: 20px;
    border-radius: var(--r-pill);
    background-image: none;
    position: relative;
}
body.glass-ui .form-switch .form-check-input::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 14px; height: 14px;
    background: #fff;
    border-radius: 50%;
    transition: transform var(--d-fast) var(--ease-standard);
}
body.glass-ui .form-switch .form-check-input:checked::before {
    transform: translateX(16px);
}

/* Input group */
body.glass-ui .input-group-text {
    background: var(--bg-surface-hover);
    border: 1px solid var(--line-2);
    color: var(--ink-2);
    font-size: var(--fs-body-sm);
    border-radius: var(--r-md);
}

/* ============================================================
   5. CARDS & SURFACES
   ============================================================ */
body.glass-ui .card,
body.glass-ui [class$="-card"]:not([class*="-card-img"]):not([class*="-card-body"]):not([class*="-card-name"]):not([class*="-card-foot"]):not([class*="-card-header"]):not([class*="-card-title"]),
body.glass-ui [class*="-stat-card"],
body.glass-ui [class*="-cash-card"],
body.glass-ui [class*="-kpi-card"],
body.glass-ui [class*="-info-card"] {
    background: var(--bg-surface) !important;
    border: 1px solid var(--line-1) !important;
    border-radius: var(--r-lg) !important;
    box-shadow: var(--el-2) !important;
    color: var(--ink-1);
}
body.glass-ui .card-header,
body.glass-ui [class*="-card-header"] {
    background: transparent !important;
    border-bottom: 1px solid var(--line-1) !important;
    padding: var(--sp-3) var(--sp-4);
    font-weight: var(--fw-semibold);
    color: var(--ink-2);
}
body.glass-ui .card-body,
body.glass-ui [class*="-card-body"] {
    padding: var(--sp-4);
}
body.glass-ui .card-footer,
body.glass-ui [class*="-card-foot"] {
    background: transparent !important;
    border-top: 1px solid var(--line-1) !important;
    padding: var(--sp-3) var(--sp-4);
}

/* Dark mode cards */
body.dark-mode.glass-ui .card,
body.dark-mode.glass-ui [class$="-card"],
body.dark-mode.glass-ui [class*="-stat-card"],
body.dark-mode.glass-ui [class*="-cash-card"],
body.dark-mode.glass-ui [class*="-kpi-card"] {
    background: var(--bg-surface) !important;
    color: var(--ink-1) !important;
}

/* ============================================================
   6. TABLES
   ============================================================ */
body.glass-ui table,
body.glass-ui .table {
    width: 100%;
    color: var(--ink-1) !important;
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
}
body.glass-ui .table thead th,
body.glass-ui table thead th {
    background: var(--ih-lavender) !important;
    color: var(--ih-indigo-mid) !important;
    font-weight: var(--fw-semibold) !important;
    font-size: var(--fs-caption) !important;
    text-transform: uppercase !important;
    letter-spacing: var(--ls-wide) !important;
    padding: var(--sp-3) var(--sp-3) !important;
    border-bottom: 1px solid var(--line-2) !important;
    border-top: none !important;
    text-align: left;
    position: sticky;
    top: 0;
    z-index: 1;
}
body.dark-mode.glass-ui .table thead th,
body.dark-mode.glass-ui table thead th {
    background: rgba(40,50,128,.45) !important;
    color: var(--ih-lavender) !important;
}
body.glass-ui .table tbody td,
body.glass-ui table tbody td {
    padding: var(--sp-3) !important;
    border-top: 1px solid var(--line-1) !important;
    vertical-align: middle !important;
    font-size: var(--fs-body);
}
body.glass-ui .table tbody tr:hover {
    background: var(--bg-surface-hover) !important;
}
body.glass-ui .table-striped tbody tr:nth-child(even) {
    background: rgba(224,232,255,.20);
}

/* ============================================================
   7. PILLS / CHIPS / BADGES / TAGS
   ============================================================ */
body.glass-ui .badge,
body.glass-ui [class*="-pill"],
body.glass-ui [class*="-chip"],
body.glass-ui [class*="-tag"]:not([class*="-tag-input"]):not([class*="-tagify"]):not(textarea) {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    border-radius: var(--r-pill) !important;
    padding: 3px 10px !important;
    font-family: var(--font-body) !important;
    font-size: var(--fs-caption) !important;
    font-weight: var(--fw-semibold) !important;
    line-height: 1.5 !important;
    letter-spacing: 0.01em !important;
    border: 1px solid transparent !important;
    text-transform: none;
}
/* Color mapping */
body.glass-ui .badge.bg-primary,
body.glass-ui .badge-primary { background: var(--ih-indigo) !important; color: #fff !important; border-color: var(--ih-indigo) !important; }
body.glass-ui .badge.bg-success,
body.glass-ui .badge-success { background: var(--ih-success-tint) !important; color: var(--ih-success-deep) !important; border-color: rgba(64,160,64,.30) !important; }
body.glass-ui .badge.bg-danger,
body.glass-ui .badge-danger  { background: var(--ih-error-tint) !important; color: var(--ih-error-deep) !important; border-color: rgba(192,48,48,.30) !important; }
body.glass-ui .badge.bg-warning,
body.glass-ui .badge-warning { background: var(--ih-warning-tint) !important; color: var(--ih-warning-deep) !important; border-color: rgba(208,144,32,.32) !important; }
body.glass-ui .badge.bg-info,
body.glass-ui .badge-info    { background: var(--ih-info-tint) !important; color: var(--ih-indigo-mid) !important; border-color: rgba(64,80,192,.28) !important; }
body.glass-ui .badge.bg-secondary,
body.glass-ui .badge-secondary { background: rgba(40,50,128,.08) !important; color: var(--ih-indigo-mid) !important; border-color: rgba(40,50,128,.20) !important; }
body.glass-ui .badge.bg-light  { background: var(--ih-lavender) !important; color: var(--ih-indigo-mid) !important; }
body.glass-ui .badge.bg-dark   { background: var(--ih-midnight) !important; color: var(--ih-white-indigo) !important; }

/* ============================================================
   8. ALERTS & BANNERS
   ============================================================ */
body.glass-ui .alert {
    padding: var(--sp-3) var(--sp-4);
    border-radius: var(--r-md);
    border: 1px solid;
    font-size: var(--fs-body);
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3);
}
body.glass-ui .alert-success { background: var(--ih-success-tint) !important; color: var(--ih-success-deep) !important; border-color: rgba(64,160,64,.30) !important; }
body.glass-ui .alert-danger,
body.glass-ui .alert-error   { background: var(--ih-error-tint) !important; color: var(--ih-error-deep) !important; border-color: rgba(192,48,48,.30) !important; }
body.glass-ui .alert-warning { background: var(--ih-warning-tint) !important; color: var(--ih-warning-deep) !important; border-color: rgba(208,144,32,.32) !important; }
body.glass-ui .alert-info,
body.glass-ui .alert-primary { background: var(--ih-info-tint) !important; color: var(--ih-indigo-mid) !important; border-color: rgba(64,80,192,.28) !important; }

/* ============================================================
   9. MODALS / DROPDOWNS / POPOVERS / TOOLTIPS
   ============================================================ */
body.glass-ui .modal-content,
body.glass-ui .dropdown-menu,
body.glass-ui .popover {
    background: var(--bg-surface) !important;
    border: 1px solid var(--line-1) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--el-4) !important;
    color: var(--ink-1) !important;
}
body.glass-ui .modal-header,
body.glass-ui .modal-footer {
    border-color: var(--line-1) !important;
    padding: var(--sp-4) var(--sp-5);
}
body.glass-ui .modal-title { font-weight: var(--fw-semibold); color: var(--ink-1); }
body.glass-ui .modal-body { padding: var(--sp-5); }
body.glass-ui .modal-backdrop { background: var(--bg-overlay) !important; }

body.glass-ui .dropdown-menu { padding: var(--sp-2); min-width: 200px; }
body.glass-ui .dropdown-item {
    color: var(--ink-2) !important;
    padding: var(--sp-2) var(--sp-3) !important;
    border-radius: var(--r-sm) !important;
    margin: 1px 0 !important;
    font-size: var(--fs-body);
    cursor: pointer;
    transition: background-color var(--d-fast) var(--ease-standard);
}
body.glass-ui .dropdown-item:hover,
body.glass-ui .dropdown-item:focus {
    background: var(--ih-info-tint) !important;
    color: var(--ih-indigo-mid) !important;
}
body.glass-ui .dropdown-item.active,
body.glass-ui .dropdown-item:active {
    background: var(--ih-indigo) !important;
    color: var(--ink-on-brand) !important;
}
body.glass-ui .dropdown-divider {
    border-top: 1px solid var(--line-1);
    margin: var(--sp-1) 0;
}

body.glass-ui .tooltip-inner {
    background: var(--ih-midnight) !important;
    color: var(--ih-white-indigo) !important;
    font-size: var(--fs-caption);
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--r-sm);
}

/* ============================================================
   10. TABS — segmented pill style
   ============================================================ */
body.glass-ui .nav-tabs,
body.glass-ui [class*="-tabs"] {
    display: inline-flex;
    background: var(--bg-surface-hover);
    border: 1px solid var(--line-1);
    border-radius: var(--r-lg);
    padding: 4px;
    gap: 2px;
}
body.glass-ui .nav-tabs .nav-link,
body.glass-ui [class*="-tabs"] [class*="-tab"]:not([class*="-tabs"]) {
    border: none !important;
    background: transparent;
    color: var(--ink-3);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-body);
    padding: var(--sp-2) var(--sp-4);
    border-radius: var(--r-md);
    transition: background-color var(--d-fast), color var(--d-fast);
    cursor: pointer;
}
body.glass-ui .nav-tabs .nav-link:hover,
body.glass-ui [class*="-tabs"] [class*="-tab"]:hover {
    color: var(--ink-2);
    background: rgba(255,255,255,.5);
}
body.glass-ui .nav-tabs .nav-link.active,
body.glass-ui [class*="-tabs"] [class*="-tab"].active {
    background: var(--bg-surface) !important;
    color: var(--ih-indigo) !important;
    box-shadow: var(--el-1);
}

/* ============================================================
   11. PAGINATION
   ============================================================ */
body.glass-ui .pagination {
    display: inline-flex;
    gap: 4px;
    list-style: none;
    padding: 0;
}
body.glass-ui .pagination .page-link {
    background: transparent !important;
    border: 1px solid var(--line-2) !important;
    color: var(--ink-2) !important;
    border-radius: var(--r-sm) !important;
    padding: var(--sp-2) var(--sp-3);
    font-size: var(--fs-body-sm);
    min-width: var(--control-h-sm);
    text-align: center;
    transition: background var(--d-fast), border-color var(--d-fast);
}
body.glass-ui .pagination .page-link:hover {
    background: var(--ih-info-tint) !important;
    border-color: var(--ih-indigo) !important;
}
body.glass-ui .pagination .page-item.active .page-link {
    background: var(--ih-indigo) !important;
    border-color: var(--ih-indigo) !important;
    color: var(--ink-on-brand) !important;
}
body.glass-ui .pagination .page-item.disabled .page-link {
    opacity: .45;
    pointer-events: none;
}

/* ============================================================
   12. BREADCRUMBS
   ============================================================ */
body.glass-ui .breadcrumb {
    background: transparent;
    padding: var(--sp-2) 0;
    margin: 0;
    font-size: var(--fs-body-sm);
}
body.glass-ui .breadcrumb-item { color: var(--ink-3); }
body.glass-ui .breadcrumb-item a { color: var(--ih-indigo); text-decoration: none; }
body.glass-ui .breadcrumb-item a:hover { color: var(--ih-indigo-mid); text-decoration: underline; }
body.glass-ui .breadcrumb-item.active { color: var(--ink-1); font-weight: var(--fw-semibold); }
body.glass-ui .breadcrumb-item + .breadcrumb-item::before {
    content: "›";
    color: var(--ink-4);
    padding: 0 var(--sp-2);
}

/* ============================================================
   13. SPINNERS / LOADERS / SKELETONS
   ============================================================ */
body.glass-ui .ds-spinner,
body.glass-ui .spinner-border {
    display: inline-block;
    width: 20px; height: 20px;
    border: 2px solid var(--ih-indigo);
    border-bottom-color: transparent;
    border-radius: 50%;
    animation: ds-spin .7s linear infinite;
}
body.glass-ui .spinner-border-sm { width: 14px; height: 14px; }

body.glass-ui .ds-skeleton {
    display: block;
    background: linear-gradient(90deg,
        rgba(40,50,128,.06) 0%,
        rgba(40,50,128,.12) 50%,
        rgba(40,50,128,.06) 100%);
    background-size: 200% 100%;
    border-radius: var(--r-sm);
    animation: ds-shimmer 1.4s ease-in-out infinite;
}
@keyframes ds-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ============================================================
   14. TOASTS (custom stack-friendly)
   ============================================================ */
body.glass-ui .toast,
body.glass-ui .ds-toast {
    background: var(--bg-glass-strong) !important;
    backdrop-filter: blur(12px);
    border: 1px solid var(--line-1) !important;
    border-radius: var(--r-lg) !important;
    box-shadow: var(--el-4) !important;
    color: var(--ink-1) !important;
    padding: var(--sp-3) var(--sp-4);
    font-size: var(--fs-body);
}
body.glass-ui .toast-container {
    z-index: var(--z-toast);
    padding: var(--sp-4);
}

/* ============================================================
   15. KPI / STAT CARDS
   ============================================================ */
body.glass-ui .kpi-value,
body.glass-ui [class*="-stat-num"],
body.glass-ui [class*="-stat-value"],
body.glass-ui [class*="-kpi-num"] {
    font-weight: var(--fw-bold);
    font-size: 28px;
    color: var(--ink-1);
    letter-spacing: var(--ls-tight);
    line-height: 1.1;
}
body.glass-ui [class*="-stat-label"],
body.glass-ui [class*="-kpi-label"] {
    color: var(--ink-3);
    text-transform: uppercase;
    font-size: var(--fs-overline);
    letter-spacing: var(--ls-wider);
    font-weight: var(--fw-semibold);
}

/* ============================================================
   16. LINKS
   ============================================================ */
body.glass-ui a:not(.btn):not([class*="-btn"]):not(.dropdown-item):not(.nav-link):not(.page-link):not([class*="-tab"]):not(.gs-home-link):not(.gs-subitem) {
    color: var(--ink-link);
    text-decoration: none;
    transition: color var(--d-fast) var(--ease-standard);
}
body.glass-ui a:not(.btn):not([class*="-btn"]):not(.dropdown-item):not(.nav-link):not(.page-link):hover {
    color: var(--ink-link-hover);
    text-decoration: underline;
}

/* ============================================================
   17. ACCORDIONS
   ============================================================ */
body.glass-ui .accordion-item {
    background: var(--bg-surface);
    border: 1px solid var(--line-1) !important;
    border-radius: var(--r-md) !important;
    margin-bottom: var(--sp-2);
    overflow: hidden;
}
body.glass-ui .accordion-button {
    background: transparent !important;
    color: var(--ink-1) !important;
    font-weight: var(--fw-semibold);
    padding: var(--sp-3) var(--sp-4);
    box-shadow: none !important;
}
body.glass-ui .accordion-button:not(.collapsed) {
    background: var(--ih-info-tint) !important;
    color: var(--ih-indigo-mid) !important;
}
body.glass-ui .accordion-button:focus { box-shadow: var(--el-focus) !important; }

/* ============================================================
   18. PROGRESS BARS
   ============================================================ */
body.glass-ui .progress {
    height: 8px;
    background: var(--bg-surface-hover);
    border-radius: var(--r-pill);
    overflow: hidden;
}
body.glass-ui .progress-bar {
    background: var(--ih-indigo);
    border-radius: var(--r-pill);
    transition: width var(--d-base) var(--ease-standard);
}

/* ============================================================
   19. FOCUS RING — global accessibility
   ============================================================ */
body.glass-ui *:focus-visible {
    outline: none;
}
body.glass-ui a:focus-visible,
body.glass-ui [tabindex]:focus-visible,
body.glass-ui [role="button"]:focus-visible {
    box-shadow: var(--el-focus);
    border-radius: var(--r-sm);
}

/* ============================================================
   20. AVATARS
   ============================================================ */
body.glass-ui .ds-avatar,
body.glass-ui [class*="-avatar"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--ih-indigo);
    color: var(--ink-on-brand);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-body-sm);
    overflow: hidden;
    border: 2px solid var(--bg-surface);
}
body.glass-ui [class*="-avatar"] img { width: 100%; height: 100%; object-fit: cover; }

/* ============================================================
   21. DRAWER / OFFCANVAS
   ============================================================ */
body.glass-ui .offcanvas {
    background: var(--bg-surface) !important;
    color: var(--ink-1) !important;
    box-shadow: var(--el-5);
    border: none !important;
}
body.glass-ui .offcanvas-header { border-bottom: 1px solid var(--line-1); padding: var(--sp-4); }
body.glass-ui .offcanvas-title { font-weight: var(--fw-semibold); }
body.glass-ui .offcanvas-body { padding: var(--sp-4); }

/* ============================================================
   22. ADMINS / USERS & PERMISSIONS — glass-ui integration
   Remaps --rc-* tokens to IH palette and applies glass surfaces.
   Fixes collisions with global [class$="-card"], [class*="-chip"]
   and [class*="-btn-outline"] rules that override admins-scoped CSS.
   ============================================================ */

/* ── Token remapping ──────────────────────────────────────────────────── */
body.glass-ui #admins-root {
    --rc-white:      var(--bg-glass);
    --rc-slate-50:   var(--bg-surface-2);
    --rc-slate-100:  var(--bg-surface-hover);
    --rc-slate-200:  var(--line-2);
    --rc-slate-300:  var(--line-3);
    --rc-slate-400:  var(--ink-4);
    --rc-slate-500:  var(--ink-3);
    --rc-slate-600:  var(--ink-3);
    --rc-slate-700:  var(--ink-1);
    --rc-slate-900:  var(--ih-midnight);
    --rc-indigo:     var(--ih-indigo);
    --rc-indigo-dk:  var(--ih-indigo-hover);
    --rc-indigo-lt:  var(--ih-info-tint);
    --rc-shadow-sm:  var(--el-1);
    --rc-shadow:     var(--el-3);
    --rc-shadow-lg:  var(--el-5);
    --rc-radius-sm:  var(--r-sm);
    --rc-radius:     var(--r-lg);
    --rc-radius-lg:  var(--r-xl);
}

/* ── Page header ──────────────────────────────────────────────────────── */
body.glass-ui #admins-root .adm-page-header h2 {
    font-family: var(--font-display) !important;
    font-size: 1.55rem !important;
    font-weight: 400 !important;
    color: var(--ih-midnight) !important;
    letter-spacing: -0.01em !important;
}
body.glass-ui #admins-root .adm-page-header p {
    color: var(--ink-3) !important;
    font-size: var(--fs-body-sm) !important;
}

/* ── Sidebar — glass surface ──────────────────────────────────────────── */
body.glass-ui #admins-root .adm-sidebar {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid var(--line-2) !important;
    box-shadow: var(--el-2) !important;
}
body.glass-ui #admins-root .adm-sidebar-title  { color: var(--ink-4) !important; }
body.glass-ui #admins-root .adm-sidebar-divider { border-color: var(--line-2) !important; }
body.glass-ui #admins-root .adm-role-name       { color: var(--ink-1) !important; }
body.glass-ui #admins-root .adm-role-desc       { color: var(--ink-3) !important; }
body.glass-ui #admins-root .adm-role-cnt {
    background: var(--bg-surface-hover) !important;
    color: var(--ink-2) !important;
}
body.glass-ui #admins-root .adm-role-item:hover {
    background: var(--bg-surface-hover) !important;
    border-color: var(--line-3) !important;
}
body.glass-ui #admins-root .adm-role-item.active {
    background: var(--ih-info-tint) !important;
    border-color: var(--ih-indigo) !important;
}
body.glass-ui #admins-root .adm-role-item.active .adm-role-cnt {
    background: var(--ih-indigo) !important;
    color: var(--ink-on-brand) !important;
}

/* ── User cards — glass surface (overrides global [class$="-card"]) ───── */
body.glass-ui #admins-root .adm-card {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid var(--line-2) !important;
    border-radius: var(--r-lg) !important;
    box-shadow: var(--el-2) !important;
    /* Layout enforcement: prevent any global flex/grid/height rule from collapsing the card */
    display: block !important;
    min-height: 180px !important;
    text-align: center !important;
    padding: 20px 16px 16px !important;
}

/* Card filter: class-based hide — specificity (1,3,1) beats .adm-card (1,2,1) so it wins
   even against display:block !important on the base rule. JS uses classList.toggle. */
body.glass-ui #admins-root .adm-card.adm-card--hidden {
    display: none !important;
}

/* Fix avatar-wrap: escape global [class*="-avatar"] constraints (36px box + overflow:hidden) */
body.glass-ui #admins-root .adm-avatar-wrap {
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    position: relative !important;
    margin-bottom: 10px !important;
}

/* Fix avatar circle: ensure 60px size and correct text color */
body.glass-ui #admins-root .adm-avatar {
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: var(--ink-on-brand) !important;
    margin: 0 auto !important;
}
body.glass-ui #admins-root .adm-card:hover {
    background: var(--bg-glass-strong) !important;
    border-color: rgba(64, 80, 192, 0.28) !important;
    box-shadow: var(--el-4) !important;
    transform: translateY(-3px) !important;
}
body.glass-ui #admins-root .adm-card-email      { color: var(--ink-1) !important; }
body.glass-ui #admins-root .adm-card-last-active { color: var(--ink-4) !important; }
body.glass-ui #admins-root .adm-online-dot       { border-color: var(--bg-glass) !important; }

/* Card menu button — restore correct size (overrides global [class*="-btn"] height) */
body.glass-ui #admins-root .adm-card-menu-btn {
    height: auto !important;
    padding: 5px 6px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--ink-4) !important;
}
body.glass-ui #admins-root .adm-card-menu-btn:hover {
    background: var(--bg-surface-hover) !important;
    color: var(--ink-1) !important;
}

/* Card dropdown */
body.glass-ui #admins-root .adm-card-dropdown {
    background: var(--bg-glass-strong) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid var(--line-2) !important;
    box-shadow: var(--el-4) !important;
}
body.glass-ui #admins-root .adm-card-dropdown a,
body.glass-ui #admins-root .adm-card-dropdown button {
    color: var(--ink-2) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    height: auto !important;
    padding: 8px 14px !important;
}
body.glass-ui #admins-root .adm-card-dropdown a:hover,
body.glass-ui #admins-root .adm-card-dropdown button:hover {
    background: var(--bg-surface-hover) !important;
    color: var(--ink-1) !important;
}
body.glass-ui #admins-root .adm-card-dropdown .danger {
    color: var(--ih-error) !important;
}
body.glass-ui #admins-root .adm-card-dropdown .danger:hover {
    background: var(--ih-error-tint) !important;
    color: var(--ih-error-deep) !important;
}

/* ── Invite card (also matched by global [class$="-card"]) ────────────── */
body.glass-ui #admins-root .adm-invite-card {
    background: var(--bg-surface-2) !important;
    border: 2px dashed var(--line-3) !important;
    box-shadow: none !important;
}
body.glass-ui #admins-root .adm-invite-card:hover {
    background: var(--ih-info-tint) !important;
    border-color: var(--ih-indigo) !important;
}
body.glass-ui #admins-root .adm-invite-icon {
    border-color: var(--line-3) !important;
    color: var(--ink-4) !important;
}
body.glass-ui #admins-root .adm-invite-card:hover .adm-invite-icon {
    border-color: var(--ih-indigo) !important;
    color: var(--ih-indigo) !important;
}

/* ── Branch chips — restore border (overridden by [class*="-chip"] !) ─── */
body.glass-ui #admins-root .adm-branch-chip {
    background: var(--bg-surface-hover) !important;
    color: var(--ink-2) !important;
    border: 1px solid var(--line-2) !important;
    border-radius: var(--r-pill) !important;
    padding: 2px 8px !important;
    font-size: var(--fs-caption) !important;
    font-weight: var(--fw-semibold) !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* ── Stats bar — glass surface ────────────────────────────────────────── */
body.glass-ui #admins-root .adm-stats-bar {
    background: var(--bg-glass) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid var(--line-2) !important;
    box-shadow: var(--el-2) !important;
}
body.glass-ui #admins-root .adm-stat-value { color: var(--ink-1) !important; }
body.glass-ui #admins-root .adm-stat-label {
    color: var(--ink-3) !important;
    text-transform: uppercase !important;
    letter-spacing: var(--ls-wide) !important;
}

/* ── Toolbar — search input height correction ─────────────────────────── */
body.glass-ui #admins-root #admSearchInput {
    height: auto !important;
    padding: 9px 12px 9px 32px !important;
    min-height: var(--control-h-md) !important;
}

/* ── Filter buttons active state ─────────────────────────────────────── */
/* When active, JS removes adm-btn-outline so [class*="-btn-outline"] rule
   no longer applies. This rule reinforces the active visual via higher
   specificity (ID selector beats the global attribute selector). */
body.glass-ui #admins-root .adm-btn-filter-active {
    background-color: var(--ih-info-tint) !important;
    border-color: var(--ih-indigo) !important;
    color: var(--ih-indigo) !important;
}

/* ── Empty state ──────────────────────────────────────────────────────── */
body.glass-ui #admins-root .adm-empty { color: var(--ink-3) !important; }

/* ── ADD / EDIT USER MODAL ────────────────────────────────────────────── */
body.glass-ui #admins-root .adm-modal {
    background: var(--bg-glass-strong) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--el-5) !important;
}
body.glass-ui #admins-root .adm-modal-header {
    border-bottom-color: var(--line-1) !important;
}
body.glass-ui #admins-root .adm-modal-footer {
    border-top-color: var(--line-1) !important;
}
body.glass-ui #admins-root .adm-modal-header h3 {
    font-family: var(--font-display) !important;
    font-weight: 400 !important;
    color: var(--ink-1) !important;
}
body.glass-ui #admins-root .adm-modal-header p {
    color: var(--ink-3) !important;
}
body.glass-ui #admins-root .adm-modal-close {
    background: var(--bg-surface-hover) !important;
    color: var(--ink-2) !important;
    border: none !important;
    box-shadow: none !important;
    height: auto !important;
    width: 34px !important;
    padding: 0 !important;
}
body.glass-ui #admins-root .adm-modal-close:hover {
    background: var(--line-2) !important;
    color: var(--ink-1) !important;
}

/* Form elements */
body.glass-ui #admins-root .adm-form-label {
    color: var(--ink-2) !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}
body.glass-ui #admins-root .adm-status-toggle {
    background: var(--bg-surface-2) !important;
    border-color: var(--line-2) !important;
}
body.glass-ui #admins-root .adm-status-toggle label {
    color: var(--ink-2) !important;
}
body.glass-ui #admins-root .adm-branch-picker {
    background: var(--bg-surface) !important;
    border-color: var(--line-2) !important;
}
body.glass-ui #admins-root .adm-branch-picker:focus-within {
    border-color: var(--ih-indigo) !important;
    box-shadow: var(--el-focus) !important;
}
body.glass-ui #admins-root .adm-branch-suggestions {
    background: var(--bg-glass-strong) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-color: var(--line-2) !important;
    box-shadow: var(--el-4) !important;
}
body.glass-ui #admins-root .adm-branch-chip-sel {
    background: var(--ih-info-tint) !important;
    border-color: rgba(64,80,192,.30) !important;
    color: var(--ih-indigo) !important;
}

/* Role grid options */
body.glass-ui #admins-root .adm-role-card-opt {
    border-color: var(--line-2) !important;
    background: var(--bg-surface-2) !important;
    box-shadow: none !important;
}
body.glass-ui #admins-root .adm-role-card-opt:hover {
    border-color: var(--line-3) !important;
    background: var(--bg-surface-hover) !important;
}
body.glass-ui #admins-root .adm-role-card-opt.selected {
    border-color: var(--ih-indigo) !important;
    background: var(--ih-info-tint) !important;
}
body.glass-ui #admins-root .adm-role-card-opt .rc-rco-name {
    color: var(--ink-2) !important;
}
body.glass-ui #admins-root .adm-role-card-opt.selected .rc-rco-name {
    color: var(--ih-indigo) !important;
}

/* Advanced perms accordion */
body.glass-ui #admins-root .adm-adv-perms-header {
    background: var(--bg-surface-2) !important;
    border-color: var(--line-2) !important;
    color: var(--ink-2) !important;
}
body.glass-ui #admins-root .adm-adv-perms-header:hover {
    border-color: var(--line-3) !important;
}
body.glass-ui #admins-root .adm-adv-perms-body {
    border-color: var(--line-2) !important;
}
body.glass-ui #admins-root .adm-perm-row {
    border-bottom-color: var(--line-1) !important;
}
body.glass-ui #admins-root .adm-perm-row-label {
    color: var(--ink-2) !important;
}

/* ── CREATE ROLE MODAL ────────────────────────────────────────────────── */
body.glass-ui #admins-root .adm-view-switch {
    background: var(--bg-surface-hover) !important;
}
body.glass-ui #admins-root .adm-view-btn {
    color: var(--ink-3) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    height: auto !important;
    padding: 6px 14px !important;
}
body.glass-ui #admins-root .adm-view-btn.active {
    background: var(--bg-surface) !important;
    color: var(--ih-indigo) !important;
    box-shadow: var(--el-1) !important;
}
body.glass-ui #admins-root .adm-node-sidebar {
    background: var(--bg-surface-2) !important;
    border-color: var(--line-2) !important;
}
body.glass-ui #admins-root .adm-module-card {
    background: var(--bg-surface) !important;
    border-color: var(--line-2) !important;
    box-shadow: none !important;
}
body.glass-ui #admins-root .adm-module-card:hover {
    border-color: var(--line-3) !important;
    background: var(--bg-surface-hover) !important;
}
body.glass-ui #admins-root .adm-module-name {
    color: var(--ink-1) !important;
}
body.glass-ui #admins-root .adm-toggle-row {
    color: var(--ink-3) !important;
}
body.glass-ui #admins-root .adm-toggle-row span {
    color: var(--ink-2) !important;
}

/* Invite / Discard buttons inside modals — maintain correct sizing */
body.glass-ui #admins-root .adm-btn-invite {
    height: auto !important;
    padding: 10px 22px !important;
}
body.glass-ui #admins-root .adm-btn-discard {
    height: auto !important;
    padding: 9px 18px !important;
    background: transparent !important;
    border: 1.5px solid var(--line-3) !important;
    color: var(--ink-3) !important;
}
body.glass-ui #admins-root .adm-btn-discard:hover {
    border-color: var(--line-3) !important;
    background: var(--bg-surface-hover) !important;
    color: var(--ink-1) !important;
}

/* Create role button in sidebar */
body.glass-ui #admins-root .adm-btn-create-role {
    border-color: var(--ih-indigo) !important;
    color: var(--ih-indigo) !important;
    background: transparent !important;
    height: auto !important;
    padding: 10px 14px !important;
}
body.glass-ui #admins-root .adm-btn-create-role:hover {
    background: var(--ih-info-tint) !important;
}