/* Prueba de estilo: Poppins, colores del taller y modo oscuro. */
@font-face { font-family: Poppins; src: url(fonts/Poppins-Regular.ttf); font-weight: 400; }
@font-face { font-family: Poppins; src: url(fonts/Poppins-Medium.ttf); font-weight: 500; }
@font-face { font-family: Poppins; src: url(fonts/Poppins-SemiBold.ttf); font-weight: 600; }
@font-face { font-family: Poppins; src: url(fonts/Poppins-Bold.ttf); font-weight: 700; }

:root, [data-bs-theme=light] {
  --md-naranja: #fe450d;
  --md-naranja-oscuro: #d93a08;
  --md-fondo: #f4f5f7;
  --md-superficie: #ffffff;
  --md-borde: #e6e8ec;
  --md-barra: #ffffff;
  --md-texto-suave: #6b7280;
  --bs-body-font-family: Poppins, system-ui, sans-serif;
  --bs-body-bg: var(--md-fondo);
  --bs-primary: #fe450d;
  --bs-primary-rgb: 254, 69, 13;
  --bs-link-color: #e03c0a;
  --bs-link-color-rgb: 224, 60, 10;
  --bs-link-hover-color: #b02f07;
  --bs-border-radius: .6rem;
}
[data-bs-theme=dark] {
  --md-fondo: #111214;
  --md-superficie: #1b1d21;
  --md-borde: #2b2e34;
  --md-barra: #17181b;
  --md-texto-suave: #9aa0aa;
  --bs-body-bg: var(--md-fondo);
  --bs-body-color: #e7e9ec;
  --bs-link-color: #ff6a3d;
  --bs-link-color-rgb: 255, 106, 61;
  --bs-link-hover-color: #ff8c66;
  --bs-border-color: var(--md-borde);
  --bs-secondary-color: var(--md-texto-suave);
}
body { font-size: .94rem; background: var(--md-fondo); }
h1, .h3 { font-weight: 600; letter-spacing: -.01em; }

/* Barra superior */
.navbar.barra { background: var(--md-barra) !important; border-bottom: 3px solid var(--md-naranja); box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.barra .navbar-brand img.alas { height: 38px; }
.barra .navbar-brand img.nombre { height: 13px; margin-left: .6rem; }
.barra .nav-link { font-weight: 500; color: var(--bs-body-color); border-radius: .5rem; padding: .35rem .8rem !important; margin: 0 .1rem; }
.barra .nav-link:hover, .barra .nav-link.show { background: rgba(254,69,13,.12); color: var(--bs-body-color) !important; }
/* El menú de la sección actual: pastilla naranja con letra blanca, para que no se confunda con el logo. */
.barra .nav-link.active { background: var(--md-naranja); color: #fff !important; }
.dropdown-menu { border: 1px solid var(--md-borde); border-radius: .7rem; box-shadow: 0 10px 30px rgba(0,0,0,.12); padding: .4rem; }
.dropdown-item { border-radius: .45rem; }
.dropdown-item:hover { background: rgba(254,69,13,.1); color: var(--md-naranja); }
.boton-tema { border: 1px solid var(--md-borde); background: transparent; border-radius: 2rem; width: 2.3rem; height: 2.3rem; color: var(--bs-body-color); }

/* Botones */
.btn-primary { --bs-btn-bg: var(--md-naranja); --bs-btn-border-color: var(--md-naranja); --bs-btn-hover-bg: var(--md-naranja-oscuro); --bs-btn-hover-border-color: var(--md-naranja-oscuro); --bs-btn-active-bg: var(--md-naranja-oscuro); font-weight: 500; }
.btn-outline-primary { --bs-btn-color: var(--md-naranja); --bs-btn-border-color: var(--md-naranja); --bs-btn-hover-bg: var(--md-naranja); --bs-btn-hover-border-color: var(--md-naranja); --bs-btn-active-bg: var(--md-naranja); }
.btn { border-radius: .55rem; }
.form-control, .form-select { border-color: var(--md-borde); background-color: var(--md-superficie); }
.form-control:focus, .form-select:focus { border-color: var(--md-naranja); box-shadow: 0 0 0 .2rem rgba(254,69,13,.18); }

/* Tarjetas y tablas */
.card { border: 1px solid var(--md-borde); border-radius: .9rem; background: var(--md-superficie); box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.table { --bs-table-bg: var(--md-superficie); border-radius: .9rem; overflow: hidden; }
.table-responsive { border: 1px solid var(--md-borde); border-radius: .9rem; background: var(--md-superficie); }
.table > thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; color: var(--md-texto-suave); font-weight: 600; background: var(--md-superficie); border-bottom: 2px solid var(--md-naranja); }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: rgba(254,69,13,.06); }
.badge { border-radius: 2rem; font-weight: 500; padding: .38em .75em; }
.text-bg-info { background: rgba(14,165,233,.15) !important; color: #0284c7 !important; }
.text-bg-warning { background: rgba(245,158,11,.18) !important; color: #b45309 !important; }
.text-bg-success { background: rgba(34,197,94,.16) !important; color: #15803d !important; }
.text-bg-danger { background: rgba(239,68,68,.15) !important; color: #b91c1c !important; }
.text-bg-light { background: rgba(107,114,128,.12) !important; color: var(--md-texto-suave) !important; border: 0 !important; }
.text-bg-primary { background: var(--md-naranja) !important; }
[data-bs-theme=dark] .text-bg-info { color: #38bdf8 !important; }
[data-bs-theme=dark] .text-bg-warning { color: #fbbf24 !important; }
[data-bs-theme=dark] .text-bg-success { color: #4ade80 !important; }
[data-bs-theme=dark] .text-bg-danger { color: #f87171 !important; }
[data-bs-theme=dark] .table-primary { --bs-table-bg: rgba(254,69,13,.14); --bs-table-color: inherit; }
.page-link { color: var(--md-naranja); }
.active > .page-link { background: var(--md-naranja); border-color: var(--md-naranja); }

/* Login */
.login-logo { width: 220px; display: block; margin: 0 auto .8rem; }
.login-nombre { width: 240px; display: block; margin: 0 auto 1.6rem; }
.list-group-item { background: transparent; }
/* Recuadros dentro de formularios (por ejemplo, cambiar contraseña). */
.recuadro { border: 1px solid var(--md-borde); border-radius: .7rem; background: var(--md-superficie); }
.recuadro legend { font-size: .95rem; font-weight: 500; float: none; width: auto; padding: 0 .4rem; margin-bottom: .4rem; }
