/* ========================================
   PROTAGONISTAS DE LA HISTORIA 
   Camporee Conquistadores UMN 2026
======================================= */

/* COLORES BASE LIGHT MODE - SUAVIZADOS */
:root {
  /* FUEGO - Más suave */
  --fire-main: #D8554E;
  --fire-dark: #A8554E;
  
  /* HIELO - Pastel */
  --ice-main: #A0D8FF;
  --ice-soft: #E8F4FD;
  
  /* ORO - Dorado suave */
  --gold-main: #FAD689;
  
  /* HISTORIA - Marrón neutro */
  --brown-main: #8A6A4D;
  
  /* ESPERANZA - Verde suave */
  --success-green: #4ABF68;
  
  /* ADVERTENCIA - Ámbar suave */
  --warning-amber: #F0C14B;
  
  /* BASE - Fondos neutros */
  --bg-main: #FAF7F2;
  --bg-card: rgba(255,255,255,0.92);
  
  /* TEXTOS - Suavizados */
  --text-main: #3A2F20;
  --text-muted: #8A7D6F;
}

/* DARK MODE AUTOMÁTICO - Suavizado *
@media (prefers-color-scheme: dark) {
  :root {
    --bg-main: #5A2A2A;
    --bg-card: rgba(90,42,42,0.92);
    --text-main: #F8F2E8;
    --text-muted: #D2CBB9;
  }
}

.theme-dark {
  --bg-main: #5A2A2A;
  --bg-card: rgba(90,42,42,0.92);
  --text-main: #F8F2E8;
  --text-muted: #D2CBB9;
}

/* BODY - FONDO GENERAL */
body {
  background: linear-gradient(rgba(0,0,0,0.15), rgba(0,0,0,0.15)), url('../img/panolin.jpg') center/cover no-repeat fixed;
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: var(--text-main);
}

/* Contenedor principal */
.main-bg {
  background: var(--bg-card);
  backdrop-filter: blur(6px);
  border-radius: 1.75rem;
  padding: 2rem;
  box-shadow: 0 14px 40px rgba(0,0,0,0.25);
}

/* NAVBAR */
.navbar {
  background: linear-gradient(90deg, var(--fire-main), var(--brown-main));
}

.navbar-brand img {
  height: 48px;
}

/* TARJETAS DASHBOARDS */
.info-card {
  background: linear-gradient(180deg, var(--bg-card), rgba(255,255,255,0.7));
  border-left: 6px solid var(--gold-main);
  border-radius: 1.25rem;
  transition: all 0.25s ease;
}

.info-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 35px rgba(0,0,0,0.25);
}

.card-title {
  font-weight: 700;
  color: var(--brown-main);
}

/* TABLAS */
.table thead th {
  background: var(--gold-main);
  color: #3A240F;
  font-weight: 700;
  border-bottom: 4px solid var(--brown-main);
}

.table td, .table th {
  vertical-align: middle;
}

/* Alineaciones */
.text-right {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

/* Estados financieros */
.text-money-pos {
  color: var(--success-green);
  font-weight: 700;
}

.text-money-neg {
  color: var(--fire-main);
  font-weight: 700;
}

.text-money-warn {
  color: var(--warning-amber);
  font-weight: 700;
}

/* BOTONES iOS STYLE */
.btn {
  border-radius: 999px;
  padding: 0.65rem 1.4rem;
  font-weight: 600;
}

.btn-primary {
  background: linear-gradient(135deg, var(--fire-main), var(--fire-dark));
  border: none;
  color: #fff;
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(162,37,35,0.5);
}

.btn-secondary {
  background: linear-gradient(135deg, var(--gold-main), var(--brown-main));
  border: none;
  color: #3A240F;
}

/* PROGRESS BAR HIELO vs FUEGO */
.progress {
  height: 1.3rem;
  border-radius: 999px;
  background: var(--ice-soft);
}

.progress-bar {
  background: linear-gradient(90deg, var(--gold-main), var(--ice-main));
  font-weight: 700;
}

/* FORMULARIOS */
.form-control, .form-select {
  border-radius: 0.75rem;
  border: 1px solid #CFC2AE;
}

.form-control:focus, .form-select:focus {
  border-color: var(--gold-main);
  box-shadow: 0 0 0 3px rgba(244,197,66,0.35);
}

/* MOBILE FIRST */
@media (max-width: 768px) {
  .main-bg {
    padding: 1.25rem;
    border-radius: 1.2rem;
  }
  
  .card-title {
    font-size: 1rem;
  }
  
  .btn {
    width: 100%;
    margin-bottom: 0.5rem;
  }
}