/* =========================================================================
   MJ Plast — Estilos del panel de administración
   ========================================================================= */
.admin-body{ background:var(--bg); }

/* LOGIN */
.admin-login{ min-height:100vh; display:grid; place-items:center; padding:1rem;
  background:linear-gradient(135deg,var(--navy),var(--navy-deep)); }
.admin-login__card{ background:#fff; border-radius:18px; padding:2.5rem; width:min(380px,100%);
  box-shadow:var(--shadow-lg); display:flex; flex-direction:column; gap:.8rem; text-align:center; }
.admin-login__card img{ height:56px; margin:0 auto .5rem; }
.admin-login__card h2{ color:var(--navy); }
.admin-login__card label{ text-align:left; font-size:.8rem; font-weight:700; display:flex; flex-direction:column; gap:.3rem; }
.admin-login__card input{ border:2px solid var(--line); border-radius:10px; padding:.65rem .8rem; font-family:inherit; font-size:.95rem; outline:0; }
.admin-login__card input:focus{ border-color:var(--blue); }
.small{ font-size:.8rem; }

/* LAYOUT */
.admin{ display:grid; grid-template-columns:230px 1fr; min-height:100vh; }
.admin__side{ background:var(--navy-deep); color:#cdd9f5; display:flex; flex-direction:column; padding:1.2rem .8rem; position:sticky; top:0; height:100vh; }
.admin__brand{ background:#fff; border-radius:12px; padding:.6rem; margin-bottom:1.5rem; }
.admin__brand img{ height:42px; margin:0 auto; }
.admin__nav{ display:flex; flex-direction:column; gap:.25rem; flex:1; }
.admin__navbtn{ text-align:left; border:0; background:transparent; cursor:pointer; color:#cdd9f5;
  font-family:inherit; font-weight:600; font-size:.9rem; padding:.7rem .8rem; border-radius:10px; transition:.15s; }
.admin__navbtn:hover{ background:rgba(255,255,255,.08); color:#fff; }
.admin__navbtn.active{ background:var(--blue); color:#fff; }
.admin__side-foot{ display:flex; flex-direction:column; gap:.25rem; border-top:1px solid rgba(255,255,255,.1); padding-top:.6rem; }

.admin__main{ padding:1.6rem 2rem; overflow-x:auto; }
.admin__topbar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:1.5rem; }
.admin__topbar h1{ color:var(--navy); font-size:1.6rem; }
.admin__who{ font-size:.85rem; color:var(--muted); font-weight:600; }

/* CARDS DASHBOARD */
.admin__cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1rem; margin-bottom:1.5rem; }
.acard{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.3rem; box-shadow:var(--shadow-sm); }
.acard__num{ font-size:1.9rem; font-weight:900; color:var(--navy); line-height:1; }
.acard__lbl{ font-size:.82rem; color:var(--muted); font-weight:600; margin-top:.3rem; }
.acard--accent{ background:var(--navy); color:#fff; }
.acard--accent .acard__num{ color:#fff; }
.acard--accent .acard__lbl{ color:#9fb3e0; }

.admin__panel{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.3rem; box-shadow:var(--shadow-sm); }
.admin__panel h3{ color:var(--navy); margin-bottom:.8rem; font-size:1.05rem; }

/* TOOLBAR */
.admin__toolbar{ display:flex; gap:.6rem; margin-bottom:1.1rem; align-items:center; }
.admin__toolbar input[type=search], .admin__toolbar select{
  border:2px solid var(--line); border-radius:10px; padding:.6rem .8rem; font-family:inherit; font-size:.9rem; outline:0; }
.admin__toolbar input[type=search]{ flex:1; max-width:360px; }
.admin__toolbar input:focus, .admin__toolbar select:focus{ border-color:var(--blue); }

/* TABLAS */
.tbl{ width:100%; border-collapse:collapse; background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); }
.tbl thead th{ background:var(--blue-light); color:var(--navy); text-align:left; font-size:.76rem; text-transform:uppercase; letter-spacing:.03em; padding:.7rem .9rem; }
.tbl tbody td{ padding:.7rem .9rem; border-top:1px solid var(--line); font-size:.88rem; vertical-align:middle; }
.tbl tbody tr:hover{ background:var(--bg); }
.tbl .codecell{ font-family:ui-monospace,monospace; font-weight:700; color:var(--navy); font-size:.8rem; }
.tbl .num{ text-align:right; font-weight:700; }
.tbl .actions{ display:flex; gap:.35rem; justify-content:flex-end; }
.iconbtn-sm{ border:1px solid var(--line); background:#fff; cursor:pointer; border-radius:8px; padding:.35rem .55rem; font-size:.85rem; }
.iconbtn-sm:hover{ background:var(--blue-light); }
.iconbtn-sm.danger:hover{ background:#fde0e0; }

/* Estrella de "destacado" clickeable en la lista de productos */
.star-cell{ text-align:center; }
.starbtn{ border:0; background:transparent; cursor:pointer; font-size:1.25rem; line-height:1;
  color:#c8cedb; padding:.15rem .3rem; border-radius:6px; transition:transform .12s, color .12s; }
.starbtn:hover{ color:#e0a800; transform:scale(1.15); }
.starbtn.on{ color:#f5b301; }
.starbtn:disabled{ opacity:.5; cursor:default; transform:none; }

.pill{ font-size:.7rem; font-weight:800; padding:.2rem .55rem; border-radius:999px; }
.pill--on{ background:#d6f5e0; color:#1c7d44; }
.pill--off{ background:#eee; color:#888; }
.pill--star{ background:#fff3d6; color:#9a6700; }
.pill--admin{ background:#e7ddff; color:#5b21b6; }

/* selector de estado en pedidos admin */
.estado-sel{ border:2px solid var(--line); border-radius:8px; padding:.3rem .5rem; font-family:inherit; font-weight:700; font-size:.78rem; cursor:pointer; }

/* MODAL PRODUCTO */
.modal__card--wide{ width:min(640px,100%); text-align:left; }
.modal__card--wide h3{ color:var(--navy); margin-bottom:1rem; }
.prodform__grid{ display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
.prodform__grid > *{ min-width:0; }   /* permite que las columnas se achiquen y entre todo (sin scroll horizontal) */
.prodform label{ font-size:.78rem; font-weight:700; color:var(--ink); display:flex; flex-direction:column; gap:.3rem; min-width:0; }
.prodform input, .prodform select{ width:100%; min-width:0; border:2px solid var(--line); border-radius:9px; padding:.55rem .7rem; font-family:inherit; font-size:.9rem; outline:0; }
.prodform input:focus, .prodform select:focus{ border-color:var(--blue); }
.prodform .span2{ grid-column:span 2; }
.prodform .check{ flex-direction:row; align-items:center; gap:.5rem; font-weight:600; }
.prodform .check input{ width:18px; height:18px; accent-color:var(--navy); }
.prodform__actions{ display:flex; justify-content:flex-end; gap:.6rem; margin-top:1.2rem; }

/* CATEGORÍAS */
.cat-thumb{ width:44px; height:44px; border-radius:10px; object-fit:cover; display:inline-block; vertical-align:middle; }
.cat-thumb--ph{ display:grid; place-items:center; font-size:1.3rem; background:var(--blue-light); }
/* Widget de subida de imagen (producto / categoría) */
.imgfield{ display:flex; flex-direction:column; gap:.35rem; }
.imgfield__lbl{ font-size:.78rem; font-weight:700; color:var(--ink); }
.imgup{ display:flex; align-items:center; gap:1rem; }
.imgup__prev{ width:86px; height:86px; flex:0 0 auto; border:2px dashed var(--line); border-radius:12px;
  background:var(--bg); display:grid; place-items:center; cursor:pointer; overflow:hidden; transition:.15s; }
.imgup--big .imgup__prev{ width:120px; height:120px; }
.imgup__prev:hover{ border-color:var(--blue); background:var(--blue-light); }
.imgup__prev.has{ border-style:solid; border-color:var(--line); }
.imgup__prev img{ width:100%; height:100%; object-fit:cover; }
.imgup__ctl{ display:flex; flex-direction:column; gap:.45rem; align-items:flex-start; }
.imgup__pick{ font-size:.82rem; padding:.5rem .9rem; }
.imgup__rm{ border:0; background:transparent; color:#c0283c; font-family:inherit; font-size:.76rem; font-weight:600; cursor:pointer; padding:0; }
.imgup__rm:hover{ text-decoration:underline; }
.imgup__status{ font-size:.76rem; color:var(--muted); font-weight:600; min-height:1em; }

/* MODAL RESET CONTRASEÑA */
.pwrow{ display:flex; gap:.5rem; }
.pwrow input{ flex:1; }
.pwrow .btn{ padding:.55rem .8rem; flex-shrink:0; }
.pwok{ background:#e7f7ec; border:1px solid #b6e3c4; border-radius:10px; padding:.9rem 1rem; font-size:.85rem; color:#1c7d44; display:flex; flex-direction:column; gap:.5rem; text-align:center; }
.pwok strong{ font-size:1.5rem; color:var(--navy); letter-spacing:.04em; font-family:ui-monospace,monospace; }
.pwok .btn--wa{ width:auto; }

/* IMPORTAR PRECIOS */
.import__files{ display:flex; gap:.8rem; align-items:flex-end; flex-wrap:wrap; margin-top:1rem; }
.import__file{ display:flex; flex-direction:column; gap:.35rem; font-size:.8rem; font-weight:700; color:var(--navy); }
.import__file input[type=file]{ border:2px dashed var(--line); border-radius:10px; padding:.6rem; font-family:inherit; font-size:.82rem; background:#fff; cursor:pointer; }
#impResult{ display:flex; flex-direction:column; gap:1rem; margin-top:1rem; }
.import__detectgrid{ display:grid; grid-template-columns:1fr 1fr; gap:.8rem; margin:.6rem 0; }
.import__listcard{ border-radius:12px; padding:1rem; border:1px solid var(--line); }
.import__listcard--b{ background:#e7f7ec; border-color:#b6e3c4; }
.import__listcard--a{ background:#eef2fb; border-color:#c7d6f5; }
.import__listtag{ font-size:.72rem; text-transform:uppercase; letter-spacing:.03em; font-weight:800; color:var(--navy); }
.import__listfile{ font-weight:700; margin:.25rem 0; word-break:break-all; }
.impwarn{ background:#fff8e6; border:1px solid #f3dca0; }
.impwarn p{ font-size:.86rem; margin:.25rem 0; color:#7a5b00; }
.impok{ background:#e7f7ec; border:1px solid #b6e3c4; color:#1c7d44; font-weight:700; }
.import__summary{ margin-bottom:0; }
.import__match{ display:flex; align-items:center; gap:.6rem; padding:.55rem .2rem; border-top:1px solid var(--line); cursor:pointer; }
.import__match input{ width:18px; height:18px; accent-color:var(--navy); flex-shrink:0; }
.import__matchtxt{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:.88rem; }
.import__matchold{ color:#b91c1c; text-decoration:line-through; }
.import__matcharrow{ color:var(--muted); font-weight:800; }
.import__matchnew{ color:#1c7d44; font-weight:700; }
.import__apply{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.import__purge{ font-size:.82rem; display:flex; align-items:center; gap:.45rem; color:#b91c1c; font-weight:600; }
.import__apply .btn{ margin-left:auto; }

@media (max-width:760px){
  .admin{ grid-template-columns:1fr; }
  .import__detectgrid{ grid-template-columns:1fr; }
  /* Sidebar → barra superior compacta (logo + accesos en fila) */
  .admin__side{ position:static; height:auto; flex-direction:row; flex-wrap:wrap;
    align-items:center; gap:.4rem .7rem; padding:.7rem 1rem; }
  .admin__brand{ margin-bottom:0; padding:.35rem .55rem; flex:0 0 auto; }
  .admin__brand img{ height:32px; }
  .admin__nav{ flex-direction:row; flex-wrap:wrap; flex:1 1 auto; gap:.25rem; }
  .admin__navbtn{ padding:.5rem .7rem; font-size:.85rem; }
  .admin__side-foot{ flex-direction:row; border-top:0; padding-top:0; gap:.5rem; flex:0 0 auto; }
  .admin__main{ padding:1.2rem 1rem; }
  .admin__topbar h1{ font-size:1.3rem; }
  .prodform__grid{ grid-template-columns:1fr; }
  .prodform .span2{ grid-column:span 1; }
}

/* ---------- Segmentos / categorías sin clasificar ---------- */
.admin__alert{ background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; border-radius:var(--radius); padding:.8rem 1rem; margin-bottom:1.1rem; font-size:.86rem; line-height:1.5; }
.admin__alert em{ font-style:normal; font-weight:700; }
.seg-panel__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:.8rem; }
.seg-ico{ font-size:1.2rem; }
.seg-tag{ display:inline-block; background:var(--blue-light); color:var(--navy); font-weight:700; font-size:.78rem; padding:.18rem .55rem; border-radius:999px; white-space:nowrap; }
.seg-tag--none{ background:#fff7ed; color:#9a3412; }
.tbl tbody tr.row--warn{ background:#fffaf4; }
.tbl tbody tr.row--warn:hover{ background:#fff3e6; }
.modal__actions{ display:flex; gap:.6rem; align-items:center; justify-content:flex-end; margin-top:.3rem; }
.modal__actions .danger{ margin-right:auto; color:#b91c1c; border-color:#f3c2c2; }
.modal__actions .danger:hover{ background:#fde0e0; }

/* ---------- CARRUSEL DE BANNERS ---------- */
.bannerup{ display:inline-flex; cursor:pointer; margin:.4rem 0 1.1rem; }
.bannerlist{ display:flex; flex-direction:column; gap:.7rem; }
.bannerlist__empty{ padding:1rem 0; }
.bannerrow{
  display:flex; align-items:center; gap:.9rem;
  background:#fff; border:1px solid var(--line); border-radius:10px; padding:.6rem .8rem;
}
.bannerrow.off{ opacity:.55; }
.bannerrow__img{ width:120px; height:64px; object-fit:cover; border-radius:7px; background:var(--bg); flex:0 0 auto; }
.bannerrow__info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:.35rem; }
.bannerrow__in{ border:1px solid var(--line); border-radius:7px; padding:.4rem .55rem; font-family:inherit; font-size:.84rem; outline:0; }
.bannerrow__in:focus{ border-color:var(--blue); }
.bannerrow__ord{ display:flex; flex-direction:column; gap:.25rem; flex:0 0 auto; }
.bannerrow__sw{ flex:0 0 auto; font-size:.8rem; }
.bannerrow .iconbtn-sm:disabled{ opacity:.4; cursor:default; }
@media (max-width:640px){
  .bannerrow{ flex-wrap:wrap; }
  .bannerrow__img{ width:84px; height:52px; }
  .bannerrow__info{ flex-basis:100%; order:3; }
}