/* Tema MALAKA: el de las maquetas del cliente.
   Fondo claro de trabajo, tarjetas blancas, verde corporativo como acento y
   cabecera oscura en movil. Pensado para leerse bien con luz de nave. */
:root{
  /* Lienzo */
  --bg:#f4f6f8; --page-bg:#f4f6f8;
  --aside:#ffffff; --sidebar-txt:#1f2a37;
  --card-bg:#ffffff; --card-shadow:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.04);
  --line:#e4e7ec; --txt:#1f2a37; --mut:#667085; --head:#101828;

  /* Marca */
  --brand-bg:#12582f; --brand-txt:#ffffff;
  --accent:#12a150; --accent2:#0d7f3f;
  --btn-primary:#12a150; --btn-primary-txt:#ffffff;
  --btn-sec:#eef1f4; --btn-sec-txt:#344054;
  --btn-dark:#1f2a37; --btn-dark-txt:#ffffff;

  /* Navegacion */
  --nav-active:#e7f6ec; --nav-active-txt:#0d7f3f;
  --topbar-bg:#ffffff; --topbar-line:#e4e7ec;
  --mobilebar-bg:#101828; --mobilebar-txt:#ffffff;

  /* Formularios */
  --input-bg:#ffffff; --input-border:#d0d5dd;
  --table-head-bg:#f9fafb;

  /* Estados */
  --badge-bg:#e7f6ec; --badge-txt:#0d7f3f;
  --danger:#d92d20; --amber:#b54708;

  --radius:10px; --font:'Segoe UI',system-ui,Roboto,Arial,sans-serif;
  --glow:none; --title-spacing:-0.01em;
}

/* Barra lateral clara: el bloque de marca es el unico oscuro */
aside{box-shadow:1px 0 0 var(--line)}
nav button.active{font-weight:600}

/* Badges de estado en claro */
.badge.gray{background:#f2f4f7;color:#475467}
.badge.amber{background:#fef0c7;color:#b54708}
.badge.red{background:#fee4e2;color:#b42318}

/* Tablas con cabecera gris suave, como en la maqueta */
th{background:var(--table-head-bg)}
tbody tr:hover>td{background:#f9fafb}

/* Botones: el primario es verde macizo, sin degradado */
button.primary{box-shadow:none}
button.primary:hover{background:var(--accent2)}
