/* ============================================================
   Tema EMYLEC para el panel del ERP
   Colores tomados del logo: azul #0A3A86 y naranja #D4842E
   ============================================================ */

:root {
  --emy-azul: #0a3a86;
  --emy-azul-osc: #072a63;
  --emy-azul-claro: #eaf0fa;
  --emy-naranja: #d4842e;
  --emy-naranja-osc: #b36a1c;
  --emy-fondo: #f3f5f9;
  --emy-sombra: 0 1px 2px rgba(15, 30, 60, .06), 0 2px 8px rgba(15, 30, 60, .05);
  --emy-radio: 10px;

  --primary: var(--emy-azul);
  --secondary: var(--emy-azul);
  --accent: var(--emy-naranja);
  --primary-fg: #fff;

  --body-fg: #1f2937;
  --body-bg: #fff;
  --body-quiet-color: #5b6678;
  --body-medium-color: #3b4555;
  --body-loud-color: #0f172a;

  --header-color: #5b6678;
  --header-branding-color: var(--emy-azul);
  --header-bg: #fff;
  --header-link-color: var(--emy-azul);

  --breadcrumbs-fg: #b8c7e6;
  --breadcrumbs-link-fg: #fff;
  --breadcrumbs-bg: var(--emy-azul);

  --link-fg: #0b4aa8;
  --link-hover-color: var(--emy-naranja-osc);
  --link-selected-fg: var(--emy-azul);

  --hairline-color: #e5e9f0;
  --border-color: #d2d9e4;

  --message-success-bg: #e7f5ea;
  --message-warning-bg: #fff4e0;
  --message-error-bg: #fdecec;

  --darkened-bg: #f6f8fb;
  --selected-bg: #e8eef8;
  --selected-row: #fff3e3;

  --button-fg: #fff;
  --button-bg: var(--emy-azul);
  --button-hover-bg: var(--emy-azul-osc);
  --default-button-bg: var(--emy-naranja);
  --default-button-hover-bg: var(--emy-naranja-osc);
  --close-button-bg: #6b7688;
  --close-button-hover-bg: #4b5567;

  --object-tools-fg: #fff;
  --object-tools-bg: var(--emy-azul);
  --object-tools-hover-bg: var(--emy-azul-osc);

  --font-family-primary: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}

body { background: var(--emy-fondo); color: var(--body-fg); }

/* ---------- cabecera ---------- */
#header {
  background: #fff;
  border-bottom: 3px solid var(--emy-naranja);
  padding: 10px 32px;
  min-height: 62px;
  box-sizing: border-box;
}
#branding { display: flex; align-items: center; }
#site-name { margin: 0; }
.marca:link, .marca:visited { display: flex; align-items: center; gap: 16px; text-decoration: none; }
.marca-logo { height: 40px; width: auto; display: block; }
.marca-sistema {
  border-left: 1px solid var(--border-color);
  padding-left: 16px;
  color: var(--body-quiet-color);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .2px;
}
#user-tools { color: var(--body-quiet-color); font-size: 12px; letter-spacing: .3px; }
#user-tools a, #logout-form button { color: var(--emy-azul); border-bottom: none; }
#user-tools a:hover, #logout-form button:hover { color: var(--emy-naranja-osc); text-decoration: underline; }
#user-tools strong { color: var(--body-fg); }
.theme-toggle { display: none !important; }

/* ---------- migas de pan ---------- */
div.breadcrumbs { padding: 9px 32px; font-size: 13px; }

/* ---------- contenido ---------- */
#content { padding: 24px 32px; }
#content > h1, #content-main > h1 { color: var(--body-loud-color); font-weight: 600; font-size: 22px; }
#main { background: var(--emy-fondo); }
#container > .main { min-height: calc(100vh - 140px); }

/* bloques y formularios como tarjetas */
.module, fieldset.module, .inline-group, #changelist .changelist-form-container, #changelist-filter {
  background: #fff;
  border: 1px solid var(--hairline-color);
  border-radius: var(--emy-radio);
  box-shadow: var(--emy-sombra);
}
fieldset.module { margin-bottom: 18px; }
.module h2, .module caption, .inline-group h2, fieldset.module h2 {
  background: var(--emy-azul);
  color: #fff;
  font-weight: 600;
  letter-spacing: .3px;
  font-size: 13px;
  padding: 9px 14px;
}
fieldset.module h2, .inline-group h2 { border-radius: var(--emy-radio) var(--emy-radio) 0 0; }
.module caption { border-radius: 0; }
.inline-group .tabular { border: none; box-shadow: none; }
.inline-group { overflow: visible; }

