/* =========================================
   STYLE GLOBAL & UTILITAIRES
   ========================================= */
body {
    background-color: #f8f9fa;
    padding-bottom: 80px; /* Espace pour le scroll mobile */
}

/* Utilitaires pour icônes et textes */
.icon-lg { font-size: 2rem; display: block; margin-bottom: 10px; }
.small-label { font-size: 0.75rem; color: #6c757d; }

/* =========================================
   DASHBOARD (INDEX)
   ========================================= */
.step-card { 
    transition: transform 0.2s; 
    cursor: pointer; 
}
.step-card:hover { 
    transform: translateY(-5px); 
    box-shadow: 0 4px 15px rgba(0,0,0,0.1); 
}
/* Styles légers pour les briques du tableau de bord */
    .kpi-card {
        transition: transform 0.15s ease, box-shadow 0.15s ease;
        cursor: pointer;
    }
    .kpi-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    }

    /* Briques plus compactes (≈ 1/3 de hauteur en moins) */
    .kpi-card .card-body {
        padding: 0.5rem 0.4rem;
    }
    .kpi-icon {
        font-size: 1.6rem;
        margin-bottom: 0.15rem;
    }
    .kpi-value {
        font-size: 1.3rem;
        font-weight: 700;
        line-height: 1.1;
    }
    .kpi-card .fw-semibold {
        font-size: 0.85rem;
    }


/* =========================================
   PAGE SEMIS
   ========================================= */
.stock-line:focus-within { background-color: #e8f5e9; }

/* Lignes de tableau colorées */
.semis-row { 
    border-left: 3px solid #dee2e6; 
    transition: all 0.2s; 
    background-color: white;
    border-bottom: 1px solid #eee;
}
.semis-row:hover { background-color: #f8f9fa; }
.semis-row.status-seme    { border-left-color: #ffc107; }
.semis-row.status-germe   { border-left-color: #0dcaf0; }
.semis-row.status-repique { border-left-color: #198754; }
.semis-row.status-echec   { border-left-color: #dc3545; }
.semis-row.status-retard  { border-left-color: #dc3545; }

/* Formulaire d'édition germination */
.edit-germ-form { display: none; }
.edit-germ-form.show { display: flex; }

/* Photos */
.photo-thumb { 
    width: 60px; height: 60px; 
    object-fit: cover; 
    border-radius: 4px; 
    cursor: pointer; 
    transition: transform 0.2s; 
}
.photo-thumb:hover { transform: scale(1.1); opacity: 0.9; }
.photo-section { border-left: 3px solid #0d6efd; }

/* =========================================
   PAGE REPIQUAGE
   ========================================= */
.carte-repiq { border-left: 4px solid #ffc107; transition: 0.2s; }
.carte-repiq.prioritaire { border-left-color: #198754; }
.carte-repiq:hover { box-shadow: 0 0 8px rgba(0,0,0,0.15); }

.edit-box { display: none; }
.edit-box.show { display: block; animation: fadeIn 0.3s; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* =========================================
   LIGHTBOX (GALERIE PHOTO)
   ========================================= */
.lightbox-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.95);
    z-index: 9999;
    justify-content: center; align-items: center; flex-direction: column;
}
.lightbox-overlay.active { display: flex; }
.lightbox-content { 
    position: relative; 
    max-width: 90%; max-height: 80%; 
    display: flex; justify-content: center; align-items: center; 
}
.lightbox-content img { 
    max-width: 100%; max-height: 80vh; 
    object-fit: contain; border-radius: 8px; 
}
.lightbox-close, .lightbox-nav {
    position: absolute;
    background: rgba(255,255,255,0.2);
    border: none; color: white; cursor: pointer; border-radius: 50%;
}
.lightbox-close { top: 10px; right: 10px; width: 40px; height: 40px; font-size: 1.5rem; }
.lightbox-nav { top: 50%; transform: translateY(-50%); width: 50px; height: 50px; font-size: 1.5rem; }
.lightbox-nav.prev { left: 20px; }
.lightbox-nav.next { right: 20px; }
.lightbox-info { color: white; text-align: center; margin-top: 10px; font-size: 0.9rem; }

/* =========================================
   OPTIMISATIONS MOBILE (MODE TERRAIN)
   ========================================= */
@media (max-width: 576px) {
    /* Boutons et inputs plus gros pour le tactile */
    .btn-sm, .form-control-sm, .form-select-sm {
        font-size: 16px !important; /* Empêche le zoom auto sur iPhone */
        padding: 8px 10px !important;
        height: auto !important;
    }

    /* Page Semis : Aérer les lignes */
    .semis-row {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
    
    /* Page Semis : Formulaire germination en colonne */
    .semis-row form.d-flex {
        flex-wrap: wrap;
        margin-top: 10px;
        background: #f8f9fa;
        padding: 10px;
        border-radius: 8px;
    }
    .semis-row form.d-flex input {
        width: 100% !important;
        margin-bottom: 8px;
    }
    .semis-row form.d-flex button {
        width: 100%;
        margin-top: 5px;
    }
    
    /* Boutons d'action plus accessibles */
    .btn-icon {
        padding: 8px 12px !important;
        margin-top: 5px;
    }

    /* Page Repiquage : Formulaires empilés */
    .carte-repiq form .col-6 {
        width: 100% !important;
        margin-bottom: 8px;
    }
    
    /* Boutons de validation pleine largeur */
    button[name="valider_repiquage"], 
    button[name="modifier_repiquage"],
    button[name="save_semis"] {
        width: 100%;
        padding: 12px !important;
        font-weight: bold;
    }
}

.app-footer {
    font-size: 0.8rem;        /* petits caractères */
    line-height: 1.3;         /* compact mais lisible */
}