/* Estilos formulario Clientes */
:root {
  --c-verde:#78C841; --c-lima:#B4E50D; --c-naranja:#FF9B2F; --c-rojo:#FB4141;
  --verde:var(--c-verde); --verde-dark:#4e8a29; --gris:#f5f7f5; --borde:#d9e8df; --error:var(--c-rojo); --focus:var(--c-lima);
  --radius:14px;
}
.form-wrapper {max-width: 980px; margin: 1.5rem auto 2.5rem; background:#fff; border:1px solid var(--borde); border-radius: var(--radius); box-shadow:0 4px 14px -4px rgba(0,0,0,.08); overflow:hidden;}
.form-header {background: linear-gradient(135deg,var(--verde),var(--c-lima)); padding:1.25rem 1.75rem; color:#13240c; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;}
.form-header h1 {margin:0; font-size:1.35rem; letter-spacing:.5px;}
.form-body {padding:1.75rem; display:grid; gap:1.25rem; grid-template-columns: repeat(auto-fit,minmax(270px,1fr));}
.field-group {display:flex; flex-direction:column; position:relative;}
.field-group label {font-weight:600; font-size:.75rem; text-transform:uppercase; letter-spacing:.6px; color:#333; margin-bottom:.25rem;}
.field-group input[type=text], .field-group input[type=email], .field-group input[type=number], .field-group select, .field-group textarea {border:1px solid #cfd8d3; border-radius:10px; padding:.55rem .7rem; font: 400 .9rem system-ui, Arial, sans-serif; background:#fff; transition:border-color .25s, box-shadow .25s;}
.field-group textarea {resize:vertical; min-height:70px;}
.field-group input:focus, .field-group select:focus, .field-group textarea:focus {outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(180,229,13,.35);} 
.small-hint {font-size:.65rem; color:#555; margin-top:.25rem; letter-spacing:.3px;}
.required-marker {color:var(--verde-dark);} 
.section-divider {grid-column:1/-1; margin:1.2rem 0 .2rem; font-size:.65rem; font-weight:700; letter-spacing:1.1px; color:var(--verde-dark); text-transform:uppercase; display:flex; align-items:center; gap:.5rem;}
.section-divider:before, .section-divider:after {content:""; flex:1; height:1px; background:linear-gradient(90deg,transparent,var(--borde));}
.section-divider:after {background:linear-gradient(90deg,var(--borde),transparent);} 
.form-footer {border-top:1px solid var(--borde); padding:1.2rem 1.75rem; background:#fafcfa; display:flex; gap:.75rem; flex-wrap:wrap; justify-content:flex-end;}
.btn {appearance:none; border:none; border-radius:10px; padding:.7rem 1.1rem; font-weight:600; font-size:.8rem; letter-spacing:.5px; cursor:pointer; display:inline-flex; align-items:center; gap:.4rem; text-decoration:none;}
.btn-primary {background:linear-gradient(135deg,var(--verde),var(--c-lima)); color:#1b2c12; box-shadow:0 2px 4px rgba(0,0,0,.15); transition:background .25s, transform .25s, box-shadow .25s, color .25s;}
.btn-primary:hover {background:linear-gradient(135deg,var(--c-lima),var(--verde)); box-shadow:0 4px 12px rgba(0,0,0,.25); transform:translateY(-2px); color:#111;} 
.btn-outline {background:#fff; color:var(--verde-dark); border:1px solid var(--c-lima);} 
.btn-outline:hover {background:var(--c-lima); color:#1b2c12;} 
.errorlist {margin:.3rem 0 0; padding:0; list-style:none;}
.errorlist li {background:var(--error); color:#fff; font-size:.65rem; padding:.35rem .55rem; border-radius:6px; margin-bottom:.25rem; letter-spacing:.3px;}
.field-error input, .field-error select, .field-error textarea {border-color:var(--error) !important;}
.badge-tipo {display:inline-block; background:#fff3; color:#fff; padding:.3rem .6rem; border-radius:30px; font-size:.6rem; letter-spacing:1px; font-weight:600;}
.toggle-hidden {display:none;}
@media (max-width:640px){
  .form-body {grid-template-columns:1fr; padding:1.25rem;}
  .form-header {padding:1rem 1.25rem;}
  .form-header h1 {font-size:1.1rem;}
  .form-footer {padding:1rem 1.25rem;}
}

/* ================= LISTA CLIENTES ================= */
.page-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.page-header h1{ margin:0; font-size:1.6rem; }
.clientes-filtro{ display:flex; flex-wrap:wrap; gap:.75rem; background:#fff; padding:.75rem 1rem; border:1px solid #e1e5e2; border-radius:8px; margin-bottom:1rem; box-shadow:0 1px 2px rgba(0,0,0,.05); }
.clientes-filtro .inp{ padding:.45rem .65rem; border:1px solid #c8d1cc; border-radius:6px; background:#fff; font-size:.9rem; min-width:160px; }
.clientes-filtro .inp:focus{ outline:2px solid var(--verde); outline-offset:0; border-color:var(--verde); }
.filtro-actions{ display:flex; gap:.5rem; align-items:center; }
.btn.btn-ghost{ background:transparent; color:var(--verde-dark); padding:.5rem .9rem; border-radius:6px; font-weight:500; text-decoration:none; }
.btn.btn-ghost:hover{ background:#e6f4ec; }
.tabla-wrapper{ overflow-x:auto; background:#fff; padding:0; border:1px solid #e1e5e2; border-radius:10px; box-shadow:0 2px 4px rgba(0,0,0,.05); }
table.tabla{ width:100%; border-collapse:collapse; font-size:.9rem; }
table.tabla thead{ background:var(--verde); color:#fff; }
table.tabla th, table.tabla td{ padding:.55rem .7rem; text-align:left; }
table.tabla tbody tr{ border-top:1px solid #eef2ef; }
table.tabla tbody tr:hover{ background:#f5faf7; }
.link-detalle{ color:var(--verde-dark); font-weight:600; text-decoration:none; }
.link-detalle:hover{ text-decoration:underline; }
.badge-clasif{ display:inline-block; padding:.25rem .45rem; border-radius:4px; font-size:.7rem; font-weight:600; color:#fff; letter-spacing:.5px; }
.badge-clasif-a{ background:#1e88e5; }
.badge-clasif-b{ background:var(--verde); }
.badge-clasif-c{ background:#ff9800; }
.badge-clasif-d{ background:#6d4c41; }
.estado-activo{ background:var(--verde); color:#fff; padding:.15rem .5rem; border-radius:12px; font-size:.65rem; font-weight:600; }
.estado-inactivo{ background:#b71c1c; color:#fff; padding:.15rem .5rem; border-radius:12px; font-size:.65rem; font-weight:600; }
.acciones{ white-space:nowrap; }
.acciones .accion{ margin:0 .15rem; text-decoration:none; font-size:1rem; }
.acciones .accion.editar:hover{ filter:brightness(.8); }
.acciones .accion.eliminar:hover{ filter:brightness(.8); }
.sin-resultados{ text-align:center; padding:1.5rem !important; color:#666; font-style:italic; }
@media (max-width:760px){
  table.tabla thead{ display:none; }
  table.tabla, table.tabla tbody, table.tabla tr, table.tabla td { display:block; width:100%; }
  table.tabla tr{ margin-bottom:.75rem; background:#fff; border:1px solid #e1e5e2; border-radius:8px; box-shadow:0 1px 2px rgba(0,0,0,.04); }
  table.tabla td{ border:none; padding:.4rem .75rem; position:relative; }
  table.tabla td::before{ content: attr(data-label); font-weight:600; display:block; margin-bottom:2px; color:#333; font-size:.65rem; text-transform:uppercase; letter-spacing:1px; }
  .acciones{ text-align:right; }
}


/* ================= DETALLE CLIENTE ================= */
.detalle-cliente-card{ background:#fff; border:1px solid #e1e5e2; border-radius:14px; padding:1.25rem 1.5rem 1.5rem; box-shadow:0 4px 8px -2px rgba(0,0,0,.06); max-width:980px; }
.detalle-header{ display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.detalle-header h1{ margin:0; font-size:1.6rem; }
.chips{ display:flex; gap:.5rem; flex-wrap:wrap; }
.chip{ background:#e6f4ec; color:var(--verde-dark); padding:.35rem .7rem; border-radius:20px; font-size:.7rem; font-weight:600; letter-spacing:.5px; }
.chip.clasif-a{ background:#1e88e5; color:#fff; }
.chip.clasif-b{ background:var(--verde); color:#13240c; }
.chip.clasif-c{ background:#ff9800; color:#fff; }
.chip.clasif-d{ background:#6d4c41; color:#fff; }
.chip.estado.activo{ background:var(--verde); color:#13240c; }
.chip.estado.inactivo{ background:#b71c1c; color:#fff; }
.detalle-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1rem 1.25rem; margin-bottom:1.2rem; }
.detalle-grid label{ font-size:.65rem; font-weight:600; text-transform:uppercase; letter-spacing:1px; color:#5d6d64; display:block; margin-bottom:2px; }
.detalle-grid p{ margin:0; font-size:.85rem; line-height:1.3rem; }
.detalle-actions{ display:flex; gap:.8rem; }

/* ================= SUBFORMSETS PROVEEDORES ================= */
.subformset{ grid-column:1/-1; background:#f8fbf9; border:1px dashed var(--borde); padding:1.1rem 1.1rem 1.25rem; border-radius:16px; position:relative; }
.subformset > .subformset-items{ display:flex; flex-direction:column; gap:.95rem; }
.subformset-item{ background:#fff; border:1px solid #dfe7e2; border-radius:14px; padding:.85rem 1rem 1rem; position:relative; box-shadow:0 3px 8px -4px rgba(0,0,0,.08); transition:box-shadow .25s, transform .25s, border-color .25s; }
.subformset-item:hover{ box-shadow:0 6px 18px -6px rgba(0,0,0,.12); }
.subformset-item.marked-delete{ opacity:.55; background:#fff5f5; border-color:#f5b5b5; }
.subformset-item.marked-delete .subformset-head .item-index{ text-decoration:line-through; }
.subformset-head{ display:flex; align-items:center; justify-content:space-between; margin:0 0 .6rem; }
.subformset-head .item-index{ font-size:.65rem; letter-spacing:1px; font-weight:700; color:#27613a; text-transform:uppercase; }
.subformset-head .inline-actions{ display:flex; gap:.4rem; }
.btn-icon{ background:#e9f3ec; border:none; width:30px; height:30px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; font-size:.9rem; color:#0d5f2a; transition:background .25s, transform .25s; }
.btn-icon:hover{ background:#d1ebd9; }
.btn-icon.danger{ background:#ffe9e9; color:#a41515; }
.btn-icon.danger:hover{ background:#ffd1d1; }
.btn-icon.restore{ background:#fff6d8; color:#9a6a00; }
.btn-icon.restore:hover{ background:#ffeeb4; }
.subform-grid{ display:grid; gap:.75rem .9rem; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
.field-mini{ display:flex; flex-direction:column; }
.field-mini label{ font-size:.55rem; font-weight:600; letter-spacing:1px; text-transform:uppercase; margin-bottom:2px; color:#3d4e45; }
.field-mini input[type=text], .field-mini input[type=email], .field-mini select{ padding:.45rem .55rem; font-size:.75rem; border:1px solid #cfd8d3; border-radius:8px; }
.field-mini input:focus, .field-mini select:focus{ outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(0,143,57,.18); }
.subformset .btn.btn-sm{ padding:.55rem .9rem; font-size:.65rem; border-radius:8px; margin-top:.5rem; }
.delete-box{ display:none; }
.item-badge{ position:absolute; top:.5rem; left:.6rem; background:#e6f4ec; color:#114922; font-size:.55rem; font-weight:700; padding:.25rem .5rem; border-radius:14px; letter-spacing:.5px; box-shadow:0 0 0 1px #b9dfc8 inset; }
.marked-delete .item-badge{ background:#ffdbdb; color:#7a1111; box-shadow:0 0 0 1px #f1b3b3 inset; }
.cards-grid{ display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); }
.card-sm{ background:#fff; border:1px solid #dfe7e2; border-radius:14px; padding:.75rem .85rem .85rem; display:flex; flex-direction:column; gap:.5rem; box-shadow:0 3px 8px -4px rgba(0,0,0,.06); }
.card-sm .card-head{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.card-sm .card-body.mini{ display:grid; gap:.4rem .75rem; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); font-size:.7rem; }
.card-sm .card-body.mini label{ font-size:.5rem; text-transform:uppercase; letter-spacing:.9px; color:#5d6d64; display:block; margin-bottom:1px; font-weight:600; }
.chip.small{ font-size:.55rem; padding:.25rem .55rem; }
.mono{ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace; font-size:.75rem; }
.badge-soft{ background:#e6f4ec; color:#1e5c31; font-size:.6rem; padding:.25rem .5rem; border-radius:6px; font-weight:600; letter-spacing:.5px; }
/* Collapse */
.collapsible-header{ cursor:pointer; user-select:none; }
.collapse-toggle{ background:#e6f4ec; border:1px solid var(--borde); color:#0d5f2a; border-radius:6px; width:28px; height:24px; display:inline-flex; align-items:center; justify-content:center; font-size:.6rem; font-weight:700; margin-right:.35rem; cursor:pointer; }
.collapse-toggle[aria-expanded="false"]{ transform:rotate(-90deg); }
.subformset.collapsed{ display:none; }
/* Mostrar botón eliminar oculto hasta marcar campo */
.btn-icon.danger.hidden-inactive{ visibility:hidden; }
.subformset-item:hover .btn-icon.danger.hidden-inactive{ visibility:visible; }
/* Validación simple highlight */
.needs-attention{ animation:blinkBorder 1s linear infinite alternate; }
@keyframes blinkBorder{ from{ box-shadow:0 0 0 0 rgba(198,40,40,.0),0 0 0 1px #ffb3b3 inset; } to{ box-shadow:0 0 0 3px rgba(198,40,40,.35),0 0 0 1px #ff9191 inset; } }
@media (max-width:640px){
  .subform-grid{ grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); }
  .subformset{ padding:1rem .9rem 1.1rem; }
  .subformset-item{ padding:.75rem .75rem .85rem; }
}
