/* Theme clair « blanc atelier » (01/10/2026), pour tout le site. Charge par _theme_head.html, qui pose
   la classe `lt2` sur <html>. Tout est prefixe `html.lt2[data-theme="light"]` : plus fort que les regles
   claires d'avant (theme.css, pages), et sans effet en sombre.

   Principes : fond presque blanc et froid, cartes blanches posees dessus avec un trait tres fin et une
   ombre douce ; texte ardoise (pas de noir pur, pas de gris sale) ; un seul rouge, franc ; les couleurs
   d'etat (bleu, vert, orange) en teintes legeres avec une encre lisible. */

html.lt2[data-theme="light"] {
    --bg: #f4f6f9;
    --bg-2: #ffffff;
    --card: #ffffff;
    --card-2: #f5f7fa;
    --card-3: #e9edf2;

    --accent: #d92d20; --accent-2: #b42318; --accent-3: #912018;
    --accent-tint: rgba(217, 45, 32, .08); --accent-line: rgba(217, 45, 32, .28);
    --accent-glow: rgba(217, 45, 32, .28);
    --leather: linear-gradient(180deg, #e3382c 0%, #d92d20 100%);
    --leather-soft: rgba(217, 45, 32, .07);
    --leather-dark: #fef3f2;

    --silver: #667085; --silver-hi: #344054; --silver-2: #475467; --silver-3: #98a2b3;
    --trim: linear-gradient(90deg, transparent, #d0d5dd 20%, #d0d5dd 80%, transparent);
    --line: #e6e9ef; --line-2: #d3d8e0;

    --text: #101828; --muted: #667085; --muted-2: #98a2b3;
    --ok: #067647; --warn: #b54708; --bad: #d92d20;
    --ok-tint: #ecfdf3; --bad-tint: #fef3f2;
    --glass: rgba(255, 255, 255, .9);

    --sh-1: 0 1px 2px rgba(16, 24, 40, .05);
    --sh-2: 0 4px 12px -2px rgba(16, 24, 40, .08), 0 2px 4px -2px rgba(16, 24, 40, .04);
    --sh-3: 0 20px 40px -12px rgba(16, 24, 40, .18);
    --sh-red: 0 1px 2px rgba(16, 24, 40, .06);

    --violet: #6941c6; --violet-tint: #f4f3ff;
    /* Mon atelier : bleu = en cours, vert = pret / accepte */
    --pl-blue: #2e5bff; --pl-blue-tint: #eef3ff; --pl-blue-line: #b3c5ff;
    --pl-green: #12b76a; --pl-green-ink: #067647; --pl-green-tint: #ecfdf3; --pl-green-line: #a6e9c5;
    color-scheme: light;
}
html.lt2[data-theme="light"] body { background: var(--bg); color: var(--text); }

/* --- Barre de gauche : blanche, un trait a droite, l'entree active en teinte douce ------------- */
html.lt2[data-theme="light"] .side { background: #fff; border-right: 1px solid var(--line); }
html.lt2[data-theme="light"] .side a { color: #475467; }
html.lt2[data-theme="light"] .side a:hover { color: var(--text); background: #f9fafb; }
html.lt2[data-theme="light"] .side a.on { color: var(--accent); background: var(--accent-tint); }
html.lt2[data-theme="light"] .side a.add { color: var(--accent); }
html.lt2[data-theme="light"] .side a.side-out { color: #475467; }
html.lt2[data-theme="light"] .side a.side-plan, html.lt2[data-theme="light"] .side a.side-plan.on { color: var(--violet); }
html.lt2[data-theme="light"] .side a.side-plan.on { background: var(--violet-tint); }
html.lt2[data-theme="light"] .side .sep { background: var(--line); opacity: 1; }
html.lt2[data-theme="light"] .side a.sub::before { background: var(--line-2); }
html.lt2[data-theme="light"] .side .badge.trash-n { background: #f2f4f7; color: #475467; }
html.lt2[data-theme="light"] .side-ai .ai-meter { background: #f9fafb; border-color: var(--line); }
html.lt2[data-theme="light"] .side-close { background: #f9fafb; border-color: var(--line); }
html.lt2[data-theme="light"] .side .side-close a, html.lt2[data-theme="light"] .side .side-close a:hover { box-shadow: 0 1px 2px rgba(16, 24, 40, .1); }
html.lt2[data-theme="light"] .side .side-foot .ico { background: #fff; border-color: var(--line-2); color: #475467; }
html.lt2[data-theme="light"] .side .side-foot .ico:hover { background: #f9fafb; color: var(--text); }

/* --- Barre du haut ------------------------------------------------------------------------- */
html.lt2[data-theme="light"] .topbar { background: rgba(255, 255, 255, .85); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
                                        border-bottom-color: var(--line); }
html.lt2[data-theme="light"] .tb-lang, html.lt2[data-theme="light"] .tb-theme { border-color: var(--line-2); background: #fff; }

/* --- Cartes, champs, boutons ----------------------------------------------------------------- */
html.lt2[data-theme="light"] .card { background: #fff; border: 1px solid var(--line); box-shadow: var(--sh-1); }
html.lt2[data-theme="light"] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]):not(.pk-q),
html.lt2[data-theme="light"] select, html.lt2[data-theme="light"] textarea {
    background: #fff; border: 1px solid var(--line-2); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); color: var(--text); }
html.lt2[data-theme="light"] input::placeholder, html.lt2[data-theme="light"] textarea::placeholder { color: #98a2b3; }
html.lt2[data-theme="light"] input:focus, html.lt2[data-theme="light"] select:focus, html.lt2[data-theme="light"] textarea:focus {
    border-color: #f97066; box-shadow: 0 0 0 4px rgba(217, 45, 32, .1); }
html.lt2[data-theme="light"] .btn { box-shadow: 0 1px 2px rgba(16, 24, 40, .1); }
html.lt2[data-theme="light"] .btn.ghost { background: #fff; color: #344054; border: 1px solid var(--line-2); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
html.lt2[data-theme="light"] .btn.ghost:hover { background: #f9fafb; border-color: #c4cad4; color: var(--text); }
html.lt2[data-theme="light"] .btn.danger { background: #fff; }

/* --- Plaques : la vraie plaque reste blanche, cadre bleu ------------------------------------- */
html.lt2[data-theme="light"] .plate { box-shadow: 0 1px 2px rgba(16, 24, 40, .12); }

/* =============================================================================================
   MON ATELIER
   ============================================================================================= */
/* Les chiffres du haut : des cartes blanches nettes */
html.lt2[data-theme="light"] .pl .pl-kpi { background: #fff; border-color: var(--line); box-shadow: var(--sh-1); }
html.lt2[data-theme="light"] .pl-kpi .bar { background: #eef1f5; }
/* Le sol de l'atelier : un gris tres clair, pointille discret */
html.lt2[data-theme="light"] .pl-garage { background: radial-gradient(circle, #d6dbe3 1px, transparent 1.3px) 0 0 / 22px 22px, #f9fafb;
                                          border-color: var(--line); }
/* Les postes : blancs, trait net (les liserés bleu / rouge du haut restent) */
html.lt2[data-theme="light"] .pl-bay .in { border-color: var(--line-2); }
html.lt2[data-theme="light"] .pl-bay.free .in { background: rgba(255, 255, 255, .5); border: 1.5px dashed #c9cfd8; }
html.lt2[data-theme="light"] .pl-door .in { border-color: #c9cfd8; background: rgba(255, 255, 255, .55); }
/* Boutons du plan */
html.lt2[data-theme="light"] .pl-b { background: #fff; color: #344054; border-color: var(--line-2) !important; box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
html.lt2[data-theme="light"] .pl-b:hover { background: #f9fafb; border-color: #c4cad4 !important; }
html.lt2[data-theme="light"] .pl-b.red, html.lt2[data-theme="light"] .pl-b.blue, html.lt2[data-theme="light"] .pl-b.green { box-shadow: 0 1px 2px rgba(16, 24, 40, .1); }
html.lt2[data-theme="light"] .pl-b.green { color: #fff !important; }
/* Colonne de droite (hors des postes) : un panneau a peine gris, des cartes blanches */
html.lt2[data-theme="light"] .pl-right { background: #fbfcfd; border-left-color: var(--line); }
html.lt2[data-theme="light"] .pl-card { background: #fff; border-color: var(--line); box-shadow: var(--sh-1); }
html.lt2[data-theme="light"] .pl-card:hover { border-color: #c4cad4; }
html.lt2[data-theme="light"] .pl-card.sel { border-color: var(--pl-blue); box-shadow: 0 0 0 3px var(--pl-blue-tint); }

/* Le bouton ☰ : clair, comme les autres boutons */
html.lt2[data-theme="light"] .ham { background: #fff; color: #344054; border: 1px solid var(--line-2); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
html.lt2[data-theme="light"] .ham:hover { background: #f9fafb; }

/* Rouge plein, texte blanc : « Clôturer la journée » et la pastille des notifications */
html.lt2[data-theme="light"] .side .side-close a:not(.done):not(.stale),
html.lt2[data-theme="light"] .side .side-close a:not(.done):not(.stale):hover,
html.lt2[data-theme="light"] .side .side-close a:not(.done):not(.stale) .ni { background: var(--accent); color: #fff; }
html.lt2[data-theme="light"] .side .side-close a:not(.done):not(.stale):hover { background: var(--accent-2); }
html.lt2[data-theme="light"] .ham .ntf-badge { background: var(--accent); color: #fff; box-shadow: 0 0 0 2px #fff; }

/* WhatsApp : toujours vert (texte vert, fond vert tres clair, contour vert) */
html.lt2[data-theme="light"] .pl-b.wa, html.lt2[data-theme="light"] .pl-b[data-a="tell"],
html.lt2[data-theme="light"] .pl-qa .wa, html.lt2[data-theme="light"] a.ic.wa, html.lt2[data-theme="light"] a.pl-ico[href*="wa.me"] {
    color: #067647 !important; background: #ecfdf3 !important; border: 1px solid #a6e9c5 !important; }
html.lt2[data-theme="light"] .pl-b.wa:hover, html.lt2[data-theme="light"] .pl-b[data-a="tell"]:hover,
html.lt2[data-theme="light"] .pl-qa .wa:hover, html.lt2[data-theme="light"] a.ic.wa:hover, html.lt2[data-theme="light"] a.pl-ico[href*="wa.me"]:hover {
    background: #d1fadf !important; border-color: #12b76a !important; }

/* La fiche d'une voiture : fond gris tres clair, chaque section = une carte blanche bien detachee */
html.lt2[data-theme="light"] .pl-drawer { background: var(--bg); border-left-color: var(--line-2); }
html.lt2[data-theme="light"] .pl-sec { background: #fff; border: 1px solid var(--line-2); box-shadow: 0 1px 3px rgba(16, 24, 40, .07); }
html.lt2[data-theme="light"] .pl-sec h4, html.lt2[data-theme="light"] details.pl-sec summary { color: #344054; }
