/* =============================================================
   GCS LOGISTIQUE — CSS v1.0.0
   Admin + front-end shortcode
   ============================================================= */

/* ---- Reset / base ----------------------------------------- */
.gcs-log-card,
.gcs-log-modal,
.gcs-log-front-section {
    box-sizing: border-box;
}

/* ---- Card générique --------------------------------------- */
.gcs-log-card {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
}

/* ---- Toast ----------------------------------------------- */
#gcs-log-toast,
.gcs-log-front-toast {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 100000;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    display: none;
    max-width: 340px;
    box-shadow: 0 4px 16px rgba(0,0,0,.2);
}
#gcs-log-toast.show,
.gcs-log-front-toast.show { display: block; }
#gcs-log-toast.ok,
.gcs-log-front-toast.ok   { background: #00a32a; color: #fff; }
#gcs-log-toast.err,
.gcs-log-front-toast.err  { background: #d63638; color: #fff; }

/* ---- Topbar stats + actions ------------------------------- */
.gcs-log-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    padding: 12px 18px;
    margin-bottom: 14px;
}
.gcs-log-stats {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 13px;
    color: #555;
}
.gcs-log-stat-item strong { color: #111; }
.gcs-log-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

/* ---- Onglets --------------------------------------------- */
.gcs-log-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 2px solid #ddd;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.gcs-log-tab {
    padding: 8px 16px;
    border: none;
    background: none;
    font-size: 13px;
    font-weight: 500;
    color: #555;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    border-radius: 4px 4px 0 0;
    transition: color .15s, border-color .15s;
}
.gcs-log-tab:hover   { color: #2271b1; }
.gcs-log-tab.active  { color: #2271b1; border-bottom-color: #2271b1; background: #f0f6ff; }

/* ---- Layout 2 colonnes ------------------------------------ */
.gcs-log-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 16px;
    align-items: start;
}

/* ---- Panneau participants (gauche) ------------------------ */
.gcs-log-participants-panel {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    padding: 12px;
    position: sticky;
    top: 32px;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
}
.gcs-log-panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
}
.gcs-log-badge {
    background: #2271b1;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 10px;
}
.gcs-log-legend {
    display: flex;
    gap: 10px;
    font-size: 11px;
    color: #888;
    margin-bottom: 10px;
}
.gcs-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 3px;
    vertical-align: middle;
}
.gcs-dot-ok   { background: #00a32a; }
.gcs-dot-none { background: #bbb; }

/* Groupes dans le panneau */
.gcs-log-part-group-title {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #888;
    padding: 6px 4px 3px;
}

/* Items draggables */
.gcs-log-draggable {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 6px 7px;
    border-radius: 7px;
    font-size: 12px;
    cursor: grab;
    margin-bottom: 3px;
    border: 1px solid #e5e7ea;
    background: #fff;
    transition: background .1s, box-shadow .1s;
    user-select: none;
}
.gcs-log-draggable:hover      { background: #f0f6ff; }
.gcs-log-draggable.sortable-drag { opacity: .5; }
.gcs-log-draggable.assigned   { border-color: #c3e6cb; background: #f0faf4; }
.gcs-log-drag-handle {
    color: #bbb;
    font-size: 14px;
    cursor: grab;
    flex-shrink: 0;
}
.gcs-log-draggable-name { flex: 1; line-height: 1.3; }
.gcs-log-draggable-cat  { font-size: 10px; color: #888; }

/* Avatar cercle */
.gcs-log-avatar {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 10px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.av-t { background: #dbeafe; color: #1d4ed8; }
.av-a { background: #f3e8ff; color: #7e22ce; }
.av-c { background: #fef9c3; color: #854d0e; }
.av-k { background: #dcfce7; color: #166534; }
.av-x { background: #f1f5f9; color: #64748b; }

/* ---- Panneau onglet (droite) ----------------------------- */
.gcs-log-pane         { display: none; }
.gcs-log-pane.active  { display: block; }

.gcs-log-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 14px;
    align-items: start;
}
.gcs-log-empty-hint {
    text-align: center;
    padding: 48px 20px;
    color: #888;
    background: #fafafa;
    border: 2px dashed #ddd;
    border-radius: 10px;
    font-size: 13px;
}

/* ---- Cartes transport / covoiturage / logement / RDV ------- */
.gcs-log-item-card {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
    transition: box-shadow .15s;
}
.gcs-log-item-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.1); }

.gcs-log-item-header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
}
.gcs-log-item-icon {
    font-size: 1.5rem;
    line-height: 1;
    flex-shrink: 0;
    margin-top: 2px;
}
.gcs-log-item-body     { flex: 1; min-width: 0; }
.gcs-log-item-title    { font-size: 13px; font-weight: 600; margin: 0 0 2px; }
.gcs-log-item-meta     { font-size: 11px; color: #666; margin: 2px 0 0; }
.gcs-log-item-actions  { display: flex; gap: 4px; flex-shrink: 0; }

.gcs-log-item-body-section {
    padding: 0 14px 12px;
    border-top: 1px solid #f0f0f0;
}
.gcs-log-item-body-section-title {
    font-size: 11px;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: .03em;
    padding: 8px 0 5px;
}

/* Zone de drop SortableJS */
.gcs-log-drop-zone {
    min-height: 46px;
    border: 1.5px dashed #c8ccd0;
    border-radius: 8px;
    padding: 6px 8px;
    background: #f8f9fa;
    transition: border-color .15s, background .15s;
}
.gcs-log-drop-zone.drag-over {
    border-color: #2271b1;
    background: #f0f6ff;
}
.gcs-log-drop-hint {
    text-align: center;
    color: #aaa;
    font-size: 11px;
    padding: 8px 0;
}
.gcs-log-drop-zone .gcs-log-draggable {
    margin-bottom: 4px;
    cursor: default;
}
.gcs-log-drop-zone .gcs-log-draggable:last-child { margin-bottom: 0; }

/* Barre capacité */
.gcs-log-capacity {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #555;
    margin-top: 8px;
}
.gcs-log-cap-bar {
    flex: 1;
    height: 6px;
    background: #e5e7eb;
    border-radius: 3px;
    overflow: hidden;
}
.gcs-log-cap-fill { height: 100%; border-radius: 3px; transition: width .3s; }
.gcs-log-cap-ok   { background: #00a32a; }
.gcs-log-cap-warn { background: #dba617; }
.gcs-log-cap-full { background: #d63638; }

/* Badges statut passagers */
.gcs-log-status-badge {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 600;
}
.gcs-log-status-ok      { background: #d1fae5; color: #065f46; }
.gcs-log-status-wait    { background: #fef3c7; color: #92400e; }
.gcs-log-status-refuse  { background: #fee2e2; color: #991b1b; }

/* Chambres dans un logement */
.gcs-log-chambres-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 8px;
    padding: 10px 14px 12px;
}
.gcs-log-chambre-box {
    border: 1px solid #e2e4e7;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 12px;
}
.gcs-log-chambre-box-title {
    font-weight: 600;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.gcs-log-chambre-add {
    border: 1.5px dashed #c8ccd0;
    border-radius: 8px;
    padding: 12px 10px;
    font-size: 12px;
    text-align: center;
    color: #888;
    cursor: pointer;
    transition: border-color .15s, color .15s;
}
.gcs-log-chambre-add:hover { border-color: #2271b1; color: #2271b1; }

/* ---- MODALS ----------------------------------------------- */
.gcs-log-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gcs-log-modal {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
    width: 560px;
    max-width: 96vw;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}
.gcs-log-modal-sm { width: 380px; }
.gcs-log-modal-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-bottom: 1px solid #eee;
    background: #f6f7f7;
    border-radius: 12px 12px 0 0;
}
.gcs-log-modal-hd h3 { margin: 0; font-size: 15px; }
.gcs-log-modal-close {
    background: none; border: none; cursor: pointer;
    font-size: 22px; line-height: 1; color: #666; padding: 0 4px;
}
.gcs-log-modal-close:hover { color: #d63638; }
.gcs-log-modal-bd {
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.gcs-log-modal-ft {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 20px;
    border-top: 1px solid #eee;
    background: #f6f7f7;
    border-radius: 0 0 12px 12px;
}

/* Formulaire dans modal */
.gcs-log-form-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.gcs-log-form-row label { font-size: 12px; font-weight: 600; color: #444; }
.req { color: #d63638; }
.gcs-log-form-row input[type="text"],
.gcs-log-form-row input[type="tel"],
.gcs-log-form-row input[type="number"],
.gcs-log-form-row input[type="date"],
.gcs-log-form-row input[type="time"],
.gcs-log-form-row select,
.gcs-log-form-row textarea {
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    width: 100%;
    box-sizing: border-box;
}
.gcs-log-form-row textarea { resize: vertical; min-height: 56px; }
.gcs-log-form-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.gcs-log-toggle-row {
    display: flex;
    gap: 16px;
    align-items: center;
    font-size: 13px;
    padding: 6px 0;
}
.gcs-log-fieldset {
    border: 1px solid #e2e4e7;
    border-radius: 8px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.gcs-log-fieldset legend {
    font-size: 12px;
    font-weight: 600;
    color: #555;
    padding: 0 6px;
}

/* ---- FRONT-END SHORTCODE ---------------------------------- */
.gcs-log-front {
    font-family: inherit;
    width: 100%;
}
.gcs-log-front-header {
    background: linear-gradient(135deg,#1e293b,#334155);
    color: #fff;
    border-radius: 12px;
    padding: 18px 22px;
    margin-bottom: 18px;
}
.gcs-log-front-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 6px;
    color: #fff;
}
.gcs-log-front-meta {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 13px;
    opacity: .8;
}
.gcs-log-front-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
@media (max-width: 640px) {
    .gcs-log-front-grid { grid-template-columns: 1fr; }
}
.gcs-log-front-section {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    padding: 14px 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.gcs-log-front-section h3 {
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
}
.gcs-log-front-loading {
    color: #888;
    font-size: 13px;
    text-align: center;
    padding: 12px 0;
}
.gcs-log-front-actions { margin-top: 10px; }
.gcs-log-front-btn {
    padding: 7px 14px;
    border-radius: 6px;
    border: 1px solid #c8ccd0;
    background: #fff;
    font-size: 13px;
    cursor: pointer;
    font-family: inherit;
    transition: background .15s;
}
.gcs-log-front-btn:hover { background: #f0f0f0; }
.gcs-log-front-btn-primary {
    background: #2271b1;
    border-color: #2271b1;
    color: #fff;
}
.gcs-log-front-btn-primary:hover { background: #135e96; }
.gcs-log-front-btn-danger {
    background: #d63638;
    border-color: #d63638;
    color: #fff;
}

/* Info ligne front */
.gcs-log-front-info-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    padding: 4px 0;
    color: #333;
}
.gcs-log-front-info-row span.label {
    color: #888;
    min-width: 80px;
    font-size: 12px;
}
.gcs-log-covoit-card-front {
    border: 1px solid #e2e4e7;
    border-radius: 8px;
    padding: 10px 12px;
    margin-bottom: 8px;
    font-size: 13px;
}
.gcs-log-covoit-card-front-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    margin-bottom: 6px;
}
.gcs-log-notice {
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 13px;
    border: 1px solid #e2e4e7;
    background: #f6f7f7;
}
.gcs-log-notice-warn {
    background: #fff8e1;
    border-color: #f0c040;
}

/* ---- RESPONSIVE ------------------------------------------ */
@media (max-width: 960px) {
    .gcs-log-layout { grid-template-columns: 1fr; }
    .gcs-log-participants-panel { position: static; max-height: none; }
}
@media (max-width: 600px) {
    .gcs-log-form-2col { grid-template-columns: 1fr; }
    .gcs-log-chambres-grid { grid-template-columns: 1fr 1fr; }
    .gcs-log-topbar { flex-direction: column; align-items: flex-start; }
}

/* ---- IMPRESSION ------------------------------------------ */
@media print {
    .gcs-log-topbar,
    .gcs-log-tabs,
    .gcs-log-participants-panel,
    .gcs-log-item-actions,
    .gcs-log-modal-overlay,
    .gcs-log-front-actions,
    #wpadminbar, #adminmenumain { display: none !important; }
    .gcs-log-layout { grid-template-columns: 1fr; }
    .gcs-log-pane { display: block !important; }
}

/* ---- Autocomplete participants ----------------------------- */
.gcs-log-autocomplete {
    position: absolute;
    z-index: 9999;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    max-height: 200px;
    overflow-y: auto;
    width: 100%;
    left: 0;
}
.gcs-log-form-row { position: relative; }
.gcs-log-autocomplete-item {
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
}
.gcs-log-autocomplete-item:last-child { border-bottom: none; }
.gcs-log-autocomplete-item:hover { background: #f0f6ff; }

/* ---- Badge RDV lié (sur cartes transport/logement) --------- */
.gcs-log-rdv-link-badge {
    display: inline-block;
    margin: 4px 4px 0 0;
    padding: 2px 8px;
    background: #e8f5e9;
    color: #2e7d32;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 500;
}

/* ---- Checkboxes liens RDV ---------------------------------- */
.gcs-log-link-checkboxes {
    padding: 6px 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 120px;
    overflow-y: auto;
}

/* ---- Invités (badge rôle dans panneau participants) --------- */
.gcs-log-draggable .role-tag {
    font-size: 10px;
    padding: 1px 5px;
    border-radius: 8px;
    margin-left: auto;
    flex-shrink: 0;
}
.role-tag-invite     { background: #fce4ec; color: #880e4f; }
.role-tag-log        { background: #e8eaf6; color: #3949ab; }
.role-tag-add        { background: #e8f5e9; color: #2e7d32; }

/* ---- Bloc famille (shortcode front) ----------------------- */
.gcs-log-famille-bloc {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    padding: 16px 18px;
    margin-bottom: 18px;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.gcs-log-famille-titre {
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}
.gcs-log-famille-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 10px;
}
.gcs-log-famille-card {
    border: 1px solid #e2e4e7;
    border-radius: 9px;
    padding: 12px 14px;
    font-size: 13px;
    background: #fafafa;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.gcs-log-famille-card-ok {
    border-color: #c3e6cb;
    background: #f0faf4;
}
.gcs-log-famille-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
}
.gcs-log-famille-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.gcs-log-famille-nom {
    font-weight: 600;
    line-height: 1.3;
}
.gcs-log-famille-role {
    font-size: 11px;
    color: #666;
}
.gcs-log-famille-badge {
    margin-left: auto;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}
.gcs-log-famille-badge-ok  { background: #d1fae5; color: #065f46; }
.gcs-log-famille-badge-non { background: #fef3c7; color: #92400e; }
.gcs-log-famille-contacts {
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-size: 12px;
    color: #555;
}
.gcs-log-famille-action {
    margin-top: 2px;
}
.gcs-log-famille-action a {
    display: inline-block;
    font-size: 12px;
    padding: 5px 12px;
    text-decoration: none;
}

/* ---- Layout front : panneau famille + modules --------------- */
.gcs-log-front-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 16px;
    align-items: start;
    margin-top: 16px;
}
.gcs-log-front-famille-panel {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    padding: 12px;
    position: sticky;
    top: 20px;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
}
.gcs-log-front-modules {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.gcs-log-front-famille-item {
    margin-bottom: 3px;
}
.gcs-log-front-inscrire-link {
    font-size: 11px;
    color: #2271b1;
    text-decoration: none;
    display: inline-block;
}
.gcs-log-front-inscrire-link:hover { text-decoration: underline; }
.gcs-log-front-card-mine {
    border-color: #2271b1 !important;
    background: #f0f6ff !important;
}
@media (max-width: 640px) {
    .gcs-log-front-layout {
        grid-template-columns: 1fr;
    }
    .gcs-log-front-famille-panel {
        position: static;
        max-height: none;
    }
}

/* ---- Toast front (même style que admin) -------------------- */
.gcs-log-front-toast-wrap {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 99999;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    display: none;
    box-shadow: 0 4px 16px rgba(0,0,0,.2);
}
.gcs-log-front-toast-wrap.show { display: block; }
.gcs-log-front-toast-wrap.ok  { background:#00a32a; color:#fff; }
.gcs-log-front-toast-wrap.err { background:#d63638; color:#fff; }

/* ---- Front-wrap : hérite du layout admin ------------------- */
.gcs-log-front-wrap .gcs-log-topbar { margin-bottom: 14px; }
.gcs-log-front-wrap .gcs-log-tabs   { margin-bottom: 16px; }

/* ---- Nom compte connecté (topbar front) -------------------- */
.gcs-log-front-username {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: rgba(255,255,255,.15);
    border-radius: 20px;
    padding: 4px 12px;
    white-space: nowrap;
}
.gcs-log-front-wrap .gcs-log-topbar {
    background: #1e293b;
    border-color: #1e293b;
}
.gcs-log-front-wrap .gcs-log-stats,
.gcs-log-front-wrap .gcs-log-stats .gcs-recap-sep {
    color: rgba(255,255,255,.75);
}
.gcs-log-front-wrap .gcs-log-stats strong { color: #fff; }

/* ---- Badge compteur sur boutons d'action ------------------- */
.gcs-log-btn-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: rgba(255,255,255,0.35);
    color: #fff;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
    margin-left: 4px;
    vertical-align: middle;
    line-height: 1;
}
/* Sur fond sombre (topbar front) */
.gcs-log-front-wrap .gcs-log-btn-badge {
    background: rgba(255,255,255,0.25);
}

/* Badge sur les onglets (fond sombre sur fond clair) */
.gcs-log-tab .gcs-log-btn-badge {
    background: #2271b1;
    color: #fff;
}
.gcs-log-tab.active .gcs-log-btn-badge {
    background: #2271b1;
    color: #fff;
}

/* Bouton secondaire dans footer de modal */
.gcs-log-modal-ft .button:not(.button-primary) {
    border-color: #8c8f94;
}
.gcs-log-modal-ft .button[title*="RDV"] {
    border-color: #e85d00;
    color: #e85d00;
}
.gcs-log-modal-ft .button[title*="RDV"]:hover {
    background: #fef5ee;
}

/* ---- Boutons action inline (passagers, supprimer, rejoindre) --- */
/* Override complet des styles WP admin qui noircissent les boutons */
.gcs-log-front-wrap .gcs-log-front-btn,
.gcs-log-front-wrap .gcs-log-front-btn:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid #c8ccd0;
    background: #fff;
    color: #333;
    line-height: 1.4;
    text-decoration: none;
    transition: background .12s, color .12s;
    font-family: inherit;
    box-shadow: none;
    outline: none;
}
.gcs-log-front-wrap .gcs-log-front-btn:hover {
    background: #f0f0f0;
    color: #111;
}
.gcs-log-front-wrap .gcs-log-front-btn-primary,
.gcs-log-front-wrap .gcs-log-front-btn-primary:visited {
    background: #2271b1;
    border-color: #2271b1;
    color: #fff !important;
}
.gcs-log-front-wrap .gcs-log-front-btn-primary:hover {
    background: #135e96;
    color: #fff !important;
}
.gcs-log-front-wrap .gcs-log-front-btn-danger,
.gcs-log-front-wrap .gcs-log-front-btn-danger:visited {
    background: #fff;
    border-color: #d63638;
    color: #d63638 !important;
}
.gcs-log-front-wrap .gcs-log-front-btn-danger:hover {
    background: #fcebeb;
}
/* Bouton accepter passager */
.gcs-log-front-wrap .gcs-log-front-valider-pass[title="Accepter"] {
    border-color: #2e7d32;
    color: #2e7d32 !important;
    background: #fff;
}
.gcs-log-front-wrap .gcs-log-front-valider-pass[title="Accepter"]:hover {
    background: #eaf3de;
}
/* Bouton refuser passager */
.gcs-log-front-wrap .gcs-log-front-valider-pass[title="Refuser"] {
    border-color: #d63638;
    color: #d63638 !important;
    background: #fff;
}
.gcs-log-front-wrap .gcs-log-front-valider-pass[title="Refuser"]:hover {
    background: #fcebeb;
}

/* ---- Badge RDV inline sur cartes transport/covoit ----------- */
.gcs-log-rdv-inline-badge {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    background: #f0faf4;
    border-top: 1px solid #e0f0e8;
    font-size: 12px;
    color: #2e7d32;
    flex-wrap: wrap;
}
.gcs-log-rdv-inline-badge strong {
    color: #1b5e20;
}

/* Bouton 📍 RDV orange/ambre */
.gcs-log-front-btn-to-rdv {
    border-color: #e85d00 !important;
    color: #e85d00 !important;
    background: #fff !important;
    font-size: 12px;
}
.gcs-log-front-btn-to-rdv:hover {
    background: #fef5ee !important;
}
/* Admin */
.button.btn-tr-new-rdv,
.button.btn-cov-new-rdv {
    color: #e85d00 !important;
    border-color: #e85d00 !important;
}

/* ---- Statuts réservation / paiement — checkboxes toggle --- */
.gcs-log-statut-row {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
}

/* Label toggle checkbox */
.gcs-log-check-statut {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px 3px 6px;
    border-radius: 20px;
    border: 1.5px solid #e65100;
    background: #fff8f0;
    color: #e65100;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    transition: background .15s, border-color .15s, color .15s;
    line-height: 1.3;
    white-space: nowrap;
}
.gcs-log-check-statut input[type="checkbox"] {
    display: none;
}
/* Icône ronde (checked/unchecked) */
.gcs-log-check-icon {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1.5px solid currentColor;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 9px;
}
.gcs-log-check-statut.checked .gcs-log-check-icon::before {
    content: '✓';
}
/* État coché = vert */
.gcs-log-check-statut.checked {
    border-color: #2e7d32;
    background: #f0faf4;
    color: #2e7d32;
}

/* ---- Ligne occupant chambre / passager transport compacte -- */
.gcs-log-chambre-occ-row {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    padding: 6px 28px 6px 8px;
    background: #f9fdfb;
    border-radius: 6px;
    margin-bottom: 3px;
    font-size: 12px;
}
.gcs-log-avatar-sm {
    width: 26px !important;
    height: 26px !important;
    font-size: 10px !important;
    flex-shrink: 0;
}
.gcs-log-occ-nom {
    flex: 1;
    min-width: 80px;
    font-weight: 500;
    color: #333;
}
/* Pills statut plus petits */
.gcs-log-statut-row {
    display: flex;
    flex-direction: row;
    gap: 4px;
    flex-wrap: nowrap;
    flex-shrink: 0;
}
.gcs-log-chambre-occ-row .gcs-log-check-statut {
    padding: 2px 6px 2px 4px;
    font-size: 10px;
    border-radius: 14px;
    white-space: nowrap;
}
.gcs-log-chambre-occ-row .gcs-log-check-icon {
    width: 11px;
    height: 11px;
    font-size: 7px;
}
.gcs-log-chambre-occ-row .gcs-log-status-badge {
    font-size: 10px;
    padding: 1px 6px;
    white-space: nowrap;
}
.gcs-log-chambre-occ-row .gcs-log-front-remove {
    cursor: pointer;
    color: #d63638;
    font-size: 12px;
    padding: 0 2px;
    flex-shrink: 0;
}
/* Chambres plus compactes */
.gcs-log-chambre-box {
    min-width: 160px;
}
.gcs-log-chambre-box-title {
    font-size: 12px;
    padding: 6px 8px;
}

/* ---- Croix suppression en haut à droite de la ligne occ --- */
.gcs-log-chambre-occ-row .gcs-log-front-remove,
.gcs-log-chambre-occ-row .btn-remove-from-zone {
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 11px;
    color: #d63638 !important;
    cursor: pointer;
    padding: 0 2px;
    line-height: 1;
    flex-shrink: 0;
}

/* ---- Mode lecture seule (non connecté) --------------------- */
.gcs-log-layout-readonly {
    grid-template-columns: 1fr; /* pas de panneau famille */
}
.gcs-log-readonly-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #f0f6ff;
    border: 1px solid #c2d8f8;
    border-radius: 8px;
    font-size: 13px;
    color: #2271b1;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.gcs-log-readonly-icon {
    font-size: 20px;
    flex-shrink: 0;
}
.gcs-log-readonly-banner > div {
    flex: 1;
    min-width: 180px;
}

/* Bouton Se connecter (topbar + bandeau) */
.gcs-log-front-btn-login {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #fff;
    color: #2271b1;
    border: 1.5px solid #2271b1;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background .12s, color .12s;
}
.gcs-log-front-btn-login:hover {
    background: #2271b1;
    color: #fff;
    text-decoration: none;
}
/* Version CTA dans le bandeau */
.gcs-log-front-btn-login-cta {
    background: #2271b1;
    color: #fff;
    flex-shrink: 0;
}
.gcs-log-front-btn-login-cta:hover {
    background: #135e96;
    color: #fff;
}
/* Topbar : bouton connexion blanc sur fond sombre */
.gcs-log-front-wrap .gcs-log-topbar .gcs-log-front-btn-login {
    border-color: rgba(255,255,255,.6);
    color: #fff;
    background: rgba(255,255,255,.1);
}
.gcs-log-front-wrap .gcs-log-topbar .gcs-log-front-btn-login:hover {
    background: rgba(255,255,255,.25);
    color: #fff;
}

/* ---- Sélecteur événements (mode non-connecté) -------------- */
.gcs-log-select-wrap {
    max-width: 900px;
    margin: 0 auto;
    padding: 20px 0;
}
.gcs-log-select-header {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid #e2e4e7;
}
.gcs-log-select-title {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    flex: 1;
    min-width: 200px;
}
.gcs-log-select-sub {
    width: 100%;
    color: #666;
    font-size: 13px;
    margin: 0;
}
.gcs-log-evt-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 14px;
}
.gcs-log-evt-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    background: #fff;
    border: 1.5px solid #e2e4e7;
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s, box-shadow .15s, transform .1s;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.gcs-log-evt-card:hover {
    border-color: #2271b1;
    box-shadow: 0 4px 16px rgba(34,113,177,.15);
    transform: translateY(-2px);
    text-decoration: none;
    color: inherit;
}
.gcs-log-evt-card-icon {
    font-size: 28px;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f6ff;
    border-radius: 10px;
}
.gcs-log-evt-card-body {
    flex: 1;
    min-width: 0;
}
.gcs-log-evt-card-title {
    font-weight: 600;
    font-size: 14px;
    color: #1d2327;
    margin-bottom: 4px;
    line-height: 1.3;
}
.gcs-log-evt-card-date,
.gcs-log-evt-card-lieu,
.gcs-log-evt-card-meta {
    font-size: 12px;
    color: #666;
    margin-top: 2px;
}
.gcs-log-evt-card-arrow {
    font-size: 16px;
    color: #2271b1;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity .15s, transform .15s;
    transform: translateX(-4px);
}
.gcs-log-evt-card:hover .gcs-log-evt-card-arrow {
    opacity: 1;
    transform: translateX(0);
}

/* ---- Largeur max desktop (front + sélecteur) --------------- */
.gcs-log-front-wrap,
.gcs-log-select-wrap {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

/* ---- Vignette avec logistique existante -------------------- */
.gcs-log-evt-card-active {
    border-color: #2271b1;
    background: #f8fbff;
}
.gcs-log-evt-card-status {
    margin-top: 6px;
}
.gcs-log-evt-status-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
}
.gcs-log-evt-status-ok  { background: #d1fae5; color: #065f46; }
.gcs-log-evt-status-new { background: #e0eaff; color: #2271b1; }

/* ---- Modal mobile d'assignation ---------------------------- */
.gcs-log-mobile-modal {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 99998;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.gcs-log-mobile-modal-box {
    background: #fff;
    border-radius: 16px 16px 0 0;
    width: 100%;
    max-width: 540px;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.gcs-log-mobile-modal-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px 12px;
    border-bottom: 1px solid #eee;
}
.gcs-log-mobile-modal-title {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
}
.gcs-log-mobile-modal-close {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    color: #666;
    padding: 4px;
}
.gcs-log-mobile-modal-list {
    overflow-y: auto;
    flex: 1;
    padding: 12px 18px;
}
.gcs-log-mobile-check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 6px;
    border: 1.5px solid #e2e4e7;
    background: #fafafa;
    cursor: pointer;
    font-size: 13px;
    transition: background .12s, border-color .12s;
}
.gcs-log-mobile-check-row input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    accent-color: #2271b1;
}
.gcs-log-mobile-check-row.checked {
    background: #f0f6ff;
    border-color: #2271b1;
}
.gcs-log-mobile-modal-ft {
    display: flex;
    gap: 10px;
    padding: 14px 18px;
    border-top: 1px solid #eee;
}
.gcs-log-mobile-modal-ft .gcs-log-front-btn {
    flex: 1;
    justify-content: center;
    padding: 10px;
    font-size: 14px;
}

/* ---- Badge RDV en ligne — demi-largeur DANS le wrapper ---- */
.gcs-log-rdv-badges-row {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 2px 0 6px;
}
.gcs-log-rdv-badges-row .gcs-log-rdv-inline-badge {
    flex: 1 1 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 11px;
}

/* ---- Passagers rétractables (desktop + mobile) ------------ */
.gcs-log-item-body-section {
    border-top: 1px solid #eee;
}
.gcs-log-item-body-section-title {
    cursor: pointer;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
}
.gcs-log-item-body-section-title::after {
    content: '▾';
    font-size: 12px;
    color: #888;
    transition: transform .2s;
}
.gcs-log-item-body-section.collapsed .gcs-log-item-body-section-title::after {
    transform: rotate(-90deg);
}
.gcs-log-item-body-section.collapsed .gcs-log-drop-zone,
.gcs-log-item-body-section.collapsed .gcs-log-mobile-assign-btn {
    display: none !important;
}

/* ---- Mobile ------------------------------------------------ */
@media (max-width: 767px) {
    .gcs-log-rdv-inline-badge {
        width: 100% !important;
        min-width: 0;
    }
    .gcs-log-item-card { padding: 10px 12px; }
    .gcs-log-item-header { gap: 8px; }
    .gcs-log-item-body p { margin: 2px 0; }
}

/* ---- Hint mobile cliquable --------------------------------- */
@media (max-width: 767px) {
    .hint-mobile {
        color: #2271b1;
        cursor: pointer;
        font-weight: 600;
        text-decoration: underline;
    }
    .gcs-log-drop-hint { text-align: center; padding: 10px; }
}


/* =============================================================
   v2.0.2 — UX améliorations
   ============================================================= */

/* ---- Topbar simplifiée ------------------------------------ */
.gcs-log-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    background: #1d2327;
    color: #f0f0f1;
    border-radius: 8px;
    padding: 8px 14px;
    margin-bottom: 10px;
    font-size: 13px;
}
.gcs-log-topbar-left  { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gcs-log-topbar-right { display: flex; align-items: center; gap: 8px; }
.gcs-log-topbar-label { font-weight: 600; }
.gcs-log-topbar-meta  { color: #ccd0d4; font-size: 12px; }
.gcs-recap-sep        { color: #555d66; }
.gcs-log-front-username { font-size: 12px; color: #ccd0d4; }

/* ---- Onglets + boutons Add intégrés ----------------------- */
.gcs-log-tabs {
    display: flex;
    align-items: center;
    gap: 2px;
    border-bottom: 2px solid #ddd;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.gcs-log-tab-add-btn {
    margin-left: auto;
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    padding-bottom: 4px;
}
.gcs-log-tab-add-btn .gcs-log-front-btn {
    font-size: 11px;
    padding: 4px 9px;
    height: auto;
}

/* ---- Grille 2 colonnes covoiturage ------------------------ */
/* ---- Grille covoiturage : identique aux autres types ---- */
.gcs-log-covoit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 14px;
    align-items: start;
}
.gcs-log-covoit-grid .gcs-log-item-card {
    font-size: 12px;
}
.gcs-log-covoit-grid .gcs-log-item-title  { font-size: 12px; }
.gcs-log-covoit-grid .gcs-log-item-meta   { font-size: 11px; }
.gcs-log-covoit-grid .gcs-log-capacity    { font-size: 11px; }

/* ---- Panel participants rétractable ----------------------- */
.gcs-log-panel-toggle {
    cursor: pointer;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 4px;
    border-radius: 6px;
    transition: background .15s;
}
.gcs-log-panel-toggle:hover { background: #f0f6ff; }
.gcs-log-panel-chevron {
    font-size: 11px;
    color: #888;
    transition: transform .2s;
    flex-shrink: 0;
}
.gcs-log-panel-body { overflow: hidden; }

/* ---- Drop-zone cliquable (tous appareils) ----------------- */
.gcs-log-drop-zone {
    cursor: pointer;
    transition: border-color .15s, background .15s, box-shadow .15s;
}
.gcs-log-drop-zone:hover {
    border-color: #2271b1;
    background: #f0f6ff;
    box-shadow: 0 0 0 2px rgba(34,113,177,.15);
}
.gcs-log-drop-hint {
    color: #2271b1;
    font-weight: 500;
}

/* ---- Badges dans la popin assignation --------------------- */
.gcs-log-modal-name-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    flex-wrap: wrap;
}
.gcs-log-modal-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 10px;
    white-space: nowrap;
}
.gcs-log-modal-badge-ok   { background: #d1fae5; color: #065f46; }
.gcs-log-modal-badge-warn { background: #fef3c7; color: #92400e; }

/* ---- Responsive covoit grid ------------------------------- */
@media (max-width: 900px) {
    .gcs-log-covoit-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .gcs-log-tab-add-btn { margin-left: 0; width: 100%; }
    .gcs-log-topbar { padding: 8px 10px; }
}

/* =============================================================
   v2.0.5 — Modal RDV membres + fixes
   ============================================================= */

/* ---- Filtre types participants dans modal RDV -------------- */
.gcs-log-rdv-type-filters {
    margin-bottom: 8px;
}
.gcs-log-rdv-type-filters .rdv-type-btn {
    font-size: 11px;
    padding: 3px 10px;
    border-radius: 12px;
    border: 1px solid #ccc;
    background: #fff;
    color: #555;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.gcs-log-rdv-type-filters .rdv-type-btn:hover { background: #f0f6ff; border-color: #2271b1; color: #2271b1; }

/* ---- Liste membres éditable dans modal RDV ---------------- */
.gcs-log-rdv-membres-list {
    border: 1px solid #e2e4e7;
    border-radius: 8px;
    padding: 8px;
    min-height: 40px;
    background: #fafafa;
    max-height: 200px;
    overflow-y: auto;
}

/* ---- RDV badge : pleine largeur (déjà corrigé ligne ~1383) - */
/* Override mobile déjà dans la règle existante */

/* =============================================================
   Breakout pleine largeur — sort du conteneur de thème WP
   Fonctionne quand .entry-content / .wp-block-group ont un
   max-width. Technique : position relative + margin négatif.
   ============================================================= */
.gcs-log-front-wrap {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    padding: 0 20px;
}

/* Sur admin WP : pas de padding additionnel */
#gcs-log-admin-wrap .gcs-log-front-wrap {
    padding: 0;
}

/* Éviter le scroll horizontal causé par le breakout 100vw */
body:has(.gcs-log-front-wrap) {
    overflow-x: hidden;
}

/* Page avec shortcode gcs_logistique : override overflow du thème */
body.gcs-log-page {
    overflow-x: hidden;
}

/* Certains thèmes wrappent dans .site-content, .main-content, .content-area etc.
   Le breakout 100vw ne fonctionne que si le parent n'a pas overflow:hidden.
   Si le thème bloque, utiliser plutôt ce padding négatif sur le contenu. */
body.gcs-log-page .entry-content,
body.gcs-log-page .post-content,
body.gcs-log-page .page-content,
body.gcs-log-page article.page {
    overflow: visible;
}

/* ---- Barre d'actions admin (remplace l'ancienne topbar sombre) ---- */
.gcs-log-admin-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 14px;
    padding: 10px 0;
    border-bottom: 1px solid #e2e4e7;
}

/* ---- Page sélection événements — mise en page propre ------- */
.gcs-log-select-wrap {
    padding: 24px 0;
    max-width: none;
}
.gcs-log-evt-grid {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

/* ---- Assurer que le front-wrap en mode sélection a du padding */
.gcs-log-front-wrap:has(.gcs-log-select-wrap) {
    padding-top: 8px;
}

/* =============================================================
   v2.1.5 — Grille uniforme 3 colonnes
   ============================================================= */

/* Cartes de même hauteur dans la grille */
.gcs-log-cards-grid .gcs-log-item-card,
.gcs-log-covoit-grid .gcs-log-item-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Le corps de la carte prend tout l'espace disponible */
.gcs-log-item-card > .gcs-log-item-body-section {
    flex: 1;
}

/* Responsive : 2 colonnes < 1100px, 1 colonne < 700px */
@media (max-width: 1100px) {
    .gcs-log-cards-grid,
    .gcs-log-covoit-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }
}
@media (max-width: 700px) {
    .gcs-log-cards-grid,
    .gcs-log-covoit-grid {
        grid-template-columns: 1fr;
    }
}

/* Supprimer le breakout overflow-x inutile maintenant que position:relative est retiré */
body:has(.gcs-log-front-wrap) {
    overflow-x: unset;
}

/* Layout sans panneau participants (mode non connecté) : colonne unique */
.gcs-log-layout:not(:has(.gcs-log-participants-panel)) {
    grid-template-columns: 1fr;
}

/* Layout pleine largeur (sans panneau participants) */
.gcs-log-layout-full {
    grid-template-columns: 1fr;
}

/* =============================================================
   v2.1.6 — Panneau participants horizontal (admin)
   ============================================================= */

/* ---- Barre participants horizontale ------------------------ */
.gcs-log-participants-bar {
    background: #fff;
    border: 1px solid #e2e4e7;
    border-radius: 10px;
    margin-bottom: 16px;
    overflow: hidden;
}
.gcs-log-participants-bar-hd {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 16px;
    cursor: pointer;
    user-select: none;
    border-bottom: 1px solid transparent;
    transition: background .15s;
}
.gcs-log-participants-bar-hd:hover { background: #f8f9fa; }
.gcs-log-participants-bar-hd.open  { border-bottom-color: #e2e4e7; }
.gcs-log-participants-bar-title {
    font-size: 13px;
    font-weight: 600;
    color: #1d2327;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.gcs-log-legend-inline {
    display: flex;
    gap: 12px;
    font-size: 12px;
    color: #666;
}

/* ---- Liste participants en mode horizontal scrollable ------ */
.gcs-log-participants-bar-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 16px 12px;
    max-height: 220px;
    overflow-y: auto;
}

/* Chaque draggable en mode barre : compact */
.gcs-log-participants-bar-list .gcs-log-draggable {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f8f9fa;
    border: 1px solid #e2e4e7;
    border-radius: 20px;
    padding: 4px 10px 4px 6px;
    font-size: 12px;
    cursor: grab;
    white-space: nowrap;
    transition: border-color .15s, box-shadow .15s;
}
.gcs-log-participants-bar-list .gcs-log-draggable:hover {
    border-color: #2271b1;
    box-shadow: 0 2px 8px rgba(34,113,177,.15);
}
.gcs-log-participants-bar-list .gcs-log-draggable.assigned {
    border-color: #00a32a;
    background: #f0faf4;
}
.gcs-log-participants-bar-list .gcs-log-avatar {
    width: 22px;
    height: 22px;
    font-size: 10px;
    flex-shrink: 0;
}
.gcs-log-participants-bar-list .gcs-log-draggable-name {
    font-size: 12px;
    line-height: 1.2;
}
.gcs-log-participants-bar-list .gcs-log-draggable-cat { display: none; }
.gcs-log-participants-bar-list .gcs-log-drag-handle   { display: none; }
.gcs-log-participants-bar-list .gcs-log-part-group-title {
    width: 100%;
    font-size: 10px;
    font-weight: 700;
    color: #888;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 4px 0 2px;
    margin: 0;
}

/* Supprimer l'ancien layout 2 colonnes en mode admin */
#gcs-log-main > .gcs-log-layout {
    grid-template-columns: 1fr;
}

/* =============================================================
   v2.1.7 — Mode lecture seule : toutes sections visibles
   ============================================================= */

/* Toutes les panes visibles en mode readonly */
.gcs-log-tab-content-all .gcs-log-pane {
    display: block !important;
    margin-bottom: 32px;
}
.gcs-log-tab-content-all .gcs-log-pane:last-child {
    margin-bottom: 0;
}

/* .gcs-log-section-title : supprimé */

/* Sections vides masquées par JS (voir renderBadges) */

/* =============================================================
   v2.1.8 — Onglet Tous + titres de section
   ============================================================= */

/* Mode "Tous" : tous les panes visibles avec séparateurs */
/* Pas de séparateur entre sections en mode Tous */

/* Titre de section auto-injecté par JS quand mode 'all' */
.gcs-log-section-heading {
    font-size: 14px;
    font-weight: 600;
    color: #1d2327;
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Espacement entre sections en mode Tous (admin, front connecté, readonly) */
.gcs-log-pane.active + .gcs-log-pane.active {
    margin-top: 24px;
}

/* =============================================================
   v2.2.1 — Mode "Tous" : panes transparents, grille continue
   ============================================================= */

/* En mode Tous : chaque pane devient transparent (display:contents)
   → les .gcs-log-cards-grid enfants partagent le même contexte de flux */
.gcs-log-pane.active {
    display: block;
}

/* Quand tous les panes sont actifs (mode Tous) :
   le tab-content lui-même devient une grille unifiée */
.gcs-log-tab-content:has(.gcs-log-pane.active + .gcs-log-pane.active) {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 14px;
    align-items: start;
}
.gcs-log-tab-content:has(.gcs-log-pane.active + .gcs-log-pane.active) .gcs-log-pane {
    display: contents;
}
.gcs-log-tab-content:has(.gcs-log-pane.active + .gcs-log-pane.active) .gcs-log-cards-grid {
    display: contents;
}
.gcs-log-tab-content:has(.gcs-log-pane.active + .gcs-log-pane.active) .gcs-log-item-card {
    display: flex;
    flex-direction: column;
}
/* Réinitialiser le margin-top entre panes en mode grille unifiée */
.gcs-log-tab-content:has(.gcs-log-pane.active + .gcs-log-pane.active) .gcs-log-pane.active + .gcs-log-pane.active {
    margin-top: 0;
}

/* Fallback sans :has() — classe JS gcs-log-tab-all */
.gcs-log-tab-content.gcs-log-tab-all {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 14px;
    align-items: start;
}
.gcs-log-tab-content.gcs-log-tab-all .gcs-log-pane,
.gcs-log-tab-content.gcs-log-tab-all .gcs-log-cards-grid {
    display: contents;
}
.gcs-log-tab-content.gcs-log-tab-all .gcs-log-item-card {
    display: flex;
    flex-direction: column;
}
.gcs-log-tab-content.gcs-log-tab-all .gcs-log-pane.active + .gcs-log-pane.active {
    margin-top: 0;
}
/* Pane inactif en mode all : masqué */
.gcs-log-tab-content.gcs-log-tab-all .gcs-log-pane:not(.active) {
    display: none;
}

/* =============================================================
   Badges comptage sur les cartes événements
   ============================================================= */
.gcs-log-evt-card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}
.gcs-log-evt-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
    background: #f0f6ff;
    color: #2271b1;
    border: 1px solid #d0e4f7;
}
.gcs-log-evt-badge-part { background: #f0f7f0; color: #1a7a1a; border-color: #b8ddb8; }
.gcs-log-evt-badge-tr   { background: #f5f0ff; color: #6a3ab2; border-color: #d4c0f0; }
.gcs-log-evt-badge-cov  { background: #fff4f0; color: #c04a00; border-color: #f0c8b0; }
.gcs-log-evt-badge-log  { background: #fffbf0; color: #8a6000; border-color: #e8d890; }
.gcs-log-evt-badge-rdv  { background: #fff0f5; color: #b01050; border-color: #f0b8cc; }

/* =============================================================
   Bouton aide + Modal d'aide
   ============================================================= */

/* Bouton ? dans la topbar */
.gcs-log-help-btn {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,.6);
    background: transparent;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    line-height: 1;
    flex-shrink: 0;
    transition: background .15s, border-color .15s;
    margin-left: 8px;
}
.gcs-log-help-btn:hover {
    background: rgba(255,255,255,.2);
    border-color: #fff;
}

/* Modal aide : plus large */
.gcs-log-modal-help {
    max-width: 680px;
    width: 95vw;
}

/* Corps de l'aide */
.gcs-log-help-body {
    max-height: 70vh;
    overflow-y: auto;
    padding: 4px 0;
}
.gcs-log-help-intro {
    background: #f0f6ff;
    border-left: 4px solid #2271b1;
    border-radius: 0 8px 8px 0;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-size: 14px;
    color: #1d2327;
}
.gcs-log-help-section {
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid #f0f0f0;
}
.gcs-log-help-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.gcs-log-help-section h4 {
    font-size: 14px;
    font-weight: 700;
    color: #1d2327;
    margin: 0 0 8px;
}
.gcs-log-help-section p {
    font-size: 13px;
    color: #444;
    margin: 0 0 6px;
    line-height: 1.6;
}
.gcs-log-help-section ul {
    margin: 6px 0 0 18px;
    padding: 0;
}
.gcs-log-help-section ul li {
    font-size: 13px;
    color: #444;
    margin-bottom: 6px;
    line-height: 1.5;
}

/* Suggestions autocomplete enrichies */
.gcs-log-autocomplete-item-rich {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px;
}
.gcs-log-autocomplete-item-rich strong {
    font-size: 13px;
    color: #1d2327;
}
.gcs-log-autocomplete-sub {
    font-size: 11px;
    color: #888;
}