.app-card {
    border: 1px solid rgb(229 231 235);
    border-radius: 0.75rem;
    background: rgb(255 255 255);
    padding: 1rem;
}

.dark .app-card {
    border-color: rgb(55 65 81);
    background: rgb(17 24 39);
}

.app-muted {
    color: rgb(107 114 128);
}

.dark .app-muted {
    color: rgb(156 163 175);
}

.app-title {
    font-size: 1rem;
    font-weight: 600;
    color: rgb(17 24 39);
}

.dark .app-title {
    color: rgb(243 244 246);
}

.app-open-chip {
    border: 1px solid rgb(148 163 184);
    border-radius: 0.5rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgb(51 65 85);
}

.dark .app-open-chip {
    border-color: rgb(75 85 99);
    color: rgb(203 213 225);
}

.app-section-title {
    margin-bottom: 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgb(107 114 128);
}

.dark .app-section-title {
    color: rgb(156 163 175);
}

.app-log-entry.reverted {
    text-decoration: line-through;
    opacity: 0.7;
}

/* Welcome card: name + role (matches Filament account widget rhythm). */
.fi-account-widget-user-name .fi-account-widget-user-role {
    margin-left: 0.35rem;
    font-weight: 500;
    color: rgb(107 114 128);
}

.dark .fi-account-widget-user-name .fi-account-widget-user-role {
    color: rgb(156 163 175);
}

/* Always display status color options as colored buttons. */
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='gray']) label { background: rgb(107 114 128) !important; border-color: rgb(107 114 128) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='slate']) label { background: rgb(100 116 139) !important; border-color: rgb(100 116 139) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='zinc']) label { background: rgb(113 113 122) !important; border-color: rgb(113 113 122) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='red']) label { background: rgb(239 68 68) !important; border-color: rgb(239 68 68) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='orange']) label { background: rgb(249 115 22) !important; border-color: rgb(249 115 22) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='amber']) label { background: rgb(245 158 11) !important; border-color: rgb(245 158 11) !important; color: rgb(17 24 39) !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='yellow']) label { background: rgb(234 179 8) !important; border-color: rgb(234 179 8) !important; color: rgb(17 24 39) !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='lime']) label { background: rgb(132 204 22) !important; border-color: rgb(132 204 22) !important; color: rgb(17 24 39) !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='green']) label { background: rgb(34 197 94) !important; border-color: rgb(34 197 94) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='emerald']) label { background: rgb(16 185 129) !important; border-color: rgb(16 185 129) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='teal']) label { background: rgb(20 184 166) !important; border-color: rgb(20 184 166) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='cyan']) label { background: rgb(6 182 212) !important; border-color: rgb(6 182 212) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='blue']) label { background: rgb(59 130 246) !important; border-color: rgb(59 130 246) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='indigo']) label { background: rgb(99 102 241) !important; border-color: rgb(99 102 241) !important; color: white !important; }
.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input[value='pink']) label { background: rgb(236 72 153) !important; border-color: rgb(236 72 153) !important; color: white !important; }

.status-color-toggle .fi-fo-toggle-buttons-btn-ctn:has(input:checked) label {
    box-shadow: 0 0 0 2px rgb(255 255 255 / 65%) inset, 0 0 0 1px rgb(17 24 39 / 20%);
}

/* Settings page layout tokens (avoid per-page inline styling). */
.settings-page {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.settings-card {
    padding: 1.25rem;
    border-radius: 0.9rem;
}

.settings-card--primary {
    border-color: rgb(251 191 36 / 45%);
    background: rgb(255 251 235);
}

.dark .settings-card--primary {
    border-color: rgb(245 158 11 / 35%);
    background: rgb(120 53 15 / 20%);
}

.settings-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.settings-card-actions {
    margin-top: 0.85rem;
    display: flex;
    justify-content: flex-end;
}

.settings-definition-grid {
    margin-top: 0.75rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem 1.4rem;
}

.settings-definition-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    border-bottom: 1px solid rgb(229 231 235);
    padding-bottom: 0.4rem;
}

.dark .settings-definition-row {
    border-bottom-color: rgb(55 65 81);
}

.settings-definition-row dt {
    font-size: 0.9rem;
    color: rgb(107 114 128);
}

.dark .settings-definition-row dt {
    color: rgb(156 163 175);
}

.settings-definition-row dd {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: rgb(17 24 39);
}

.dark .settings-definition-row dd {
    color: rgb(243 244 246);
}

.settings-items-grid {
    margin-top: 0.9rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.9rem;
}

.settings-item-card {
    border: 1px solid rgb(229 231 235);
    border-radius: 0.75rem;
    background: rgb(249 250 251);
    padding: 0.9rem;
}

.dark .settings-item-card {
    border-color: rgb(55 65 81);
    background: rgb(17 24 39);
}

.settings-item-card-inner {
    min-height: 8rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0.8rem;
}

