/* ==========================================
   Faciliter Shared Theme Tokens
   Single source of truth for application and public palette
   ========================================== */

:root {
    /* Core brand palette */
    --theme-primary: #1e40af;
    --theme-primary-hover: #1d4ed8;
    --theme-accent: #3b82f6;
    --theme-accent-soft: #06b6d4;
    --theme-secondary: #0f172a;

    /* Surfaces */
    --theme-bg: #f4f7fb;
    --theme-bg-soft: #eff6ff;
    --theme-surface: #ffffff;
    --theme-surface-muted: #f8fafc;
    --theme-surface-elevated: #eef4fb;

    /* Borders and text */
    --theme-border: #d8e1ee;
    --theme-border-strong: #bfd0ea;
    --theme-text: #0f172a;
    --theme-text-muted: #475569;
    --theme-text-soft: #64748b;
    --theme-text-faint: #94a3b8;
    --theme-text-inverse: #ffffff;

    /* Status */
    --theme-success: #16a34a;
    --theme-success-soft: rgba(22, 163, 74, 0.1);
    --theme-warning: #f59e0b;
    --theme-warning-soft: #fffbeb;
    --theme-danger: #ef4444;
    --theme-danger-strong: #dc2626;
    --theme-danger-soft: #fef2f2;
    --theme-info: var(--theme-primary);
    --theme-info-soft: rgba(30, 64, 175, 0.08);

    /* Shadows and overlays */
    --theme-shadow-soft: 0 10px 30px -20px rgba(15, 23, 42, 0.35);
    --theme-shadow-card: 0 14px 28px -24px rgba(15, 23, 42, 0.45);
    --theme-shadow-elevated: 0 20px 40px -24px rgba(15, 23, 42, 0.5);
    --theme-overlay: rgba(15, 23, 42, 0.5);

    /* Shared transition */
    --theme-transition: 0.15s ease;

    /* Tailwind token bridge */
    --color-primary-100: 239 246 255;
    --color-primary-200: 219 234 254;
    --color-primary-300: 147 197 253;
    --color-primary-400: 96 165 250;
    --color-primary-500: 59 130 246;
    --color-primary-600: 30 64 175;
    --color-primary-700: 29 78 216;
    --color-primary-800: 30 41 59;
    --color-primary-900: 15 23 42;

    /* Backward-compatible aliases */
    --primary-color: var(--theme-primary);
    --secondary-color: var(--theme-secondary);
    --portal-navy: var(--theme-secondary);
    --portal-royal: var(--theme-primary);
    --portal-blue: var(--theme-accent);
    --portal-cyan: var(--theme-accent-soft);
    --portal-bg: var(--theme-bg);
    --portal-bg-elevated: var(--theme-surface-elevated);
    --portal-border: var(--theme-border);
    --portal-border-strong: var(--theme-border-strong);
    --portal-text: var(--theme-text);
    --portal-text-muted: var(--theme-text-muted);
    --portal-shadow-soft: var(--theme-shadow-soft);
    --portal-shadow-card: var(--theme-shadow-card);
    --brand-navy: var(--theme-secondary);
    --brand-royal: var(--theme-primary);
    --accent-cyan: var(--theme-accent-soft);
    --accent-blue: var(--theme-accent);
}

.theme-shell-body {
    background-color: var(--theme-bg);
    color: var(--theme-text-muted);
}

.theme-shell-text {
    color: var(--theme-text);
}

.theme-shell-muted {
    color: var(--theme-text-muted);
}

.theme-shell-link {
    color: var(--theme-text-soft);
    transition: color var(--theme-transition), background-color var(--theme-transition), border-color var(--theme-transition);
}

.theme-shell-link:hover {
    color: var(--theme-text);
}

.theme-shell-hover-surface:hover {
    background-color: var(--theme-surface-muted);
}

.theme-shell-panel {
    background-color: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow-soft);
}

.theme-shell-dropdown {
    background-color: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow-elevated);
}

.theme-shell-avatar {
    background-color: var(--theme-surface-muted);
    color: var(--theme-text-muted);
    border: 1px solid var(--theme-border);
}

.theme-shell-language-chip {
    background-color: var(--theme-surface-muted);
    color: var(--theme-text-muted);
}

.theme-shell-dropdown-item {
    color: var(--theme-text-muted);
    transition: color var(--theme-transition), background-color var(--theme-transition);
}

.theme-shell-dropdown-item:hover {
    background-color: var(--theme-surface-muted);
    color: var(--theme-text);
}

