/* Orkia OS · LOBO antitermita — Expediente MIP (fase 1): sede con pestañas,
   libreta de contactos, servicios contratados con recurrencia. Prefijo exp-. */

.exp-modal-sub { font-size: 13px; color: var(--lbo-gray-500); margin: 2px 0 0; }
.exp-sec { font-size: 15px; font-weight: 700; color: var(--lbo-gray-900); margin: 1.25rem 0 .6rem; display: flex; align-items: center; gap: 6px; }
.exp-sec:first-child { margin-top: 0; }
.exp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.exp-grid .doble { grid-column: span 2; }
.exp-campo { margin-bottom: 14px; }
.exp-campo .lbo-label { display: block; margin-bottom: 6px; font-weight: 600; font-size: 14px; color: var(--lbo-gray-800); }
.exp-campo .lbo-input, .exp-campo .lbo-select { width: 100%; font-size: 16px; min-height: 46px; }
.exp-campo textarea.lbo-input { min-height: 80px; }
.exp-campo .lbo-hint { margin-top: 4px; }

/* Chips seleccionables (días, semanas) */
.exp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.exp-chip {
  min-height: 44px; padding: 0 16px; border-radius: 999px; font-size: 15px; font-weight: 600;
  border: 1.5px solid var(--lbo-gray-300); background: #fff; color: var(--lbo-gray-700); cursor: pointer;
}
.exp-chip:hover { border-color: var(--lbo-blue); color: var(--lbo-blue); }
.exp-chip.activo { background: var(--lbo-blue); border-color: var(--lbo-blue); color: #fff; }

/* Funciones del contacto: No / Principal / Alterno */
.exp-funciones { display: flex; flex-direction: column; gap: 8px; }
.exp-funcion {
  display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 10px 14px; border: 1px solid var(--lbo-gray-200); border-radius: 14px;
}
.exp-funcion-nombre { font-weight: 700; font-size: 15px; color: var(--lbo-gray-900); }
.exp-funcion .lbo-hint { margin: 0; }
.exp-seg { display: inline-flex; border: 1.5px solid var(--lbo-gray-300); border-radius: 12px; overflow: hidden; }
.exp-seg button { min-height: 42px; padding: 0 14px; font-size: 14px; font-weight: 600; background: #fff; color: var(--lbo-gray-600); border: 0; cursor: pointer; }
.exp-seg button + button { border-left: 1.5px solid var(--lbo-gray-300); }
.exp-seg button.activo { background: var(--lbo-blue); color: #fff; }
.exp-seg button[data-rol=""].activo { background: var(--lbo-gray-100); color: var(--lbo-gray-700); }

.exp-alcance { display: flex; flex-direction: column; gap: 8px; }
.exp-radio, .exp-check { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--lbo-gray-800); min-height: 40px; cursor: pointer; }
.exp-radio input, .exp-check input { width: 20px; height: 20px; accent-color: var(--lbo-blue); }
.exp-sedes-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 12px; padding: 6px 0 0 30px; }

/* Personas */
.exp-persona { display: flex; gap: 12px; align-items: flex-start; padding: 6px 0; }
.exp-persona-info { min-width: 0; }
.exp-persona-nombre { font-weight: 700; font-size: 15px; color: var(--lbo-gray-900); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.exp-rol, .exp-tag { font-size: 12px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: var(--lbo-blue-light); color: var(--lbo-blue-dark); }
.exp-rol.alterno, .exp-tag.alterno { background: var(--lbo-gray-100); color: var(--lbo-gray-600); }
.exp-contactos { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; margin-top: 14px; }
.exp-contacto { padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
.exp-contacto-fun { display: flex; flex-wrap: wrap; gap: 6px; }
.exp-acc { display: flex; gap: 8px; flex-wrap: wrap; }
.exp-peligro { color: var(--lbo-danger) !important; }

.exp-funciones-resumen { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; margin-top: 12px; }
.exp-fun-card { padding: 12px 14px; }
.exp-fun-tit { font-size: 13px; font-weight: 700; color: var(--lbo-gray-500); text-transform: uppercase; letter-spacing: .03em; margin-bottom: 6px; display: flex; gap: 6px; align-items: center; }
.exp-fun-linea { font-size: 14px; color: var(--lbo-gray-900); margin-top: 4px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.exp-funciones-sede { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin-bottom: 12px; }
.exp-fun-sede { padding: 14px 16px; }
.exp-vacio-fun { font-size: 14px; color: var(--lbo-gray-500); padding: 6px 0; }
.exp-sub-tit { font-size: 13px; font-weight: 700; color: var(--lbo-gray-500); margin-top: 12px; }

.exp-aviso { background: #FFF7E6; border: 1px solid #F5D9A8; color: #8A5300; border-radius: 14px; padding: 12px 16px; font-size: 14px; margin: 0 0 14px; }

/* Encabezado de sede */
.exp-chips-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.exp-zona { font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; color: var(--zona); background: color-mix(in srgb, var(--zona) 12%, white); }
.exp-prog { font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.exp-prog.fija, .exp-prog-grande.fija, .exp-opcion.fija { --c: #0C84CC; }
.exp-prog.flexible, .exp-prog-grande.flexible, .exp-opcion.flexible { --c: #B7791F; }
.exp-prog.restricciones, .exp-prog-grande.restricciones, .exp-opcion.restricciones { --c: #C53030; }
.exp-prog { color: var(--c); background: color-mix(in srgb, var(--c) 12%, white); }

.exp-instruccion { background: #FFF8DB; border: 1px solid #F1D776; border-radius: 16px; padding: 14px 18px; margin-bottom: 14px; font-size: 15px; color: #5C4600; }
.exp-instruccion-tit { font-weight: 700; margin-bottom: 4px; }

.exp-codigo { font-family: var(--lbo-font-mono); font-size: 30px; font-weight: 600; letter-spacing: .12em; color: var(--lbo-gray-900); background: var(--lbo-gray-50); border: 1px dashed var(--lbo-gray-300); border-radius: 14px; padding: 10px 16px; display: inline-block; margin: 6px 0; }
.exp-codigo.vencido { color: var(--lbo-danger); text-decoration: line-through; }

.exp-prog-grande { border-left: 5px solid var(--c); background: color-mix(in srgb, var(--c) 7%, white); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--lbo-gray-700); }
.exp-prog-grande strong { font-size: 17px; color: var(--c); }
.exp-semana { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0; }
.exp-semana span { min-width: 48px; text-align: center; padding: 8px 0; border-radius: 10px; font-weight: 700; font-size: 14px; }
.exp-semana .si { background: var(--lbo-blue-light); color: var(--lbo-blue-dark); }
.exp-semana .no { background: var(--lbo-gray-100); color: var(--lbo-gray-400); text-decoration: line-through; }
.exp-nota { font-size: 14px; color: var(--lbo-gray-700); background: var(--lbo-gray-50); border-radius: 10px; padding: 8px 12px; margin: 8px 0 0; }

.exp-opciones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.exp-opcion { border: 1.5px solid var(--lbo-gray-300); border-radius: 14px; padding: 12px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--lbo-gray-600); cursor: pointer; position: relative; }
.exp-opcion input { position: absolute; opacity: 0; }
.exp-opcion strong { font-size: 16px; color: var(--c); }
.exp-opcion:has(input:checked) { border-color: var(--c); background: color-mix(in srgb, var(--c) 8%, white); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 18%, transparent); }

/* Servicios contratados */
.exp-sc { padding: 16px 18px; margin-bottom: 14px; display: flex; flex-direction: column; gap: 10px; }
.exp-sc.inactivo { opacity: .65; }
.exp-sc-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.exp-sc-head > div:first-child { display: flex; gap: 8px; align-items: center; font-size: 16px; }
.exp-sc-rec { font-size: 16px; font-weight: 600; color: var(--lbo-blue-dark); }
.exp-tabla { width: 100%; font-size: 14px; }
.exp-tabla .der { text-align: right; }
.exp-tabla .tachado { text-decoration: line-through; color: var(--lbo-gray-400); }
.exp-tabla .suave { color: var(--lbo-gray-400); }
.exp-tabla tfoot td { border-top: 1px solid var(--lbo-gray-200); padding-top: 8px; }

.exp-filas { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.exp-fila { display: grid; grid-template-columns: minmax(0, 2.4fr) 1fr 1.2fr 1.1fr 40px; gap: 10px; align-items: start; border: 1px solid var(--lbo-gray-200); border-radius: 14px; padding: 10px 12px 0; }
.exp-importe { min-height: 46px; display: flex; align-items: center; font-weight: 700; font-size: 16px; color: var(--lbo-gray-900); }
.exp-quitar { margin-top: 30px; width: 40px; height: 40px; border-radius: 10px; border: 1px solid var(--lbo-gray-300); background: #fff; font-size: 22px; color: var(--lbo-danger); cursor: pointer; }
.exp-total { text-align: right; font-size: 16px; margin: 10px 0 4px; color: var(--lbo-gray-700); }
.exp-total strong { font-size: 20px; color: var(--lbo-gray-900); }
/* En celular el total va a la izquierda: a la derecha queda la burbuja de Orki. */
@media (max-width: 767px) { .exp-total { text-align: left; } }

.exp-previa { background: var(--lbo-blue-light); border-radius: 14px; padding: 12px 16px; margin: 4px 0 8px; }
.exp-previa-txt { font-size: 16px; font-weight: 700; color: var(--lbo-blue-dark); margin-bottom: 6px; }
.exp-previa-fechas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 13px; color: var(--lbo-gray-600); }
.exp-previa-fechas span { background: #fff; border-radius: 999px; padding: 4px 10px; font-weight: 600; color: var(--lbo-gray-800); }

.exp-historial { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 2px solid var(--lbo-gray-200); }
.exp-historial li { position: relative; padding: 0 0 14px 14px; font-size: 15px; color: var(--lbo-gray-800); }
.exp-historial li::before { content: ''; position: absolute; left: -21px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: var(--lbo-gray-300); }
.exp-historial li.tarifa::before { background: var(--lbo-blue); }
.exp-h-fecha { font-size: 12px; color: var(--lbo-gray-500); }

@media (max-width: 720px) {
  .exp-grid, .exp-opciones { grid-template-columns: 1fr; }
  .exp-grid .doble { grid-column: auto; }
  .exp-fila { grid-template-columns: 1fr 1fr; padding-bottom: 6px; }
  .exp-fila .exp-campo:first-child { grid-column: span 2; }
  .exp-quitar { margin-top: 0; }
  .exp-contactos { grid-template-columns: 1fr; }
  .exp-funcion { flex-direction: column; align-items: stretch; }
  .exp-seg { width: 100%; }
  .exp-seg button { flex: 1; }
  .exp-tabla { font-size: 13px; }
}

/* Fecha doble: AAMMDD tecleado + calendario (igual que Servicios). */
.exp-fecha { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.exp-fecha input[type="text"] { font-family: var(--lbo-font-mono); letter-spacing: .08em; }

/* Próximas visitas del contratado (ajustes 2-nov, punto 10) */
.exp-proximas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 4px 0 8px; }
.exp-proximas-tit { width: 100%; font-size: 13px; font-weight: 600; color: var(--lbo-gray-700); }
.exp-prox { display: inline-flex; flex-direction: column; border-radius: 12px; padding: 6px 10px; font-size: 13px; font-weight: 600;
  border: 1px solid var(--lbo-gray-200); background: #fff; color: var(--lbo-gray-800); }
.exp-prox em { font-style: normal; font-weight: 500; font-size: 12px; }
.exp-prox.calendario { background: var(--lbo-blue-light); border-color: #b9dcf2; }
.exp-prox.calendario em { color: var(--lbo-blue-dark); }
.exp-prox.por_confirmar { background: #FDF3E2; border-color: #f4d9a8; }
.exp-prox.por_confirmar em { color: #B45309; }
.exp-prox.pendiente { background: #FDEAEA; border-color: #f5c2c2; }
.exp-prox.pendiente em { color: #DC2626; }
.exp-precios-grupo { margin-bottom: 12px; }