/* =====================================================================
 * THEMIS - Identidad visual comun (espejo de la app Angular)
 * Tirado Escobar & Abogados
 * Fuente de verdad: Angular/src/scss/styles.scss + _variables.scss
 * Reutilizable por: litigando/v2, pqr, consulta, Bienvenida.
 * NO modificar la app Angular; estas interfaces se adaptan a ella.
 * ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap');

:root{
  --themis-primary:#a9b827;     /* verde oliva de marca */
  --themis-primary-d:#555c14;   /* oliva oscuro: bordes/texto sobre primario */
  --themis-dark:#363233;        /* carbon */
  --themis-gray:#4D4D4D;        /* gris sidebar */
  --themis-dark-gray:#444444;
  --themis-accent:#00a59b;      /* teal */
  --themis-secondary:#f4f4f4;
  --themis-success:#8BC34A;
  --themis-danger:#dc3545;
  --themis-bg:#f2f2f3;
  --themis-card:#ffffff;
  --themis-text:#363233;
  --themis-muted:#7a7a7a;
  --themis-border:#e4e4e2;
  --themis-font:'Roboto', system-ui, 'Segoe UI', Arial, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
body{ font-family:var(--themis-font); background:var(--themis-bg); color:var(--themis-text); font-size:13px; line-height:1.5; }

/* ---- Barra superior ---- */
.themis-top{ background:var(--themis-dark); color:#fff; padding:10px 24px; display:flex; align-items:center; justify-content:space-between; border-bottom:3px solid var(--themis-primary); }
.themis-top .brand{ font-size:1.25rem; font-weight:700; letter-spacing:.5px; color:#fff; }
.themis-top .brand span{ color:var(--themis-primary); }
.themis-top .search{ background:#fff; color:var(--themis-text); border-radius:20px; padding:5px 14px; font-size:.85rem; font-weight:600; }

/* ---- Contenedor ---- */
.themis-wrap{ max-width:1150px; margin:0 auto; padding:20px; }
.themis-titulo{ color:var(--themis-dark); font-size:1.5rem; font-weight:700; margin:6px 0 18px; }
.themis-titulo small{ color:var(--themis-primary-d); font-size:.8rem; font-weight:600; }
.themis-titulo small a{ color:var(--themis-primary-d); }

/* ---- Rejilla ---- */
.themis-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
@media (max-width:850px){ .themis-grid2{ grid-template-columns:1fr; } }

/* ---- Tarjetas ---- */
.themis-card{ background:var(--themis-card); border-radius:6px; margin-bottom:16px; box-shadow:0 1px 4px rgba(0,0,0,.08); overflow:hidden; border:1px solid var(--themis-border); }
.themis-card > .head{ background:var(--themis-dark); color:#fff; padding:10px 16px; font-weight:600; font-size:.9rem; display:flex; justify-content:space-between; align-items:center; cursor:pointer; border-left:4px solid var(--themis-primary); }
.themis-card > .head .chev{ transition:transform .2s; color:var(--themis-primary); }
.themis-card > .body{ padding:0; }

/* ---- Filas clave/valor ---- */
.themis-row{ display:flex; padding:9px 16px; border-bottom:1px solid #f0f0ef; }
.themis-row:nth-child(even){ background:#faf9f6; }
.themis-row .k{ font-weight:600; color:var(--themis-muted); min-width:130px; text-transform:uppercase; font-size:.72rem; padding-top:2px; }
.themis-row .v{ color:var(--themis-text); flex:1; }

/* ---- Tablas ---- */
.themis-table{ width:100%; border-collapse:collapse; }
.themis-table th{ background:var(--themis-dark); color:#fff; padding:8px 12px; text-align:left; font-size:.72rem; text-transform:uppercase; }
.themis-table td{ padding:8px 12px; border-bottom:1px solid #f0f0ef; vertical-align:top; }
.themis-table tr:nth-child(even) td{ background:#faf9f6; }

/* ---- Badge ---- */
.themis-badge{ display:inline-block; padding:2px 9px; border-radius:10px; font-size:.7rem; font-weight:700; background:#eef3d2; color:var(--themis-primary-d); }

/* ---- Botones (espejo .btn-primary Angular) ---- */
.themis-btn{ display:inline-block; font-family:var(--themis-font); font-weight:500; text-transform:uppercase; cursor:pointer; padding:.4rem 1rem; border-radius:6px; font-size:.82rem; transition:all .15s; text-decoration:none; }
.themis-btn-primary{ background:var(--themis-primary); border:1.6px solid var(--themis-primary-d); color:var(--themis-primary-d); }
.themis-btn-primary:hover{ opacity:.85; }
.themis-btn-ghost{ background:none; border:1px solid var(--themis-primary); color:var(--themis-primary-d); padding:5px 14px; border-radius:4px; font-size:.82rem; font-weight:600; }
.themis-btn-ghost:hover{ background:var(--themis-primary); color:#fff; }

/* ---- Formularios (compacto, espejo Angular) ---- */
.themis-label{ display:block; margin-bottom:.1rem; font-size:.8rem; font-weight:500; color:var(--themis-text); }
.themis-label .req{ color:var(--themis-primary); }
.themis-input, .themis-select, .themis-textarea{
  width:100%; font-family:var(--themis-font); padding:.35rem .5rem; font-size:.85rem;
  min-height:30px; color:var(--themis-text); background:#fff;
  border:1px solid #c4c9d0; border-radius:6px; transition:border-color .15s, box-shadow .15s;
}
.themis-input:focus, .themis-select:focus, .themis-textarea:focus{
  outline:none; border-color:var(--themis-primary); box-shadow:0 0 0 .15rem rgba(169,184,39,.25);
}
.themis-textarea{ min-height:90px; resize:vertical; }

/* ---- Mensajes ---- */
.themis-error{ background:#fdecea; border:1px solid #f5b7b1; color:var(--themis-danger); padding:18px; border-radius:6px; text-align:center; margin:30px auto; max-width:560px; }
.themis-ok{ background:#eef3d2; border:1px solid #cdda7a; color:var(--themis-primary-d); padding:18px; border-radius:6px; text-align:center; margin:30px auto; max-width:560px; }

/* ---- Utilidades Litigando (actuaciones) ---- */
.themis-scroll{ max-height:700px; overflow-y:auto; }
.themis-act{ border-bottom:1px solid var(--themis-border); }
.themis-act .rama{ background:var(--themis-primary-d); color:#fff; padding:7px 16px; font-weight:700; font-size:.82rem; }
.themis-act .det{ padding:10px 16px; }
.themis-act .meta{ display:flex; gap:18px; flex-wrap:wrap; color:var(--themis-muted); font-size:.78rem; margin-bottom:6px; }
.themis-act .meta b{ color:var(--themis-text); }
.themis-act .titulo-act{ color:var(--themis-dark); font-weight:700; margin:2px 0 6px; }
.themis-dato{ margin:4px 0; }
.themis-dato .dk{ font-weight:700; color:var(--themis-primary-d); font-size:.76rem; }
.themis-dato .dv{ color:var(--themis-text); font-size:.82rem; }

@media print{ .themis-top .search, .themis-btn-ghost, .themis-btn{ display:none; } .themis-scroll{ max-height:none; } }