@media (max-width: 640px) {
    .settings-card-header {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (min-width: 768px) {
    .settings-definition-grid {
        grid-template-columns: 1fr 1fr;
    }

    .settings-items-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 1280px) {
    .settings-items-grid {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

/* Unit Dashboard — same layout system as Settings (filament-app.css). */
.unit-dashboard-page {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.unit-dashboard-metrics {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.unit-dashboard-metric {
    padding: 1.25rem;
    border-radius: 0.9rem;
}

/* Match My Dashboard stats (sentence case, not settings-style uppercase labels). */
.unit-dashboard-stat-heading {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.25rem;
    color: rgb(107 114 128);
}

.dark .unit-dashboard-stat-heading {
    color: rgb(156 163 175);
}

.unit-dashboard-metric-value {
    margin-top: 0.5rem;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    color: rgb(17 24 39);
}

.dark .unit-dashboard-metric-value {
    color: rgb(243 244 246);
}

.unit-dashboard-columns {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

.unit-dashboard-panel {
    padding: 1.25rem;
    border-radius: 0.9rem;
}

.unit-dashboard-panel-title {
    margin-bottom: 0.75rem;
}

.unit-dashboard-toolbar {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.unit-dashboard-week-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.unit-dashboard-week-label {
    margin: 0;
    font-weight: 600;
    color: rgb(17 24 39);
}

.dark .unit-dashboard-week-label {
    color: rgb(243 244 246);
}

.unit-dashboard-nav-button {
    border: 1px solid rgb(209 213 219);
    border-radius: 0.6rem;
    background: rgb(255 255 255);
    padding: 0.28rem 0.65rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: rgb(55 65 81);
}

.unit-dashboard-nav-button--subtle {
    font-weight: 500;
}

.dark .unit-dashboard-nav-button {
    border-color: rgb(75 85 99);
    background: rgb(31 41 55);
    color: rgb(229 231 235);
}

.unit-dashboard-filter-row {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.unit-dashboard-unit-select {
    border: 1px solid rgb(209 213 219);
    border-radius: 0.6rem;
    background: rgb(255 255 255);
    padding: 0.3rem 0.55rem;
    font-size: 0.85rem;
}

.dark .unit-dashboard-unit-select {
    border-color: rgb(75 85 99);
    background: rgb(31 41 55);
    color: rgb(243 244 246);
}

.unit-dashboard-list {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.unit-dashboard-link {
    display: block;
    text-decoration: none;
    border: 1px solid rgb(229 231 235);
    border-radius: 0.75rem;
    background: rgb(249 250 251);
    padding: 0.85rem 1rem;
    color: inherit;
}

.dark .unit-dashboard-link {
    border-color: rgb(55 65 81);
    background: rgb(31 41 55);
}

.unit-dashboard-link:hover {
    border-color: rgb(251 191 36);
    background: rgb(255 251 235);
}

.dark .unit-dashboard-link:hover {
    border-color: rgb(245 158 11 / 50%);
    background: rgb(55 48 33 / 40%);
}

.unit-dashboard-link-title {
    font-size: 0.95rem;
}

.unit-dashboard-link--meeting {
    padding: 0.65rem 0.75rem;
}

.unit-dashboard-link-meta {
    margin-top: 0.25rem;
    font-size: 0.8rem;
}

.unit-dashboard-empty {
    border: 1px dashed rgb(209 213 219);
    border-radius: 0.75rem;
    padding: 1rem;
    font-size: 0.9rem;
    color: rgb(107 114 128);
    background: rgb(249 250 251);
}

.dark .unit-dashboard-empty {
    border-color: rgb(75 85 99);
    color: rgb(156 163 175);
    background: rgb(17 24 39);
}

.unit-dashboard-calendars {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    max-width: 100%;
}

.unit-week-calendar {
    display: grid;
    grid-template-columns: repeat(7, minmax(10rem, 1fr));
    gap: 0.5rem;
    overflow-x: auto;
    max-width: 100%;
}

.unit-week-column {
    border: 1px solid rgb(229 231 235);
    border-radius: 0.75rem;
    background: rgb(249 250 251);
    padding: 0.75rem;
    min-height: 20rem;
}

.unit-dashboard-panel {
    min-width: 0;
    max-width: 100%;
}

.dark .unit-week-column {
    border-color: rgb(55 65 81);
    background: rgb(31 41 55);
}

.unit-week-day-title {
    margin: 0 0 0.5rem;
    font-size: 0.88rem;
    font-weight: 700;
}

.unit-week-day-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.unit-week-item {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.unit-week-item-title {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 600;
}

.unit-week-item-meta,
.unit-week-item-note,
.unit-week-empty {
    margin: 0;
    font-size: 0.77rem;
}

.unit-status-chip {
    width: fit-content;
    border-radius: 9999px;
    padding: 0.1rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 700;
}

.unit-status-chip--gray { background: rgb(107 114 128); color: white; }
.unit-status-chip--slate { background: rgb(100 116 139); color: white; }
.unit-status-chip--zinc { background: rgb(113 113 122); color: white; }
.unit-status-chip--red { background: rgb(239 68 68); color: white; }
.unit-status-chip--orange { background: rgb(249 115 22); color: white; }
.unit-status-chip--amber { background: rgb(245 158 11); color: rgb(17 24 39); }
.unit-status-chip--yellow { background: rgb(234 179 8); color: rgb(17 24 39); }
.unit-status-chip--lime { background: rgb(132 204 22); color: rgb(17 24 39); }
.unit-status-chip--green { background: rgb(34 197 94); color: white; }
.unit-status-chip--emerald { background: rgb(16 185 129); color: white; }
.unit-status-chip--teal { background: rgb(20 184 166); color: white; }
.unit-status-chip--cyan { background: rgb(6 182 212); color: white; }
.unit-status-chip--blue { background: rgb(59 130 246); color: white; }
.unit-status-chip--indigo { background: rgb(99 102 241); color: white; }
.unit-status-chip--pink { background: rgb(236 72 153); color: white; }

@media (min-width: 768px) {
    .unit-dashboard-metrics {
        grid-template-columns: 1fr 1fr;
    }

    .unit-dashboard-calendars {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1279px) {
    .unit-dashboard-calendars {
        grid-template-columns: 1fr;
    }
}

/* Meeting list: allow status/resolution badge popovers to extend past the cell. */
.fi-ta-cell-overflow-visible {
    overflow: visible !important;
}

.um-meeting-badge-picker__trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    max-width: 100%;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.um-meeting-badge-picker__badge {
    max-width: 12rem;
    justify-content: flex-start;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.um-meeting-badge-picker__icon {
    width: 0.72rem;
    height: 0.72rem;
    color: rgb(107 114 128);
}

.dark .um-meeting-badge-picker__icon {
    color: rgb(156 163 175);
}

.um-meeting-badge-picker__panel {
    position: fixed;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 8px;
    border-radius: 10px;
    background: rgb(255 255 255);
    border: 1px solid rgb(229 231 235);
    box-shadow: 0 12px 30px rgb(0 0 0 / 35%);
    max-width: 13rem;
}

.dark .um-meeting-badge-picker__panel {
    background: rgb(17 24 39);
    border-color: rgb(55 65 81);
}

.um-meeting-badge-picker__overlay {
    position: fixed;
    inset: 0;
    z-index: 9998;
}

.um-meeting-badge-picker__caret {
    position: absolute;
    top: -6px;
    left: 1.25rem;
    z-index: 1;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid rgb(255 255 255);
}

.dark .um-meeting-badge-picker__caret {
    border-bottom-color: rgb(17 24 39);
}

.um-meeting-badge-picker__option {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-start;
    border-radius: 0.5rem;
    padding: 0.2rem 0.15rem;
    transition: background-color 120ms ease;
}

.um-meeting-badge-picker__option:hover {
    background-color: rgb(243 244 246);
}

.dark .um-meeting-badge-picker__option:hover {
    background-color: rgb(55 65 81);
}

/* Public home page */
.home-shell {
    min-height: 100vh;
    background: rgb(2 6 23);
    color: rgb(226 232 240);
    font-family: "Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}

.home-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem 1rem 3rem;
}

.home-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgb(30 41 59);
    padding-bottom: 0.85rem;
}

.home-brand {
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: rgb(248 250 252);
}

.home-login-link {
    border: 1px solid rgb(51 65 85);
    border-radius: 0.6rem;
    background: rgb(15 23 42);
    color: rgb(226 232 240);
    padding: 0.5rem 0.9rem;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
}

.home-login-link:hover {
    border-color: rgb(71 85 105);
    background: rgb(30 41 59);
}

.home-hero {
    margin-top: 2.2rem;
    background: rgb(15 23 42);
    border: 1px solid rgb(30 41 59);
    border-radius: 0.85rem;
    padding: 2rem;
}

.home-eyebrow {
    margin: 0 0 0.7rem;
    color: rgb(148 163 184);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}

.home-title {
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -0.02em;
    margin: 0;
    color: rgb(248 250 252);
}

.home-subtitle {
    margin: 1rem 0 0;
    max-width: 50rem;
    color: rgb(148 163 184);
    font-size: 1rem;
    line-height: 1.7;
}

.home-actions {
    margin-top: 1.3rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.home-primary-button {
    border: 1px solid rgb(245 158 11);
    border-radius: 0.7rem;
    background: rgb(245 158 11);
    color: rgb(15 23 42);
    padding: 0.65rem 1rem;
    text-decoration: none;
    font-weight: 700;
    font-size: 0.92rem;
}

.home-primary-button:hover {
    background: rgb(217 119 6);
    border-color: rgb(217 119 6);
    color: rgb(255 255 255);
}

.home-secondary-text {
    font-size: 0.9rem;
    color: rgb(100 116 139);
}