/* Pcfact — overrides charte Provence Cloud (v1.25 + thème bleu v1.28 + v1.30 thème global). */ :root { /* Thème vert (défaut, charte historique Provence Cloud) */ --pc-primary: #00897B; --pc-primary-dark: #00695C; --pc-primary-light: #4DB6AC; --pc-primary-ring: rgba(0, 137, 123, 0.35); --pc-slate: #37474F; --pc-slate-dark: #263238; --pc-accent-bg: #F5F5F5; } /* Thème bleu (azur Provence) — opt-in via data-theme="bleu" sur . */ body[data-theme="bleu"] { --pc-primary: #1565C0; --pc-primary-dark: #0D47A1; --pc-primary-light: #64B5F6; --pc-primary-ring: rgba(21, 101, 192, 0.35); --pc-slate: #1A2D3F; --pc-slate-dark: #102030; } body { font-family: "Roboto", "Liberation Sans", "DejaVu Sans", Arial, sans-serif; color: #263238; } /* ============================================================================ * Overrides Tailwind « teal-x / slate-x » vers variables de thème. * On préfixe par `body` pour garantir la spécificité contre les utilitaires * Tailwind pré-compilés. * ============================================================================ */ /* Header principal */ body header.bg-slate-800 { background: var(--pc-slate-dark); } /* Branding teal */ body .text-teal-300 { color: var(--pc-primary-light) !important; } body .text-teal-500 { color: var(--pc-primary) !important; } body .text-teal-600 { color: var(--pc-primary-dark) !important; } body .text-teal-700 { color: var(--pc-primary-dark) !important; } body .text-teal-800 { color: var(--pc-primary-dark) !important; } body .bg-teal-500 { background-color: var(--pc-primary) !important; } body .bg-teal-700 { background-color: var(--pc-primary) !important; } body .bg-teal-800 { background-color: var(--pc-primary-dark) !important; } body .hover\:bg-teal-700:hover { background-color: var(--pc-primary) !important; } body .hover\:bg-teal-800:hover { background-color: var(--pc-primary-dark) !important; } body .hover\:text-teal-300:hover { color: var(--pc-primary-light) !important; } body .focus\:ring-teal-500:focus { --tw-ring-color: var(--pc-primary-ring) !important; } body .focus\:border-teal-500:focus { border-color: var(--pc-primary) !important; } /* Bandeau-titre PCFACT (sous le header) */ .pc-banner { background: var(--pc-slate); color: #fff; padding: 1rem 1.5rem; display: flex; align-items: center; gap: 1rem; } .pc-banner img.logo { display: block; width: auto; height: auto; max-width: 7.5rem; max-height: 3rem; object-fit: contain; flex: 0 0 auto; } .pc-banner .titles { line-height: 1.15; } .pc-banner .brand { font-weight: 700; font-size: 1.4rem; letter-spacing: 0.04em; } .pc-banner .subbrand{ font-size: 0.9rem; opacity: 0.9; } .pc-banner .version { font-size: 0.7rem; opacity: 0.65; } /* Cartes dashboard avec bordure gauche teal */ .pc-card { background: #fff; border-left: 4px solid var(--pc-primary); border-radius: 0.5rem; box-shadow: 0 1px 2px rgba(0,0,0,0.06); padding: 1rem; } /* ============================================================================ * Composants Pcfact — source de vérité unique (plain CSS, plus de @apply). * .btn-*, .input, table.tbl : tout est défini ici, sans dépendre de la * compilation Tailwind d'utilitaires (le bloc