:root {
    --camecon-blue: #1b3a5c;
    --camecon-light: #f0f4f8;
    --camecon-teal: #0d9488;
}

html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #333;
}

/* ================================================================
   CAMECON BRAND COLORS
   ================================================================ */
.text-primary {
    color: var(--camecon-blue) !important;
}

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

.btn-primary {
    background-color: var(--camecon-blue);
    border-color: var(--camecon-blue);
}

.btn-primary:hover {
    background-color: #14304d;
    border-color: #14304d;
}

.btn-outline-primary {
    color: var(--camecon-blue);
    border-color: var(--camecon-blue);
}

.btn-outline-primary:hover {
    background-color: var(--camecon-blue);
    border-color: var(--camecon-blue);
}

/* Fix: "Registrati" nella navbar (btn-outline-light) bianco su bianco all'hover */
.navbar .btn-outline-light:hover {
    background-color: rgba(255, 255, 255, 0.15);
    color: #fff !important;
    border-color: #fff;
}

/* ================================================================
   COLORE TEAL (non presente in Bootstrap)
   ================================================================ */
.text-teal {
    color: var(--camecon-teal) !important;
}

.bg-teal {
    background-color: var(--camecon-teal) !important;
}

.bg-teal.bg-opacity-10 {
    background-color: #e0f2f1 !important;
}

.btn-teal {
    background-color: var(--camecon-teal);
    border-color: var(--camecon-teal);
    color: #fff;
}

.btn-teal:hover {
    background-color: #0a7a70;
    border-color: #0a7a70;
    color: #fff;
}

.btn-outline-teal {
    color: var(--camecon-teal);
    border-color: var(--camecon-teal);
    background-color: transparent;
}

.btn-outline-teal:hover {
    background-color: var(--camecon-teal);
    border-color: var(--camecon-teal);
    color: #fff;
}

.badge.bg-teal {
    background-color: var(--camecon-teal) !important;
    color: #fff !important;
}

.badge.bg-teal.bg-opacity-10 {
    background-color: #e0f2f1 !important;
    color: #0a5c54 !important;
    border: 1px solid #b2dfdb;
}

.bg-teal.bg-opacity-10 .text-teal {
    color: #0a5c54 !important;
}

/* ================================================================
   FIX CONTRASTO: bg-COLOR bg-opacity-10 + text-COLOR
   Il problema: bg-primary bg-opacity-10 crea uno sfondo scuro
   perché --camecon-blue è #1b3a5c (molto scuro).
   Soluzione: sfondo chiaro esplicito per le combinazioni opacity.
   ================================================================ */

/* Sfondi chiari con buon contrasto */
.bg-primary.bg-opacity-10 {
    background-color: #e8eef4 !important; /* blu chiarissimo leggibile */
}

.bg-primary.bg-opacity-25 {
    background-color: #c5d5e4 !important;
}

.bg-success.bg-opacity-10 {
    background-color: #e8f5e9 !important;
}

.bg-danger.bg-opacity-10 {
    background-color: #fce8e8 !important;
}

.bg-warning.bg-opacity-10 {
    background-color: #fff8e1 !important;
}

.bg-info.bg-opacity-10 {
    background-color: #e1f5fe !important;
}

/* ================================================================
   BADGE AD ALTO CONTRASTO
   Quando si usa badge bg-COLOR bg-opacity-10 text-COLOR,
   forziamo il testo scuro per leggibilità.
   ================================================================ */
.badge.bg-primary.bg-opacity-10 {
    background-color: #e8eef4 !important;
    color: var(--camecon-blue) !important;
    border: 1px solid #c5d5e4;
}

.badge.bg-success.bg-opacity-10 {
    background-color: #e8f5e9 !important;
    color: #1b5e20 !important;
    border: 1px solid #c8e6c9;
}

.badge.bg-danger.bg-opacity-10 {
    background-color: #fce8e8 !important;
    color: #b71c1c !important;
    border: 1px solid #f5c6c6;
}

.badge.bg-warning.bg-opacity-10 {
    background-color: #fff8e1 !important;
    color: #7a6100 !important;
    border: 1px solid #ffe082;
}

.badge.bg-info.bg-opacity-10 {
    background-color: #e1f5fe !important;
    color: #01579b !important;
    border: 1px solid #b3e5fc;
}

/* ================================================================
   ICONE/CERCHI DECORATIVI SU SFONDI CHIARI
   Garantisce che text-COLOR sia sempre leggibile su bg-COLOR-10
   ================================================================ */
.bg-primary.bg-opacity-10 .text-primary {
    color: var(--camecon-blue) !important;
}

.bg-success.bg-opacity-10 .text-success {
    color: #1b5e20 !important;
}

.bg-danger.bg-opacity-10 .text-danger {
    color: #b71c1c !important;
}

.bg-warning.bg-opacity-10 .text-warning {
    color: #e65100 !important;
}

.bg-info.bg-opacity-10 .text-info {
    color: #01579b !important;
}

/* ================================================================
   UTILITY AGGIUNTIVE
   ================================================================ */

/* Hover cards */
.hover-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.hover-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, .12) !important;
}

/* Smooth scroll */
html {
    scroll-behavior: smooth;
}

/* Nav pills stile Camecon */
.nav-pills .nav-link {
    color: var(--camecon-blue);
    border-radius: 20px;
    padding: 6px 16px;
    font-size: 0.9rem;
}

.nav-pills .nav-link:hover {
    background-color: var(--camecon-light);
}

/* List group active con colore brand */
.list-group-item.active {
    background-color: var(--camecon-blue);
    border-color: var(--camecon-blue);
}