/* botones */
.button, input[type=submit], input[type=button], .submit-row input, a.button, .object-tools a {
  border-radius: 6px !important;
  font-weight: 600;
}
.submit-row { border-radius: var(--emy-radio); background: #fff; border: 1px solid var(--hairline-color); }
.object-tools a:link, .object-tools a:visited { padding: 6px 14px; letter-spacing: .3px; }

/* campos */
input[type=text], input[type=number], input[type=email], input[type=password], input[type=url],
input[type=tel], textarea, select, .vTextField {
  border-radius: 6px;
  border-color: var(--border-color);
}
input:focus, textarea:focus, select:focus { border-color: var(--emy-azul); outline: 2px solid var(--emy-azul-claro); }

/* ---------- menú lateral ---------- */
#nav-sidebar { background: #fff; border-right: 1px solid var(--hairline-color); }
#nav-sidebar .module { box-shadow: none; border: none; border-radius: 0; background: transparent; }
#nav-sidebar .module caption { background: transparent; color: var(--body-quiet-color); font-size: 11px;
  text-transform: uppercase; letter-spacing: 1px; padding: 14px 14px 6px; }
#nav-sidebar .module caption a { color: var(--body-quiet-color); }
#nav-sidebar th, #nav-sidebar td { border-bottom: none; }
#nav-sidebar th a { font-weight: 500; color: var(--body-fg); }
#nav-sidebar tr:hover th a { color: var(--emy-azul); }
#nav-sidebar .current-model { background: var(--selected-row); box-shadow: inset 3px 0 0 var(--emy-naranja); }
#nav-sidebar .current-model th a { color: var(--emy-azul); font-weight: 600; }
#nav-sidebar .addlink { font-size: 11px; }
#nav-filter { border-radius: 6px; margin: 10px 8px; width: calc(100% - 16px); }
.toggle-nav-sidebar { background: #fff; border-right: 1px solid var(--hairline-color); color: var(--emy-azul); }

/* ---------- listados ---------- */
#changelist .changelist-form-container { padding: 0; overflow: hidden; }
#changelist #toolbar { background: var(--darkened-bg); border-bottom: 1px solid var(--hairline-color); border-radius: var(--emy-radio) var(--emy-radio) 0 0; }
#changelist table thead th { background: #f1f4f9; color: #33415a; font-weight: 600; }
#changelist table thead th.sorted { background: var(--emy-azul-claro); }
#result_list tbody tr:hover td, #result_list tbody tr:hover th { background: #f7f9fd; }
#result_list tbody tr.selected td, #result_list tbody tr.selected th { background: var(--selected-row); }
#changelist .actions { background: #fff; border-bottom: 1px solid var(--hairline-color); }
#changelist-filter { overflow: hidden; }
#changelist-filter h2 { background: var(--emy-azul); color: #fff; border-radius: 0; }
#changelist-filter h3 { color: var(--body-medium-color); font-weight: 600; }
#changelist-filter li.selected a, #changelist-filter li.selected a:link { color: var(--emy-naranja-osc); font-weight: 600; }
#changelist-filter li.selected { border-left-color: var(--emy-naranja); }
.paginator { background: #fff; }
p.datehierarchy, .xfull > .toplinks { font-weight: 500; }

/* mensajes */
ul.messagelist li { border-radius: 8px; margin: 0 0 8px; }

/* ---------- pie ---------- */
.pie { text-align: center; color: var(--body-quiet-color); font-size: 12px; padding: 14px 0 22px; }

/* ---------- login ---------- */
body.login { background: linear-gradient(180deg, var(--emy-azul) 0 42%, var(--emy-fondo) 42% 100%); }
.login #container { border-radius: 14px; box-shadow: 0 12px 40px rgba(7, 30, 70, .25); border: none; overflow: hidden; margin-top: 90px; width: 30rem; }
.login #header { justify-content: center; padding: 22px 20px 16px; }
.login #branding { flex-direction: column; }
.login .marca { flex-direction: column; gap: 8px; }
.login .marca-logo { height: 54px; }
.login .marca-sistema { border-left: none; padding-left: 0; }
.login #content { padding: 22px 30px 28px; }
.login .submit-row input { width: 100%; padding: 10px; font-size: 14px; }
.login .pie { display: none; }

/* ---------- tablero de inicio ---------- */
.dashboard #content { max-width: 1280px; }
.tablero { margin-bottom: 8px; }
.tab-saludo h1 { margin: 0 0 2px; font-size: 24px; color: var(--body-loud-color); font-weight: 600; }
.tab-saludo p { margin: 0 0 18px; color: var(--body-quiet-color); }
.tab-acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
a.tab-accion:link, a.tab-accion:visited {
  display: inline-flex; align-items: center; gap: 8px;
  background: #fff; border: 1px solid var(--border-color); border-radius: 8px;
  padding: 9px 16px; color: var(--emy-azul); font-weight: 600; text-decoration: none; box-shadow: var(--emy-sombra);
}
a.tab-accion span { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%;
  background: var(--emy-naranja); color: #fff; font-weight: 700; line-height: 1; }
a.tab-accion:hover { border-color: var(--emy-azul); background: var(--emy-azul-claro); }
.tab-tarjetas { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; margin-bottom: 22px; }
a.tab-tarjeta:link, a.tab-tarjeta:visited {
  display: flex; flex-direction: column; gap: 2px; padding: 16px 18px;
  background: #fff; border: 1px solid var(--hairline-color); border-radius: var(--emy-radio);
  border-top: 4px solid var(--borde, var(--emy-azul)); box-shadow: var(--emy-sombra);
  color: var(--body-fg); text-decoration: none;
}
a.tab-tarjeta:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(15, 30, 60, .10); }
.tab-tarjeta-titulo { color: var(--body-quiet-color); font-size: 13px; }
.tab-tarjeta strong { font-size: 30px; line-height: 1.15; color: var(--body-loud-color); font-weight: 600; }
.tab-tarjeta small { color: var(--body-quiet-color); font-size: 12px; }
.tab-rojo { --borde: #ba2121; }
.tab-ambar { --borde: #d4842e; }
.tab-verde { --borde: #2e7d32; }
.tab-azul { --borde: var(--emy-azul); }
.tab-rojo strong { color: #ba2121; }
.tab-paneles { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 18px; margin-bottom: 24px; }
.tab-panel { background: #fff; border: 1px solid var(--hairline-color); border-radius: var(--emy-radio); box-shadow: var(--emy-sombra); overflow: hidden; }
.tab-panel h2 { margin: 0; padding: 12px 16px; font-size: 14px; font-weight: 600; color: var(--body-loud-color);
  background: #fff; border-bottom: 1px solid var(--hairline-color); }
.tab-panel h2 small { color: var(--body-quiet-color); font-weight: 400; }
.tab-panel table { width: 100%; border-collapse: collapse; }
.tab-panel th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--body-quiet-color);
  background: var(--darkened-bg); padding: 8px 12px; font-weight: 600; }
.tab-panel td { padding: 9px 12px; border-top: 1px solid var(--hairline-color); vertical-align: middle; }
.tab-panel .num { text-align: right; white-space: nowrap; }
.tab-panel .nowrap { white-space: nowrap; }
.tab-vacio { padding: 18px 16px; color: var(--body-quiet-color); margin: 0; }
.tab-subtitulo { font-size: 13px; text-transform: uppercase; letter-spacing: 1px; color: var(--body-quiet-color); margin: 6px 0 12px; }
.dashboard #content-main .module { margin-bottom: 16px; }
.dashboard .app-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.dashboard #content-main { width: 100%; float: none; }
.dashboard .module table { width: 100%; }

/* ---------- pantallas angostas ---------- */
@media (max-width: 1024px) {
  #header { padding: 10px 16px; }
  #content { padding: 16px; }
  div.breadcrumbs { padding: 9px 16px; }
  .marca-sistema { display: none; }
  .tab-paneles { grid-template-columns: 1fr; }
}

/* ---------- ajustes ---------- */
body.dashboard #content { width: auto; max-width: 1280px; }
.module caption a.section:link, .module caption a.section:visited,
.module h2 a:link, .module h2 a:visited { color: #fff; }
#nav-sidebar .module caption a.section:link, #nav-sidebar .module caption a.section:visited { color: var(--body-quiet-color); }
.object-tools a.addlink:link, .object-tools a.addlink:visited { padding-right: 28px; }
.tab-panel td:first-child, .tab-panel td:nth-child(3) { white-space: nowrap; }

.login #container > .main, .login #main { min-height: 0; }
.login #container { height: auto; }
.login #main, .login #content { background: #fff; }
.login .submit-row { background: none; border: none; padding: 8px 0 0; margin: 0; box-shadow: none; }
.object-tools a.viewsitelink:link, .object-tools a.viewsitelink:visited { padding-right: 28px; }
.tab-panel th { white-space: nowrap; }
.tab-obras td:first-child { white-space: normal; min-width: 180px; }
.tab-obras td:nth-child(2) { min-width: 150px; }