/*
 * Admin Feature Styles
 * Styles for administration pages (users list, projects management, etc.)
 */

/* ===========================================
   ADMIN LIST PAGE LAYOUT
   =========================================== */

/* Admin list pages with fixed header scrolling */
.admin-list-page {
    height: calc(100vh - 65px); /* Account for navbar height */
    max-height: calc(100vh - 65px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 1rem;
    padding-top: 65px; /* Space for sticky navbar */
    box-sizing: border-box;
}

.admin-list-page > .row {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

.admin-list-page .col-12 {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    flex: 1;
    min-height: 0;
}

/* Fixed filter sections */
.admin-list-page .mb-4 {
    flex-shrink: 0;
    flex-grow: 0;
}

.admin-list-page .card.mb-4 {
    flex-shrink: 0;
    flex-grow: 0;
}

.admin-list-page .card.mb-4 .card-body {
    flex-shrink: 0;
    flex-grow: 0;
}

/* Scrollable table card */
.admin-list-page .card:not(.mb-4) {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

.admin-list-page .card:not(.mb-4) .card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

/* ===========================================
   ADMIN TABLE WRAPPERS
   =========================================== */

/* Users table wrapper with sticky header */
.users-table-wrapper {
    flex: 1;
    overflow-y: auto;
    overflow-x: auto;
    min-height: 0;
}

.users-table-wrapper .table thead th {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: #343a40;
}

/* Teams table wrapper with sticky header */
.teams-table-wrapper {
    flex: 1;
    overflow-y: auto;
    overflow-x: auto;
    min-height: 0;
}

.teams-table-wrapper .table thead th {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: #343a40;
}

/* Prevent body scroll on admin list pages */
.admin-list-page-body {
    overflow: hidden;
}

/* ===========================================
   ROLLOVER WIZARD
   =========================================== */

.rollover-stepper {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0;
    margin: 0 0 2rem 0;
}

.rollover-step {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 2rem;
    background: #f1f3f5;
    color: #6c757d;
    font-size: 0.9rem;
    flex: 1 1 auto;
    min-width: 0;
}

.rollover-step__marker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    background: #ced4da;
    color: #fff;
    font-weight: 600;
    flex-shrink: 0;
}

.rollover-step__marker .material-icons {
    font-size: 1rem;
}

.rollover-step__label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rollover-step--complete {
    background: #d1e7dd;
    color: #0f5132;
}

.rollover-step--complete .rollover-step__marker {
    background: #198754;
}

.rollover-step--current {
    background: #cfe2ff;
    color: #084298;
    font-weight: 600;
}

.rollover-step--current .rollover-step__marker {
    background: #0d6efd;
}

/* Preview tables can be long; keep them scrollable rather than pushing the
   confirm controls off screen. */
.rollover-preview-table {
    max-height: 22rem;
    overflow-y: auto;
    overflow-x: auto;
}

/* The irreversible step is visually distinct from the reversible ones. */
.rollover-danger-panel {
    border: 2px solid #dc3545;
    border-left-width: 6px;
    border-radius: 0.375rem;
    padding: 1rem 1.25rem;
    background: #fff5f5;
    color: #842029;
}

.rollover-confirm-input {
    max-width: 10rem;
}

.rollover-spinner {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

/* Small inline icon used beside account protection help text. */
.protection-icon {
    font-size: 16px;
}

/* Badge marking accounts exempt from the end-of-year purge. */
.badge-protected {
    background-color: #0f5132;
    color: #fff;
}

/* ===========================================
   CLIENT COMMUNICATIONS
   =========================================== */

/* Recipient lists can run long; keep them scrollable rather than pushing the
   send controls off screen. */
.comms-recipients {
    max-height: 24rem;
    overflow-y: auto;
}

.comms-message {
    font-family: inherit;
}

/* The sample is rendered as stored, so newlines matter. */
.comms-sample {
    white-space: pre-wrap;
    word-wrap: break-word;
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 0.375rem;
    margin-bottom: 0;
    font-family: inherit;
    font-size: 0.9rem;
}

/* Confirmation and error pages for client account removal. */
.removal-done-icon {
    font-size: 3rem;
}