.theme-shell-divider {
    border-color: var(--theme-border);
}

.theme-shell-subtext {
    color: var(--theme-text-faint);
}

.theme-shell-danger-link {
    color: var(--theme-danger-strong);
    transition: color var(--theme-transition), background-color var(--theme-transition);
}

.theme-shell-danger-link:hover {
    background-color: var(--theme-danger-soft);
}

.theme-shell-submenu-link {
    color: var(--theme-text-soft);
    transition: color var(--theme-transition), background-color var(--theme-transition);
}

.theme-shell-submenu-link:hover {
    color: var(--theme-primary);
    background-color: var(--theme-surface-muted);
}

.theme-shell-submenu-link-active {
    color: var(--theme-primary);
    background-color: rgba(30, 64, 175, 0.08);
    font-weight: 500;
}

.theme-shell-icon-active {
    color: var(--theme-primary);
}

.theme-shell-icon-inactive {
    color: var(--theme-text-faint);
}

.theme-shell-footer {
    background-color: var(--theme-surface);
    border-top: 1px solid var(--theme-border);
    color: var(--theme-text-faint);
}

.theme-shell-overlay {
    background-color: var(--theme-overlay);
}

.theme-shell-modal {
    background-color: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow-elevated);
}

.theme-shell-modal-header {
    border-bottom: 1px solid var(--theme-border);
}

.theme-shell-modal-title {
    color: var(--theme-text);
}

.theme-shell-icon-accent {
    color: var(--theme-primary);
}

.theme-shell-close {
    border: 1px solid var(--theme-border);
    color: var(--theme-text-muted);
    transition: color var(--theme-transition), background-color var(--theme-transition), border-color var(--theme-transition);
}

.theme-shell-close:hover {
    color: var(--theme-text);
    background-color: var(--theme-surface-muted);
    border-color: var(--theme-border-strong);
}

.theme-shell-spinner {
    border-bottom-color: var(--theme-primary);
}

.theme-shell-toggle-icon {
    font-size: 18px;
}

.theme-shell-modal-layer {
    z-index: 99999;
}

.theme-brand-cta {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: var(--theme-text-inverse);
    box-shadow: 0 18px 30px -22px rgba(15, 23, 42, 0.65);
    transition: transform var(--theme-transition), filter var(--theme-transition), box-shadow var(--theme-transition);
}

.theme-brand-cta:hover {
    filter: brightness(1.05);
    box-shadow: 0 20px 34px -22px rgba(15, 23, 42, 0.72);
}

