/* ===================================================================== THEME LIGHT - supportcodefacile Toutes les regles ne s'appliquent que si . Le theme sombre est le defaut (style.css, homepage.css, tools.css). ===================================================================== */ /* ===================================================================== 1. BOUTON BASCULE (visible dans les deux modes) ===================================================================== */ .header-theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); color: rgba(255,255,255,0.85); text-decoration: none; font-size: 1rem; line-height: 1; cursor: pointer; transition: all 0.25s ease; flex-shrink: 0; } .header-theme-toggle:hover { background: rgba(255,255,255,0.14); border-color: rgba(255,255,255,0.25); transform: rotate(20deg); } /* ===================================================================== 2. VARIABLES CSS DU THEME CLAIR ===================================================================== */ [data-theme="light"] { --bg-primary: #f1f5f9; --bg-secondary: rgba(15,23,42,0.04); --bg-tertiary: rgba(15,23,42,0.02); --card-bg: rgba(255,255,255,0.85); --text-primary: #0f172a; --text-secondary: rgba(15,23,42,0.62); --text-muted: rgba(15,23,42,0.55); --border: rgba(15,23,42,0.1); --border-color: rgba(15,23,42,0.1); --glass-bg: rgba(255,255,255,0.7); --glass-border: rgba(15,23,42,0.08); } /* ===================================================================== 3. BODY / FOND / ORBES ===================================================================== */ [data-theme="light"] body { background: linear-gradient(160deg, #eef2ff 0%, #e0e7ff 50%, #f5f3ff 100%); color: var(--text-primary); } [data-theme="light"] body::before { background: radial-gradient(circle, #a5b4fc, #5eead4); opacity: 0.35; } [data-theme="light"] body::after { background: radial-gradient(circle, #fda4af, #a5b4fc); opacity: 0.30; } /* ===================================================================== 4. HEADER ===================================================================== */ [data-theme="light"] .app-header { background: rgba(255,255,255,0.7); color: var(--text-primary); box-shadow: 0 1px 0 rgba(15,23,42,0.08), 0 4px 30px rgba(15,23,42,0.06); border-bottom: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .header-brand { color: var(--text-primary); } [data-theme="light"] .header-stat { background: rgba(15,23,42,0.05); border: 1px solid rgba(15,23,42,0.08); color: rgba(15,23,42,0.65); } [data-theme="light"] .header-assistant { background: rgba(139,92,246,0.12); border: 1px solid rgba(139,92,246,0.3); color: #6d28d9; } [data-theme="light"] .header-assistant:hover { background: rgba(139,92,246,0.22); border-color: rgba(139,92,246,0.5); color: #5b21b6; } [data-theme="light"] .header-theme-toggle { background: rgba(15,23,42,0.06); border: 1px solid rgba(15,23,42,0.12); color: rgba(15,23,42,0.85); } [data-theme="light"] .header-theme-toggle:hover { background: rgba(15,23,42,0.12); border-color: rgba(15,23,42,0.22); } [data-theme="light"] .header-search input { background: rgba(255,255,255,0.6); border: 1px solid rgba(15,23,42,0.12); color: var(--text-primary); } [data-theme="light"] .header-search input::placeholder { color: rgba(15,23,42,0.4); } [data-theme="light"] .header-search input:focus { border-color: rgba(99,102,241,0.5); background: rgba(255,255,255,0.85); box-shadow: 0 0 20px rgba(99,102,241,0.15); } /* ===================================================================== 5. BREADCRUMB / FOOTER ===================================================================== */ [data-theme="light"] .breadcrumb { color: var(--text-secondary); } [data-theme="light"] .breadcrumb-sep { color: rgba(15,23,42,0.3); } [data-theme="light"] .breadcrumb-current { color: var(--text-primary); } [data-theme="light"] .app-footer { color: rgba(15,23,42,0.55); background: rgba(255,255,255,0.55); border-top: 1px solid rgba(15,23,42,0.08); } /* ===================================================================== 6. CARDS ===================================================================== */ [data-theme="light"] .card { background: rgba(255,255,255,0.78); border: 1px solid rgba(15,23,42,0.08); box-shadow: 0 8px 32px rgba(15,23,42,0.08); } [data-theme="light"] .card-header { background: rgba(15,23,42,0.03); border-bottom: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .card-header h3 { color: var(--text-primary); } /* ===================================================================== 7. BOUTONS ===================================================================== */ [data-theme="light"] .btn-secondary { background: rgba(15,23,42,0.06); color: rgba(15,23,42,0.85); border: 1px solid rgba(15,23,42,0.1); } [data-theme="light"] .btn-secondary:hover { background: rgba(15,23,42,0.1); border-color: rgba(15,23,42,0.18); } [data-theme="light"] .btn-small, [data-theme="light"] .btn-icon { background: rgba(15,23,42,0.06); color: rgba(15,23,42,0.75); border: 1px solid rgba(15,23,42,0.12); } [data-theme="light"] .btn-small:hover, [data-theme="light"] .btn-icon:hover { background: rgba(15,23,42,0.12); border-color: rgba(15,23,42,0.22); color: #0f172a; } /* ===================================================================== 8. SCROLLBAR / SELECTION ===================================================================== */ [data-theme="light"] ::-webkit-scrollbar-track { background: rgba(15,23,42,0.04); } [data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(15,23,42,0.18); } [data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: rgba(15,23,42,0.3); } [data-theme="light"] ::selection { background: rgba(99,102,241,0.25); color: #0f172a; } /* ===================================================================== 9. HOMEPAGE - FILTER PILLS / TOOL TILES ===================================================================== */ [data-theme="light"] .category-filters { background: rgba(255,255,255,0.6); border: 1px solid rgba(15,23,42,0.08); box-shadow: 0 4px 20px rgba(15,23,42,0.06); } [data-theme="light"] .filter-pill { background: rgba(255,255,255,0.5); border: 1px solid rgba(15,23,42,0.1); color: rgba(15,23,42,0.7); } [data-theme="light"] .filter-pill:hover { background: rgba(99,102,241,0.08); border-color: rgba(99,102,241,0.4); color: rgba(15,23,42,0.95); } [data-theme="light"] .tool-tile { background: rgba(255,255,255,0.78); border: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .tool-tile:hover { background: rgba(255,255,255,0.95); border-color: rgba(15,23,42,0.18); box-shadow: 0 20px 40px rgba(15,23,42,0.1), 0 0 30px rgba(99,102,241,0.08); } [data-theme="light"] .tool-tile-name, [data-theme="light"] .tool-tile h3 { color: #0f172a; } [data-theme="light"] .tool-tile-desc, [data-theme="light"] .tool-tile p { color: rgba(15,23,42,0.65); } [data-theme="light"] .tool-tile-icon { background: rgba(15,23,42,0.06); border: 1px solid rgba(15,23,42,0.1); } [data-theme="light"] .tool-tile:hover .tool-tile-icon { background: rgba(15,23,42,0.1); border-color: rgba(15,23,42,0.18); } [data-theme="light"] .no-results { color: rgba(15,23,42,0.55); } /* ===================================================================== 10. PAGINATION ===================================================================== */ [data-theme="light"] .pagination { background: rgba(255,255,255,0.6); border: 1px solid rgba(15,23,42,0.08); box-shadow: 0 4px 20px rgba(15,23,42,0.06); } [data-theme="light"] .pagination-btn { background: rgba(255,255,255,0.7); border: 1px solid rgba(15,23,42,0.12); color: rgba(15,23,42,0.75); } [data-theme="light"] .pagination-btn:hover:not(:disabled):not(.active) { background: rgba(99,102,241,0.1); border-color: rgba(99,102,241,0.45); color: #0f172a; } [data-theme="light"] .pagination-btn.active { background: linear-gradient(135deg, var(--accent-teal), var(--accent-indigo)); border-color: transparent; color: white; box-shadow: 0 4px 15px rgba(99,102,241,0.3); } [data-theme="light"] .pagination-ellipsis { color: rgba(15,23,42,0.45); } [data-theme="light"] .pagination-info { color: rgba(15,23,42,0.6); } /* ===================================================================== 11. TOOLS-NAV (navigation rapide des outils) ===================================================================== */ [data-theme="light"] .tools-nav { background: rgba(255,255,255,0.7); border: 1px solid rgba(15,23,42,0.08); box-shadow: 0 4px 20px rgba(15,23,42,0.06); } [data-theme="light"] .tools-nav-label { color: rgba(15,23,42,0.65); } [data-theme="light"] .tools-nav-link { background: rgba(15,23,42,0.04); color: rgba(15,23,42,0.85); border: 1px solid rgba(15,23,42,0.1); } [data-theme="light"] .tools-nav-link:hover { background: var(--primary); color: white; border-color: var(--primary); } [data-theme="light"] .tools-nav-separator { color: rgba(15,23,42,0.2); } /* ===================================================================== 12. FORMULAIRES (inputs, selects, textareas, slider, checkbox, radio) ===================================================================== */ [data-theme="light"] input, [data-theme="light"] select, [data-theme="light"] textarea, [data-theme="light"] .form-output, [data-theme="light"] .form-textarea, [data-theme="light"] .form-select { background: rgba(255,255,255,0.85); color: var(--text-primary); border: 1px solid rgba(15,23,42,0.15); } [data-theme="light"] input::placeholder, [data-theme="light"] textarea::placeholder, [data-theme="light"] .form-output::placeholder, [data-theme="light"] .form-textarea::placeholder { color: rgba(15,23,42,0.4); } [data-theme="light"] input:focus, [data-theme="light"] select:focus, [data-theme="light"] textarea:focus, [data-theme="light"] .form-output:focus, [data-theme="light"] .form-textarea:focus, [data-theme="light"] .form-select:focus { border-color: rgba(99,102,241,0.55); background: #fff; box-shadow: 0 0 0 3px rgba(99,102,241,0.15); outline: none; } [data-theme="light"] .form-select option { background: #fff; color: var(--text-primary); } [data-theme="light"] .form-label, [data-theme="light"] .checkbox-label, [data-theme="light"] .radio-label { color: rgba(15,23,42,0.78); } [data-theme="light"] .form-hint, [data-theme="light"] .slider-labels, [data-theme="light"] .cron-hint, [data-theme="light"] .cron-description { color: rgba(15,23,42,0.55); } [data-theme="light"] .form-slider { background: linear-gradient(to right, var(--accent-teal) 0%, var(--accent-indigo) var(--value, 18.75%), rgba(15,23,42,0.12) var(--value, 18.75%), rgba(15,23,42,0.12) 100%); } [data-theme="light"] .checkbox-item { background: rgba(255,255,255,0.65); border: 1px solid rgba(15,23,42,0.12); } [data-theme="light"] .checkbox-item:hover { background: rgba(255,255,255,0.85); border-color: rgba(15,23,42,0.22); } [data-theme="light"] .os-label { background: rgba(255,255,255,0.65); color: rgba(15,23,42,0.8); border: 2px solid rgba(15,23,42,0.12); } /* ===================================================================== 13. INFO / DESCRIPTION / HELP ===================================================================== */ [data-theme="light"] .tool-info { background: rgba(15,23,42,0.03); border: 1px solid rgba(15,23,42,0.08); color: rgba(15,23,42,0.65); } [data-theme="light"] .tool-info code { background: rgba(15,23,42,0.08); border: 1px solid rgba(15,23,42,0.08); color: #0d9488; } [data-theme="light"] .tool-help { border: 1px solid rgba(15,23,42,0.1); } [data-theme="light"] .tool-help-toggle { background: rgba(15,23,42,0.04); color: rgba(15,23,42,0.65); } [data-theme="light"] .tool-help-toggle:hover { background: rgba(15,23,42,0.08); color: rgba(15,23,42,0.85); } [data-theme="light"] .tool-help-content { color: rgba(15,23,42,0.7); border-top: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .tool-help-content h4 { color: rgba(15,23,42,0.85); } [data-theme="light"] .tool-help-content kbd { background: rgba(15,23,42,0.08); border: 1px solid rgba(15,23,42,0.15); color: rgba(15,23,42,0.85); } [data-theme="light"] .tool-description { background: rgba(15,23,42,0.03); color: rgba(15,23,42,0.75); } [data-theme="light"] .tool-description code { background: rgba(15,23,42,0.08); color: #0d9488; } /* ===================================================================== 14. DROP ZONE / DRAGOVER ===================================================================== */ [data-theme="light"] .drop-zone { border: 2px dashed rgba(15,23,42,0.2); color: rgba(15,23,42,0.65); } [data-theme="light"] .drop-zone:hover, [data-theme="light"] .drop-zone.dragover { border-color: var(--accent-indigo); background: rgba(99,102,241,0.06); color: #0d9488; } /* ===================================================================== 15. TABLES GENERIQUES ===================================================================== */ [data-theme="light"] table { color: var(--text-primary); } [data-theme="light"] table th { background: rgba(15,23,42,0.05); color: var(--text-primary); border-color: rgba(15,23,42,0.1); } [data-theme="light"] table td { border-color: rgba(15,23,42,0.08); color: rgba(15,23,42,0.78); } [data-theme="light"] table tr:nth-child(even) td { background: rgba(15,23,42,0.02); } [data-theme="light"] table tr:hover td { background: rgba(99,102,241,0.04); } /* ===================================================================== 16. PRE / CODE / OUTPUT CONSOLE ===================================================================== */ [data-theme="light"] pre { background: #f1f5f9; color: #1e3a8a; border-color: rgba(15,23,42,0.1); } [data-theme="light"] code { background: rgba(15,23,42,0.06); color: #0f766e; border-color: rgba(15,23,42,0.08); } [data-theme="light"] pre code { background: transparent; color: inherit; } [data-theme="light"] .install-hint, [data-theme="light"] .linux-output { background: #f8fafc; border: 1px solid rgba(15,23,42,0.1); color: #b45309; } /* ===================================================================== 17. DOCUMENTATION (doc-content / doc-toc / doc-tip / doc-warning) ===================================================================== */ [data-theme="light"] .doc-content { color: rgba(15,23,42,0.85); } [data-theme="light"] .doc-content h3, [data-theme="light"] .doc-content h4 { color: var(--text-primary); } [data-theme="light"] .doc-content h2 { border-bottom-color: rgba(15,23,42,0.1); } [data-theme="light"] .doc-content p, [data-theme="light"] .doc-content li { color: rgba(15,23,42,0.85); } [data-theme="light"] .doc-content pre { background: #f1f5f9; border: 1px solid rgba(15,23,42,0.1); color: #1e3a8a; } [data-theme="light"] .doc-content code { background: rgba(15,23,42,0.06); color: #0f766e; } [data-theme="light"] .doc-content pre code { color: inherit; background: transparent; } [data-theme="light"] .doc-content th { background: rgba(15,23,42,0.06); color: var(--text-primary); border-bottom: 1px solid rgba(15,23,42,0.12); } [data-theme="light"] .doc-content td { color: rgba(15,23,42,0.78); border-bottom: 1px solid rgba(15,23,42,0.06); } [data-theme="light"] .doc-content tr:hover td { background: rgba(99,102,241,0.04); } [data-theme="light"] .doc-toc { background: rgba(255,255,255,0.6); border: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .doc-toc-title { color: var(--text-primary); } [data-theme="light"] .doc-toc a { color: #4f46e5; } [data-theme="light"] .doc-toc a:hover { color: #3730a3; } [data-theme="light"] .doc-tip, [data-theme="light"] .doc-warning, [data-theme="light"] .doc-info { color: var(--text-primary); } [data-theme="light"] .doc-tip { background: rgba(20,184,166,0.1); border-left-color: #0d9488; } [data-theme="light"] .doc-warning { background: rgba(244,63,94,0.08); border-left-color: #e11d48; } [data-theme="light"] .doc-info { background: rgba(99,102,241,0.08); border-left-color: #4f46e5; } /* ===================================================================== 18. MODALE CHANGELOG + BOUTON ===================================================================== */ [data-theme="light"] #changelogModal { background: rgba(15,23,42,0.45) !important; } [data-theme="light"] #changelogModal > div { background: #ffffff !important; border-color: rgba(15,23,42,0.1) !important; box-shadow: 0 8px 32px rgba(15,23,42,0.18) !important; } [data-theme="light"] #changelogModal h3 { color: #0f172a !important; } [data-theme="light"] #changelogModal p, [data-theme="light"] #changelogModal li, [data-theme="light"] #changelogModal ul { color: rgba(15,23,42,0.78) !important; } [data-theme="light"] #changelogModal span[style*="background:var(--border-color"] { background: rgba(15,23,42,0.08) !important; color: #0f172a !important; } [data-theme="light"] .changelog-btn { border-color: rgba(15,23,42,0.15); color: rgba(15,23,42,0.65); } [data-theme="light"] .changelog-btn:hover { background: rgba(59,130,246,0.12); color: #2563eb; border-color: rgba(59,130,246,0.4); } /* Bouton retour en haut */ [data-theme="light"] #scrollTopBtn { background: rgba(255,255,255,0.95); border-color: rgba(15,23,42,0.12); color: #0f172a; box-shadow: 0 2px 8px rgba(15,23,42,0.15); } [data-theme="light"] #scrollTopBtn:hover { background: rgba(99,102,241,0.18); border-color: rgba(99,102,241,0.45); } /* ===================================================================== 19. CHMOD / CRON / HTTP STATUS / LINUX / LICENCE ===================================================================== */ [data-theme="light"] .chmod-result, [data-theme="light"] .codefab-details, [data-theme="light"] .lic-summary-item, [data-theme="light"] .bitdecrypter-results, [data-theme="light"] .bits-edit-list, [data-theme="light"] .tables-list { background: rgba(255,255,255,0.6); border: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .chmod-header { color: var(--text-primary); border-bottom-color: rgba(15,23,42,0.2); } [data-theme="light"] .chmod-result-label, [data-theme="light"] .codefab-label, [data-theme="light"] .lic-summary-label, [data-theme="light"] .codefab-ascii, [data-theme="light"] .lic-summary-sub, [data-theme="light"] .bit-edit-info { color: rgba(15,23,42,0.6); } [data-theme="light"] .chmod-result-value { color: #0d9488; } [data-theme="light"] .chmod-result code, [data-theme="light"] .tool-info code { color: #0d9488; } [data-theme="light"] .codefab-value, [data-theme="light"] .lic-summary-value, [data-theme="light"] .bit-edit-info strong { color: var(--text-primary); } [data-theme="light"] .codefab-row { border-bottom-color: rgba(15,23,42,0.08); } [data-theme="light"] .cron-presets { background: rgba(15,23,42,0.03); border: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .cron-result { background: rgba(34,197,94,0.08); border: 1px solid rgba(34,197,94,0.25); } [data-theme="light"] .cron-output { color: var(--text-primary); } [data-theme="light"] .cron-description { color: #15803d; border-top-color: rgba(34,197,94,0.3); } [data-theme="light"] .http-status-header, [data-theme="light"] .http-description, [data-theme="light"] .http-category { background: rgba(15,23,42,0.03); border-color: rgba(15,23,42,0.1); } [data-theme="light"] .http-name { color: var(--text-primary); } [data-theme="light"] .http-description { color: rgba(15,23,42,0.78); } [data-theme="light"] .http-category { color: rgba(15,23,42,0.62); } [data-theme="light"] .lic-tabs, [data-theme="light"] .editor-tabs, [data-theme="light"] .linux-tabs { background: rgba(15,23,42,0.03); border-bottom-color: rgba(15,23,42,0.1); } [data-theme="light"] .lic-tab, [data-theme="light"] .editor-tab, [data-theme="light"] .linux-tab { color: rgba(15,23,42,0.65); background: transparent; } [data-theme="light"] .editor-tab { background: rgba(15,23,42,0.04); } [data-theme="light"] .lic-tab:hover, [data-theme="light"] .editor-tab:hover, [data-theme="light"] .linux-tab:hover { background: rgba(15,23,42,0.06); color: var(--accent-teal); } [data-theme="light"] .lic-tab.active { background: rgba(15,23,42,0.06); color: var(--accent-teal); } [data-theme="light"] .lic-module-badge { background: rgba(15,23,42,0.06); border: 1px solid rgba(15,23,42,0.08); color: rgba(15,23,42,0.7); } [data-theme="light"] .bit-result-item.bit-false { background: rgba(15,23,42,0.03); border: 1px solid rgba(15,23,42,0.08); color: rgba(15,23,42,0.5); } [data-theme="light"] .bit-edit-input { background: #fff; border: 1px solid rgba(15,23,42,0.15); color: var(--text-primary); } [data-theme="light"] .bit-value { color: rgba(15,23,42,0.6); } [data-theme="light"] .table-item { background: rgba(255,255,255,0.65); border: 1px solid rgba(15,23,42,0.1); color: var(--text-primary); } [data-theme="light"] .editor-tab.active { background: linear-gradient(135deg, var(--accent-teal), var(--accent-indigo)); color: white; } /* ===================================================================== 20. STATUS MESSAGES (purge-status, rss-status, lic-error) ===================================================================== */ [data-theme="light"] .purge-status-loading { background: rgba(245,158,11,0.12); border-color: rgba(245,158,11,0.3); color: #92400e; } [data-theme="light"] .purge-status-success { background: rgba(34,197,94,0.12); border-color: rgba(34,197,94,0.3); color: #166534; } [data-theme="light"] .purge-status-error, [data-theme="light"] .lic-error, [data-theme="light"] .rss-status-error { background: rgba(239,68,68,0.1); border-color: rgba(239,68,68,0.3); color: #b91c1c; } [data-theme="light"] .purge-status-warning { background: rgba(249,115,22,0.1); border-color: rgba(249,115,22,0.3); color: #c2410c; } [data-theme="light"] .rss-status-info { background: rgba(99,102,241,0.1); border-color: rgba(99,102,241,0.3); color: rgba(15,23,42,0.85); } /* ===================================================================== 21. MX ANALYZER + DNS / MX classique ===================================================================== */ [data-theme="light"] .mxa-loading, [data-theme="light"] .mxa-empty, [data-theme="light"] .rss-loading, [data-theme="light"] .rss-empty { background: rgba(255,255,255,0.5); border: 1px dashed rgba(15,23,42,0.15); color: rgba(15,23,42,0.62); } [data-theme="light"] .mxa-domain-title, [data-theme="light"] .mxa-host, [data-theme="light"] .mxa-ip-addr { color: var(--text-primary); } [data-theme="light"] .mxa-mx, [data-theme="light"] .mxa-auth-card { background: rgba(255,255,255,0.75); border: 1px solid rgba(15,23,42,0.1); } [data-theme="light"] .mxa-mx-header { border-bottom-color: rgba(15,23,42,0.08); } [data-theme="light"] .mxa-auth-card strong { color: var(--text-primary); } [data-theme="light"] .mxa-auth-card code, [data-theme="light"] .mxa-line, [data-theme="light"] .mxa-ttl, [data-theme="light"] .mxa-ptr, [data-theme="light"] .mxa-country { color: rgba(15,23,42,0.62); } [data-theme="light"] .mxa-ip { background: rgba(15,23,42,0.04); border: 1px solid rgba(15,23,42,0.08); } [data-theme="light"] .mxa-ip-type { background: rgba(15,23,42,0.08); border: 1px solid rgba(15,23,42,0.15); color: rgba(15,23,42,0.75); } [data-theme="light"] .mxa-ptr code { color: rgba(15,23,42,0.75); background: transparent; } [data-theme="light"] .mxa-country { border: 1px solid rgba(15,23,42,0.15); } [data-theme="light"] .mxa-key { color: rgba(15,23,42,0.5); } [data-theme="light"] .mxa-banner code { background: #f1f5f9; border: 1px solid rgba(15,23,42,0.08); color: rgba(15,23,42,0.85); } [data-theme="light"] .mxa-bl-detail, [data-theme="light"] .mxa-error-text { color: #b91c1c; } [data-theme="light"] .mxa-auth-ko code { color: #b91c1c; } [data-theme="light"] .mxa-badge-ok { background: rgba(34,197,94,0.15); color: #166534; border: 1px solid rgba(34,197,94,0.3); } [data-theme="light"] .mxa-badge-warn { background: rgba(245,158,11,0.15); color: #92400e; border: 1px solid rgba(245,158,11,0.3); } [data-theme="light"] .mxa-badge-ko { background: rgba(239,68,68,0.15); color: #b91c1c; border: 1px solid rgba(239,68,68,0.3); } [data-theme="light"] .mxa-priority { background: rgba(99,102,241,0.12); border: 1px solid rgba(99,102,241,0.3); color: #4338ca; } [data-theme="light"] .mx-section-header, [data-theme="light"] .mx-host { color: var(--text-primary); } [data-theme="light"] .mx-section-header { background: rgba(15,23,42,0.04); } [data-theme="light"] .mx-ip, [data-theme="light"] .mx-no-results { color: rgba(15,23,42,0.62); } /* ===================================================================== 22. RSS ===================================================================== */ [data-theme="light"] .rss-meta { color: rgba(15,23,42,0.6); } [data-theme="light"] .rss-item { background: rgba(255,255,255,0.78); border: 1px solid rgba(15,23,42,0.1); } [data-theme="light"] .rss-item:hover { background: rgba(255,255,255,0.95); border-color: rgba(15,23,42,0.18); } [data-theme="light"] .rss-item-title { color: var(--text-primary); } [data-theme="light"] .rss-item-meta { color: rgba(15,23,42,0.6); } [data-theme="light"] .rss-item-desc { color: rgba(15,23,42,0.7); } /* ===================================================================== 23. NOTICE LINK ===================================================================== */ [data-theme="light"] .notice-link { color: #0d9488; background: rgba(20,184,166,0.08); border: 1px solid rgba(20,184,166,0.25); } [data-theme="light"] .notice-link:hover { background: rgba(20,184,166,0.15); color: #0f766e; } /* ===================================================================== 24. HTTP CODE BADGES (gardent leurs couleurs : 1xx/2xx/etc.) Leur lisibilite est OK sur fond clair grace au contraste de leur badge. On ajuste seulement le texte de la description. ===================================================================== */ [data-theme="light"] .http-code.http-1xx { color: #1d4ed8; } [data-theme="light"] .http-code.http-2xx { color: #15803d; } [data-theme="light"] .http-code.http-3xx { color: #b45309; } [data-theme="light"] .http-code.http-4xx { color: #b91c1c; } [data-theme="light"] .http-code.http-5xx { color: #be123c; }