/* FIX-260626-003 — Visual fixes A1 (B/0119/2026 audit) */

/* Issue 2 — Sub-título `Empresa`/`Sector` (.boxed-title) renderizaba con
   border-bottom solid 1px #282828 que confundía como link clickable.
   Quitar el border-bottom y alinear color al resto de labels (rgb(51,51,51)).
   Override más específico que la regla original en metadata.css. */
[id^="sonata-ba-field-container-"][id*="_tramites_"] label.boxed-title {
    border-bottom: none;
    color: #333;
}

/* Issue 1 — `Empresa o Sector` (.empresa_o_sector) renderiza un Select2
   ocupando ancho 100% para un valor binario ("Empresa"/"Sector"). Limitar
   ancho a 280px y dejar el resto del row libre para contenido alineado. */
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .form-group:has(> select.empresa_o_sector),
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .form-group:has(> .select2-container .empresa_o_sector) {
    max-width: 320px;
}
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .empresa_o_sector + .select2-container {
    max-width: 280px;
}

/* Issue 3 — Labels con wrap a 2 líneas desalinean inputs en la fila
   horizontal. Flex column: label arriba (auto), input pegado al bottom
   con margin-top:auto. Mientras todos los .form-group del row tengan la
   misma altura (height:100% rellena el row), los inputs alinean al
   mismo bottom independiente del wrap de label. */
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .row > [class*="col-"] > .form-group {
    display: flex;
    flex-direction: column;
    height: 100%;
}
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .row > [class*="col-"] > .form-group > .form-control,
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .row > [class*="col-"] > .form-group > .select2-container,
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .row > [class*="col-"] > .form-group > .input-group {
    margin-top: auto;
}

/* Issue 6 — Textareas translatables (es/eu) en campos opcionales
   renderizaban textarea grande vacío ocupando ~80px de espacio sin
   justificar. Limitar altura inicial a una sola línea visible; el textarea
   sigue siendo redimensionable por el usuario si quiere más espacio. */
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  textarea.form-control[id*="current_translation"] {
    height: 38px;
    min-height: 38px;
    resize: vertical;
}
/* El usuario puede arrastrar el handle inferior-derecho para agrandar
   manualmente si necesita ver más contenido. El default ya no desperdicia
   ~50px verticales cuando el campo está vacío u opcional. */


/* ============================================================
   Issues A2 + A3 follow-up — auditoría visual 2026-06-26 PM
   ============================================================ */

/* A2-3 — Banda blanca grande entre cabecera A2 y primer módulo:
   reducir margen vertical inicial del trámite container. */
[id^="sonata-ba-field-container-"][id*="_tramites_"] > .box,
[id^="sonata-ba-field-container-"][id*="_tramites_"] > .box-body {
    padding-top: 4px;
}
[id^="sonata-ba-field-container-"][id*="_tramites_"] .box-body > .form-group:first-child {
    margin-top: 0;
}

/* A2-1 — Título duplicado: sub-object con boxed-title del mismo texto
   que el módulo padre. Reducir tamaño del primer boxed-title del primer
   hijo de un .box_form si es único contenido textual (heurística suave). */
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .form-group > .box_form > .form-group:first-child > label.boxed-title {
    font-size: 13px;
    color: #555;
    margin-bottom: 4px;
}

/* A2-5 — Caja collection vacía con solo botón "+ Añadir": reducir altura
   excesiva del contenedor cuando no hay filas. */
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .box_form > .form-group .collection-json-field > .form-group {
    padding-top: 4px;
    padding-bottom: 4px;
}

/* A3-1 — Selectores apilados ancho 100% sin retícula horizontal:
   limitar ancho máximo a ~600px cuando son root de un sub-object simple
   (no parte de un row Bootstrap con varias cols). */
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .box-body > .form-group > .form-control,
[id^="sonata-ba-field-container-"][id*="_tramites_"]
  .box-body > .form-group > .select2-container {
    max-width: 600px;
}

/* BOTÓN SUBMIT PRIMARIO — "siguiente trámite" / "guardar+continuar"
   Estética institucional sobria (paleta neutra de grises, sin color
   saturado). Jerarquía por densidad/contraste tonal, no por color.
   Selector heurístico: button[type=submit] dentro de _tramites_ que NO
   sea generar/envio de documentos ni el "+" de add row de collection. */
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit]:not([name*="generar_documentos"]):not([name*="envio_documentos"]):not([name*="actualizar"]):not(.collection-add-button):not(.add_item_link) {
    background-color: #333;
    color: #fff;
    border: 1px solid #1a1a1a;
    font-weight: 600;
    padding: 8px 28px;
    margin-top: 16px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.12);
    border-radius: 3px;
}
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit]:not([name*="generar_documentos"]):not([name*="envio_documentos"]):not([name*="actualizar"]):not(.collection-add-button):not(.add_item_link):hover {
    background-color: #1a1a1a;
    cursor: pointer;
}
/* Botones generar/envío docs: estilo SECUNDARIO (outline neutro) para
   distinguirlos del paso a siguiente trámite. Igualmente sobrio. */
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit][name*="generar_documentos"],
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit][name*="envio_documentos"] {
    background-color: #fff;
    color: #333;
    border: 1px solid #999;
    font-weight: 500;
    padding: 6px 18px;
}
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit][name*="generar_documentos"]:hover,
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit][name*="envio_documentos"]:hover {
    background-color: #f5f5f5;
    border-color: #666;
}
/* Botones submit SIN name (typically Descargar documento / Subir Documento
   del fileupload): estilo SECUNDARIO outline, NO primario. */
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit][name=""],
[id^="sonata-ba-field-container-"][id*="_tramites_"] button[type=submit]:not([name]) {
    background-color: #fff !important;
    color: #333 !important;
    border: 1px solid #999 !important;
    font-weight: 500 !important;
    padding: 6px 18px !important;
    box-shadow: none !important;
    margin-top: 4px !important;
}


