/* Shared application identity, adapted from the public landing page.
   Keep semantic status and destructive-action colors independent of branding. */
:root {
    --app-shell-bg: #141418;
    --app-shell-fg: #f0eef3;
    --app-sidebar-bg: #19191f;
    --app-surface: #1e1e25;
    --app-surface-muted: #24232c;
    --app-border: #393640;
    --app-border-strong: #514a60;
    --app-muted: #b0abb8;
    --app-link: #c6b3e5;
    --brand-link-rgb: 198, 179, 229;
    --brand-link-hover-rgb: 229, 216, 250;
    --brand-muted-surface-rgb: 36, 35, 44;
    --app-link-hover: #e5d8fa;
    --app-nav-link: #bdb8c7;
    --app-nav-hover-bg: #27232f;
    --app-nav-active-bg: #30283e;
    --app-nav-active-fg: #e1cff9;
    --app-nav-active-border: #b397d6;
    --app-table-head-bg: #24232c;
    --app-table-head-fg: #c9c3d1;
    --app-table-head-border: #393640;
    --app-row-hover-bg: #292530;
    --app-user-trigger-bg: #24232c;
    --app-user-trigger-hover-bg: #30283e;
    --app-user-trigger-border: #393640;
    --app-user-trigger-hover-border: #746482;
    --app-user-trigger-fg: #e8e2ef;
    --app-user-trigger-hover-fg: #ffffff;
    --app-user-name: #f0eef3;
    --app-user-email: #bdb8c7;
    --app-avatar-bg: #443650;
    --app-avatar-fg: #f0e1fc;
    --brand-action-bg: #eeeaf3;
    --brand-action-fg: #1c1822;
    --brand-action-hover: #ddd3e9;
    --brand-focus: #c6b3e5;
    --brand-heading-tracking: -0.035em;
}

html[data-bs-theme="light"] {
    --app-shell-bg: #f7f7f4;
    --app-shell-fg: #17171b;
    --app-sidebar-bg: #f7f7f4;
    --app-surface: #ffffff;
    --app-surface-muted: #f0efed;
    --app-border: #dedbe2;
    --app-border-strong: #bbb2c7;
    --app-muted: #625d6b;
    --app-link: #6b4d8a;
    --brand-link-rgb: 107, 77, 138;
    --brand-link-hover-rgb: 78, 53, 105;
    --brand-muted-surface-rgb: 240, 239, 237;
    --app-link-hover: #4e3569;
    --app-nav-link: #57515f;
    --app-nav-hover-bg: #eeebf1;
    --app-nav-active-bg: #eae3f1;
    --app-nav-active-fg: #593d75;
    --app-nav-active-border: #8971ac;
    --app-table-head-bg: #f3f1f5;
    --app-table-head-fg: #595161;
    --app-table-head-border: #dedbe2;
    --app-row-hover-bg: #f5f1f8;
    --app-user-trigger-bg: #f0edf3;
    --app-user-trigger-hover-bg: #eae3f1;
    --app-user-trigger-border: #dedbe2;
    --app-user-trigger-hover-border: #a797bb;
    --app-user-trigger-fg: #39313f;
    --app-user-trigger-hover-fg: #17171b;
    --app-user-name: #17171b;
    --app-user-email: #625d6b;
    --app-avatar-bg: #e8deef;
    --app-avatar-fg: #593d75;
    --brand-action-bg: #17171b;
    --brand-action-fg: #ffffff;
    --brand-action-hover: #39303f;
    --brand-focus: #6b4d8a;
}

body {
    --bs-body-bg: var(--app-shell-bg);
    --bs-body-color: var(--app-shell-fg);
    --bs-secondary-color: var(--app-muted);
    --bs-tertiary-bg: var(--app-surface-muted);
    --bs-border-color: var(--app-border);
    --bs-link-color: var(--app-link);
    --bs-link-hover-color: var(--app-link-hover);
    --bs-link-color-rgb: var(--brand-link-rgb);
    --bs-link-hover-color-rgb: var(--brand-link-hover-rgb);
    --bs-tertiary-bg-rgb: var(--brand-muted-surface-rgb);
}

h1, .h1, .page-header h2 {
    font-weight: 600;
    letter-spacing: var(--brand-heading-tracking);
    line-height: 1.2;
}

