/* ============================================
   QioQips - Thème Blanc & Rouge Global
   Ce fichier surcharge TOUS les styles Pico CSS
============================================ */

:root {
    /* Couleurs QioQips */
    --qioqips-primary: #ef4444;
    --qioqips-secondary: #dc2626;
    --qioqips-light: #fef2f2;
    
    /* Override Pico CSS variables */
    --primary: #ef4444;
    --primary-hover: #dc2626;
    --primary-focus: rgba(239, 68, 68, 0.125);
    --primary-inverse: #fff;
    
    /* Fond */
    --background-color: #ffffff;
    --card-background-color: #ffffff;
    --card-border-color: #fee2e2;
    
    /* Texte */
    --color: #1f2937;
    --h1-color: #111827;
    --h2-color: #1f2937;
    --h3-color: #374151;
    
    /* Bordures */
    --border-color: #fecaca;
    --muted-border-color: #fecaca;
    
    /* Formulaires */
    --form-element-border-color: #fecaca;
    --form-element-focus-color: #ef4444;
    --form-element-background-color: #ffffff;
    
    /* Tables */
    --table-border-color: #fee2e2;
}

/* BODY */
body {
    background: linear-gradient(135deg, #ffffff 0%, #fee2e2 50%, #ffffff 100%) !important;
    color: #1f2937 !important;
}

/* BOUTONS */
button:not(.secondary):not([role="button"]) {
    background: var(--qioqips-primary) !important;
    border-color: var(--qioqips-primary) !important;
    color: white !important;
}

button:not(.secondary):not([role="button"]):hover {
    background: var(--qioqips-secondary) !important;
    border-color: var(--qioqips-secondary) !important;
}

/* ARTICLES */
article {
    background: white !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    border: 1px solid #fee2e2 !important;
}

article > header {
    background: var(--qioqips-light) !important;
    border-bottom: 2px solid var(--qioqips-primary) !important;
    color: var(--qioqips-primary) !important;
}

article > footer {
    border-top: 1px solid #fee2e2 !important;
}

/* TABLES */
table {
    background: white !important;
}

table thead {
    background: var(--qioqips-primary) !important;
}

table thead th {
    color: #000000; /* Noir par défaut (lisible), puis surchargé par colors-loader.js avec !important */
    border-color: var(--qioqips-secondary) !important;
}

table tbody tr {
    border-bottom: 1px solid #fee2e2 !important;
}

table tbody tr:hover {
    background: var(--qioqips-light) !important;
}

/* FORMULAIRES */
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
    background: white !important;
    border-color: #fecaca !important;
    color: #1f2937 !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--qioqips-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(239, 68, 68, 0.25) !important;
}

/* CHECKBOXES ET RADIOS */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
    background-color: var(--qioqips-primary) !important;
    border-color: var(--qioqips-primary) !important;
}

/* LABELS */
label {
    color: #374151 !important;
}

/* DIALOG (MODALES) */
dialog {
    background: white !important;
    border: 2px solid var(--qioqips-primary) !important;
}

dialog article {
    background: white !important;
}

dialog article > header {
    background: var(--qioqips-light) !important;
    border-bottom: 2px solid var(--qioqips-primary) !important;
}

dialog article > footer {
    background: #fafafa !important;
    border-top: 1px solid #fee2e2 !important;
}

/* TITRES */
h1, h2, h3, h4, h5, h6 {
    color: #111827 !important;
}

/* LIENS */
a {
    color: var(--qioqips-primary) !important;
}

a:hover {
    color: var(--qioqips-secondary) !important;
}

/* SMALL TEXT */
small {
    color: #6b7280 !important;
}

/* BADGES DE STATUT */
.badge {
    font-weight: 600;
}

.badge-actif {
    background: #10b981 !important;
    color: white !important;
}

.badge-blesse {
    background: var(--qioqips-primary) !important;
    color: white !important;
}

.badge-suspendu {
    background: #f59e0b !important;
    color: white !important;
}

/* STAT CARDS */
.stat-card {
    background: white !important;
    border: 1px solid #fee2e2 !important;
}

.stat-card:hover {
    border-color: var(--qioqips-primary) !important;
}

/* PROGRESS BARS (si utilisées) */
progress {
    color: var(--qioqips-primary) !important;
}

progress::-webkit-progress-value {
    background-color: var(--qioqips-primary) !important;
}

