/* ==========================================================================
   app.css — Design System Principal
   Premium Dark Theme com Glassmorphism e Micro-interações
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700&display=swap');

:root {
    /* Identidade oficial Shalub — preto premium + dourado.
       Dourado é usado com moderação (CTA, foco, seleção, marca) — a
       superfície do sistema é neutra (preto/grafite), não dourada. */
    --bg-base: #0B0B0B;
    --bg-panel: #151515;
    --bg-panel-hover: #1C1C1C;
    --bg-glass: rgba(21, 21, 21, 0.86);
    --border-glass: #2A2A2A;

    /* Dourado — CTA principal, item ativo do menu, foco, seleção, marca */
    --accent-primary: #C9A34E;
    --accent-primary-hover: #E2C36E;
    --accent-secondary: #E2C36E;
    --accent-glow: rgba(201, 163, 78, 0.20);
    --accent-on: #0B0B0B; /* texto sobre superfícies douradas — contraste correto */

    /* Status Colors — preservados: significado operacional (atrasado,
       concluído, alerta) nunca deve depender do dourado da marca */
    --status-success: #10b981;
    --status-success-bg: rgba(16, 185, 129, 0.1);
    --status-warning: #f59e0b;
    --status-warning-bg: rgba(245, 158, 11, 0.1);
    --status-danger: #ef4444;
    --status-danger-bg: rgba(239, 68, 68, 0.1);
    --status-info: #3b82f6;
    --status-info-bg: rgba(59, 130, 246, 0.1);

    /* Text */
    --text-primary: #F5F1E8;
    --text-secondary: #A7A097;
    --text-muted: #6E6860;

    /* Geometry & Effects */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-full: 9999px;
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.35), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.45), 0 4px 6px -2px rgba(0, 0, 0, 0.25);
    --shadow-glow: 0 0 20px var(--accent-glow);

    /* Transitions */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   Reset & Base
   ========================================================================== */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Garante que [hidden] sempre vença, mesmo em elementos com display:flex/grid
   definido por classe (ex.: painéis colapsáveis, abas Lista/Kanban). */
[hidden] {
    display: none !important;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--bg-base);
    color: var(--text-primary);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Outfit', sans-serif;
    font-weight: 600;
    line-height: 1.2;
    color: var(--text-primary);
}

a {
    color: var(--accent-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--accent-secondary);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

ul {
    list-style: none;
}

/* ==========================================================================
   Typography Utilities
   ========================================================================== */
.text-h1 { font-size: 2.5rem; letter-spacing: -0.02em; }
.text-h2 { font-size: 2rem; letter-spacing: -0.01em; }
.text-h3 { font-size: 1.5rem; }
.text-h4 { font-size: 1.25rem; }
.text-body { font-size: 1rem; }
.text-sm { font-size: 0.875rem; }
.text-xs { font-size: 0.75rem; }

.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.text-muted { color: var(--text-muted); }
.text-gradient {
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ==========================================================================
   Glassmorphism Components
   ========================================================================== */
.glass-panel {
    background: var(--bg-glass);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--border-glass);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}

.glass-card {
    background: var(--bg-panel);
    border: 1px solid var(--border-glass);
    border-radius: var(--radius-md);
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.glass-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-glow);
    border-color: rgba(201, 163, 78, 0.3);
}

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.625rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    border-radius: var(--radius-md);
    border: 1px solid transparent;
    cursor: pointer;
    transition: all var(--transition-normal);
    gap: 0.5rem;
    text-decoration: none;
    outline: none;
}

.btn:focus-visible {
    box-shadow: 0 0 0 2px var(--bg-base), 0 0 0 4px var(--accent-primary);
}

/* Ação primária — reservada para o CTA principal de cada tela.
   Texto escuro sobre dourado: contraste correto (branco sobre este
   tom de dourado falha WCAG) e é o acabamento premium/metálico
   esperado — não um botão "colorido" igual aos demais. */
.btn-primary {
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    color: var(--accent-on);
    font-weight: 600;
    box-shadow: 0 4px 12px var(--accent-glow);
}

.btn-primary:hover {
    box-shadow: 0 6px 18px rgba(201, 163, 78, 0.35);
    transform: translateY(-1px);
    color: var(--accent-on);
}

