/*
 * SpindlIQ clay design system
 *
 * This file intentionally contains only the visual theme. Layout, responsive
 * behavior and component ownership remain in app.css so the theme can evolve
 * without coupling visual decisions to business UI behavior.
 */

.theme-clay {
    color-scheme: light;
    --bg: #e9edec;
    --bg-soft: #e2e7e6;
    --bg-panel: #f4f6f4;
    --bg-panel-strong: #fafbf9;
    --bg-tint: #e4e9e9;
    --navy: #17344c;
    --navy-soft: #3f5b70;
    --text: #1b3549;
    --text-soft: #586f7f;
    --line: rgba(50, 85, 104, 0.14);
    --line-strong: rgba(45, 81, 101, 0.24);
    --accent: #3976b8;
    --accent-strong: #255a93;
    --accent-soft: #d8e5f0;
    --teal: #2e7f7c;
    --good: #21876d;
    --warn: #ad751f;
    --danger: #c95162;
    --clay-canvas: #e9edec;
    --clay-surface: #f4f6f4;
    --clay-surface-high: #fafbf9;
    --clay-surface-low: #e2e7e6;
    --clay-blue: #3976b8;
    --clay-blue-deep: #255a93;
    --clay-blue-soft: #d8e5f0;
    --clay-mint: #d8e7e2;
    --clay-mint-deep: #2e7f7c;
    --clay-peach: #e7d8cd;
    --clay-peach-deep: #9a624a;
    --clay-sun: #ede3c1;
    --clay-ink: #17344c;
    --clay-muted: #586f7f;
    --clay-outline: rgba(48, 73, 86, 0.16);
    --clay-highlight: rgba(255, 255, 255, 0.82);
    --clay-shadow-color: rgba(46, 67, 78, 0.15);
    --clay-shadow-sm:
        0 3px 9px rgba(46, 67, 78, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        inset 0 -2px 4px rgba(55, 78, 89, 0.05);
    --clay-shadow-md:
        0 10px 24px rgba(43, 63, 74, 0.12),
        inset 0 2px 1px rgba(255, 255, 255, 0.82),
        inset 0 -4px 9px rgba(55, 78, 89, 0.055);
    --clay-shadow-lg:
        0 18px 42px rgba(39, 59, 69, 0.16),
        inset 0 2px 1px rgba(255, 255, 255, 0.85),
        inset 0 -5px 12px rgba(55, 78, 89, 0.065);
    --clay-shadow-inset:
        inset 2px 3px 7px rgba(55, 78, 89, 0.11),
        inset -2px -2px 5px rgba(255, 255, 255, 0.78);
    --clay-shadow-pressed:
        inset 3px 4px 8px rgba(35, 63, 82, 0.22),
        inset -2px -2px 4px rgba(255, 255, 255, 0.22);
    --shadow-xl: var(--clay-shadow-lg);
    --shadow-lg: var(--clay-shadow-md);
    --shadow-md: var(--clay-shadow-sm);
    --radius-xl: 1.25rem;
    --radius-lg: 0.9rem;
    --radius-md: 0.65rem;
    min-height: 100%;
    font-family: Aptos, "Segoe UI Variable Text", "Trebuchet MS", sans-serif;
    color: var(--clay-ink);
    background: linear-gradient(180deg, #eef1ef 0%, #e6ebea 100%);
    background-attachment: fixed;
}

body.theme-clay::before {
    background:
        linear-gradient(rgba(40, 67, 82, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(40, 67, 82, 0.025) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.22), transparent 88%);
    opacity: 0.6;
}

body.theme-clay::after {
    content: none;
}

.theme-clay :is(h1, h2, h3, .entry-benefit-copy h1) {
    font-family: "Aptos Display", "Segoe UI Variable Display", "Trebuchet MS", sans-serif;
    color: var(--clay-ink);
    letter-spacing: -0.025em;
}

.theme-clay h1 {
    font-weight: 700;
    text-wrap: balance;
}

.theme-clay h2,
.theme-clay h3 {
    font-weight: 680;
}

.theme-clay a {
    color: var(--clay-blue-deep);
}

.theme-clay :is(button, a, input, select, textarea):focus-visible {
    outline: 3px solid rgba(39, 95, 200, 0.35);
    outline-offset: 3px;
}

/* Application canvas and navigation */

.theme-clay :is(.app-shell, .superadmin-shell, .entry-shell) {
    background: transparent;
}

.theme-clay :is(.app-shell-main, .superadmin-main) {
    position: relative;
}

.theme-clay :is(.app-nav-shell, .superadmin-topbar, .entry-utility-bar) {
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    background: linear-gradient(100deg, #2d5e9b 0%, #245681 58%, #216b78 100%);
    box-shadow:
        0 8px 20px rgba(32, 55, 70, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        inset 0 -3px 8px rgba(12, 39, 65, 0.14);
}

.theme-clay .app-nav-shell {
    border-radius: 0 0 1rem 1rem;
}

.theme-clay .superadmin-topbar,
.theme-clay .entry-utility-bar {
    border-radius: 0 0 0.85rem 0.85rem;
}

.theme-clay :is(.app-nav-mobile-toggle, .superadmin-mobile-toggle) {
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 0.7rem;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.08));
    box-shadow:
        0 4px 10px rgba(10, 38, 78, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.26),
        inset 0 -2px 5px rgba(7, 31, 72, 0.12);
}

.theme-clay :is(.app-nav-mobile-toggle, .superadmin-mobile-toggle):active {
    transform: translateY(1px);
    box-shadow: inset 4px 5px 9px rgba(8, 34, 76, 0.28);
}

.theme-clay .app-nav-links .menu-link,
.theme-clay .superadmin-nav .menu-link {
    border: 1px solid transparent;
    border-radius: 0.65rem;
    color: rgba(246, 251, 255, 0.86);
    transition: transform 160ms ease, color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.theme-clay .app-nav-links .menu-link:hover,
.theme-clay .app-nav-links .menu-link.active,
.theme-clay .superadmin-nav .menu-link:hover,
.theme-clay .superadmin-nav .menu-link.active {
    color: #17344c;
    border-color: rgba(255, 255, 255, 0.48);
    background: linear-gradient(145deg, #f9fcf8, #dce8ec);
    box-shadow:
        0 3px 8px rgba(10, 37, 77, 0.17),
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -2px 4px rgba(61, 88, 102, 0.08);
    transform: translateY(-1px);
}

.theme-clay .app-nav-links .menu-link.active::after {
    border-radius: 999px;
    background: var(--clay-blue);
    box-shadow:
        0 2px 5px rgba(21, 68, 108, 0.22),
        inset 1px 1px 1px rgba(255, 255, 255, 0.75);
}

.theme-clay .app-nav-links .menu-link:hover .menu-link-icon,
.theme-clay .app-nav-links .menu-link.active .menu-link-icon,
.theme-clay .superadmin-nav .menu-link:hover .menu-link-icon,
.theme-clay .superadmin-nav .menu-link.active .menu-link-icon {
    color: var(--clay-blue-deep);
    background: var(--clay-blue-soft);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .app-nav-search.topbar-search {
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 0.75rem;
    background: rgba(234, 243, 246, 0.93);
    box-shadow:
        inset 2px 3px 7px rgba(8, 42, 76, 0.15),
        inset -2px -2px 5px rgba(255, 255, 255, 0.6),
        0 3px 0 rgba(255, 255, 255, 0.08);
}

.theme-clay .app-nav-shell .topbar-search.app-nav-search:focus-within {
    border-color: rgba(255, 255, 255, 0.72);
    background: #f8fbfa;
    box-shadow:
        inset 3px 4px 8px rgba(37, 74, 97, 0.13),
        inset -3px -3px 6px rgba(255, 255, 255, 0.85),
        0 0 0 4px rgba(200, 238, 226, 0.25);
}

.theme-clay .app-nav-shell .topbar-search.app-nav-search :is(.topbar-search-input, .topbar-search-icon) {
    color: var(--clay-ink);
}

.theme-clay .app-nav-shell .topbar-search.app-nav-search .topbar-search-input::placeholder {
    color: #718394;
}

.theme-clay .app-nav-shell .topbar-bell-button.app-nav-notification-button,
.theme-clay .app-nav-profile-trigger {
    border-color: rgba(255, 255, 255, 0.22);
    border-radius: 0.7rem;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.21), rgba(255, 255, 255, 0.08));
    box-shadow:
        0 4px 10px rgba(9, 36, 74, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        inset 0 -2px 5px rgba(7, 32, 71, 0.12);
}

.theme-clay :is(.app-nav-role-pill, .app-nav-profile-role, .topbar-bell-count) {
    border-radius: 999px;
    box-shadow:
        3px 4px 8px rgba(7, 31, 67, 0.2),
        inset 1px 1px 1px rgba(255, 255, 255, 0.34);
}

.theme-clay :is(.app-nav-profile-dropdown, .notification-drawer) {
    border: 1px solid rgba(65, 94, 108, 0.14);
    border-radius: 0.9rem;
    background: linear-gradient(155deg, #f9faf8, #edf1ef);
    box-shadow: var(--clay-shadow-lg);
    backdrop-filter: none;
}

/* Core clay surfaces */

.theme-clay :is(
    .glass-card,
    .module-card,
    .menu-role-group,
    .topbar,
    .entry-header,
    .entry-role-card,
    .entry-stat-card,
    .faq-item,
    .order-card,
    .recommendation-card,
    .scanner-card,
    .public-request-card,
    .public-inquiry-form-card,
    .dashboard-table-card,
    .resource-workspace-panel,
    .resource-contact-card,
    .resource-rule-card,
    .resource-form-card,
    .scheduler-control-card,
    .scheduler-day-shell,
    .scheduler-footer-panel,
    .entry-auth-layout,
    .entry-auth-card,
    .entry-secondary-shell,
    .entry-hint-card
) {
    border: 1px solid var(--clay-outline);
    border-radius: var(--radius-xl);
    background: linear-gradient(155deg, #f8f9f7, #eef1ef);
    box-shadow: var(--clay-shadow-md);
    backdrop-filter: none;
}

.theme-clay :is(.glass-card, .module-card, .entry-role-card, .resource-card, .public-item-card) {
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.theme-clay :is(.module-card-link, .entry-role-card, .resource-card, .public-item-card):hover {
    border-color: rgba(39, 95, 200, 0.22);
    box-shadow: var(--clay-shadow-md);
    transform: translateY(-1px);
}

.theme-clay .glass-card > .mini-card,
.theme-clay .glass-card > .drawer-section,
.theme-clay .review-modal-section > .mini-card,
.theme-clay .side-drawer .mini-card {
    border: 1px solid rgba(65, 94, 108, 0.1);
    border-radius: var(--radius-lg);
    background: #eef2f0;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -2px 5px rgba(55, 78, 89, 0.05);
}

.theme-clay .mini-card {
    padding: 0.9rem 1rem;
    border-top: 0;
}

.theme-clay :is(.list-card, .operation-card) {
    margin-block: 0.45rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(65, 94, 108, 0.1);
    border-radius: var(--radius-lg);
    background: rgba(246, 248, 246, 0.78);
    box-shadow:
        0 2px 6px rgba(61, 89, 101, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.75),
        inset 0 -2px 4px rgba(79, 105, 116, 0.04);
}

.theme-clay :is(.list-card, .operation-card):first-of-type {
    padding-top: 0.9rem;
    border-top: 1px solid rgba(65, 94, 108, 0.1);
}

.theme-clay .kpi-card {
    position: relative;
    overflow: hidden;
}

.theme-clay .kpi-card::before {
    content: none;
}

.theme-clay .kpi-card > * {
    position: relative;
}

.theme-clay :is(.topbar-card, .metrics-pair div, .public-item-spec-card, .resource-detail-section, .drawer-section) {
    border: 1px solid rgba(65, 94, 108, 0.11);
    border-radius: var(--radius-lg);
    background: #f1f4f2;
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .topbar-card::after {
    height: 0.22rem;
    border-radius: 999px;
    background: var(--clay-blue);
    box-shadow: inset 1px 1px 2px rgba(255, 255, 255, 0.7);
    opacity: 0.62;
}

.theme-clay :is(.menu-role-icon, .entry-role-badge, .entry-role-option-icon) {
    border-radius: 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow:
        0 3px 8px rgba(39, 79, 111, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.3),
        inset 0 -2px 5px rgba(22, 72, 115, 0.1);
}

.theme-clay :is(.resource-type-icon, .resource-inline-icon, .feedback-icon) {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.theme-clay .resource-type-icon {
    width: 1.75rem;
    height: 1.75rem;
}

.theme-clay .resource-type-icon-large {
    width: 2rem;
    height: 2rem;
}

.theme-clay .feedback-icon {
    width: 1.35rem;
    height: 1.35rem;
}

.theme-clay .menu-link {
    border-radius: 0.65rem;
}

.theme-clay .menu-link-icon {
    border-radius: 0.72rem;
}

/* Buttons and interactive controls */

.theme-clay :is(.action-button, .ghost-button, .filter-pill, .review-comment-trigger, .upload-action-button) {
    border-radius: 0.65rem;
    font-weight: 750;
    letter-spacing: 0.01em;
    transition: transform 150ms ease, box-shadow 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

.theme-clay :is(.action-button, .upload-action-button) {
    border: 1px solid rgba(25, 73, 161, 0.42);
    color: #fff;
    background: linear-gradient(180deg, #326fae, #275b91);
    box-shadow:
        0 5px 12px rgba(31, 77, 119, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        inset 0 -3px 6px rgba(18, 54, 89, 0.18);
    text-shadow: 0 1px 2px rgba(14, 44, 91, 0.25);
}

.theme-clay :is(.ghost-button, .filter-pill, .review-comment-trigger) {
    border: 1px solid rgba(55, 87, 105, 0.14);
    color: var(--clay-ink);
    background: linear-gradient(180deg, #f8f9f7, #edf1ef);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay :is(.action-button, .ghost-button, .filter-pill, .review-comment-trigger, .upload-action-button):hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay :is(.action-button, .ghost-button, .filter-pill, .review-comment-trigger, .upload-action-button):active:not(:disabled) {
    transform: translateY(1px);
    box-shadow: var(--clay-shadow-pressed);
}

.theme-clay :is(.filter-pill-active, .segmented-selector-button-active, .table-row-count-button-active, .entry-role-option-active) {
    border-color: rgba(37, 90, 147, 0.25);
    color: #173b5a;
    background: linear-gradient(180deg, #e2ebf3, #cfdee9);
    box-shadow:
        0 3px 8px rgba(37, 90, 147, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.66),
        inset 0 -2px 5px rgba(37, 90, 147, 0.08);
    text-shadow: none;
}

.theme-clay .action-button:disabled,
.theme-clay .ghost-button:disabled {
    opacity: 0.52;
    filter: saturate(0.5);
    box-shadow: none;
}

.theme-clay :is(.icon-button, .help-trigger-button, .notification-close-button, .app-toast-close, .drawer-edit-icon-button, .notification-dismiss-button) {
    border-radius: 0.9rem;
}

.theme-clay .icon-button-guided {
    background: linear-gradient(110deg, #f8faf8 0%, #e0eaf2 42%, #d7e6e2 58%, #f8faf8 100%);
    background-size: 220% 100%;
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay :is(.field-input, .text-area, .topbar-search, input[type="file"]) {
    border: 1px solid rgba(50, 85, 104, 0.15);
    border-radius: 0.65rem;
    color: var(--clay-ink);
    background: #eef4f3;
    box-shadow: var(--clay-shadow-inset);
    transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}

.theme-clay :is(.field-input, .text-area):hover:not(:disabled) {
    border-color: rgba(39, 95, 200, 0.24);
    background: #f3f7f5;
}

.theme-clay :is(.field-input, .text-area):focus {
    border-color: rgba(39, 95, 200, 0.5);
    outline: 0;
    background: #fbfcf9;
    box-shadow:
        inset 3px 4px 8px rgba(72, 100, 112, 0.1),
        inset -3px -3px 7px rgba(255, 255, 255, 0.9),
        0 0 0 4px rgba(75, 141, 246, 0.14);
}

.theme-clay :is(.field-input, .text-area):disabled {
    color: #758895;
    background: #e2e9e8;
    box-shadow: inset 3px 4px 8px rgba(72, 100, 112, 0.08);
}

.theme-clay :is(.segmented-selector, .table-row-count-selector) {
    padding: 0.35rem;
    border: 1px solid rgba(50, 85, 104, 0.12);
    border-radius: 0.8rem;
    background: #e2ebeb;
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay :is(.segmented-selector-button, .table-row-count-button) {
    border: 1px solid transparent;
    border-radius: 0.52rem;
    background: transparent;
    box-shadow: none;
}

.theme-clay :is(.segmented-selector-button, .table-row-count-button):hover {
    border-color: rgba(50, 85, 104, 0.1);
    background: rgba(255, 255, 255, 0.58);
    box-shadow: 3px 4px 8px rgba(61, 89, 101, 0.1);
}

.theme-clay :is(.segmented-selector-button-active, .table-row-count-button-active) {
    border-color: rgba(255, 255, 255, 0.58);
}

.theme-clay .toggle-chip {
    border-radius: 999px;
    border-color: rgba(50, 85, 104, 0.14);
    background: linear-gradient(180deg, #f6f8f6, #e5eae8);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .toggle-chip:has(input:checked) {
    border-color: rgba(33, 135, 109, 0.26);
    background: linear-gradient(180deg, #dfece7, #c9ded7);
    box-shadow:
        0 3px 8px rgba(33, 110, 96, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        inset 0 -2px 5px rgba(33, 110, 96, 0.08);
}

.theme-clay .upload-dropzone {
    border: 2px dashed rgba(39, 95, 200, 0.28);
    border-radius: var(--radius-lg);
    background: linear-gradient(180deg, #f3f6f4, #e4e9e8);
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay .upload-dropzone-dragover {
    border-color: var(--clay-blue);
    background: linear-gradient(180deg, #e9f0f5, #d9e5e7);
    box-shadow:
        inset 5px 6px 12px rgba(39, 95, 200, 0.11),
        0 0 0 5px rgba(75, 141, 246, 0.1);
}

.theme-clay :is(.help-inline-box, .inline-entry-panel, .score-reason-box) {
    border: 1px solid rgba(39, 95, 200, 0.14);
    border-radius: var(--radius-lg);
    background: linear-gradient(180deg, #eef3f6, #e1e9eb);
    box-shadow: var(--clay-shadow-inset);
}

/* Data tables and dense workspaces */

.theme-clay .table-shell {
    padding: 0.35rem 0.45rem 0.5rem;
    border: 1px solid rgba(50, 85, 104, 0.12);
    border-radius: var(--radius-xl);
    background: #e5eae9;
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay .data-table {
    border-collapse: separate;
    border-spacing: 0 0.25rem;
}

.theme-clay .data-table thead th {
    padding: 0.7rem 0.9rem 0.45rem;
    border: 0;
    color: #526b7a;
    background: transparent;
    letter-spacing: 0.105em;
}

.theme-clay .data-table tbody td {
    padding: 0.82rem 0.9rem;
    border-top: 1px solid rgba(255, 255, 255, 0.7);
    border-bottom: 1px solid rgba(56, 88, 105, 0.09);
    background: rgba(249, 250, 248, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.theme-clay .data-table tbody td:first-child {
    border-left: 1px solid rgba(56, 88, 105, 0.08);
    border-radius: 0.55rem 0 0 0.55rem;
}

.theme-clay .data-table tbody td:last-child {
    border-right: 1px solid rgba(56, 88, 105, 0.08);
    border-radius: 0 0.55rem 0.55rem 0;
}

.theme-clay .data-table tbody tr:hover td {
    border-color: rgba(39, 95, 200, 0.16);
    background: #eaf1f5;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.theme-clay :is(.workflow-table-row-selected, .workflow-table-row-current, .dashboard-row-current) td {
    background: #dfeaf2;
}

.theme-clay :is(.workflow-table-row-completed, .dashboard-row-completed) td {
    color: #607482;
    background: #e2e7e5;
}

.theme-clay .table-empty-state {
    border-radius: var(--radius-lg);
    background: var(--clay-surface-low);
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay .table-inline-actions :is(.ghost-button, .action-button, a) {
    border-radius: 0.82rem;
    box-shadow:
        0 2px 6px rgba(61, 89, 101, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        inset 0 -2px 4px rgba(61, 89, 101, 0.05);
}

.theme-clay .superadmin-customer-table {
    width: max-content;
    min-width: 116rem;
    table-layout: auto;
}

.theme-clay .superadmin-customer-table thead th {
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

.theme-clay .superadmin-customer-table :is(th, td):nth-child(1) { width: 9rem; }
.theme-clay .superadmin-customer-table :is(th, td):nth-child(3) { width: 12rem; }
.theme-clay .superadmin-customer-table :is(th, td):nth-child(6) { width: 13rem; }
.theme-clay .superadmin-customer-table :is(th, td):nth-child(7) { width: 11rem; }
.theme-clay .superadmin-customer-table :is(th, td):nth-child(10) { width: 14rem; }
.theme-clay .superadmin-customer-table :is(th, td):nth-child(13) { width: 22rem; }

.theme-clay .superadmin-customer-actions {
    min-width: 20rem;
    flex-wrap: wrap;
    overflow: visible;
}

.theme-clay .superadmin-customer-actions :is(.ghost-button, .action-button) {
    max-width: 100%;
}

.theme-clay :is(.kpi-chart-bar, .progress-track span, .scheduler-utilization-bar span) {
    border-radius: 999px 999px 0.75rem 0.75rem;
    box-shadow:
        4px 6px 10px rgba(39, 95, 200, 0.2),
        inset 2px 2px 2px rgba(255, 255, 255, 0.42),
        inset -3px -4px 6px rgba(26, 78, 152, 0.16);
}

.theme-clay :is(.progress-track, .scheduler-utilization-bar) {
    border-radius: 999px;
    background: #dce7e7;
    box-shadow: var(--clay-shadow-inset);
}

/* Status, notices and feedback */

.theme-clay .status-pill {
    border-radius: 999px;
    border-color: rgba(50, 85, 104, 0.12);
    box-shadow:
        0 2px 5px rgba(61, 89, 101, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.68),
        inset 0 -2px 4px rgba(61, 89, 101, 0.045);
}

.theme-clay .status-pill::before {
    background: transparent;
    box-shadow: none;
}

.theme-clay :is(.feedback-banner, .app-toast, .notification-feed-item, .notification-workflow-card) {
    border-radius: var(--radius-lg);
    background: linear-gradient(145deg, #fafcf8, #e4edec);
    box-shadow: var(--clay-shadow-sm);
    backdrop-filter: none;
}

.theme-clay .notification-sent-strip {
    border-radius: var(--radius-lg);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .feedback-good,
.theme-clay .app-toast-success {
    border-color: rgba(33, 135, 109, 0.25);
    background: linear-gradient(145deg, #e9f8f1, #cbe9df);
}

.theme-clay .app-toast-warning {
    border-color: rgba(177, 117, 20, 0.28);
    background: linear-gradient(145deg, #fff8e8, #f1e0b6);
}

.theme-clay .feedback-warn,
.theme-clay .app-toast-error {
    border-color: rgba(201, 81, 98, 0.23);
    background: linear-gradient(145deg, #fff1ed, #f3d4d5);
}

.theme-clay .notification-feed-item-important {
    background: linear-gradient(145deg, #fff8e8, #f1e0b6);
}

.theme-clay .notification-feed-item-question {
    background: linear-gradient(145deg, #ebf4ff, #d1e2f5);
}

.theme-clay .notification-feed-item-incident {
    background: linear-gradient(145deg, #fff0ee, #f1d2d3);
}

.theme-clay .notification-feed-avatar,
.theme-clay .notification-sent-strip-avatar {
    border-radius: 1rem;
    box-shadow: var(--clay-shadow-sm);
}

/* Modals, drawers and floating layers */

.theme-clay :is(.drawer-overlay, .review-modal-shell, .review-comment-overlay) {
    background: rgba(28, 50, 65, 0.3);
    backdrop-filter: blur(6px) saturate(0.8);
    -webkit-backdrop-filter: blur(6px) saturate(0.8);
}

.theme-clay :is(
    .side-drawer,
    .review-modal-card,
    .review-modal-card-wide,
    .review-modal-sidecard,
    .review-comment-modal-card,
    .resource-detail-modal-card
) {
    border: 1px solid rgba(65, 94, 108, 0.16);
    border-radius: 1.25rem;
    background: linear-gradient(155deg, #fafbf9, #edf1ef);
    box-shadow: var(--clay-shadow-lg);
}

.theme-clay .side-drawer {
    margin: 0.5rem;
    height: calc(100vh - 1rem);
    border-left: 1px solid rgba(65, 94, 108, 0.16);
}

.theme-clay :is(.review-modal-section, .drawer-section, .review-executive-decision-panel, .review-side-decision-panel) {
    border-radius: var(--radius-lg);
}

.theme-clay :is(.review-executive-decision-panel, .review-side-decision-panel) {
    border: 1px solid rgba(174, 117, 31, 0.2);
    border-top: 5px solid #e6b84d;
    background: linear-gradient(180deg, #f8f4e9, #ece4ce);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .review-comment-panel {
    border-radius: var(--radius-lg);
    background: linear-gradient(155deg, #fafbf9, #edf1ef);
    box-shadow: var(--clay-shadow-md);
}

/* Entry, authentication and public-facing screens */

.theme-clay :is(.entry-shell-app, .entry-shell-auth) {
    background: linear-gradient(180deg, #eef1ef 0%, #e5eae9 100%);
}

.theme-clay :is(.entry-backdrop-left, .entry-backdrop-right) {
    display: none;
}

.theme-clay .entry-frame {
    position: relative;
}

.theme-clay .entry-benefit-copy h1 {
    max-width: 26ch;
    font-size: clamp(2rem, 2.5vw, 2.5rem);
    line-height: 1.08;
}

.theme-clay .entry-logo-shell {
    border-radius: 1.25rem;
    background: linear-gradient(155deg, #f9faf8, #edf1ef);
    box-shadow: var(--clay-shadow-lg);
}

.theme-clay .entry-role-card {
    overflow: hidden;
}

.theme-clay .entry-role-card-active {
    border-color: rgba(39, 95, 200, 0.3);
    background: linear-gradient(180deg, #f4f7f9, #e1eaf0);
    box-shadow: var(--clay-shadow-md);
}

.theme-clay .entry-auth-card {
    border-color: rgba(48, 73, 86, 0.12);
    background: #f5f7f5;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.84),
        inset 0 -3px 7px rgba(55, 78, 89, 0.045);
}

.theme-clay .entry-secondary-shell {
    border-color: rgba(48, 73, 86, 0.12);
    background: #e9eeec;
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay .entry-hint-card {
    border-color: rgba(48, 73, 86, 0.11);
    border-left: 3px solid rgba(57, 118, 184, 0.58);
    border-radius: 0.7rem;
    background: #f6f7f4;
    box-shadow:
        0 2px 6px rgba(46, 67, 78, 0.07),
        inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.theme-clay .entry-shell-auth .entry-stat-card {
    border: 1px solid rgba(65, 94, 108, 0.12);
    border-left: 0;
    background: linear-gradient(180deg, #f5f7f5, #eaeeec);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .entry-role-option {
    border-radius: 0.75rem;
    background: linear-gradient(180deg, #f7f8f6, #ecefed);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .entry-role-option:hover,
.theme-clay .entry-role-option:focus-visible {
    background: linear-gradient(180deg, #f1f5f8, #dfe8ed);
}

.theme-clay .entry-site-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 1.25rem 1.25rem 0 0;
    background: linear-gradient(100deg, #2a5b92, #214f70);
    box-shadow:
        0 -6px 18px rgba(45, 76, 93, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

/* Domain-specific workspaces */

.theme-clay .resource-card {
    border-radius: var(--radius-xl);
    background: linear-gradient(155deg, #f8f9f7, #edf1ef);
    box-shadow: var(--clay-shadow-md);
}

.theme-clay .resource-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
}

.theme-clay .resource-card-expanded {
    border-color: rgba(39, 95, 200, 0.24);
    box-shadow: var(--clay-shadow-lg);
}

.theme-clay :is(.resource-card-load, .resource-inline-indicator, .resource-workspace-badges > *, .resource-workspace-meta > *) {
    border-radius: 999px;
}

.theme-clay :is(.scheduler-kpi-card, .scheduler-sidebar-card, .scheduler-risk-card) {
    border: 1px solid rgba(65, 94, 108, 0.11);
    border-radius: var(--radius-lg);
    background: linear-gradient(180deg, #f6f8f6, #e9edeb);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .scheduler-sidebar-card:hover,
.theme-clay .scheduler-sidebar-card:focus-visible {
    border-color: rgba(39, 95, 200, 0.2);
    box-shadow: var(--clay-shadow-md);
    transform: translateY(-1px);
}

.theme-clay .scheduler-board {
    border: 1px solid rgba(65, 94, 108, 0.12);
    border-radius: var(--radius-lg);
    background: #e3ecec;
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay .scheduler-board-block {
    border-radius: 0.65rem;
    box-shadow:
        0 4px 10px rgba(42, 75, 96, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.38),
        inset 0 -2px 5px rgba(35, 73, 105, 0.1);
}

.theme-clay .scheduler-board-block:active,
.theme-clay .scheduler-board-block-dragging {
    box-shadow: var(--clay-shadow-pressed);
}

.theme-clay :is(.worksheet-route-card, .checklist-card, .public-item-card, .photo-card, .scanner-stage, .drawing-preview-frame) {
    border-radius: var(--radius-lg);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay :is(.scanner-stage, .drawing-preview-frame, .worksheet-drawing-frame) {
    border-color: rgba(50, 85, 104, 0.14);
    background: #dfe9e9;
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay .faq-item summary {
    border-radius: var(--radius-lg);
}

.theme-clay .faq-item[open] summary {
    background: linear-gradient(180deg, #edf2f5, #dde7eb);
    box-shadow: var(--clay-shadow-inset);
}

.theme-clay .recommendation-tree-node {
    border-radius: var(--radius-lg);
    box-shadow: var(--clay-shadow-sm);
}

.theme-clay .recommendation-checkpoint-circle,
.theme-clay .checkpoint-marker,
.theme-clay .score-badge {
    box-shadow:
        5px 7px 12px rgba(55, 83, 98, 0.16),
        inset 2px 2px 2px rgba(255, 255, 255, 0.52),
        inset -3px -4px 7px rgba(55, 83, 98, 0.09);
}

.theme-clay .workflow-accent-card-warning {
    border-color: rgba(174, 117, 31, 0.2);
    background: linear-gradient(180deg, #faf7ef, #eee5cd);
}

.theme-clay .workflow-accent-card-info {
    border-color: rgba(39, 95, 200, 0.2);
    background: linear-gradient(180deg, #f0f4f7, #dce7ed);
}

.theme-clay .workflow-accent-card-success {
    border-color: rgba(33, 135, 109, 0.22);
    background: linear-gradient(180deg, #eef5f2, #d9e8e2);
}

/* Compact surfaces keep data-heavy screens usable. */

@media (max-width: 1440px) {
    .theme-clay :is(.app-nav-mobile-panel, .superadmin-mobile-panel) {
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 0 0 1rem 1rem;
        background: linear-gradient(100deg, #2a5b92, #214f70);
        box-shadow:
            0 10px 22px rgba(30, 56, 76, 0.2),
            inset 0 1px 0 rgba(255, 255, 255, 0.12),
            inset 0 -3px 7px rgba(8, 35, 70, 0.12);
    }
}

@media (max-width: 1180px) {
    .theme-clay .table-shell {
        overflow: visible;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .theme-clay .superadmin-customer-table {
        width: 100%;
        min-width: 0;
    }

    .theme-clay .superadmin-customer-actions {
        min-width: 0;
    }

    .theme-clay .data-table tbody tr {
        border: 1px solid rgba(50, 85, 104, 0.1);
        border-radius: 0.8rem;
        background: linear-gradient(180deg, #f7f8f6, #ecefed);
        box-shadow: var(--clay-shadow-sm);
        overflow: hidden;
    }

    .theme-clay .data-table tbody td,
    .theme-clay .data-table tbody td:first-child,
    .theme-clay .data-table tbody td:last-child {
        border: 0;
        border-bottom: 1px solid rgba(50, 85, 104, 0.08);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .theme-clay .data-table tbody td:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 760px) {
    .theme-clay {
        --radius-xl: 1.05rem;
        --radius-lg: 0.8rem;
        --radius-md: 0.6rem;
        --clay-shadow-md:
            0 7px 17px rgba(46, 67, 78, 0.11),
            inset 0 1px 0 rgba(255, 255, 255, 0.78),
            inset 0 -3px 7px rgba(55, 78, 89, 0.05);
    }

    .theme-clay main,
    .theme-clay .superadmin-main {
        padding-inline: 0.8rem;
    }

    .theme-clay :is(.glass-card, .superadmin-summary-card, .superadmin-form-card, .superadmin-table-card) {
        padding: 1rem;
    }

    .theme-clay .table-shell {
        padding: 0.35rem;
    }

    .theme-clay .superadmin-customer-table {
        width: 100%;
        min-width: 0;
    }

    .theme-clay .superadmin-customer-actions {
        min-width: 0;
    }

    .theme-clay .data-table tbody tr {
        border: 1px solid rgba(50, 85, 104, 0.1);
        border-radius: 0.8rem;
        background: linear-gradient(180deg, #f7f8f6, #ecefed);
        box-shadow: var(--clay-shadow-sm);
        overflow: hidden;
    }

    .theme-clay .data-table tbody td,
    .theme-clay .data-table tbody td:first-child,
    .theme-clay .data-table tbody td:last-child {
        border: 0;
        border-bottom: 1px solid rgba(50, 85, 104, 0.08);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .theme-clay .data-table tbody td:last-child {
        border-bottom: 0;
    }

    .theme-clay .side-drawer {
        inset: 0;
        width: 100vw;
        height: 100dvh;
        margin: 0;
        border-radius: 0;
    }

    .theme-clay :is(.review-modal-card, .review-modal-card-wide, .review-comment-modal-card) {
        border-radius: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .theme-clay *,
    .theme-clay *::before,
    .theme-clay *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

@media (forced-colors: active) {
    .theme-clay :is(
        .glass-card,
        .action-button,
        .ghost-button,
        .field-input,
        .text-area,
        .table-shell,
        .status-pill
    ) {
        border: 1px solid CanvasText;
        box-shadow: none;
    }
}