/*  estilos.css  ────────────────────────────────────────────────────── */
/*  1. VARIABLES                                                          */
:root{
  --verde-primario: #005f3c;
  --verde-claro:    #39a06b;
  --gris-oscuro:    #444;
  --gris-claro:     #f2f2f2;
  --rojo-alerta:    #d9534f;
  --azul-info:      #0d6efd;
  --bs-body-font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  --bs-body-font-size:   15px;
}

/*  2. TIPOGRAFÍA                                                      */
body{
  font-family: var(--bs-body-font-family);
  font-size:   var(--bs-body-font-size);
  color: var(--gris-oscuro);
  background-color: var(--gris-claro);
  line-height: 1.45;
}

/* títulos uniformes */
h1,h2,h3,h4{
  color: var(--verde-primario);
  font-weight: 600;
}

/*  3. LINKS                                                            */
a{ color: var(--azul-info); }
a:hover{ color: var(--verde-primario); text-decoration: underline; }

/*  4. BOTONES personalizados                                           */
.btn-verde{
  --bs-btn-bg: var(--verde-primario);
  --bs-btn-border-color: var(--verde-primario);
  --bs-btn-hover-bg: var(--verde-claro);
  --bs-btn-hover-border-color: var(--verde-claro);
  --bs-btn-color: #fff;
}
.btn-outline-verde{
  --bs-btn-color: var(--verde-primario);
  --bs-btn-border-color: var(--verde-primario);
  --bs-btn-hover-bg: var(--verde-primario);
  --bs-btn-hover-color: #fff;
}

/*  5. TARJETAS                                                         */
.card{
  border-radius: .6rem;
  box-shadow: 0 0 .5rem rgba(0,0,0,.1);
}
.card-header{
  background-color: var(--verde-primario);
  color:#fff;
  font-weight: 600;
}

/*  6. TABLAS                                                           */
.table tr>th{
  background-color: var(--gris-claro);
  font-weight: 600;
}
.table-striped>tbody>tr:nth-of-type(odd)>*{
  background-color: #ffffff;
}
.table-striped>tbody>tr:nth-of-type(even)>*{
  background-color: #fafafa;
}

/*  7. FORMULARIOS                                                      */
.form-control:focus{
  border-color: var(--verde-primario);
  box-shadow: 0 0 0 .25rem rgba(0,95,60,.25);
}

/*  8. BARRA DE PROGRESO                                                */
.progress{
  background-color:#e9ecef;
  height:1.8rem;
}
.progress-bar{
  font-weight:600;
}
.progress-bar.bg-info   { background-color: var(--azul-info)!important; }
.progress-bar.bg-success{ background-color: var(--verde-claro)!important; }
.progress-bar.bg-danger { background-color: var(--rojo-alerta)!important; }

/*  9. UTILITARIOS                                                      */
.text-verde{ color: var(--verde-primario)!important; }
.bg-verde  { background-color: var(--verde-primario)!important; color:#fff; }

.shadow-xs{ box-shadow:0 0 .15rem rgba(0,0,0,.05)!important; }
.shadow-sm{ box-shadow:0 .1rem .5rem rgba(0,0,0,.1)!important; }
.shadow-md{ box-shadow:0 .3rem 1rem rgba(0,0,0,.15)!important; }

/* 10. MODO IMPRESIÓN                                                   */
@media print{
  body{ background:none!important; }
  a[href]:after{ content:" (" attr(href) ")"; font-size:80%; }
  .btn, nav, footer, .no-print{ display:none!important; }
  .card{ box-shadow:none!important; page-break-inside:avoid; }
}

/* 11. TIMELINE & DASHBOARD ENHANCEMENTS  */
.timeline-item {
    position: relative;
    padding-left: 20px;
}
.status-box {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.status-box:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 15px rgba(0,0,0,0.05) !important;
}
.fw-800 { font-weight: 800 !important; }
.icon-box i { line-height: 1; }
.timeline-marker { z-index: 2; }
