html,
body {
    margin: 0;
    min-height: 100%;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    background: #f5f7fb;
    color: #122032;
}

.et-support-banner,
.et-support-session-active {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1rem;
    background: var(--et-warning-soft, #fff7ed);
    color: var(--et-warning-strong, #9a3412);
    border-bottom: 1px solid var(--et-warning-border, #fed7aa);
}

.et-domain-list { display: grid; gap: .75rem; }
.et-domain-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .5rem 1rem;
    padding: 1rem;
    border: 1px solid var(--et-border, #d0d5dd);
    border-radius: .75rem;
    background: var(--et-surface, #fff);
}
.et-domain-card div { display: grid; gap: .2rem; }
.et-domain-card small { color: var(--et-text-muted, #667085); }
.et-one-time-secret {
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid var(--et-warning-border, #fed7aa);
    border-radius: .75rem;
    background: var(--et-warning-soft, #fff7ed);
}
.et-secret-value { overflow-wrap: anywhere; user-select: all; }
.et-input-wrapper__helper, .et-form-note { color: var(--et-text-muted, #667085); font-size: .82rem; }

@media (max-width: 720px) {
    .et-support-banner, .et-support-session-active { align-items: stretch; flex-direction: column; }
    .et-domain-card { grid-template-columns: 1fr; }
}

a {
    color: inherit;
}

.admin-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 16rem minmax(0, 1fr);
}

.admin-sidebar {
    background: #122032;
    color: #e7edf5;
    padding: 1rem;
}

.brand-block {
    display: grid;
    gap: .15rem;
    margin-bottom: 1.5rem;
}

.brand {
    color: #ffffff;
    font-weight: 800;
    font-size: 1.15rem;
    text-decoration: none;
}

.brand-block span {
    color: #9fb0c5;
    font-size: .85rem;
}

.navbar-toggler {
    display: none;
}

.nav-scrollable nav {
    display: grid;
    gap: .35rem;
}

.nav-link {
    display: block;
    color: #dbe6f3;
    text-decoration: none;
    border-radius: 6px;
    padding: .7rem .75rem;
    font-weight: 700;
}

.nav-link:hover,
.nav-link.active {
    background: #1f6feb;
    color: #ffffff;
}

.admin-main {
    min-width: 0;
}

.admin-topbar {
    height: 3.75rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #d8e0ea;
    color: #607086;
}

.admin-topbar strong {
    color: #122032;
    font-size: .9rem;
}

.link-button {
    border: 1px solid #d8e0ea;
    background: #ffffff;
    color: #122032;
    border-radius: 6px;
    padding: .45rem .75rem;
    font-weight: 700;
}

.admin-content {
    padding: 1.5rem;
}

.foundation-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.foundation-card,
.detail-panel {
    background: #ffffff;
    border: 1px solid #d8e0ea;
    border-radius: 8px;
    padding: 1rem;
    box-shadow: 0 10px 30px rgba(18, 32, 50, .04);
}

.form-panel {
    display: grid;
    gap: .8rem;
    max-width: 28rem;
    background: #ffffff;
    border: 1px solid #d8e0ea;
    border-radius: 8px;
    padding: 1rem;
}

.form-panel label {
    display: grid;
    gap: .25rem;
    color: #607086;
    font-weight: 700;
}

.form-panel input {
    border: 1px solid #c8d3df;
    border-radius: 6px;
    padding: .6rem .7rem;
    font: inherit;
}

.primary-button {
    border: 0;
    background: #1f6feb;
    color: #ffffff;
    border-radius: 6px;
    padding: .7rem .9rem;
    font-weight: 800;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    border: 1px solid #d8e0ea;
}

.data-table th,
.data-table td {
    border-bottom: 1px solid #edf1f5;
    padding: .75rem;
    text-align: left;
}

.data-table th {
    color: #607086;
    font-size: .85rem;
    text-transform: uppercase;
}

.admin-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .65rem;
    margin-bottom: 1rem;
}

.admin-input,
.admin-form textarea {
    border: 1px solid #c8d3df;
    border-radius: 6px;
    padding: .58rem .7rem;
    font: inherit;
    color: #122032;
    background: #ffffff;
}

.admin-toolbar .admin-input {
    min-width: 13rem;
}

.admin-grid-two {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(18rem, .6fr);
    gap: 1rem;
    align-items: start;
}

.admin-form {
    display: grid;
    gap: .8rem;
}

.admin-form h2,
.admin-dialog h2 {
    margin: 0;
    font-size: 1.1rem;
}

.admin-form label,
.assignment-page label,
.admin-dialog label {
    display: grid;
    gap: .3rem;
    color: #607086;
    font-weight: 700;
}

.admin-check {
    display: flex !important;
    align-items: center;
    gap: .5rem !important;
    color: #122032 !important;
}

.admin-actions,
.row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.row-actions button,
.admin-actions button {
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #122032;
    border-radius: 6px;
    padding: .42rem .6rem;
    font-weight: 700;
}

.row-actions button:disabled,
.admin-actions button:disabled {
    opacity: .45;
}

.admin-actions .primary-button,
.primary-button {
    border-color: #1f6feb;
    background: #1f6feb;
    color: #ffffff;
}

.admin-alert {
    border: 1px solid #b7e4c7;
    background: #f0fff4;
    color: #166534;
    border-radius: 8px;
    padding: .75rem 1rem;
    margin-bottom: 1rem;
    font-weight: 700;
}

.selected-row {
    background: #eef6ff;
}

.data-table small {
    display: block;
    color: #607086;
    margin-top: .15rem;
}

.admin-table-compact {
    font-size: .92rem;
}

.admin-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(15, 23, 42, .45);
    display: grid;
    place-items: center;
    padding: 1rem;
}

.admin-dialog {
    width: min(32rem, 100%);
    max-height: calc(100vh - 2rem);
    overflow: auto;
    display: grid;
    gap: .8rem;
    background: #ffffff;
    border-radius: 8px;
    padding: 1rem;
    box-shadow: 0 20px 55px rgba(15, 23, 42, .22);
}

.admin-dialog.wide {
    width: min(54rem, 100%);
}

.admin-check-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem .85rem;
}

.admin-check-list label {
    display: flex !important;
    align-items: center;
    gap: .5rem !important;
    color: #122032 !important;
    font-weight: 600 !important;
}

.assignment-page {
    display: grid;
    gap: 1rem;
}

.assignment-group {
    border: 1px solid #d8e0ea;
    border-radius: 8px;
    padding: .75rem;
    background: #fbfdff;
}

.assignment-group summary {
    cursor: pointer;
    font-weight: 800;
    color: #122032;
    margin-bottom: .55rem;
}

.error-text {
    color: #b42318;
    font-weight: 700;
}

.foundation-card h2 {
    font-size: 1rem;
    margin: 0 0 .5rem;
}

.foundation-card p {
    margin: 0;
    color: #607086;
    line-height: 1.55;
}

.detail-panel {
    display: grid;
    gap: .75rem;
    max-width: 48rem;
}

.detail-panel div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid #edf1f5;
    padding-bottom: .75rem;
}

.detail-panel div:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.detail-panel span {
    color: #607086;
    font-weight: 700;
}

#blazor-error-ui {
    background: #fff1f2;
    border-top: 1px solid #fecdd3;
    bottom: 0;
    display: none;
    left: 0;
    padding: .75rem 1rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 1rem;
}

@media (max-width: 760px) {
    .admin-shell {
        grid-template-columns: 1fr;
    }

    .admin-sidebar {
        position: static;
    }

    .foundation-grid {
        grid-template-columns: 1fr;
    }

    .admin-grid-two,
    .admin-check-list {
        grid-template-columns: 1fr;
    }

    .admin-topbar,
    .detail-panel div {
        align-items: flex-start;
        flex-direction: column;
    }
}