/**
 * yoCare — CSS Custom Properties
 * Tutte le variabili del design system con prefisso --yc-*
 *
 * Patch redesign 2026-07: raggi ammorbiditi (6/10/14), font Archivo,
 * scala di densità per tabelle e form, ramp di superficie, focus ring.
 * Nessun nome di variabile esistente è stato rimosso.
 */

:root {
    /* ── Brand Colors ──────────────────────────────────────────────────────── */
    --yc-primary:          #0d9488;
    --yc-primary-dark:     #0f766e;
    --yc-primary-light:    #f0fdfa;
    --yc-primary-rgb:      13, 148, 136;
    /* Nuovi: passi intermedi, per tinte e stati premuti senza color-mix ad hoc */
    --yc-primary-50:       #f0fdfa;
    --yc-primary-100:      #ccfbf1;
    --yc-primary-200:      #99f6e4;
    --yc-primary-700:      #0f766e;
    --yc-primary-800:      #115e59;

    --yc-secondary:        #64748b;
    --yc-secondary-dark:   #475569;
    --yc-secondary-light:  #f1f5f9;

    --yc-accent:           #0ea5e9;
    --yc-accent-dark:      #0284c7;
    --yc-accent-light:     #f0f9ff;

    /* ── Semantic Colors ───────────────────────────────────────────────────── */
    --yc-success:          #16a34a;
    --yc-success-light:    #dcfce7;
    --yc-success-dark:     #15803d;
    --yc-warning:          #d97706;
    --yc-warning-light:    #fef3c7;
    --yc-warning-dark:     #b45309;
    --yc-danger:           #dc2626;
    --yc-danger-light:     #fee2e2;
    --yc-danger-dark:      #b91c1c;
    --yc-info:             #0284c7;
    --yc-info-light:       #e0f2fe;
    --yc-info-dark:        #0369a1;

    /* ── Neutral Palette ───────────────────────────────────────────────────── */
    --yc-gray-50:          #f8fafc;
    --yc-gray-100:         #f1f5f9;
    --yc-gray-200:         #e2e8f0;
    --yc-gray-300:         #cbd5e1;
    --yc-gray-400:         #94a3b8;
    --yc-gray-500:         #64748b;
    --yc-gray-600:         #475569;
    --yc-gray-700:         #334155;
    --yc-gray-800:         #1e293b;
    --yc-gray-900:         #0f172a;

    /* ── Typography ────────────────────────────────────────────────────────── */
    /* Archivo va linkato nel layout backend; la stack di fallback regge da sola. */
    --yc-font-sans:        'Archivo', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --yc-font-mono:        'JetBrains Mono', 'Fira Code', ui-monospace, 'Courier New', monospace;

    --yc-text:             var(--yc-gray-900);
    --yc-text-muted:       var(--yc-gray-500);
    --yc-text-light:       var(--yc-gray-400);

    --yc-font-size-xs:     0.75rem;    /* 12px */
    --yc-font-size-sm:     0.8125rem;  /* 13px — densità lista */
    --yc-font-size-base:   0.9375rem;  /* 15px — interfaccia admin */
    --yc-font-size-lg:     1.0625rem;  /* 17px */
    --yc-font-size-xl:     1.25rem;    /* 20px */
    --yc-font-size-2xl:    1.5rem;     /* 24px */

    --yc-font-weight-medium:   500;
    --yc-font-weight-semibold: 600;
    /* Etichette di colonna e kicker */
    --yc-label-size:       0.6875rem;  /* 11px */
    --yc-label-tracking:   .06em;

    /* ── Layout ────────────────────────────────────────────────────────────── */
    --yc-sidebar-width:    260px;
    --yc-sidebar-collapsed: 64px;
    --yc-topbar-height:    60px;
    --yc-content-max-width: 1280px;
    --yc-content-max-width-wide: 1600px;   /* pagine lista dense */

    /* ── Background ────────────────────────────────────────────────────────── */
    --yc-bg:               #ffffff;
    --yc-bg-light:         #f3f2f2;              /* sfondo pagina — grigio caldo come il mockup Modernist */
    --yc-bg-card:          #f3f2f2;              /* card/pannelli = fondo pagina: nel redesign non ci sono sfondi bianchi; lo stacco lo fanno bordi/divisori */
    --yc-bg-subtle:        #eae9e9;              /* header tabella, fill inattivi — grigio caldo (mockup --color-surface) */
    --yc-sidebar-bg:       #1e293b;
    --yc-topbar-bg:        #f3f2f2;              /* topbar: stesso fondo pagina, come il mockup */

    /* ── Borders ───────────────────────────────────────────────────────────── */
    --yc-border:           var(--yc-gray-200);
    --yc-border-strong:    var(--yc-gray-300);
    /* Divisore caldo del design system Modernist (--color-divider): grigio caldo
       medio, tono coerente col fondo #f3f2f2. Usalo per i filetti "forti" del
       redesign (sezioni wizard, header tabella flush, fascia dettaglio, KPI). */
    --yc-divider:          color-mix(in srgb, #201e1d 40%, transparent);
    --yc-border-radius-sm: 0.25rem;     /* 4px  — badge, chip */
    --yc-border-radius:    0.375rem;    /* 6px  — bottoni, input */
    --yc-border-radius-lg: 0.625rem;    /* 10px — card, pannelli */
    --yc-border-radius-xl: 0.875rem;    /* 14px — modali, drawer */

    /* ── Shadows ────────────────────────────────────────────────────────────── */
    --yc-shadow-sm:        0 1px 2px 0 rgba(15,23,42,.05);
    --yc-shadow:           0 1px 3px 0 rgba(15,23,42,.08), 0 1px 2px -1px rgba(15,23,42,.06);
    --yc-shadow-md:        0 4px 6px -1px rgba(15,23,42,.08), 0 2px 4px -2px rgba(15,23,42,.06);
    --yc-shadow-lg:        0 12px 24px -6px rgba(15,23,42,.12), 0 4px 8px -4px rgba(15,23,42,.08);

    /* ── Transitions ───────────────────────────────────────────────────────── */
    --yc-transition:       150ms ease-in-out;
    --yc-transition-slow:  300ms ease-in-out;

    /* ── Focus ─────────────────────────────────────────────────────────────── */
    --yc-focus-ring:       0 0 0 3px rgba(var(--yc-primary-rgb), .25);
    --yc-focus-outline:    2px solid var(--yc-primary);

    /* ── Z-index layers ────────────────────────────────────────────────────── */
    --yc-z-dropdown:       1000;
    --yc-z-sticky:         1020;
    --yc-z-topbar:         1030;
    --yc-z-overlay:        1040;
    --yc-z-modal:          1050;
    --yc-z-toast:          9999;

    /* ── Appointment Status Colors ─────────────────────────────────────────── */
    --yc-status-pending:   #f59e0b;
    --yc-status-confirmed: #3b82f6;
    --yc-status-completed: #16a34a;
    --yc-status-cancelled: #6b7280;
    --yc-status-noshow:    #ef4444;
    --yc-status-rescheduled: #8b5cf6;
    /* Tinte chiare per i badge di stato (fill tenue + testo scuro) */
    --yc-status-pending-light:     #fef3c7;
    --yc-status-confirmed-light:   #dbeafe;
    --yc-status-completed-light:   #dcfce7;
    --yc-status-cancelled-light:   #f1f5f9;
    --yc-status-noshow-light:      #fee2e2;
    --yc-status-rescheduled-light: #ede9fe;

    /* ── Calendar ──────────────────────────────────────────────────────────── */
    --yc-cal-slot-height:  48px;
    --yc-cal-hour-width:   60px;

    /* ── Form ───────────────────────────────────────────────────────────────── */
    --yc-input-border:     var(--yc-gray-300);
    --yc-input-focus:      var(--yc-primary);
    --yc-input-error:      var(--yc-danger);
    --yc-label-weight:     500;
    --yc-input-height:     34px;
    --yc-input-height-sm:  30px;
    --yc-input-padding-x:  0.625rem;

    /* ── Tabelle (densità) ──────────────────────────────────────────────────── */
    --yc-table-cell-y:     0.5rem;
    --yc-table-cell-x:     0.625rem;
    --yc-table-head-y:     0.4375rem;
    --yc-table-row-border: var(--yc-gray-100);

    /* ── Frontend specifici ─────────────────────────────────────────────────── */
    --yc-dark:             #0f172a;
    --yc-warm:             #f59e0b;
    --yc-hero-bg:          var(--yc-dark);
    --yc-section-gap:      5rem;
    --yc-card-radius:      1.5rem;
    --yc-btn-radius:       50px;
}

/* ── Dark mode (future) ───────────────────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
    :root[data-theme="auto"] {
        --yc-bg:           #0f172a;
        --yc-bg-light:     #1e293b;
        --yc-bg-card:      #1e293b;
        --yc-bg-subtle:    #1e293b;
        --yc-topbar-bg:    #1e293b;
        --yc-text:         #f1f5f9;
        --yc-text-muted:   #94a3b8;
        --yc-border:       #334155;
        --yc-border-strong: #475569;
        --yc-divider:      color-mix(in srgb, #f1f5f9 30%, transparent);
        --yc-table-row-border: #1e293b;
    }
}
