:root {
    --ink: #2f2940;
    --ink-soft: #716a7c;
    --forest: #49325f;
    --forest-dark: #342244;
    --forest-light: #73508d;
    --sage: #eee7f3;
    --sage-soft: #f7f2f9;
    --cream: #f7f4ec;
    --paper: #ffffff;
    --gold: #d39a45;
    --gold-soft: #fbf0de;
    --danger: #c9584f;
    --danger-soft: #fae8e6;
    --blue: #5a5f9a;
    --blue-soft: #e5f1f4;
    --line: #dfe7e2;
    --shadow-sm: 0 3px 12px rgba(24, 61, 49, .06);
    --shadow-md: 0 8px 24px rgba(24, 61, 49, .09);
    --radius-lg: 14px;
    --radius-md: 12px;
    --radius-sm: 12px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--cream); }
body {
    min-height: 100vh;
    margin: 0;
    color: var(--ink);
    background: var(--cream);
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 15px;
    line-height: 1.55;
}

h1, h2, h3, h4, h5, h6, .brand-name, .topbar-title {
    font-family: 'Segoe UI', Arial, sans-serif;
    letter-spacing: -.025em;
}

a { color: inherit; }

.app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
}

.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 280px;
    padding: 28px 20px 22px;
    display: flex;
    flex-direction: column;
    color: #f7fbf8;
    background:
        radial-gradient(circle at 85% 10%, rgba(211,154,69,.23), transparent 28%),
        linear-gradient(165deg, #39254b 0%, #2a1d38 100%);
    overflow-y: auto;
    z-index: 1000;
}

.brand-block {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 4px 4px 27px;
}

