/* =========================================================================
   PANEL DE ADMINISTRACIÓN — PWM INGENIEROS
   Estilos propios (Tailwind se carga por CDN para utilidades sueltas).
   Paleta azul PWM.
   ========================================================================= */
:root{
  --pwm-blue:#005FBE; --pwm-navy:#062F5E; --pwm-ink:#16202C; --pwm-slate:#5B6B7D;
  --pwm-line:#DCE4EE; --pwm-bg:#EEF3F8; --pwm-red:#e8232a; --pwm-green:#1E9E5A;
}
*{box-sizing:border-box}
body{font-family:'Poppins',"Segoe UI",Roboto,system-ui,sans-serif;margin:0;color:var(--pwm-ink);
  background:var(--pwm-bg)}
a{color:inherit}
.admin-bg{min-height:100vh;background:linear-gradient(160deg,#f4f8fc 0%,#e7eef6 100%)}

/* Barra superior */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  padding:1rem 1.5rem;background:#fff;border-bottom:1px solid var(--pwm-line);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:.7rem}
.brand img{height:34px}
.brand .sub{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--pwm-slate)}

/* Menú tipo píldora */
.nav-pill{display:flex;align-items:center;border-radius:2rem;background:var(--pwm-bg);overflow:hidden;
  width:fit-content;padding:.25rem;gap:.15rem;flex-wrap:wrap}
.nav-pill .item{padding:.55rem 1.05rem;border-radius:2rem;cursor:pointer;transition:all .2s;
  white-space:nowrap;color:var(--pwm-slate);text-decoration:none;font-weight:600;font-size:.85rem}
.nav-pill .item:hover{color:var(--pwm-blue)}
.nav-pill .item.active{background:var(--pwm-blue);color:#fff}
.nav-pill .item-exit{color:var(--pwm-red)}
.nav-pill .item-exit:hover{background:#fde8e9;color:var(--pwm-red)}

/* Contenedor */
.wrap{max-width:1180px;margin:0 auto;padding:1.75rem 1.5rem}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}
.page-head h1{font-size:1.5rem;font-weight:800;color:var(--pwm-navy);margin:0}
.page-head p{margin:.25rem 0 0;color:var(--pwm-slate);font-size:.9rem}

/* Tarjetas */
.admin-card{background:#fff;border:1px solid var(--pwm-line);border-radius:14px;
  box-shadow:0 8px 24px rgba(6,47,94,.06);padding:1.4rem}
.muted{color:var(--pwm-slate)}

/* Botones */
.btn{display:inline-flex;align-items:center;gap:.45rem;border:none;border-radius:8px;cursor:pointer;
  font-family:inherit;font-weight:700;font-size:.85rem;padding:.6rem 1.1rem;transition:all .2s;text-decoration:none}
.btn-primary{background:var(--pwm-blue);color:#fff}
.btn-primary:hover{background:#0a52a0}
.btn-secondary{background:#fff;color:var(--pwm-blue);border:1px solid var(--pwm-line)}
.btn-secondary:hover{border-color:var(--pwm-blue)}
.btn-danger{background:var(--pwm-red);color:#fff}
.btn-danger:hover{background:#c41d23}
.btn-ghost{background:transparent;color:var(--pwm-slate)}
.btn-ghost:hover{color:var(--pwm-blue)}
.btn-text{background:none;padding:.3rem .5rem;color:var(--pwm-blue)}
.btn-sm{padding:.4rem .7rem;font-size:.78rem}
.btn:disabled{opacity:.55;cursor:not-allowed}

/* Formularios */
.input,.select,.textarea{width:100%;border:1px solid var(--pwm-line);border-radius:8px;padding:.6rem .75rem;
  font-family:inherit;font-size:.9rem;color:var(--pwm-ink);background:#fff;transition:border-color .2s}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--pwm-blue);box-shadow:0 0 0 3px rgba(0,95,190,.12)}
.textarea{min-height:90px;resize:vertical}
.label{display:block;font-weight:700;font-size:.8rem;color:var(--pwm-navy);margin-bottom:.35rem}
.hint{font-size:.75rem;color:var(--pwm-slate);margin-top:.25rem}
.field{margin-bottom:1.1rem}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.1rem}
@media(max-width:700px){.grid2,.grid3{grid-template-columns:1fr}}

/* Toggle (switch) */
.switch{display:inline-flex;align-items:center;gap:.6rem;cursor:pointer;user-select:none}
.switch input{display:none}
.switch .track{width:42px;height:24px;border-radius:20px;background:#cbd5e1;position:relative;transition:background .2s;flex-shrink:0}
.switch .track::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.switch input:checked + .track{background:var(--pwm-green)}
.switch input:checked + .track::after{transform:translateX(18px)}
.switch .lbl{font-weight:600;font-size:.88rem}

/* Chips / etiquetas */
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}
.chip{display:inline-flex;align-items:center;gap:.35rem;background:#eef3fb;border:1px solid #d8e4f4;
  border-radius:20px;padding:.3rem .7rem;font-size:.78rem;font-weight:600;color:var(--pwm-blue)}
.chip button{background:none;border:none;cursor:pointer;color:var(--pwm-red);padding:0;display:flex}

/* Badges de estado */
.badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.7rem;font-weight:700;padding:.2rem .55rem;
  border-radius:20px}
.badge-on{background:#dcfce7;color:#166534}
.badge-off{background:#f1f5f9;color:#64748b}

/* Tabla de listas */
.list{width:100%;border-collapse:collapse;background:#fff}
.list th{text-align:left;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--pwm-slate);padding:.7rem .8rem;border-bottom:2px solid var(--pwm-line)}
.list td{padding:.7rem .8rem;border-bottom:1px solid #eef2f7;font-size:.88rem;vertical-align:middle}
.list tr:hover td{background:#f7fafd}
.list .thumb{width:52px;height:44px;object-fit:contain;background:#fff;border:1px solid var(--pwm-line);border-radius:6px}
.list .modelo{font-weight:700;color:var(--pwm-navy)}

/* Login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#005FBE 0%,#062F5E 100%);padding:1.5rem}
.login-card{background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.3);padding:2.5rem;
  width:100%;max-width:400px}
.login-card .logo{display:flex;justify-content:center;margin-bottom:1.5rem}
.login-card .logo img{height:44px}
.login-card h1{font-size:1.25rem;font-weight:800;color:var(--pwm-navy);text-align:center;margin:0 0 .3rem}
.login-card .sub{text-align:center;color:var(--pwm-slate);font-size:.85rem;margin-bottom:1.5rem}
.err{background:#fde8e9;color:#b91c1c;border-radius:8px;padding:.6rem .8rem;font-size:.85rem;margin-bottom:1rem}
.hidden{display:none}

/* Uploader de fotos */
.dropzone{display:block;width:100%;border:2px dashed var(--pwm-line);border-radius:12px;padding:2.5rem 2rem;text-align:center;
  cursor:pointer;transition:all .2s;color:var(--pwm-slate)}
.dropzone:hover,.dropzone.over{border-color:var(--pwm-blue);background:#f4f8fc;color:var(--pwm-blue)}
.fotos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.9rem;margin-top:1.1rem}
.foto-item{position:relative;background:#fff;border:1px solid var(--pwm-line);border-radius:10px;overflow:hidden}
.foto-item img{width:100%;height:110px;object-fit:contain;background:#fff;display:block}
.foto-item .acts{position:absolute;top:.3rem;right:.3rem;display:flex;gap:.25rem}
.foto-item .acts button{width:26px;height:26px;border-radius:6px;border:none;cursor:pointer;
  background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.foto-item .ord{position:absolute;bottom:.3rem;left:.3rem;background:var(--pwm-blue);color:#fff;
  font-size:.65rem;font-weight:700;border-radius:20px;padding:.1rem .45rem}

/* Filas dinámicas (métricas, especificaciones) */
.rowset{display:flex;flex-direction:column;gap:.5rem}
.dynrow{display:flex;gap:.5rem;align-items:center}
.dynrow .input{flex:1}
.dynrow .del{flex:0 0 auto;background:none;border:none;color:var(--pwm-red);cursor:pointer;padding:.4rem}
.grouptag{display:inline-flex;align-items:center;gap:.4rem;font-size:.7rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:var(--pwm-blue);background:#eef3fb;border-radius:6px;padding:.25rem .6rem}

/* Aviso de configuración pendiente */
.cfg-warn{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:12px;padding:1rem 1.25rem;
  margin-bottom:1.25rem;font-size:.88rem}
.cfg-warn b{color:#7c2d12}