.page-header { margin-bottom: 1.5rem; gap: 1.25rem; }
.breadcrumb { font-size: 0.875rem; }
.sidebar-brand-wrap { justify-content: flex-start; padding: 0.5rem 0; }
.sidebar-brand a { display: flex; align-items: center; gap: 0.7rem; }
.sidebar-brand .sidebar-logo { width: 36px; height: 36px; }
.sidebar-brand .sidebar-title {
    margin-top: 0 !important;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.045em;
}
.sidebar-tenant-card {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--app-border) !important;
    border-radius: 0 !important;
    padding: 0.5rem 0 1.25rem !important;
}
.sidebar ul.nav .nav-link { padding-block: 0.6rem; border-radius: 0.375rem; }

.btn-primary {
    --bs-btn-color: var(--brand-action-fg);
    --bs-btn-bg: var(--brand-action-bg);
    --bs-btn-border-color: var(--brand-action-bg);
    --bs-btn-hover-color: var(--brand-action-fg);
    --bs-btn-hover-bg: var(--brand-action-hover);
    --bs-btn-hover-border-color: var(--brand-action-hover);
    --bs-btn-active-color: var(--brand-action-fg);
    --bs-btn-active-bg: var(--brand-action-hover);
    --bs-btn-active-border-color: var(--brand-action-hover);
    --bs-btn-disabled-color: var(--brand-action-fg);
    --bs-btn-disabled-bg: var(--brand-action-bg);
    --bs-btn-disabled-border-color: var(--brand-action-bg);
    font-weight: 600;
}
.btn-outline-primary {
    --bs-btn-color: var(--app-link);
    --bs-btn-border-color: var(--app-border-strong);
    --bs-btn-hover-color: var(--app-nav-active-fg);
    --bs-btn-hover-bg: var(--app-nav-active-bg);
    --bs-btn-hover-border-color: var(--app-nav-active-border);
    --bs-btn-active-color: var(--app-nav-active-fg);
    --bs-btn-active-bg: var(--app-nav-active-bg);
    --bs-btn-active-border-color: var(--app-nav-active-border);
    --bs-btn-disabled-color: var(--app-muted);
    --bs-btn-disabled-border-color: var(--app-border);
}
.btn:focus-visible, .sidebar a:focus-visible {
    outline: 2px solid var(--brand-focus);
    outline-offset: 3px;
}
.card { --bs-card-bg: var(--app-surface); --bs-card-border-color: var(--app-border); }
.card-header { --bs-card-cap-bg: var(--app-surface-muted); }

/* Keep validation borders and feedback independent of the focus indicator. */
.form-control:focus, .form-select:focus {
    outline: 2px solid var(--brand-focus);
    outline-offset: 2px;
    box-shadow: none;
}

/* Simple creation forms share a readable measure in pages and dialogs. */
.setup-form { width: 100%; max-width: 48rem; }
.setup-form-field { margin-bottom: 1.25rem; }
.setup-form .form-label { font-weight: 600; }
.setup-form .invalid-feedback[id$="_error"],
.setup-form .text-danger[id$="_error"] {
    color: var(--bs-danger-text-emphasis) !important;
}
.setup-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--app-border);
}

/* Opt-in list layout: retain meaningful cards elsewhere, including dialogs. */
.collection-section { min-width: 0; }
.collection-heading {
    padding: 0.75rem 0;
    gap: 0.75rem;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--app-border);
}
.collection-toolbar { padding: 1rem 0; }
.collection-content { padding: 0.5rem 0 0; min-width: 0; }
.collection-section .data-table > :not(caption) > * > * {
    padding: 0.875rem 0.75rem;
}
.collection-section .data-table > thead > tr > th {
    font-weight: 600;
}

.activity-details { min-width: 10rem; max-width: 24rem; }
.activity-details[open] { width: 20rem; }
.activity-details > summary { color: var(--app-link); }
.activity-details > small { overflow-wrap: anywhere; margin-top: 0.5rem; }
.activity-details > summary:focus-visible {
    outline: 2px solid var(--brand-focus);
    outline-offset: 2px;
}

.dashboard-setup-instructions {
    background: var(--app-surface-muted);
    color: var(--app-shell-fg) !important;
    border: 0;
    border-inline-start: 3px solid var(--app-nav-active-border);
    border-radius: 0;
}
.dashboard-allowance-action {
    padding: 0.75rem 0 0;
    border: 0;
    border-top: 1px solid var(--app-border);
    border-radius: 0;
    background: transparent;
}
.dashboard-summary-box .allowance-gauge { width: 104px; height: 104px; }
.dashboard-summary-box .allowance-gauge::before { inset: 10px; }
.dashboard-summary-box .allowance-gauge-value { font-size: 1.3rem; }

@media (max-width: 575.98px) {
    .page-header { margin-bottom: 1.1rem; gap: 0.75rem; }
}