/**
 * Styles personnalisés - Trophées du Commerce 2026
 * Complément Bootstrap 5.3
 */

 
/* Corps */
body {
    min-height: 100vh;
    max-width:100vw;
    overflow-x:hidden;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
}

/* Navbar */
.navbar-brand {
    font-weight: 600;
}

/* Cartes candidats cliquables */
.candidat-card {
    cursor: pointer;
}

.candidat-card.border-success {
    border-width: 3px !important;
}


/* Badges */
.badge {
    font-weight: 500;
}

/* Notes display */
.note-display {
    min-width: 45px;
    text-align: center;
}

/* Sliders */
.form-range {
    height: 8px;
}

.form-range::-webkit-slider-thumb {
    width: 20px;
    height: 20px;
}

.form-range::-moz-range-thumb {
    width: 20px;
    height: 20px;
}

/* QR Code */
#qrcode img {
    max-width: 200px;
    height: auto;
    border-radius: 8px;
}

/* Podium */
.podium-card {
    text-align: center;
    padding: 20px;
}

/* Liste group hover */
.list-group-item-action {
    transition: background-color 0.15s;
}

/* Code session */
.code-session {
    font-family: 'Courier New', monospace;
    letter-spacing: 2px;
    font-weight: bold;
}

/* Tabs */
.nav-tabs .nav-link {
    border-radius: 8px 8px 0 0;
    font-weight: 500;
}

.nav-tabs .nav-link.active {
    --cci-bg-opacity:1!important;
}

/* Table résultats */
.table th {
    font-weight: 600;
    font-size: 0.875rem;
}

.table td {
    vertical-align: middle;
}

/* Toast */
.toast {
    border-radius: 10px;
}

/* Modal */
.modal-content {
    border-radius: 16px;
    border: none;
}

.modal-header {
    border-radius: 16px 16px 0 0;
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.card, .list-group-item {
    animation: fadeIn 0.3s ease-out;
}

/* Input code */
#codeSession {
    font-family: 'Courier New', monospace;
    font-weight: bold;
}

/* Footer */
footer {
    margin-top: auto;
}

/* Responsive */
@media (max-width: 768px) {
    .display-5 {
        font-size: 1.75rem;
    }
    
    .display-6 {
        font-size: 1.25rem;
    }
    
    #qrcode img {
        max-width: 150px;
    }
    
}

/* Accessibilité - Focus visible */
.btn:focus-visible,
.form-control:focus-visible,
.form-range:focus-visible,
.nav-link:focus-visible {
    outline: 3px solid var(--cci-bleu);
    outline-offset: 2px;
}

/* Print styles */
@media print {
    .navbar,
    .btn,
    .toast-container,
    footer {
        display: none !important;
    }
    
    .card {
        break-inside: avoid;
        box-shadow: none !important;
        border: 1px solid #ddd !important;
    }
}