/* Compléments à Tabler : seul l'en-tête prend la couleur de l'entreprise (variable --tblr-primary posée sur <body>). */
body { --tblr-link-color: var(--tblr-primary); --tblr-link-color-rgb: var(--tblr-primary-rgb); --tblr-link-hover-color: var(--tblr-primary-darken); }
.entete { background: var(--tblr-primary); }
.cle { font-family: Consolas, monospace; background: var(--tblr-bg-surface-secondary); padding: 6px 10px; border-radius: 6px; word-break: break-all; user-select: all; }

/* Calendrier d'équipe : une colonne par jour du mois. */
.calendrier-equipe th.jour, .calendrier-equipe td.jour { text-align: center; padding: .25rem 0; min-width: 1.6rem; width: 1.6rem; }
.calendrier-equipe th.jour .lettre { display: block; font-weight: 400; font-size: .65rem; opacity: .7; }
.calendrier-equipe .colonne-nom { position: sticky; left: 0; background: var(--tblr-bg-surface); z-index: 1; min-width: 11rem; }
.calendrier-equipe .jour-we { background: var(--tblr-bg-surface-secondary); }
.calendrier-equipe td.jour-abs { background: var(--tblr-primary); }
.calendrier-equipe .jour-auj { box-shadow: inset 2px 0 0 var(--tblr-orange), inset -2px 0 0 var(--tblr-orange); }
.legende { display: inline-block; width: .9rem; height: .9rem; border-radius: 3px; vertical-align: -2px; margin-right: .25rem; border: 1px solid var(--tblr-border-color); }
.legende-abs { background: var(--tblr-primary); }
.legende-we { background: var(--tblr-bg-surface-secondary); }

/* Logo de l'entreprise : sur la page de connexion, et dans l'en-tête sur une pastille claire (lisible sur toute couleur). */
.logo-connexion { max-height: 90px; max-width: 100%; }
.logo-barre { height: 34px; width: auto; max-width: 120px; margin-right: .6rem; padding: 3px 6px; background: #fff; border-radius: 6px; vertical-align: middle; }

/* Administration : logo à côté du nom de l'entreprise et aperçu de la couleur. */
.logo-admin { height: 36px; width: auto; max-width: 140px; margin-right: .75rem; vertical-align: middle; }
.logo-apercu { max-height: 80px; max-width: 100%; padding: 6px; border: 1px solid var(--tblr-border-color); border-radius: 6px; background: #fff; }
.apercu-couleur { color: #fff; padding: .35rem .8rem; border-radius: 6px; font-size: .85rem; }

/* QR code de la page « Installer l'application » */
.qr-code { width: 260px; max-width: 100%; padding: .5rem; background: #fff; border: 1px solid var(--tblr-border-color); border-radius: .5rem; }
.qr-code svg { display: block; width: 100%; height: auto; }