/* ANCHO CONSISTENTE CROSS-TRÁMITE — auditoría visual 2026-06-26 PM
   El usuario percibía que cabecera+título+módulos se hacían "cada vez
   más estrechos" según avanzaban los trámites. Forzar el contenedor del
   trámite y sus hijos a ocupar el 100% del col Bootstrap padre, sin
   ajuste al contenido. */
[id^="sonata-ba-field-container-"][id*="_tramites_"][id$="_form"] {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
[id^="sonata-ba-field-container-"][id*="_tramites_"] > .box,
[id^="sonata-ba-field-container-"][id*="_tramites_"] > .form-group,
[id^="sonata-ba-field-container-"][id*="_tramites_"] .box_form,
[id^="sonata-ba-field-container-"][id*="_tramites_"] .box-body {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
/* Cabecera identificativa común (Nº Expediente / Inicio / Empresa / etc)
   también ancho completo. */
.cabecera-expediente,
[id$="_form_cabecera__form"],
[id$="_cabecera__form"] {
    width: 100%;
    max-width: 100%;
}

/* FIX-260626-005 — Truncamiento texto en cabecera identificativa.
   "ANTONIO MANUEL ALBA RO..." / "Pendiente de convo..." se cortan con
   ellipsis. Permitir wrap a 2 líneas y mantener altura natural. */
[id$="_cabecera__form"] .form-group,
[id$="_form_cabecera__form"] .form-group {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}
[id$="_cabecera__form"] .form-group .form-control,
[id$="_form_cabecera__form"] .form-group .form-control {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    word-break: break-word;
    height: auto;
    min-height: 24px;
}

/* FIX-260626-008 — Asimetría columnas fila Representantes en A2
   Empresa/Sector. La columna Representantes (entity+button) toma más
   ancho del necesario, dejando Teléfonos/Correo en columnas
   desproporcionadas. Forzar distribución 33%/33%/33%. */
[id*="EmpresaSector2_Empresa"] .row > [class*="col-"]:has(select[name*="Representantes"]),
[id*="EmpresaSector2_Sector"] .row > [class*="col-"]:has(select[name*="Representantes"]) {
    width: 33.33%;
    flex: 0 0 33.33%;
    max-width: 33.33%;
}

/* FIX-260626-A6 — Layout asimétrico CargaDatos1 con espacio blanco a
   la izquierda. Forzar flex-grow para que las columnas llenen el row. */
[id*="_tramites_"] [id*="CargaDatos1"] .row,
[id*="_tramites_"] [id*="CargaDatos2"] .row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: flex-start;
}
[id*="_tramites_"] [id*="CargaDatos1"] .row > [class*="col-"],
[id*="_tramites_"] [id*="CargaDatos2"] .row > [class*="col-"] {
    flex: 1 1 auto;
    min-width: 180px;
}


/* COHERENCIA DE TÍTULOS DE MÓDULO — auditoría 2026-06-26 PM (revisión 2)
   ESTÁNDAR del proyecto: título del módulo FUERA de la caja blanca (encima,
   texto pequeño sin background, sin borde). Es lo que ya hace label.boxed-title
   por default tras nuestro reset (sin border-bottom, color #333).

   El problema detectado: algunos trámites (A8/A11/A12) tienen títulos
   numerados DENTRO de la caja con barra superior + underline. Son títulos
   del template Sonata (.box-header, .h3-header, no .boxed-title). Sacarlos
   FUERA visualmente: quitar background, border, padding inicial. Texto plano
   encima, igual que label.boxed-title fuera. */

/* Títulos numerados (h3/h4 con border-bottom) que viven dentro de cajas
   custom (e.g. .a11-box, .a12-box, .a8-box) — patrones específicos por
   fase. Selector LAXO sobre cualquier div con "_tramites_" en su id. */
div[id*="_tramites_"] h3:not(.no-style-fix),
div[id*="_tramites_"] h4:not(.no-style-fix),
div[id*="_tramites_"] .box-header,
div[id*="_tramites_"] fieldset > legend {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 0 !important;
    padding: 0 0 4px 0 !important;
    margin: 0 0 8px 0 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #333 !important;
}
/* Quitar background y borde de cajas custom .aN-box para que el contenido
   se vea sobre fondo neutro, igual que el resto de trámites. */
div[id*="_tramites_"] div[class*="a8-box"],
div[id*="_tramites_"] div[class*="a9-box"],
div[id*="_tramites_"] div[class*="a10-box"],
div[id*="_tramites_"] div[class*="a11-box"],
div[id*="_tramites_"] div[class*="a12-box"] {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 12px 0 !important;
}
/* Pero el sub-form dentro de la caja custom sí tendrá la superficie blanca
   estándar (.box_form), para mantener "caja blanca con borde". */
div[id*="_tramites_"] div[class*="a8-box"] > div:not(h3):not(h4),
div[id*="_tramites_"] div[class*="a11-box"] > div:not(h3):not(h4),
div[id*="_tramites_"] div[class*="a12-box"] > div:not(h3):not(h4) {
    background: white;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 16px;
}