.brand-mark {
    width: 56px;
    height: 56px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    font-size: 20px;
    background: linear-gradient(145deg, #e5b86d, #c98d36);
    color: #3d2b4a;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
.brand-name { font-size: 27px; font-weight: 800; line-height: 1.05; }
.brand-subtitle { margin-top: 5px; color: rgba(255,255,255,.64); font-size: 12px; }
.nav-label {
    padding: 0 12px 10px;
    color: rgba(255,255,255,.42);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.menu { display: grid; gap: 6px; }
.menu a {
    min-height: 50px;
    padding: 9px 12px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: rgba(255,255,255,.72);
    text-decoration: none !important;
    font-weight: 650;
    transition: .22s ease;
}
.menu a:hover {
    color: #fff;
    background: rgba(255,255,255,.08);
    transform: translateX(2px);
}
.menu a.active {
    color: #4a355a;
    background: #f4ead8;
    box-shadow: 0 10px 26px rgba(0,0,0,.12);
}
.nav-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 14px;
    background: rgba(255,255,255,.08);
}
.menu a.active .nav-icon { color: #49325f; background: rgba(74,53,104,.10); }
.sidebar-card {
    margin-top: auto;
    padding: 18px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    backdrop-filter: blur(8px);
}
.sidebar-card-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: #4d4058;
    background: #d69a7d;
    border-radius: 11px;
    margin-bottom: 12px;
}
.sidebar-card-title { font-family: 'Manrope', sans-serif; font-weight: 750; }
.sidebar-card-text { margin-top: 5px; color: rgba(255,255,255,.56); font-size: 12px; line-height: 1.55; }

.app-main {
    grid-column: 2;
    min-width: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.topbar {
    min-height: 88px;
    padding: 19px clamp(24px, 4vw, 56px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid rgba(74,53,104,.08);
    background: rgba(247,244,236,.88);
    backdrop-filter: blur(14px);
    position: sticky;
    top: 0;
    z-index: 900;
}
.topbar-kicker { color: var(--forest-light); font-size: 10px; font-weight: 800; letter-spacing: .17em; }
.topbar-title { margin-top: 2px; font-size: 18px; font-weight: 800; }
.topbar-badge {
    padding: 10px 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--forest);
    background: rgba(255,255,255,.72);
    box-shadow: var(--shadow-sm);
    font-size: 12px;
    font-weight: 750;
}
.topbar-badge i { color: var(--gold); margin-right: 6px; }

.content-wrapper {
    flex: 1;
    width: 100%;
    padding: 34px clamp(24px, 4vw, 56px) 46px;
}
.content { width: 100%; max-width: 1320px; margin: 0 auto; }
.footer {
    min-height: 64px;
    padding: 18px clamp(24px, 4vw, 56px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid rgba(74,53,104,.08);
    color: #75827d;
    font-size: 12px;
}
.footer-status { display: flex; align-items: center; gap: 8px; }
.footer-status span { width: 8px; height: 8px; border-radius: 50%; background: #b85f52; box-shadow: 0 0 0 4px rgba(184,95,82,.12); }

/* Reusable page elements */
.page-heading {
    margin-bottom: 24px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 22px;
}
.page-eyebrow {
    margin-bottom: 7px;
    color: var(--forest-light);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.page-heading h1, .page-heading h2 { margin: 0; color: var(--ink); font-size: clamp(30px, 4vw, 44px); font-weight: 800; }
.page-heading p { margin: 7px 0 0; color: var(--ink-soft); font-size: 15px; }
.page-chip {
    flex: 0 0 auto;
    padding: 11px 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255,255,255,.75);
    color: var(--forest);
    font-size: 12px;
    font-weight: 750;
    box-shadow: var(--shadow-sm);
}
.page-chip i { margin-right: 7px; color: var(--gold); }

.panel-card, .control-panel, .data-container, .edit-panel, .admin-section.card, .login-panel {
    border: 1px solid rgba(74,53,104,.10) !important;
    border-radius: var(--radius-lg) !important;
    background: rgba(255,255,255,.88) !important;
    box-shadow: var(--shadow-sm) !important;
}

/* Forms */
input[type=text], input[type=password], input[type=email], input[type=number], input[type=date], select, textarea,
.form-control, .form-input, .search-input {
    width: 100%;
    max-width: none;
    min-height: 46px;
    padding: 11px 14px;
    color: var(--ink);
    background: #fbfcfb;
    border: 1px solid #ddd3e2;
    border-radius: 12px;
    outline: none;
    font: inherit;
    transition: border-color .18s, box-shadow .18s, background .18s;
}
textarea { min-height: 110px; resize: vertical; }
input:focus, select:focus, textarea:focus, .form-control:focus, .form-input:focus, .search-input:focus {
    border-color: #8b6aa3;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(116,85,141,.11);
}
.form-group { margin-bottom: 17px; }
.form-group label, .field-label {
    display: block;
    margin-bottom: 7px;
    color: #51445e;
    font-size: 13px;
    font-weight: 750;
}
.validation-error, .invalid-feedback { display: block; margin-top: 6px; color: var(--danger); font-size: 12px; }

/* Buttons */
.btn, .button, .btn-action, input[type=submit].button {
    min-height: 44px;
    padding: 10px 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 12px;
    text-decoration: none !important;
    cursor: pointer;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 750;
    line-height: 1;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.btn:hover, .button:hover, .btn-action:hover { transform: translateY(-1px); filter: brightness(.98); }
.btn-primary, .btn-action.primary, .button, input.button {
    color: #fff !important;
    background: linear-gradient(135deg, var(--forest), var(--forest-light)) !important;
    box-shadow: 0 9px 20px rgba(74,53,104,.18);
}
.btn-action.success, .btn-success { color: #5c3850 !important; background: #f3e5ee !important; border-color: #e5cbd9 !important; }
.btn-action.warning, .btn-warning { color: #704b14 !important; background: var(--gold-soft) !important; border-color: #efd4a8 !important; }
.btn-action.danger, .btn-danger { color: #8b332d !important; background: var(--danger-soft) !important; border-color: #efc4c0 !important; }
.btn-action.info, .btn-info { color: #4e4f86 !important; background: var(--blue-soft) !important; border-color: #c8e1e7 !important; }
.btn-action.secondary, .btn-secondary { color: #554e60 !important; background: #edf1ef !important; border-color: #d8e0dc !important; }
.btn-outline-primary { color: var(--forest) !important; border-color: #c9b2d3 !important; background: #fff !important; }
.btn-outline-danger { color: var(--danger) !important; border-color: #e6b3ae !important; background: #fff !important; }
.btn-outline-light { color: #fff !important; border: 1px solid rgba(255,255,255,.46) !important; background: rgba(255,255,255,.08) !important; }
.btn-outline-light:hover { color: var(--forest-dark) !important; background: #fff !important; }
.btn-lg { min-height: 50px; padding: 13px 20px; border-radius: 14px; }
.btn-sm { min-height: 34px; padding: 7px 10px; border-radius: 9px; }

/* Tables */
.table-responsive, .data-container { overflow-x: auto; }

/* Keep ASP.NET GridView rows compatible with Bootstrap */
.data-grid tr.row, .data-grid tr.alt-row { display: table-row; margin: 0; }
.data-grid tr.row > td, .data-grid tr.alt-row > td { flex: none; max-width: none; }

.gridview, .data-grid, .table {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0;
    color: var(--ink);
    background: #fff;
    font-size: 13px;
}
.gridview th, .data-grid th, .table th, .data-grid .header {
    padding: 14px 15px !important;
    color: #ecf5f0 !important;
    background: #4a3568 !important;
    border: 0 !important;
    text-align: left;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
    white-space: nowrap;
}
.gridview th:first-child, .data-grid th:first-child, .table th:first-child { border-radius: 14px 0 0 0; }
.gridview th:last-child, .data-grid th:last-child, .table th:last-child { border-radius: 0 14px 0 0; }
.gridview td, .data-grid td, .table td {
    padding: 14px 15px !important;
    border: 0 !important;
    border-bottom: 1px solid #e8eeea !important;
    vertical-align: middle;
}
.gridview tr:nth-child(even) td, .data-grid .alt-row td, .table-striped tbody tr:nth-of-type(odd) { background: #f7faf8; }
.gridview tr:hover td, .data-grid .row:hover td, .data-grid .alt-row:hover td, .table-hover tbody tr:hover { background: #edf6f1 !important; }
.pager { background: #fff !important; }
.pager td { padding: 16px !important; }
.pager a, .pager span {
    display: inline-grid;
    place-items: center;
    min-width: 34px;
    height: 34px;
    margin: 0 3px;
    border: 1px solid var(--line) !important;
    border-radius: 10px !important;
    text-decoration: none;
}
.pager a { color: var(--forest) !important; background: #fff; }
.pager span { color: #fff !important; background: var(--forest) !important; }
.empty-data { padding: 36px !important; color: var(--ink-soft) !important; text-align: center; }
.badge { padding: 7px 10px; border-radius: 999px; font-size: 11px; font-weight: 750; }
.badge-success { color: #8a4f67; background: #f3e7ee; }
.badge-secondary { color: #5d6965; background: #e9eeeb; }

@media (max-width: 980px) {
    .app-shell { display: block; }
    .sidebar {
        position: static;
        width: 100%;
        min-height: auto;
        padding: 16px 18px;
    }
    .brand-block { padding: 0 0 14px; }
    .brand-mark { width: 48px; height: 48px; }
    .brand-name { font-size: 24px; }
    .nav-label, .sidebar-card { display: none; }
    .menu { display: flex; overflow-x: auto; padding-bottom: 2px; }
    .menu a { min-width: max-content; min-height: 44px; padding: 7px 10px; }
    .app-main { grid-column: 1; }
    .topbar { position: static; min-height: 72px; padding: 14px 20px; }
    .content-wrapper { padding: 24px 18px 34px; }
}

@media (max-width: 640px) {
    .topbar-badge { display: none; }
    .topbar-title { font-size: 16px; }
    .page-heading { align-items: flex-start; flex-direction: column; }
    .page-heading h1, .page-heading h2 { font-size: 30px; }
    .footer { align-items: flex-start; flex-direction: column; }
    .btn, .button, .btn-action { width: 100%; }
}


/* ============================================================
   Built-in SVG icon system (no internet or icon font required)
   ============================================================ */
.fas, .fa-solid {
    display: inline-block;
    width: 1em;
    height: 1em;
    flex: 0 0 auto;
    vertical-align: -.12em;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    font-family: inherit !important;
    font-style: normal;
    line-height: 1;
}
.fas::before, .fa-solid::before { content: none !important; display: none !important; }
.fa-border-all { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%223%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%223%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3C%2Fsvg%3E"); }
.fa-book, .fa-book-bookmark, .fa-book-medical { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204.5A2.5%202.5%200%200%201%206.5%202H20v17H6.5A2.5%202.5%200%200%200%204%2021.5z%22%2F%3E%3Cpath%20d%3D%22M4%204.5v17%22%2F%3E%3Cpath%20d%3D%22M8%206h8%22%2F%3E%3Cpath%20d%3D%22M8%2010h7%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204.5A2.5%202.5%200%200%201%206.5%202H20v17H6.5A2.5%202.5%200%200%200%204%2021.5z%22%2F%3E%3Cpath%20d%3D%22M4%204.5v17%22%2F%3E%3Cpath%20d%3D%22M8%206h8%22%2F%3E%3Cpath%20d%3D%22M8%2010h7%22%2F%3E%3C%2Fsvg%3E"); }
.fa-book-open, .fa-book-open-reader { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%205.5A3.5%203.5%200%200%201%206.5%202H11v17H6.5A3.5%203.5%200%200%200%203%2022z%22%2F%3E%3Cpath%20d%3D%22M21%205.5A3.5%203.5%200%200%200%2017.5%202H13v17h4.5A3.5%203.5%200%200%201%2021%2022z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%205.5A3.5%203.5%200%200%201%206.5%202H11v17H6.5A3.5%203.5%200%200%200%203%2022z%22%2F%3E%3Cpath%20d%3D%22M21%205.5A3.5%203.5%200%200%200%2017.5%202H13v17h4.5A3.5%203.5%200%200%201%2021%2022z%22%2F%3E%3C%2Fsvg%3E"); }
.fa-bookmark { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%203h12v18l-6-4-6%204z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%203h12v18l-6-4-6%204z%22%2F%3E%3C%2Fsvg%3E"); }
.fa-user-group, .fa-users, .fa-users-gear { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020v-2a6%206%200%200%201%2012%200v2%22%2F%3E%3Cpath%20d%3D%22M16%205.5a3%203%200%200%201%200%205%22%2F%3E%3Cpath%20d%3D%22M17%2014a5%205%200%200%201%204%204v2%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020v-2a6%206%200%200%201%2012%200v2%22%2F%3E%3Cpath%20d%3D%22M16%205.5a3%203%200%200%201%200%205%22%2F%3E%3Cpath%20d%3D%22M17%2014a5%205%200%200%201%204%204v2%22%2F%3E%3C%2Fsvg%3E"); }
.fa-user, .fa-user-lock { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M4%2021a8%208%200%200%201%2016%200%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M4%2021a8%208%200%200%201%2016%200%22%2F%3E%3C%2Fsvg%3E"); }
.fa-user-check { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020v-2a6%206%200%200%201%2010-4.5%22%2F%3E%3Cpath%20d%3D%22m15%2017%202%202%204-5%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020v-2a6%206%200%200%201%2010-4.5%22%2F%3E%3Cpath%20d%3D%22m15%2017%202%202%204-5%22%2F%3E%3C%2Fsvg%3E"); }
.fa-user-pen { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020v-2a6%206%200%200%201%208-5.65%22%2F%3E%3Cpath%20d%3D%22m15%2017%205-5%202%202-5%205-3%201z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020v-2a6%206%200%200%201%208-5.65%22%2F%3E%3Cpath%20d%3D%22m15%2017%205-5%202%202-5%205-3%201z%22%2F%3E%3C%2Fsvg%3E"); }
.fa-address-book { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%223%22%20width%3D%2215%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%207h4M3%2012h4M3%2017h4%22%2F%3E%3Ccircle%20cx%3D%2213%22%20cy%3D%229%22%20r%3D%222.5%22%2F%3E%3Cpath%20d%3D%22M9%2017a4%204%200%200%201%208%200%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%223%22%20width%3D%2215%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%207h4M3%2012h4M3%2017h4%22%2F%3E%3Ccircle%20cx%3D%2213%22%20cy%3D%229%22%20r%3D%222.5%22%2F%3E%3Cpath%20d%3D%22M9%2017a4%204%200%200%201%208%200%22%2F%3E%3C%2Fsvg%3E"); }
.fa-chart-column, .fa-chart-simple, .fa-tachometer-alt { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2020V10%22%2F%3E%3Cpath%20d%3D%22M10%2020V4%22%2F%3E%3Cpath%20d%3D%22M16%2020v-7%22%2F%3E%3Cpath%20d%3D%22M22%2020H2%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2020V10%22%2F%3E%3Cpath%20d%3D%22M10%2020V4%22%2F%3E%3Cpath%20d%3D%22M16%2020v-7%22%2F%3E%3Cpath%20d%3D%22M22%2020H2%22%2F%3E%3C%2Fsvg%3E"); }
.fa-chart-line { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2018%209%2012l4%203%208-9%22%2F%3E%3Cpath%20d%3D%22M17%206h4v4%22%2F%3E%3Cpath%20d%3D%22M3%2021h18%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2018%209%2012l4%203%208-9%22%2F%3E%3Cpath%20d%3D%22M17%206h4v4%22%2F%3E%3Cpath%20d%3D%22M3%2021h18%22%2F%3E%3C%2Fsvg%3E"); }
.fa-chart-pie { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202v10h10A10%2010%200%201%201%2012%202z%22%2F%3E%3Cpath%20d%3D%22M15%202.5A9.5%209.5%200%200%201%2021.5%209H15z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202v10h10A10%2010%200%201%201%2012%202z%22%2F%3E%3Cpath%20d%3D%22M15%202.5A9.5%209.5%200%200%201%2021.5%209H15z%22%2F%3E%3C%2Fsvg%3E"); }
.fa-shield, .fa-shield-halved, .fa-user-shield { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202%2020%205v6c0%205-3.5%208.5-8%2011-4.5-2.5-8-6-8-11V5z%22%2F%3E%3Cpath%20d%3D%22m9%2012%202%202%204-5%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202%2020%205v6c0%205-3.5%208.5-8%2011-4.5-2.5-8-6-8-11V5z%22%2F%3E%3Cpath%20d%3D%22m9%2012%202%202%204-5%22%2F%3E%3C%2Fsvg%3E"); }
.fa-wand-magic-sparkles { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%203%201.4%204.1L17.5%208.5l-4.1%201.4L12%2014l-1.4-4.1-4.1-1.4%204.1-1.4z%22%2F%3E%3Cpath%20d%3D%22m19%2014%20.8%202.2L22%2017l-2.2.8L19%2020l-.8-2.2L16%2017l2.2-.8z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%203%201.4%204.1L17.5%208.5l-4.1%201.4L12%2014l-1.4-4.1-4.1-1.4%204.1-1.4z%22%2F%3E%3Cpath%20d%3D%22m19%2014%20.8%202.2L22%2017l-2.2.8L19%2020l-.8-2.2L16%2017l2.2-.8z%22%2F%3E%3C%2Fsvg%3E"); }
.fa-circle-check { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22m8%2012%203%203%205-6%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22m8%2012%203%203%205-6%22%2F%3E%3C%2Fsvg%3E"); }
.fa-circle-info { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%2011v6%22%2F%3E%3Cpath%20d%3D%22M12%207h.01%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%2011v6%22%2F%3E%3Cpath%20d%3D%22M12%207h.01%22%2F%3E%3C%2Fsvg%3E"); }
.fa-database { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%228%22%20ry%3D%223%22%2F%3E%3Cpath%20d%3D%22M4%205v6c0%201.7%203.6%203%208%203s8-1.3%208-3V5%22%2F%3E%3Cpath%20d%3D%22M4%2011v6c0%201.7%203.6%203%208%203s8-1.3%208-3v-6%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%228%22%20ry%3D%223%22%2F%3E%3Cpath%20d%3D%22M4%205v6c0%201.7%203.6%203%208%203s8-1.3%208-3V5%22%2F%3E%3Cpath%20d%3D%22M4%2011v6c0%201.7%203.6%203%208%203s8-1.3%208-3v-6%22%2F%3E%3C%2Fsvg%3E"); }
.fa-key { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%2215%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22m11%2012%209-9%22%2F%3E%3Cpath%20d%3D%22m17%206%202%202%22%2F%3E%3Cpath%20d%3D%22m14%209%202%202%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%2215%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22m11%2012%209-9%22%2F%3E%3Cpath%20d%3D%22m17%206%202%202%22%2F%3E%3Cpath%20d%3D%22m14%209%202%202%22%2F%3E%3C%2Fsvg%3E"); }
.fa-lock { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%2210%22%20width%3D%2214%22%20height%3D%2211%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8%2010V7a4%204%200%200%201%208%200v3%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%2210%22%20width%3D%2214%22%20height%3D%2211%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8%2010V7a4%204%200%200%201%208%200v3%22%2F%3E%3C%2Fsvg%3E"); }
.fa-magnifying-glass, .fa-search { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%2F%3E%3Cpath%20d%3D%22m20%2020-4-4%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%2F%3E%3Cpath%20d%3D%22m20%2020-4-4%22%2F%3E%3C%2Fsvg%3E"); }
.fa-pen, .fa-edit { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2020h4l11-11-4-4L4%2016z%22%2F%3E%3Cpath%20d%3D%22m13%207%204%204%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2020h4l11-11-4-4L4%2016z%22%2F%3E%3Cpath%20d%3D%22m13%207%204%204%22%2F%3E%3C%2Fsvg%3E"); }
.fa-trash-can, .fa-trash-alt { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%207h16%22%2F%3E%3Cpath%20d%3D%22M9%207V4h6v3%22%2F%3E%3Cpath%20d%3D%22m7%207%201%2014h8l1-14%22%2F%3E%3Cpath%20d%3D%22M10%2011v6M14%2011v6%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%207h16%22%2F%3E%3Cpath%20d%3D%22M9%207V4h6v3%22%2F%3E%3Cpath%20d%3D%22m7%207%201%2014h8l1-14%22%2F%3E%3Cpath%20d%3D%22M10%2011v6M14%2011v6%22%2F%3E%3C%2Fsvg%3E"); }
.fa-file-export { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%203h7v7%22%2F%3E%3Cpath%20d%3D%22m21%203-9%209%22%2F%3E%3Cpath%20d%3D%22M18%2013v6a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V8a2%202%200%200%201%202-2h6%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%203h7v7%22%2F%3E%3Cpath%20d%3D%22m21%203-9%209%22%2F%3E%3Cpath%20d%3D%22M18%2013v6a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V8a2%202%200%200%201%202-2h6%22%2F%3E%3C%2Fsvg%3E"); }
.fa-sliders { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%206h16M4%2012h16M4%2018h16%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%226%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2212%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2218%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%206h16M4%2012h16M4%2018h16%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%226%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2212%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2218%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E"); }
.fa-table-list { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%209h18M8%209v11M15%209v11%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%209h18M8%209v11M15%209v11%22%2F%3E%3C%2Fsvg%3E"); }
.fa-arrow-right { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3Cpath%20d%3D%22m14%207%205%205-5%205%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3Cpath%20d%3D%22m14%207%205%205-5%205%22%2F%3E%3C%2Fsvg%3E"); }
.fa-arrow-right-arrow-left { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%207h14%22%2F%3E%3Cpath%20d%3D%22m14%203%204%204-4%204%22%2F%3E%3Cpath%20d%3D%22M20%2017H6%22%2F%3E%3Cpath%20d%3D%22m10%2013-4%204%204%204%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%207h14%22%2F%3E%3Cpath%20d%3D%22m14%203%204%204-4%204%22%2F%3E%3Cpath%20d%3D%22M20%2017H6%22%2F%3E%3Cpath%20d%3D%22m10%2013-4%204%204%204%22%2F%3E%3C%2Fsvg%3E"); }
.fa-feather-pointed { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%204c-5-3-11%201-13%205-2%204-1%208-4%2011%204-1%207-2%209-5%203-4%204-8%208-11z%22%2F%3E%3Cpath%20d%3D%22M7%2017%2017%207%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%204c-5-3-11%201-13%205-2%204-1%208-4%2011%204-1%207-2%209-5%203-4%204-8%208-11z%22%2F%3E%3Cpath%20d%3D%22M7%2017%2017%207%22%2F%3E%3C%2Fsvg%3E"); }
.fa-lightbulb { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2018h6%22%2F%3E%3Cpath%20d%3D%22M10%2022h4%22%2F%3E%3Cpath%20d%3D%22M8.5%2015.5A7%207%200%201%201%2015.5%2015.5L14%2018h-4z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2018h6%22%2F%3E%3Cpath%20d%3D%22M10%2022h4%22%2F%3E%3Cpath%20d%3D%22M8.5%2015.5A7%207%200%201%201%2015.5%2015.5L14%2018h-4z%22%2F%3E%3C%2Fsvg%3E"); }
.fa-sun { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M12%202v2M12%2020v2M4.9%204.9l1.4%201.4M17.7%2017.7l1.4%201.4M2%2012h2M20%2012h2M4.9%2019.1l1.4-1.4M17.7%206.3l1.4-1.4%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M12%202v2M12%2020v2M4.9%204.9l1.4%201.4M17.7%2017.7l1.4%201.4M2%2012h2M20%2012h2M4.9%2019.1l1.4-1.4M17.7%206.3l1.4-1.4%22%2F%3E%3C%2Fsvg%3E"); }
.fa-door-open { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2021h16%22%2F%3E%3Cpath%20d%3D%22M6%2021V4l10-2v19%22%2F%3E%3Cpath%20d%3D%22M16%2021h3V5h-3%22%2F%3E%3Ccircle%20cx%3D%2213%22%20cy%3D%2212%22%20r%3D%22.6%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2021h16%22%2F%3E%3Cpath%20d%3D%22M6%2021V4l10-2v19%22%2F%3E%3Cpath%20d%3D%22M16%2021h3V5h-3%22%2F%3E%3Ccircle%20cx%3D%2213%22%20cy%3D%2212%22%20r%3D%22.6%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); }
.fa-layer-group { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%202%209%205-9%205-9-5z%22%2F%3E%3Cpath%20d%3D%22m3%2012%209%205%209-5%22%2F%3E%3Cpath%20d%3D%22m3%2017%209%205%209-5%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%202%209%205-9%205-9-5z%22%2F%3E%3Cpath%20d%3D%22m3%2012%209%205%209-5%22%2F%3E%3Cpath%20d%3D%22m3%2017%209%205%209-5%22%2F%3E%3C%2Fsvg%3E"); }
.fa-save { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%203h12l3%203v15H4V3z%22%2F%3E%3Cpath%20d%3D%22M8%203v6h8V3%22%2F%3E%3Crect%20x%3D%228%22%20y%3D%2214%22%20width%3D%228%22%20height%3D%227%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%203h12l3%203v15H4V3z%22%2F%3E%3Cpath%20d%3D%22M8%203v6h8V3%22%2F%3E%3Crect%20x%3D%228%22%20y%3D%2214%22%20width%3D%228%22%20height%3D%227%22%2F%3E%3C%2Fsvg%3E"); }
.fa-undo { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%207%204%2012l5%205%22%2F%3E%3Cpath%20d%3D%22M4%2012h9a6%206%200%200%201%206%206%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%207%204%2012l5%205%22%2F%3E%3Cpath%20d%3D%22M4%2012h9a6%206%200%200%201%206%206%22%2F%3E%3C%2Fsvg%3E"); }


/* ============================================================
   Native inline SVG icons — reliable offline and in every page
   ============================================================ */
.svg-symbol-library {
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}
.ui-icon {
    width: 1.08em;
    height: 1.08em;
    display: inline-block;
    flex: 0 0 auto;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    vertical-align: -0.16em;
}
.brand-mark .ui-icon { width: 25px; height: 25px; }
.nav-icon .ui-icon { width: 18px; height: 18px; }
.sidebar-card-icon .ui-icon { width: 17px; height: 17px; }
.feature-icon .ui-icon { width: 22px; height: 22px; }
.stat-icon .ui-icon { width: 20px; height: 20px; }
.news-icon .ui-icon { width: 20px; height: 20px; }
.panel-icon .ui-icon, .login-icon .ui-icon { width: 21px; height: 21px; }
.book .ui-icon { width: 42px; height: 42px; }
.btn .ui-icon, .button .ui-icon, .feature-link .ui-icon { margin-right: 6px; }
.feature-link .ui-icon { margin-right: 0; margin-left: 5px; width: 13px; height: 13px; }
.error-panel {
    margin-top: 15px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(190, 59, 59, .22);
    border-radius: 12px;
    color: #a93232;
    background: #fff2f2;
    font-size: 13px;
    font-weight: 650;
}
.error-panel .error-message { color: inherit; }


/* Open Shelf interface */
:root {
    --ink: #263247;
    --ink-soft: #667085;
    --forest: #4a3568;
    --forest-dark: #332442;
    --forest-light: #74558d;
    --sage: #eee8f4;
    --sage-soft: #f8f4fa;
    --cream: #f8f4ee;
    --paper: #ffffff;
    --gold: #c8795b;
    --gold-soft: #f8e9e2;
    --danger: #b94f55;
    --danger-soft: #fbeaec;
    --blue: #5671a6;
    --blue-soft: #e9eef8;
    --line: #e2e5eb;
    --shadow-sm: 0 4px 14px rgba(34, 45, 67, .06);
    --shadow-md: 0 14px 34px rgba(34, 45, 67, .10);
    --radius-lg: 16px;
    --radius-md: 12px;
    --radius-sm: 10px;
}

html, body {
    background: #f8f4ee;
    color: var(--ink);
}
body {
    font-family: "Segoe UI", Arial, sans-serif;
}

.site-frame {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid #e4e6eb;
    box-shadow: 0 5px 16px rgba(34,45,67,.04);
}
.header-row {
    max-width: 1240px;
    min-height: 76px;
    margin: 0 auto;
    padding: 13px 26px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}
.brand-horizontal {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--ink);
    text-decoration: none !important;
}
.brand-letter {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 2px solid #344767;
    border-radius: 50%;
    color: #344767;
    background: #fff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .04em;
}
.brand-copy {
    display: grid;
    line-height: 1.1;
}
.brand-copy strong {
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -.02em;
}
.brand-copy small {
    margin-top: 4px;
    color: #8a91a0;
    font-size: 11px;
    font-weight: 500;
}
.session-pill {
    min-height: 36px;
    padding: 8px 12px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #e1e4ea;
    border-radius: 9px;
    background: #fafbfc;
    color: #626b7b;
    font-size: 11px;
    font-weight: 650;
}
.session-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #c8795b;
}
.top-menu {
    max-width: 1240px;
    min-height: 51px;
    margin: 0 auto;
    padding: 0 26px 9px;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: thin;
}
.top-menu a {
    min-height: 38px;
    padding: 8px 10px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    border-radius: 8px;
    color: #5f6878;
    text-decoration: none !important;
    font-size: 12px;
    font-weight: 650;
    transition: .16s ease;
}
.top-menu a:hover {
    color: #263247;
    background: #f3f4f7;
}
.top-menu a.active {
    color: #fff;
    background: #344767;
}
.top-menu .menu-icon {
    width: 14px;
    height: 14px;
    opacity: .8;
    order: 2;
}
.menu-spacer {
    flex: 1 1 auto;
    min-width: 16px;
}
.top-menu .account-link {
    color: #56637b;
}
.top-menu .admin-link {
    border: 1px solid #e5c8bd;
    color: #a45e47;
    background: #fff8f5;
}
.top-menu .admin-link.active,
.top-menu .admin-link:hover {
    color: #fff;
    border-color: #c8795b;
    background: #c8795b;
}
.top-menu .logout-link {
    color: #9a4c51;
}

.page-shell {
    flex: 1 0 auto;
    width: 100%;
}
.content-wrapper {
    padding: 0;
}
.content {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 34px 26px 46px;
}
.site-footer {
    max-width: 1240px;
    width: calc(100% - 52px);
    margin: 0 auto;
    padding: 18px 0 24px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #e1e3e8;
    color: #818896;
    font-size: 11px;
}
.site-footer strong { color: #4c5668; }

/* Common page appearance */
.page-heading {
    margin-bottom: 22px;
    align-items: center;
}
.page-eyebrow {
    color: #b0644d;
    letter-spacing: .12em;
}
.page-heading h1, .page-heading h2 {
    color: #263247;
    font-size: clamp(28px, 3.2vw, 38px);
    font-weight: 750;
}
.page-heading p {
    color: #707887;
}
.page-chip {
    border-radius: 8px;
    color: #4d5d79;
    background: #eef2f8;
    box-shadow: none;
}

.panel-card, .control-panel, .data-container, .edit-panel, .admin-section.card, .login-panel {
    border-color: #e1e4e9 !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 3px 12px rgba(42,52,72,.04) !important;
}

input[type=text], input[type=password], input[type=email], input[type=number], input[type=date], select, textarea,
.form-control, .form-input, .search-input {
    min-height: 43px;
    border-radius: 8px;
    border-color: #d9dde5;
    background: #fff;
}
input:focus, select:focus, textarea:focus, .form-control:focus, .form-input:focus, .search-input:focus {
    border-color: #7a8db4;
    box-shadow: 0 0 0 3px rgba(86,113,166,.12);
}

.btn, .button, .btn-action, input[type=submit].button {
    min-height: 41px;
    border-radius: 8px;
    font-weight: 650;
}
.btn-primary, .btn-action.primary, .button, input.button {
    background: #344767 !important;
    box-shadow: none;
}
.btn-primary:hover, .btn-action.primary:hover, .button:hover, input.button:hover {
    background: #283a58 !important;
}
.btn-action.success, .btn-success { color: #61405a !important; background: #f3e8ef !important; border-color: #e7cfdd !important; }
.btn-action.warning, .btn-warning { color: #92593f !important; background: #faeee8 !important; border-color: #efd6ca !important; }
.btn-action.info, .btn-info { color: #435f94 !important; background: #edf1f9 !important; border-color: #d7dfef !important; }

.gridview, .data-grid, .table {
    border: 1px solid #e2e5ea;
    border-radius: 10px;
    overflow: hidden;
    font-size: 13px;
}
.gridview th, .data-grid th, .table th, .data-grid .header {
    color: #fff !important;
    background: #344767 !important;
    text-transform: none;
    letter-spacing: 0;
    font-size: 12px;
}
.gridview td, .data-grid td, .table td {
    border-bottom-color: #eceef2 !important;
}
.gridview tr:nth-child(even) td, .data-grid .alt-row td, .table-striped tbody tr:nth-of-type(odd) {
    background: #fafbfc;
}
.gridview tr:hover td, .data-grid .row:hover td, .data-grid .alt-row:hover td, .table-hover tbody tr:hover {
    background: #f1f4f9 !important;
}

/* Login and registration */
.account-login-wrap {
    min-height: 560px !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background:
        linear-gradient(90deg, #ece7df 0, #ece7df 35%, #f8f4ee 35%, #f8f4ee 100%) !important;
}
.account-login-card {
    max-width: 470px !important;
    border-radius: 12px !important;
    border-color: #e0e3e8 !important;
    box-shadow: 0 16px 36px rgba(39,50,70,.10) !important;
}
.account-login-icon {
    margin-left: auto !important;
    margin-bottom: 16px !important;
    border-radius: 50% !important;
    color: #fff !important;
    background: #c8795b !important;
}
.account-kicker { color: #a65e48 !important; }
.account-switch a { color: #506792 !important; }

@media (max-width: 860px) {
    .header-row { padding-inline: 18px; }
    .top-menu { padding-inline: 18px; }
    .content { padding: 24px 18px 38px; }
    .site-footer { width: calc(100% - 36px); }
    .session-pill { display: none; }
}
@media (max-width: 620px) {
    .brand-copy small { display: none; }
    .top-menu { gap: 2px; }
    .top-menu a { padding: 8px 9px; }
    .site-footer { flex-direction: column; }
}


/* === Aryam 12525 final visual revision === */
.site-header {
    background: #332442 !important;
    border-bottom: 0 !important;
    box-shadow: 0 10px 28px rgba(40, 26, 56, .18) !important;
}
.header-row {
    min-height: 94px !important;
    padding-top: 16px !important;
    padding-bottom: 14px !important;
}
.brand-horizontal { color: #ffffff !important; }
.brand-letter {
    width: 50px !important;
    height: 50px !important;
    border: 0 !important;
    border-radius: 14px !important;
    color: #332442 !important;
    background: #e4a082 !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.16) !important;
}
.brand-copy strong {
    color: #ffffff !important;
    font-size: 32px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: -.04em !important;
}
.brand-copy small {
    margin-top: 6px !important;
    color: #d8cfe0 !important;
    font-size: 11px !important;
}
.header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}
.email-cta {
    min-height: 42px;
    padding: 10px 16px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #e4a082;
    border-radius: 10px;
    color: #ffffff !important;
    background: #b85f52;
    text-decoration: none !important;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 7px 18px rgba(184,95,82,.22);
}
.email-cta:hover {
    color: #fff !important;
    background: #9f4e45;
}
.email-cta .ui-icon { width: 17px; height: 17px; }
.session-pill {
    border-color: rgba(255,255,255,.18) !important;
    color: #eee8f4 !important;
    background: rgba(255,255,255,.08) !important;
}
.session-dot { background: #e4a082 !important; }

.top-menu {
    max-width: none !important;
    padding: 6px max(26px, calc((100vw - 1240px)/2 + 26px)) 8px !important;
    background: #2a1d38 !important;
}
.top-menu a {
    color: #d9cfdf !important;
}
.top-menu a:hover {
    color: #ffffff !important;
    background: rgba(255,255,255,.08) !important;
}
.top-menu a.active {
    color: #332442 !important;
    background: #e4a082 !important;
}
.top-menu .admin-link {
    border-color: #8f6c9f !important;
    color: #f0e8f3 !important;
    background: transparent !important;
}
.top-menu .admin-link.active,
.top-menu .admin-link:hover {
    border-color: #e4a082 !important;
    color: #332442 !important;
    background: #e4a082 !important;
}
.top-menu .account-link { color: #e4ddec !important; }
.top-menu .logout-link { color: #f0b5ad !important; }
.top-menu .email-nav-link {
    color: #fff !important;
    background: rgba(184,95,82,.22) !important;
}
.top-menu .email-nav-link:hover {
    background: #b85f52 !important;
}

html, body { background: #f7f2ee !important; }

.btn-primary, .btn-action.primary, .button, input.button {
    background: #4a3568 !important;
    border-color: #4a3568 !important;
}
.btn-primary:hover, .btn-action.primary:hover, .button:hover, input.button:hover {
    background: #39294f !important;
    border-color: #39294f !important;
}
.btn-action.success, .btn-success {
    color: #5f3d55 !important;
    background: #f3e7ee !important;
    border-color: #e4cbd8 !important;
}
.btn-outline-primary {
    color: #4a3568 !important;
    border-color: #bba7c7 !important;
}
input:focus, select:focus, textarea:focus, .form-control:focus, .form-input:focus, .search-input:focus {
    border-color: #8a6aa0 !important;
    box-shadow: 0 0 0 3px rgba(116,85,141,.12) !important;
}
.footer-status span {
    background: #b85f52 !important;
    box-shadow: 0 0 0 4px rgba(184,95,82,.12) !important;
}

/* Neutralize Bootstrap success green in case any legacy page uses it */
.text-success, .link-success { color: #8a4f67 !important; }
.bg-success, .btn-success, .alert-success, .table-success {
    color: #5f3d55 !important;
    background-color: #f3e7ee !important;
    border-color: #e4cbd8 !important;
}
.border-success { border-color: #d9b7c9 !important; }

@media (max-width: 860px) {
    .header-actions { gap: 7px; }
    .email-cta { padding-inline: 12px; }
    .brand-copy strong { font-size: 27px !important; }
}
@media (max-width: 620px) {
    .header-row { min-height: 78px !important; }
    .brand-letter { width: 42px !important; height: 42px !important; }
    .brand-copy strong { font-size: 24px !important; }
    .email-cta span { display: none; }
    .email-cta { width: 42px; padding: 0; justify-content: center; }
}