progress::-moz-progress-bar {
    background-color: var(--qioqips-primary) !important;
}

/* LOADING INDICATOR */
[aria-busy="true"]:not(input):not(select):not(textarea)::before {
    border-top-color: var(--qioqips-primary) !important;
}

/* DETAILS / SUMMARY */
details {
    border-color: #fee2e2 !important;
}

summary {
    color: var(--qioqips-primary) !important;
}

/* CARDS */
.card {
    background: white !important;
    border: 1px solid #fee2e2 !important;
}

/* NAV ITEMS */
nav {
    background: white !important;
    border-bottom: 2px solid var(--qioqips-primary) !important;
}

nav ul li a {
    color: #374151 !important;
}

nav ul li a:hover {
    background: var(--qioqips-light) !important;
    color: var(--qioqips-primary) !important;
}

nav ul li a[aria-current] {
    background: var(--qioqips-primary) !important;
    color: white !important;
}

/* MARK / HIGHLIGHTS */
mark {
    background-color: #fef2f2 !important;
    color: var(--qioqips-primary) !important;
}

/* KBD (Keyboard) */
kbd {
    background-color: #fee2e2 !important;
    color: var(--qioqips-primary) !important;
}

/* CODE BLOCKS */
code {
    background-color: #fef2f2 !important;
    color: var(--qioqips-primary) !important;
}

pre {
    background-color: #1f2937 !important;
    border: 1px solid #fee2e2 !important;
}

/* BLOCKQUOTE */
blockquote {
    border-left: 4px solid var(--qioqips-primary) !important;
    background: var(--qioqips-light) !important;
}

/* SCROLLBARS (Webkit) */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #fee2e2;
}

::-webkit-scrollbar-thumb {
    background: var(--qioqips-primary);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--qioqips-secondary);
}

/* CALENDRIER - STYLES SPÉCIFIQUES */
.calendar-nav h2 {
    color: var(--qioqips-primary) !important;
}

.calendar-grid {
    background: transparent !important;
}

.calendar-day-header {
    background: var(--qioqips-primary) !important;
    color: white !important;
    font-weight: bold !important;
    border: none !important;
}

.calendar-day {
    background: white !important;
    border: 1px solid #f3f4f6 !important;
    color: #1f2937 !important;
}

.calendar-day:hover {
    background: var(--qioqips-light) !important;
    border-color: var(--qioqips-primary) !important;
}

.calendar-day.aujourd-hui {
    border: 2px solid var(--qioqips-primary) !important;
    background: var(--qioqips-light) !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1) !important;
}

.day-number {
    color: #1f2937 !important;
    font-weight: bold !important;
}

.event-item {
    font-weight: 600 !important;
}

.event-entrainement {
    background: #10b981 !important;
    color: white !important;
}

.event-match {
    background: var(--qioqips-primary) !important;
    color: white !important;
    font-weight: 700 !important;
}

.event-evenement {
    background: #6b7280 !important;
    color: white !important;
}

/* EVENT CARDS (Vue liste) */
.event-card {
    background: white !important;
    border: 1px solid #fee2e2 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.event-card h4 {
    color: #111827 !important;
}

.event-meta {
    color: #6b7280 !important;
}

.event-meta p {
    color: #6b7280 !important;
}

/* RECURRENCE OPTIONS */
#recurrence-options {
    background: var(--qioqips-light) !important;
    border: 1px solid #fecaca !important;
}

#recurrence-options p {
    color: var(--qioqips-primary) !important;
}

#recurrence-options label {
    color: #374151 !important;
}

/* TABS */
.tab {
    border: 2px solid #fecaca !important;
    background: white !important;
    color: #374151 !important;
}

.tab:hover {
    border-color: var(--qioqips-primary) !important;
    background: var(--qioqips-light) !important;
}

.tab.active {
    background: var(--qioqips-primary) !important;
    color: white !important;
    border-color: var(--qioqips-primary) !important;
}

/* CONTAINER */
.container,
.container-login {
    color: #1f2937 !important;
}

main {
    color: #1f2937 !important;
}

/* ACTIONS */
.actions button {
    margin: 0 !important;
}

/*强制所有文本为深色 */
p, span, div:not(.event-item):not(.badge) {
    color: #1f2937;
}

strong {
    color: #111827 !important;
}