.theme-public-nav {
    background-color: rgba(255, 255, 255, 0.8);
    border-bottom: 1px solid var(--theme-border);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.theme-mobile-link {
    color: var(--theme-text-muted);
    transition: color var(--theme-transition), background-color var(--theme-transition);
}

.theme-mobile-link:hover {
    color: var(--theme-text);
    background-color: var(--theme-surface-muted);
}

.theme-mobile-language {
    background-color: var(--theme-surface-muted);
    color: var(--theme-text-muted);
    transition: color var(--theme-transition), background-color var(--theme-transition), box-shadow var(--theme-transition);
}

.theme-mobile-language:hover {
    background-color: var(--theme-bg-soft);
}

.theme-mobile-language-active {
    box-shadow: 0 0 0 2px var(--primary-color);
}

.theme-mobile-language-chip {
    background-color: var(--theme-surface);
    color: var(--theme-text-muted);
}

.theme-mobile-outline-action {
    background-color: var(--theme-surface);
    color: var(--theme-text-muted);
    border: 1px solid var(--theme-border-strong);
    transition: color var(--theme-transition), background-color var(--theme-transition), border-color var(--theme-transition);
}

.theme-mobile-outline-action:hover {
    color: var(--theme-text);
    background-color: var(--theme-surface-muted);
    border-color: var(--theme-border-strong);
}

.theme-public-footer {
    background-color: var(--theme-secondary);
    color: rgba(255, 255, 255, 0.72);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.theme-public-footer-heading {
    color: var(--theme-text-inverse);
}

.theme-public-footer-link {
    color: inherit;
    transition: color var(--theme-transition);
}

.theme-public-footer-link:hover {
    color: var(--primary-color);
}

.theme-public-footer-divider {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.theme-public-footer-muted {
    color: rgba(255, 255, 255, 0.45);
}

.theme-brand-gradient {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
}

.theme-brand-primary {
    color: var(--primary-color);
}

.theme-brand-primary-bg {
    background-color: var(--primary-color);
}

.theme-brand-secondary {
    color: var(--secondary-color);
}

.theme-brand-secondary-bg {
    background-color: var(--secondary-color);
}

.theme-button-primary {
    background: linear-gradient(135deg, var(--theme-primary), var(--theme-accent));
    color: var(--theme-text-inverse);
    border: 1px solid transparent;
    box-shadow: 0 12px 24px -18px rgba(30, 64, 175, 0.8);
    transition: background var(--theme-transition), box-shadow var(--theme-transition), transform var(--theme-transition);
}

.theme-button-primary:hover {
    background: linear-gradient(135deg, var(--theme-primary-hover), var(--theme-accent-soft));
    box-shadow: 0 16px 28px -18px rgba(30, 64, 175, 0.85);
}

.theme-button-secondary {
    background-color: var(--theme-surface-muted);
    color: var(--theme-text-muted);
    border: 1px solid var(--theme-border);
    transition: background-color var(--theme-transition), color var(--theme-transition), border-color var(--theme-transition);
}

.theme-button-secondary:hover {
    background-color: var(--theme-bg-soft);
    color: var(--theme-text);
    border-color: var(--theme-border-strong);
}

.theme-button-success {
    background-color: var(--theme-success);
    color: var(--theme-text-inverse);
}

.theme-button-success:hover {
    filter: brightness(1.05);
}

.theme-button-warning {
    background-color: var(--theme-warning);
    color: var(--theme-text-inverse);
}

.theme-button-warning:hover {
    filter: brightness(1.05);
}

.theme-button-danger {
    background-color: var(--theme-danger);
    color: var(--theme-text-inverse);
}

.theme-button-danger:hover {
    background-color: var(--theme-danger-strong);
}

.theme-link-muted {
    color: var(--theme-text-muted);
    transition: color var(--theme-transition), background-color var(--theme-transition);
}

.theme-link-muted:hover {
    color: var(--theme-text);
    background-color: var(--theme-surface-muted);
}

.theme-link-danger {
    color: var(--theme-danger-strong);
    transition: color var(--theme-transition), background-color var(--theme-transition);
}

.theme-link-danger:hover {
    background-color: var(--theme-danger-soft);
}

.theme-chip-disabled {
    background-color: #cbd5e1;
    color: var(--theme-text-muted);
}

.theme-empty-icon,
.theme-empty-icon svg {
    color: var(--theme-text-faint);
}

.theme-empty-title {
    color: var(--theme-text);
}

.theme-empty-message {
    color: var(--theme-text-muted);
}

.theme-filter-toggle {
    background-color: var(--theme-surface);
    border: 1px solid var(--theme-border);
    color: var(--theme-text);
    box-shadow: var(--theme-shadow-soft);
    transition: background-color var(--theme-transition), border-color var(--theme-transition), color var(--theme-transition);
}

.theme-filter-toggle:hover {
    background-color: var(--theme-surface-muted);
    border-color: var(--theme-border-strong);
}

.theme-filter-panel {
    background-color: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow-soft);
}

.theme-filter-label {
    color: var(--theme-text-muted);
}

.theme-filter-input {
    border: 1px solid var(--theme-border-strong);
    transition: box-shadow var(--theme-transition), border-color var(--theme-transition);
}

.theme-filter-input:focus {
    outline: none;
    border-color: var(--theme-primary);
    box-shadow: 0 0 0 2px rgba(var(--color-primary-600), 0.16);
}

.theme-tips-toggle {
    color: var(--theme-text-muted);
    transition: color var(--theme-transition), background-color var(--theme-transition);
}

.theme-tips-toggle:hover {
    color: var(--theme-text);
    background-color: var(--theme-surface-muted);
}

.theme-tips-toggle-active {
    background-color: var(--theme-surface-elevated);
    color: var(--theme-primary);
}

.theme-status-notice {
    border-left-width: 4px;
}

.theme-status-notice-info,
.theme-status-notice-processing {
    background-color: var(--theme-info-soft);
    border-color: var(--theme-primary);
}

.theme-status-notice-success {
    background-color: var(--theme-success-soft);
    border-color: var(--theme-success);
}

.theme-status-notice-warning {
    background-color: var(--theme-warning-soft);
    border-color: var(--theme-warning);
}

.theme-status-notice-error {
    background-color: var(--theme-danger-soft);
    border-color: var(--theme-danger);
}

.theme-status-icon-info,
.theme-status-icon-processing {
    color: var(--theme-primary);
}

.theme-status-icon-success {
    color: var(--theme-success);
}

.theme-status-icon-warning {
    color: var(--theme-warning);
}

.theme-status-icon-error {
    color: var(--theme-danger);
}

.theme-status-title-info,
.theme-status-title-processing {
    color: #1e3a8a;
}

.theme-status-title-success {
    color: #166534;
}

.theme-status-title-warning {
    color: #92400e;
}

.theme-status-title-error {
    color: #991b1b;
}

.theme-status-body-info,
.theme-status-body-processing {
    color: #1d4ed8;
}

.theme-status-body-success {
    color: #15803d;
}

.theme-status-body-warning {
    color: #b45309;
}

.theme-status-body-error {
    color: #b91c1c;
}

.theme-status-dismiss {
    color: var(--theme-text-faint);
    transition: color var(--theme-transition);
}

.theme-status-dismiss:hover {
    color: var(--theme-text-muted);
}

.theme-status-badge {
    display: inline-flex;
    align-items: center;
    font-weight: 600;
}

.theme-status-badge-blue,
.theme-status-badge-teal {
    background-color: rgba(var(--color-primary-600), 0.1);
    color: #1e3a8a;
}

.theme-status-badge-yellow {
    background-color: #fef3c7;
    color: #92400e;
}

.theme-status-badge-purple,
.theme-status-badge-indigo {
    background-color: #e0e7ff;
    color: #4338ca;
}

.theme-status-badge-emerald,
.theme-status-badge-green {
    background-color: var(--theme-success-soft);
    color: #166534;
}

.theme-status-badge-orange {
    background-color: #ffedd5;
    color: #9a3412;
}

.theme-status-badge-red {
    background-color: var(--theme-danger-soft);
    color: #991b1b;
}

.theme-status-badge-gray {
    background-color: var(--theme-surface-elevated);
    color: var(--theme-text-muted);
}

.theme-status-marker-public {
    background-color: #4ade80;
}

.theme-status-marker-internal {
    background-color: #fbbf24;
}

.theme-status-marker-confidential {
    background-color: #f87171;
}

.theme-banner-warning {
    background-color: var(--theme-warning);
    color: var(--theme-text-inverse);
}

.theme-banner-warning-link {
    color: var(--theme-text-inverse);
    transition: color var(--theme-transition);
}

.theme-banner-warning-link:hover {
    color: #fef3c7;
}

.theme-dialog-surface {
    background-color: var(--theme-surface);
    color: var(--theme-text);
    box-shadow: var(--theme-shadow-elevated);
}

.theme-dialog-header {
    background-color: var(--theme-surface);
}

.theme-dialog-text {
    color: var(--theme-text);
}

.theme-dialog-muted {
    color: var(--theme-text-muted);
}

.theme-dialog-divider {
    border-color: var(--theme-border);
}

.theme-dialog-actions {
    background-color: var(--theme-surface-muted);
}

.theme-dialog-cancel {
    background-color: var(--theme-surface);
    color: var(--theme-text);
    box-shadow: var(--theme-shadow-soft);
    border: 1px solid var(--theme-border-strong);
}

.theme-dialog-cancel:hover {
    background-color: var(--theme-surface-muted);
}

.theme-dialog-comment-error {
    color: var(--theme-danger-strong);
}

.theme-dialog-comment-invalid {
    border-color: var(--theme-danger) !important;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.14);
}

.theme-dialog-icon-info,
.theme-dialog-icon-primary {
    background-color: rgba(var(--color-primary-600), 0.1);
    color: var(--theme-primary);
}

.theme-dialog-icon-success {
    background-color: var(--theme-success-soft);
    color: var(--theme-success);
}

.theme-dialog-icon-warning {
    background-color: var(--theme-warning-soft);
    color: var(--theme-warning);
}

.theme-dialog-icon-danger {
    background-color: var(--theme-danger-soft);
    color: var(--theme-danger);
}

.theme-dialog-confirm-primary,
.theme-dialog-confirm-info {
    background: linear-gradient(135deg, var(--theme-primary), var(--theme-accent));
    color: var(--theme-text-inverse);
}

.theme-dialog-confirm-success {
    background-color: var(--theme-success);
    color: var(--theme-text-inverse);
}

.theme-dialog-confirm-warning {
    background-color: var(--theme-warning);
    color: var(--theme-text-inverse);
}

.theme-dialog-confirm-danger {
    background-color: var(--theme-danger);
    color: var(--theme-text-inverse);
}