/* Jobs — styles propres à l'application (Bootstrap 5 en base). */

:root {
    --jobs-primary: #2f5bea;
}

body {
    background-color: var(--jobs-page-bg, #f4f6fb);
}

[data-bs-theme="dark"] {
    --jobs-page-bg: #12151c;
    --jobs-primary: #5b7cf0;
}
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .list-group-item { background-color: #1b1f28; }
[data-bs-theme="dark"] .guest-card { background-color: #1b1f28; }
[data-bs-theme="dark"] .navbar.bg-primary { background-color: #1e2a55 !important; }
[data-bs-theme="dark"] .kanban-col { background: #161a22; }
[data-bs-theme="dark"] .kanban-card { background: #1f2430; }
[data-bs-theme="dark"] .notif-item.is-unread { background: rgba(91, 124, 240, .12); }
[data-bs-theme="dark"] .fc { --fc-border-color: #2d3340; --fc-page-bg-color: #1b1f28; --fc-neutral-bg-color: #232836;
    --fc-list-event-hover-bg-color: #232836; --fc-today-bg-color: rgba(91, 124, 240, .12); }
[data-bs-theme="dark"] .fc .fc-col-header-cell-cushion, [data-bs-theme="dark"] .fc .fc-daygrid-day-number { color: #c8d0e0; }

.bg-primary {
    background-color: var(--jobs-primary) !important;
}

/* Pages publiques (connexion, installation, erreurs) */
.guest-body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 1rem;
}

.guest-main {
    width: 100%;
    max-width: 420px;
}

.guest-main:has(.guest-card-wide) {
    max-width: 760px;
}

.guest-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--jobs-primary);
    margin-bottom: 1.25rem;
}

.guest-card {
    box-shadow: 0 .5rem 1.5rem rgba(20, 30, 60, .08);
    border: 0;
}

/* 2FA */
.code-input {
    letter-spacing: .25em;
    font-family: var(--bs-font-monospace);
}

.totp-qr {
    width: 200px;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .875rem;
    color: var(--bs-secondary-color);
}

.totp-secret {
    font-size: 1rem;
    word-break: break-all;
}

.backup-codes {
    font-size: 1.15rem;
    line-height: 1.8;
    columns: 2;
}

.config-dump {
    background: #1e1e1e;
    color: #e8e8e8;
    padding: 1rem;
    border-radius: .375rem;
    white-space: pre-wrap;
    word-break: break-all;
}

/* Cibles tactiles confortables sur mobile */
@media (max-width: 767.98px) {
    .btn, .form-control, .form-select {
        min-height: 44px;
    }
    .btn-sm {
        min-height: 36px;
    }
}

@media print {
    .navbar, .btn, .alert-dismissible .btn-close {
        display: none !important;
    }
    body {
        background: #fff;
    }
}

/* ---- Lot 2 : tâches ------------------------------------------------------ */

/* Palette des catégories (liste blanche Category::COLORS) */
.cat-blue   { --cat: #2f5bea; }
.cat-green  { --cat: #198754; }
.cat-orange { --cat: #e8590c; }
.cat-red    { --cat: #dc3545; }
.cat-purple { --cat: #7048e8; }
.cat-teal   { --cat: #0c8599; }
.cat-pink   { --cat: #d6336c; }
.cat-gray   { --cat: #6c757d; }

.badge-cat {
    background-color: var(--cat);
    color: #fff;
}

.cat-dot {
    display: inline-block;
    width: .9rem;
    height: .9rem;
    border-radius: 50%;
    background-color: var(--cat);
    flex-shrink: 0;
}

.min-w-0 { min-width: 0; }

.task-item {
    padding: .65rem .75rem;
}

.task-title {
    font-weight: 500;
    color: var(--bs-body-color);
    text-decoration: none;
    word-break: break-word;
}

.task-title:hover { text-decoration: underline; }

.task-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem .5rem;
    margin-top: .15rem;
}

.task-closed .task-title,
.task-closed-title {
    text-decoration: line-through;
    color: var(--bs-secondary-color);
}

.task-overdue {
    border-left: 3px solid var(--bs-danger);
}

/* Bouton rond « terminer » */
.task-check {
    width: 2rem;
    height: 2rem;
    min-height: 2rem !important;
    padding: 0;
    border-radius: 50%;
    border: 2px solid var(--bs-border-color);
    color: transparent;
    line-height: 1;
    font-weight: 700;
}

.task-check:hover { border-color: var(--bs-success); color: var(--bs-success); }
.task-check.is-done { background: var(--bs-success); border-color: var(--bs-success); color: #fff; }

.task-description {
    white-space: normal;
    word-break: break-word;
}

.task-details dt { font-weight: 600; font-size: .85rem; color: var(--bs-secondary-color); }
.task-details dd { margin-bottom: .75rem; }

.assignee-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    gap: .25rem 1rem;
}

/* Tableau de bord */
.stat-card { transition: box-shadow .15s; }
.stat-card:hover { box-shadow: 0 .25rem 1rem rgba(20, 30, 60, .1); }
.stat-value { font-size: 2rem; font-weight: 700; color: var(--jobs-primary); line-height: 1.1; }
.stat-label { color: var(--bs-secondary-color); }
.stat-alert .stat-value { color: var(--bs-danger); }

/* Rond « terminer » non cliquable (pas les droits) : ne doit pas ressembler à une tâche cochée */
.task-check.disabled:not(.is-done) {
    color: transparent;
    border-style: dashed;
    opacity: .45;
}

/* ---- Lot 3 : récurrence ---------------------------------------------------- */
.recurrence-box {
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
    padding: .75rem 1rem;
    background: var(--bs-tertiary-bg);
}
.interval-input { width: 5rem; }
.weekday-picker { display: flex; flex-wrap: wrap; gap: .35rem; }
.weekday-picker .btn { min-width: 3rem; }
.recurring-icon { font-size: .9em; }
.recurrence-card { border-left: 3px solid var(--jobs-primary); }
[hidden] { display: none !important; }

/* ---- Lot 4 : tableau de bord, calendrier, Kanban -------------------------- */
.jobs-progress {
    width: 100%;
    height: .6rem;
    appearance: none;
    border: 0;
    border-radius: 1rem;
    background: var(--bs-secondary-bg);
    overflow: hidden;
}
.jobs-progress::-webkit-progress-bar { background: var(--bs-secondary-bg); border-radius: 1rem; }
.jobs-progress::-webkit-progress-value { background: var(--jobs-primary); border-radius: 1rem; }
.jobs-progress::-moz-progress-bar { background: var(--jobs-primary); border-radius: 1rem; }
.jobs-progress.has-late::-webkit-progress-value { background: var(--bs-danger); }
.jobs-progress.has-late::-moz-progress-bar { background: var(--bs-danger); }

/* Calendrier : couleurs par classes (jamais de style inline) */
.fc .task-event { border: 0; background: var(--cat, var(--jobs-primary)); color: #fff; cursor: pointer; }
.fc .task-event .fc-event-main { color: #fff; }
.fc .fc-daygrid-dot-event.task-event,
.fc .fc-list-event.task-event { background: transparent; color: var(--bs-body-color); }
.fc .fc-daygrid-dot-event.task-event .fc-event-main,
.fc .fc-list-event.task-event .fc-event-main { color: var(--bs-body-color); }
.fc .task-event.status-done { opacity: .5; text-decoration: line-through; }
.fc .task-event.status-cancelled { opacity: .35; text-decoration: line-through; }
.fc .task-event.is-overdue { box-shadow: inset 3px 0 0 var(--bs-danger); }
.fc .task-event-content { padding: 1px 3px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .8rem; }
.fc .task-event-time { font-weight: 600; }
.fc .fc-toolbar-title { font-size: 1.15rem; text-transform: capitalize; }
.fc .fc-button { padding: .3rem .55rem; font-size: .85rem; }
.fc .fc-daygrid-day.fc-day-today, .fc .fc-timegrid-col.fc-day-today { background: rgba(47, 91, 234, .07); }

/* Kanban */
.kanban {
    display: grid;
    grid-template-columns: repeat(3, minmax(16rem, 1fr));
    gap: 1rem;
    overflow-x: auto;
    padding-bottom: .5rem;
}
.kanban-col { background: var(--bs-tertiary-bg); border-radius: .5rem; padding: .75rem; min-width: 0; }
.kanban-col-title { display: flex; justify-content: space-between; align-items: center; }
.kanban-cards { min-height: 6rem; display: flex; flex-direction: column; gap: .5rem; border-radius: .375rem; transition: background .15s; }
.kanban-cards.is-over { background: rgba(47, 91, 234, .1); outline: 2px dashed var(--jobs-primary); }
.kanban-card {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    padding: .5rem .65rem;
    box-shadow: 0 1px 2px rgba(20, 30, 60, .05);
}
.kanban-card[draggable="true"] { cursor: grab; }
.kanban-card.is-dragging { opacity: .4; }
.kanban-card.is-locked { opacity: .75; }
.kanban-card .task-meta { margin-top: .2rem; }
.kanban-moves .btn { min-height: 2rem !important; padding: 0 .5rem; }
.kanban-cards .kanban-empty { display: none; margin: .5rem 0 0; }
.kanban-cards:not(:has(.kanban-card)) .kanban-empty { display: block; }
@media (max-width: 767.98px) {
    .kanban { grid-template-columns: 1fr; overflow-x: visible; }
}

/* FullCalendar : sa police d'icônes est un data: URI bloqué par la CSP (font-src 'self').
   On remplace les icônes par des caractères plutôt que d'assouplir la CSP. */
.fc .fc-icon { font-family: inherit !important; font-weight: 700; width: auto; height: auto; }
.fc .fc-icon-chevron-left::before { content: "‹"; font-size: 1.3em; line-height: 1; }
.fc .fc-icon-chevron-right::before { content: "›"; font-size: 1.3em; line-height: 1; }
.fc .fc-icon-chevrons-left::before { content: "«"; }
.fc .fc-icon-chevrons-right::before { content: "»"; }
.fc .fc-icon-x::before { content: "×"; }
.fc .fc-list .task-event-content { white-space: normal; overflow: visible; }

/* ---- Lot 5 : notifications ------------------------------------------------- */
.notif-bell { position: relative; display: inline-flex; align-items: center; font-size: 1.15rem; padding: .25rem .4rem; }
.notif-badge { position: absolute; top: -.1rem; right: -.35rem; font-size: .65rem; }
.notif-toast { min-width: 18rem; }
.notif-toast .toast-body:hover { background: var(--bs-tertiary-bg); }
.notif-item.is-unread { background: rgba(47, 91, 234, .06); border-left: 3px solid var(--jobs-primary); }
.notif-icon { width: 1.75rem; text-align: center; font-size: 1.1rem; flex-shrink: 0; }
.notif-message { color: var(--bs-body-color); text-decoration: none; }
.notif-message:hover { text-decoration: underline; }
.notif-overdue { color: var(--bs-danger); }

/* ---- Lot 6 : checklist, commentaires, pièces jointes ------------------------ */
.checklist-done { text-decoration: line-through; color: var(--bs-secondary-color); }
.comment-body { white-space: normal; word-break: break-word; }
.comment-edit summary { cursor: pointer; list-style: none; }
.comment-edit summary::-webkit-details-marker { display: none; }
.attachment-thumb { width: 3.5rem; height: 3.5rem; object-fit: cover; border-radius: .25rem; border: 1px solid var(--bs-border-color); }
.attachment-icon { width: 3.5rem; text-align: center; font-size: 1.6rem; }
#history summary { cursor: pointer; }
.comment-actions .btn-link { font-size: inherit; line-height: inherit; vertical-align: baseline; min-height: 0 !important; }


/* ---- Lot 8 : navigation mobile, accessibilité ----------------------------- */
.skip-link {
    position: absolute; top: .5rem; left: .5rem; z-index: 2000;
    background: var(--bs-body-bg); color: var(--bs-body-color); padding: .5rem 1rem; border-radius: .375rem;
}
:focus-visible { outline: 3px solid rgba(47, 91, 234, .6); outline-offset: 2px; }
.navbar .nav-link.active { font-weight: 600; text-decoration: underline; text-underline-offset: .35rem; }

.bottom-nav {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030;
    display: flex; justify-content: space-around; align-items: stretch;
    background: var(--bs-body-bg); border-top: 1px solid var(--bs-border-color);
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -2px 8px rgba(20, 30, 60, .06);
}
.bottom-nav-item {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-height: 56px; font-size: .7rem; color: var(--bs-secondary-color); text-decoration: none; gap: 2px;
}
.bottom-nav-item > span:first-child { font-size: 1.2rem; line-height: 1; }
.bottom-nav-item.active { color: var(--jobs-primary); font-weight: 600; }
.bottom-nav-add > span { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%;
    background: var(--jobs-primary); color: #fff; font-size: 1.6rem !important; box-shadow: 0 2px 6px rgba(47, 91, 234, .4); }
.bottom-nav .notif-badge { top: -.4rem; right: -.8rem; }
@media (max-width: 767.98px) {
    body.has-bottom-nav { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
    .toast-stack { bottom: calc(60px + env(safe-area-inset-bottom)) !important; }
}
@media print { .bottom-nav, .skip-link { display: none !important; } }