.btn-primary:active {
    transform: translateY(0);
}

/* Ação secundária/neutra — Filtrar, Cancelar, Voltar, Limpar etc. */
.btn-secondary {
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-primary);
    border-color: var(--border-glass);
}

.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: #3A3A3A;
    color: var(--text-primary);
}

/* Ação outline — mesma semântica neutra, sem preenchimento */
.btn-outline {
    background: transparent;
    color: var(--text-secondary);
    border-color: var(--border-glass);
}

.btn-outline:hover {
    color: var(--text-primary);
    border-color: var(--text-secondary);
}

.btn-danger {
    background: rgba(239, 68, 68, 0.1);
    color: var(--status-danger);
    border-color: rgba(239, 68, 68, 0.2);
}

.btn-danger:hover {
    background: var(--status-danger);
    color: white;
}

.btn-block {
    display: flex;
    width: 100%;
}

/* ==========================================================================
   Forms
   ========================================================================== */
.form-group {
    margin-bottom: 1.25rem;
}

.form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--text-secondary);
}

.form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    font-family: 'Inter', sans-serif;
    color: var(--text-primary);
    background-color: rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border-glass);
    border-radius: var(--radius-md);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.form-control::placeholder {
    color: var(--text-muted);
}

.form-control:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px var(--accent-glow);
    background-color: rgba(0, 0, 0, 0.4);
}

/* Mini-formulários de ação rápida que aparecem/somem ao clicar (ex.: "Registrar" na ficha do cliente) */
.quick-action-form {
    align-items: flex-end;
    gap: 1rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border-glass);
}
.quick-action-form[hidden] {
    display: none;
}
.quick-action-form:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
}

/* ==========================================================================
   Alerts & Flash Messages
   ========================================================================== */
.alert {
    padding: 1rem 1.25rem;
    border-radius: var(--radius-md);
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.875rem;
    animation: slideInDown 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.alert-success {
    background-color: var(--status-success-bg);
    color: var(--status-success);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.alert-error, .alert-danger {
    background-color: var(--status-danger-bg);
    color: var(--status-danger);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.alert-info {
    background-color: var(--status-info-bg);
    color: var(--status-info);
    border: 1px solid rgba(59, 130, 246, 0.2);
}

/* ==========================================================================
   Animations
   ========================================================================== */
@keyframes slideInDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.animate-fade-in {
    animation: fadeIn 0.5s ease-out forwards;
}

/* ==========================================================================
   Utilities
   ========================================================================== */
.text-center { text-align: center; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 1.5rem; }
.w-full { width: 100%; }
.flex { display: flex; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }

/* Client workspace and manager-first navigation */
.nav-group { margin: .65rem 0; }
.nav-group summary { color: var(--text-muted); cursor: pointer; font-size: .72rem; font-weight: 700; letter-spacing: .08em; list-style: none; padding: .5rem 1rem; text-transform: uppercase; }
.nav-group summary::-webkit-details-marker { display: none; }
.nav-group summary::after { content: '⌄'; float: right; color: var(--accent-primary); }
.nav-group .nav-item { margin-left: .45rem; }
.client-workspace { display: flex; flex-direction: column; gap: 1rem; }
.client-hero { display: flex; justify-content: space-between; gap: 1rem; padding: 1.35rem; }
.workspace-back { color: var(--accent-primary); display: inline-block; margin-bottom: .45rem; text-decoration: none; }
.client-title-row, .client-meta, .client-hero-actions, .workspace-section-heading, .register-options { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem; }
.client-title-row h2 { margin: 0; }
.client-meta { color: var(--text-secondary); font-size: .875rem; margin-top: .6rem; }
.client-meta a { color: var(--accent-primary); text-decoration: none; }
.client-hero-actions { align-self: flex-start; }
.workspace-attention { background: rgba(201, 163, 78, .08); border: 1px solid rgba(201, 163, 78, .35); border-radius: var(--radius-lg); padding: 1.2rem; }
.workspace-section-heading { justify-content: space-between; margin-bottom: .85rem; }
.workspace-section-heading h3 { margin: 0; }
.eyebrow { color: var(--accent-primary); display: block; font-size: .7rem; font-weight: 700; letter-spacing: .1em; margin-bottom: .25rem; text-transform: uppercase; }
.attention-list { display: flex; flex-direction: column; gap: .55rem; }
.attention-item { align-items: center; background: var(--bg-panel); border: 1px solid var(--border-glass); border-left: 3px solid var(--accent-primary); border-radius: var(--radius-md); color: inherit; display: flex; gap: .8rem; justify-content: space-between; padding: .75rem .9rem; text-decoration: none; }
.attention-item.urgency-overdue { border-left-color: var(--status-danger); }
.attention-item.urgency-today { border-left-color: var(--accent-primary); }
.attention-item strong, .attention-item small { display: block; margin-top: .2rem; }
.attention-item small { color: var(--text-muted); font-size: .75rem; }
.workspace-empty { color: var(--text-secondary); padding: .8rem 0; }
.register-drawer { padding: 1rem 1.2rem; }
.register-options { margin-bottom: .4rem; }
.form-grow { flex: 2; min-width: 180px; }
.workspace-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.workspace-block { min-height: 176px; padding: 1.1rem; }
.workspace-block h3 { margin: 0 0 .75rem; }
.workspace-block p { color: var(--text-secondary); font-size: .9rem; margin: .45rem 0; }
.workspace-block p strong { color: var(--text-primary); }
.workspace-block-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.compact-item { border-top: 1px solid var(--border-glass); padding-top: .45rem; }
.task-row { align-items: center; border-top: 1px solid var(--border-glass); display: flex; font-size: .875rem; gap: .5rem; justify-content: space-between; padding: .5rem 0; }
.text-action { background: transparent; border: 0; color: var(--accent-primary); cursor: pointer; font: inherit; text-decoration: none; white-space: nowrap; }
.workspace-timeline { padding: 1.1rem; }
.timeline-list { display: flex; flex-direction: column; }
.timeline-list article { border-left: 2px solid var(--accent-primary); display: flex; flex-direction: column; gap: .25rem; padding: .55rem .8rem; }
.timeline-list span { color: var(--text-muted); font-size: .78rem; }
.client-list-panel { padding: 1.5rem; }
.admin-finance-strip { align-items: stretch; display: grid; gap: .7rem; grid-template-columns: 1.35fr repeat(4, 1fr); margin-bottom: 1.5rem; padding: 1rem; }.admin-finance-heading { padding: .45rem .65rem; }.admin-finance-heading h3 { margin: .15rem 0; }.admin-finance-item { background: rgba(255,255,255,.03); border: 1px solid var(--border-glass); border-left: 3px solid var(--accent-primary); border-radius: var(--radius-md); color: inherit; display: flex; flex-direction: column; justify-content: center; min-height: 100px; padding: .75rem; text-decoration: none; transition: background var(--transition-fast), transform var(--transition-fast); }.admin-finance-item:hover { background: rgba(255,255,255,.07); transform: translateY(-2px); }.admin-finance-item span:not(.admin-finance-value) { color: var(--text-secondary); font-size: .75rem; }.admin-finance-value { font-size: 1.35rem; font-weight: 800; }.admin-finance-item small { color: var(--text-muted); font-size: .66rem; margin-top: .35rem; }.admin-finance-danger { border-left-color: var(--status-danger); }.admin-finance-danger .admin-finance-value { color: var(--status-danger); }.admin-finance-warning { border-left-color: var(--status-warning); }.admin-finance-warning .admin-finance-value { color: var(--status-warning); }.admin-finance-success { border-left-color: var(--status-success); }.admin-finance-success .admin-finance-value { color: var(--status-success); }.admin-finance-neutral { border-left-color: var(--status-info); }.admin-finance-neutral .admin-finance-value { color: var(--status-info); }
.dashboard-period-filter { align-items: center; display: flex; gap: .65rem; justify-content: flex-end; margin-bottom: 1rem; }.dashboard-period-filter .eyebrow { margin: 0; }.dashboard-period-filter .form-control { max-width: 180px; }
.admin-finance-deep-grid { display: grid; gap: 1rem; grid-template-columns: 1fr 1.2fr; margin-bottom: 1.5rem; }.admin-forecast-panel, .admin-trend-panel { padding: 1.2rem; }.admin-forecast-grid { display: grid; gap: .5rem; grid-template-columns: repeat(3, 1fr); }.admin-forecast-grid > div { border-left: 2px solid var(--accent-primary); display: flex; flex-direction: column; gap: .2rem; padding: .55rem .7rem; }.admin-forecast-grid strong { font-size: 1.05rem; }.admin-forecast-grid span { color: var(--text-secondary); font-size: .72rem; }.admin-forecast-grid small { color: var(--text-muted); font-size: .65rem; }.admin-trend-list { display: flex; flex-direction: column; gap: .55rem; }.admin-trend-row { align-items: center; display: grid; gap: .55rem; grid-template-columns: 42px 1fr 95px; }.admin-trend-row > span { color: var(--text-muted); font-size: .7rem; }.admin-trend-row small { color: var(--text-secondary); font-size: .65rem; text-align: right; }.admin-trend-bars { background: rgba(255,255,255,.06); border-radius: 999px; height: .65rem; overflow: hidden; position: relative; }.admin-trend-bars i, .admin-trend-bars b { border-radius: inherit; display: block; height: 50%; left: 0; position: absolute; }.admin-trend-bars i { background: rgba(201,163,78,.45); top: 0; }.admin-trend-bars b { background: var(--status-success); bottom: 0; }.admin-trend-legend { color: var(--text-muted); display: flex; font-size: .65rem; gap: 1rem; margin-top: .75rem; }.admin-trend-legend i, .admin-trend-legend b { background: rgba(201,163,78,.45); display: inline-block; height: .45rem; margin-right: .25rem; width: .45rem; }.admin-trend-legend b { background: var(--status-success); }
.admin-user-summary { display: grid; gap: .75rem; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 1.5rem; }.admin-summary-card { background: rgba(255,255,255,.03); border: 1px solid var(--border-glass); border-radius: var(--radius-md); padding: .85rem 1rem; }.admin-summary-card span, .admin-summary-card small { color: var(--text-secondary); display: block; font-size: .75rem; }.admin-summary-card strong { display: block; font-size: 1.4rem; margin: .25rem 0; }.admin-summary-card small { color: var(--text-muted); font-size: .67rem; }.audit-quick-filters { align-items: center; display: flex; flex-wrap: wrap; gap: .45rem; margin: -0.5rem 0 1.25rem; }
.client-list-header { align-items: flex-start; }
.client-filters { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem; margin: 1rem 0; }
.table-sort-link { align-items: center; color: inherit; display: inline-flex; gap: .35rem; text-decoration: none; }
.table-sort-link span { color: var(--text-muted); font-size: .9em; }
.table-sort-link:hover, .table-sort-link.active { color: var(--accent-primary); }
.table-sort-link.active span { color: var(--accent-primary); font-weight: 800; }
.client-filters .form-control { flex: 1; min-width: 160px; }
.attention-count { align-items: center; background: rgba(255,255,255,.08); border-radius: 999px; display: inline-flex; font-weight: 700; height: 1.7rem; justify-content: center; min-width: 1.7rem; }
.attention-count.has-attention { background: rgba(201,163,78,.2); color: var(--accent-primary); }
.pagination-note { align-items: center; color: var(--text-muted); display: flex; gap: .75rem; justify-content: center; margin-top: 1rem; }
.client-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.chip { background: rgba(255,255,255,.06); border: 1px solid var(--border-glass); border-radius: 999px; color: var(--text-secondary); font-size: .82rem; padding: .35rem .9rem; text-decoration: none; white-space: nowrap; }
.chip-active { background: rgba(201,163,78,.2); border-color: var(--accent-primary); color: var(--accent-primary); }
.client-card-list { display: none; }
.client-card { display: flex; flex-direction: column; gap: .4rem; padding: 1rem; }
.client-card-header { align-items: center; display: flex; justify-content: space-between; gap: .5rem; }
.client-card .btn { align-self: flex-start; }
.manager-dashboard { display: flex; flex-direction: column; gap: 1rem; margin: 0 auto; max-width: 1440px; width: 100%; }
.manager-dashboard-header h2 { margin: .1rem 0; }
.manager-hero { align-items: flex-end; background: radial-gradient(circle at 88% 12%, rgba(201,163,78,.18), transparent 36%), linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.015)); border: 1px solid var(--border-glass); border-radius: var(--radius-lg); display: flex; justify-content: space-between; min-height: 150px; overflow: hidden; padding: 1.6rem; position: relative; }.manager-hero::after { background: linear-gradient(90deg, transparent, rgba(201,163,78,.45), transparent); content: ''; height: 1px; left: 1.6rem; position: absolute; right: 1.6rem; top: 0; }.manager-hero-copy { position: relative; z-index: 1; }.manager-hero-copy p { margin: .4rem 0 0; }.manager-hero-side { align-items: flex-end; display: flex; flex-direction: column; gap: .8rem; position: relative; z-index: 1; }.manager-date-label { color: var(--text-muted); font-size: .76rem; letter-spacing: .04em; text-transform: uppercase; }.manager-hero-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.today-grid { display: grid; gap: .75rem; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.today-card { color: inherit; display: flex; flex-direction: column; min-height: 110px; padding: 1rem; text-decoration: none; }
.today-card strong { color: var(--accent-primary); font-size: 2rem; }.today-card span { color: var(--text-secondary); font-size: .82rem; margin-top: .4rem; }
.manager-dashboard-grid { display: grid; gap: 1rem; grid-template-columns: 2fr 1fr; }.queue-panel, .my-clients-panel { padding: 1.2rem; }.my-clients-panel p { color: var(--text-secondary); }.my-clients-panel p strong { color: var(--accent-primary); font-size: 1.25rem; }
.manager-kpi-grid { display: grid; gap: .75rem; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 auto; width: 100%; }
.manager-kpi { align-items: center; border-top: 2px solid transparent; display: flex; gap: .8rem; justify-content: center; min-height: 104px; padding: 1rem; transition: border-color var(--transition-fast), transform var(--transition-fast), background var(--transition-fast); }.manager-kpi:hover { background: rgba(255,255,255,.06); border-top-color: var(--accent-primary); transform: translateY(-2px); }.manager-kpi-icon { align-items: center; background: rgba(201,163,78,.14); border-radius: 13px; color: var(--accent-primary); display: inline-flex; flex: 0 0 2.65rem; height: 2.65rem; justify-content: center; width: 2.65rem; }.manager-kpi-icon svg { fill: none; height: 1.35rem; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 1.35rem; }
.manager-kpi-icon.manager-kpi-warning { background: var(--status-danger-bg); color: var(--status-danger); }.manager-kpi-icon.manager-kpi-info { background: var(--status-info-bg); color: var(--status-info); }.manager-kpi-icon.manager-kpi-success { background: var(--status-success-bg); color: var(--status-success); }.manager-kpi-alert { border-top-color: var(--status-danger); }.manager-kpi-today { border-top-color: var(--status-info); }.manager-kpi-success-card { border-top-color: var(--status-success); }
.manager-kpi-icon.manager-kpi-warning { background: var(--status-danger-bg); color: var(--status-danger); }.manager-kpi-icon.manager-kpi-info { background: var(--status-info-bg); color: var(--status-info); }.manager-kpi-icon.manager-kpi-success { background: var(--status-success-bg); color: var(--status-success); }
.manager-kpi-icon svg { display: block; fill: none; height: 1.3rem; margin: 0; overflow: visible; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.65; width: 1.3rem; }
.manager-kpi strong, .manager-kpi span, .manager-kpi small { display: block; }.manager-kpi strong { font-size: 1.55rem; line-height: 1; }.manager-kpi div span { color: var(--text-secondary); font-size: .75rem; margin-top: .28rem; }.manager-kpi small { color: var(--text-muted); font-size: .65rem; margin-top: .25rem; }
.manager-calendar-panel { padding: 1.2rem; }.manager-calendar { display: grid; gap: .65rem; grid-template-columns: repeat(7, minmax(120px, 1fr)); overflow-x: auto; }
.calendar-day { background: rgba(255,255,255,.025); border: 1px solid var(--border-glass); border-radius: var(--radius-md); min-height: 130px; padding: .65rem; }.calendar-day-head { align-items: baseline; border-bottom: 1px solid var(--border-glass); display: flex; gap: .4rem; justify-content: space-between; margin-bottom: .45rem; padding-bottom: .4rem; }.calendar-day-head strong { color: var(--accent-primary); }.calendar-day-head span { color: var(--text-muted); font-size: .72rem; }.calendar-day-items { display: flex; flex-direction: column; gap: .35rem; }.calendar-item { background: var(--bg-panel); border-left: 2px solid var(--accent-primary); border-radius: .35rem; color: inherit; display: flex; flex-direction: column; gap: .12rem; padding: .35rem; text-decoration: none; }.calendar-item b { font-size: .72rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.calendar-item small { color: var(--text-muted); font-size: .66rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.calendar-item .badge { align-self: flex-start; font-size: .55rem; padding: .12rem .35rem; }
.calendar-empty { color: var(--text-muted); font-size: .72rem; padding: .4rem 0; }
.health-badge { align-items: center; display: inline-flex; font-size: .73rem; font-weight: 700; gap: .35rem; white-space: nowrap; }.health-badge i { background: currentColor; border-radius: 999px; display: inline-block; height: .45rem; width: .45rem; }.health-good { color: var(--status-success); }.health-warning { color: var(--status-warning); }.health-risk { color: var(--status-danger); }
.creative-flow { align-items: center; background: rgba(255,255,255,.025); border: 1px solid var(--border-glass); border-radius: var(--radius-lg); display: flex; gap: .65rem; justify-content: space-between; margin-bottom: 1.25rem; padding: .8rem 1rem; }.creative-flow-step { align-items: center; display: grid; gap: .1rem .45rem; grid-template-columns: 1.55rem 1fr; min-width: 0; }.creative-flow-step span { align-items: center; background: rgba(201,163,78,.18); border-radius: 999px; color: var(--accent-primary); display: inline-flex; grid-row: span 2; height: 1.55rem; justify-content: center; font-weight: 800; width: 1.55rem; }.creative-flow-step strong { font-size: .75rem; white-space: nowrap; }.creative-flow-step small { color: var(--text-muted); font-size: .65rem; white-space: nowrap; }.creative-flow-line { background: var(--border-glass); flex: 1; height: 1px; }

@media (max-width: 768px) {
  .today-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .manager-dashboard-grid { grid-template-columns: 1fr; }
  .manager-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-finance-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }.admin-finance-heading { grid-column: span 2; }.admin-user-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-finance-deep-grid { grid-template-columns: 1fr; }
  .manager-hero { align-items: flex-start; flex-direction: column; gap: 1rem; }.manager-hero-side { align-items: flex-start; }.manager-hero-actions { width: 100%; }.manager-hero-actions .btn { flex: 1; }
  .creative-flow { align-items: flex-start; flex-direction: column; }.creative-flow-line { height: 1px; width: 100%; }
  .client-operational-table { min-width: 760px; }
}
@media (max-width: 480px) {
  .client-hero { padding: 1rem; }.client-hero-actions { width: 100%; }.client-hero-actions .btn-primary { flex: 1; }
  .workspace-grid { grid-template-columns: 1fr; }.workspace-attention, .register-drawer, .workspace-timeline { padding: 1rem; }
  .attention-item { align-items: flex-start; }.attention-item .btn { padding: .45rem .6rem; }
  .quick-action-form:not([hidden]) { align-items: stretch; }.quick-action-form:not([hidden]) .form-group { min-width: 100%; }.quick-action-form:not([hidden]) .btn { width: 100%; }
  .client-list-panel { padding: 1rem; }.client-filters .form-control, .client-filters .btn { flex-basis: 100%; }.header-actions { width: 100%; }.header-actions .btn { flex: 1; }
  .client-list-panel .table-container { display: none; }.client-card-list { display: flex; flex-direction: column; gap: .75rem; }
  .today-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.today-card { min-height: 88px; padding: .75rem; }.today-card:last-child { grid-column: span 2; }
  .admin-finance-strip, .admin-user-summary { grid-template-columns: 1fr; }.admin-finance-heading { grid-column: auto; }
  .admin-forecast-grid { grid-template-columns: 1fr; }.admin-trend-row { grid-template-columns: 38px 1fr; }.admin-trend-row small { grid-column: 2; text-align: left; }
}