/* FABIAN-STORE — capa final de identidad visual compartida para todas las páginas.
   Cargada al final para neutralizar reglas históricas duplicadas en app.css/store.css. */
:root{
  --sr-black:#111111;--sr-green:#0B5A2B;--sr-green-hover:#084721;--sr-lime:#9DC14B;
  --sr-coral:#E4572E;--sr-cream:#FAF8F1;--sr-paper:#fff;--sr-text:#171a16;
  --sr-muted:#73776f;--sr-line:#e5e3da;--sr-radius:16px;
  --sr-shadow:0 8px 24px rgba(17,17,17,.055);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--sr-cream);color:var(--sr-text);font-family:Inter,Arial,sans-serif}
h1,h2,h3,h4{color:var(--sr-black);font-family:Montserrat,Inter,Arial,sans-serif;letter-spacing:-.02em}
a{color:var(--sr-green)}
img{max-width:100%}
button,.btn{border:0;border-radius:999px;background:var(--sr-green);color:#fff;font-weight:700;box-shadow:none;transition:background .18s,transform .18s,box-shadow .18s}
button:hover,.btn:hover{background:var(--sr-green-hover);box-shadow:0 5px 14px rgba(11,90,43,.15);transform:translateY(-1px)}
.btn-gold,.cart-btn{background:var(--sr-lime)!important;color:var(--sr-black)!important}
.btn-gold:hover,.cart-btn:hover{background:#b5d66a!important}
.btn-danger{background:var(--sr-coral)!important;color:#fff!important}
input,select,textarea{width:100%;max-width:100%;border:1px solid var(--sr-line);border-radius:10px;background:#fff;color:var(--sr-text);font:inherit;padding:11px 13px}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--sr-green);box-shadow:0 0 0 3px rgba(157,193,75,.2)}
label{font-size:13px;font-weight:700;color:#353a34}
.card,.content-card,.stat-card,.config-panel,.config-menu,.filters-card{border:1px solid var(--sr-line);border-radius:var(--sr-radius);background:var(--sr-paper);box-shadow:var(--sr-shadow)}
.card{padding:22px}
table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--sr-line);border-radius:12px;overflow:hidden}
thead th{background:var(--sr-black);color:#fff;font-size:11px;letter-spacing:.055em;padding:13px 14px}
tbody td{padding:12px 14px;border-bottom:1px solid var(--sr-line);vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:#f8f8f2}
.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
.filters>div{min-width:160px;flex:1 1 160px}
/* Marco administrativo compartido: mismo menú, cabecera y área de trabajo en cada módulo. */
body.admin-layout{display:block;min-height:100vh;margin:0;background:var(--sr-cream)}
.admin-header{position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:248px!important;height:100vh!important;z-index:1000;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important;padding:16px 12px!important;overflow-y:auto!important;overflow-x:hidden!important;background:var(--sr-black)!important;border:0!important;border-right:1px solid rgba(255,255,255,.08)!important;box-shadow:4px 0 22px rgba(0,0,0,.08)!important}
.admin-brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;padding:4px 6px 14px!important;border-bottom:1px solid rgba(255,255,255,.12)}
.admin-brand strong{display:block;color:#fff;font-family:Montserrat,Inter,sans-serif;font-size:16px;font-weight:800}
.admin-brand small{display:block;color:var(--sr-lime)!important;font-size:11px;margin-top:3px}
.admin-brand .sidebar-logo{width:46px!important;height:46px!important;flex:0 0 46px!important;object-fit:contain;background:#fff;border:0!important;border-radius:12px!important;padding:3px;box-shadow:none!important}
.admin-nav{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;flex:1 0 auto!important;overflow:visible!important;min-height:0}
.admin-nav a{display:flex;align-items:center;gap:9px;white-space:normal!important;padding:10px 11px!important;border-radius:10px!important;color:#e6e9e4!important;text-decoration:none;font-size:13px!important;font-weight:600!important;line-height:1.3;transition:background .16s,color .16s}
.admin-nav a:hover{background:rgba(157,193,75,.14)!important;color:#fff!important}
.admin-nav a.active{background:var(--sr-green)!important;color:#fff!important}
.admin-logout{width:100%;flex:0 0 auto;justify-content:center;min-height:42px;background:rgba(255,255,255,.09)!important;color:#fff!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:none!important}
.main-wrap,.admin-sidebar-collapsed .main-wrap{width:auto;margin-left:248px;min-width:0;transition:margin-left .18s}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:22px 28px 16px!important;background:rgba(250,248,241,.96)!important;border-bottom:1px solid var(--sr-line)!important;backdrop-filter:blur(12px)}
.topbar h1{font-size:clamp(22px,2.1vw,30px);line-height:1.2;margin:0;color:var(--sr-black)}
.topbar .crumb{font-size:11px;color:var(--sr-muted);font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin-bottom:5px}
.main-wrap main{width:100%;max-width:1440px;margin:0 auto;padding:22px 28px 36px!important;min-width:0}
.main-wrap main>.card,.main-wrap main>.hero{margin-bottom:18px}
.content-intro{display:flex;align-items:flex-start;gap:18px;padding:22px 24px}
.intro-icon{display:flex;align-items:center;justify-content:center;flex:0 0 54px;width:54px;height:54px;border-radius:15px;background:#edf4df;font-size:25px}
.content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch}
.content-card{padding:20px;min-width:0;transition:box-shadow .18s,border-color .18s}
.content-card:hover{box-shadow:0 10px 28px rgba(17,17,17,.075)}
.content-card h2{font-size:17px;margin:0 0 13px;padding:0 0 11px;border-bottom:1px solid var(--sr-line)}
.content-card label{display:block;margin:12px 0 6px}
.content-card textarea{min-height:78px;resize:vertical}
.content-card input[type=file]{display:block;padding:10px;background:#fafaf6;border:1px dashed #cfd4c8;border-radius:10px;font-size:12px}
.content-card img{width:100%;height:200px;object-fit:cover;border-radius:11px;margin-top:10px;background:#f3f3ed;border:1px solid var(--sr-line)}
.content-card img[hidden]{display:none!important}
.content-card.wide{grid-column:1/-1}
.image-upload{display:grid;gap:8px;min-width:0}
.image-status{font-size:12px;color:var(--sr-muted);background:#f6f6f0;border-radius:9px;padding:10px 11px;overflow-wrap:anywhere}
.image-status.is-ok{color:var(--sr-green);background:#edf4df}
.image-status.is-error{color:#a8331a;background:#fff0ed}
.hint{font-size:12px;color:var(--sr-muted);margin:7px 0 0}
#contentForm>p{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0 0}
.dashboard-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.stat-card{padding:20px;min-width:0}
.stat{font-size:clamp(24px,2.5vw,34px);color:var(--sr-green)}
.config-layout{grid-template-columns:minmax(200px,250px) minmax(0,1fr);gap:18px}
.config-menu{padding:12px}
.config-menu button{justify-content:flex-start;width:100%;background:transparent;color:var(--sr-text);box-shadow:none;border-radius:9px;text-align:left}
.config-menu button.active,.config-menu button:hover{background:#edf4df;color:var(--sr-green)}
/* Tienda pública: misma paleta, bordes y controles que el panel. */
.store-header,.store-footer{background:var(--sr-black)!important}
.store-header-inner{max-width:1440px}
.store-nav a{border-radius:999px}
.hero{border-radius:var(--sr-radius);background:linear-gradient(125deg,#111 0%,#0B5A2B 72%,#287744 100%);box-shadow:var(--sr-shadow)}
.product,.category-card,.catalog-card{border-radius:var(--sr-radius);border-color:var(--sr-line);box-shadow:var(--sr-shadow)}
.product:hover,.category-card:hover,.catalog-card:hover{box-shadow:0 12px 30px rgba(17,17,17,.1)}
.product-media{background:#f2f4ed}
.store-footer{color:#e7e9e4}
.auth-wrap{background:radial-gradient(circle at 20% 20%,#0B5A2B,#111 72%)}
.auth-card{border-radius:20px;box-shadow:0 18px 50px rgba(0,0,0,.2)}
@media(max-width:1100px){.dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.main-wrap main{padding:20px 18px 30px!important}.topbar{padding:18px!important}}
@media(max-width:900px){
 .admin-header{position:relative!important;left:auto!important;top:auto!important;bottom:auto!important;width:100%!important;height:auto!important;max-height:none!important;overflow:visible!important;padding:12px!important;gap:10px!important}
 .admin-brand{padding:2px 4px 10px!important;justify-content:flex-start!important}
 .admin-brand>div{display:block!important}
 .admin-nav{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px!important;flex:0 0 auto!important}
 .admin-nav a{font-size:12px!important;padding:9px 10px!important;white-space:normal!important}
 .admin-logout{width:auto;align-self:flex-start;padding:9px 16px}
 .main-wrap,.admin-sidebar-collapsed .main-wrap{margin-left:0!important;width:100%!important}
 .topbar{position:relative;top:auto;padding:16px 18px 12px!important}
 .main-wrap main{padding:16px 18px 28px!important}
}
@media(max-width:650px){
 .content-grid{grid-template-columns:minmax(0,1fr);gap:13px}
 .content-card.wide{grid-column:auto}
 .content-card{padding:16px}
 .content-card img{height:180px}
 .content-intro{padding:17px;gap:12px}
 .intro-icon{width:42px;height:42px;flex-basis:42px;font-size:20px}
 .admin-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
 .admin-nav a{font-size:11px!important;padding:8px!important}
 .main-wrap main{padding:12px 12px 24px!important}
 .topbar{padding:14px 12px 10px!important}
 .card{padding:16px}
 .dashboard-stats{grid-template-columns:1fr}
 table{display:block;max-width:100%;overflow-x:auto}
 .config-layout{grid-template-columns:minmax(0,1fr)}
 .filters>div{min-width:100%;flex-basis:100%}
}

/* Ajustes de estabilidad del panel administrativo (octubre 2026). */
body.admin-layout{
  min-height:100vh;
  height:auto;
  background:var(--sr-cream);
}
.admin-header{
  min-height:100vh!important;
  height:100dvh!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}
.admin-nav{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  padding-bottom:8px;
}
.admin-logout{
  margin-top:auto!important;
  position:relative!important;
  flex:0 0 auto!important;
  z-index:2;
}
.main-wrap{min-height:0;min-width:0}
.main-wrap main{padding-bottom:24px!important}
@media(max-width:900px){
  .admin-header{height:auto!important;min-height:0!important;overflow:visible!important}
  .admin-nav{flex:0 0 auto!important;overflow:visible!important;padding-bottom:0}
  .admin-logout{margin-top:0!important}
}


/* Unificación final de navegación del panel: todas las páginas comparten el mismo estado activo. */
body.admin-layout{background:var(--sr-cream,#FAF8F1)!important;color:var(--sr-text,#171a16)}
.admin-header{background:var(--sr-black,#111)!important}
.admin-nav a.active,.admin-nav a.active-tab,.admin-nav a[aria-current="page"]{background:#0b4f26!important;color:#fff!important;box-shadow:0 4px 12px rgba(11,79,38,.24)}
.admin-nav a:focus-visible,.admin-brand:focus-visible{outline:2px solid var(--sr-lime,#9DC14B);outline-offset:2px}
/* El menú conserva una columna en escritorio para no alterar el diseño compartido. */
.admin-nav{display:flex!important;flex-direction:column!important;min-width:0}
.admin-header{min-width:0}
.main-wrap{background:transparent!important}

/* Ajustes responsivos unificados para móvil y tablet. */
body.admin-layout,
.admin-layout {
  min-height: 100vh;
  min-height: 100dvh;
  height: auto !important;
  overflow-x: hidden;
}
.admin-layout { display: flex; align-items: stretch; }
.main-wrap { flex: 1 1 auto; min-width: 0; width: auto; }
.main-wrap main { min-width: 0; max-width: 100%; }
/* Las tablas pueden desplazarse horizontalmente sin ensanchar toda la página. */
.main-wrap table { max-width: 100%; }
.main-wrap main > table,
.main-wrap main .table-responsive,
.main-wrap main .table-wrap,
.main-wrap main .table-container,
.main-wrap main .data-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 900px) {
  .admin-layout { display: flex !important; flex-direction: column !important; min-height: 100vh; min-height: 100dvh; height: auto !important; }
  .admin-header { position: relative !important; inset: auto !important; width: 100% !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; flex: 0 0 auto; }
  .admin-nav { width: 100%; min-width: 0; }
  .main-wrap, .admin-sidebar-collapsed .main-wrap { width: 100% !important; min-width: 0 !important; margin-left: 0 !important; }
  .topbar { position: relative !important; top: auto !important; }
  .main-wrap main { width: 100%; min-width: 0; padding-left: 14px !important; padding-right: 14px !important; box-sizing: border-box; }
}
@media (max-width: 600px) {
  .admin-header { padding: 10px !important; }
  .admin-nav { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .main-wrap main { padding: 12px !important; }
  .main-wrap table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .main-wrap input, .main-wrap select, .main-wrap textarea, .main-wrap button { max-width: 100%; }
  .main-wrap .form-grid, .main-wrap .filters, .main-wrap .config-layout { grid-template-columns: minmax(0, 1fr) !important; }
}


/* Plantilla compartida y comportamiento móvil coherente para todas las vistas administrativas. */
body.admin-layout { box-sizing: border-box; }
body.admin-layout *, body.admin-layout *::before, body.admin-layout *::after { box-sizing: border-box; }
.main-wrap { min-width: 0; max-width: 100%; }
.main-wrap main { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.main-wrap .table-responsive, .main-wrap .table-wrap, .main-wrap .table-container, .main-wrap .data-table-wrap { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
@media (max-width: 900px) {
  body.admin-layout { display: flex !important; flex-direction: column !important; min-height: 100vh; min-height: 100dvh; height: auto !important; }
  body.admin-layout > .admin-header { position: relative !important; inset: auto !important; width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; }
  body.admin-layout > .main-wrap { width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; }
  body.admin-layout .main-wrap main { padding-left: 12px !important; padding-right: 12px !important; }
}
@media (max-width: 600px) {
  body.admin-layout .main-wrap table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body.admin-layout .main-wrap input, body.admin-layout .main-wrap select, body.admin-layout .main-wrap textarea, body.admin-layout .main-wrap button { max-width: 100%; }
}

/* Corrección definitiva: estilos compartidos cargados en todas las páginas admin. */
body.admin-layout {
  min-height: 100vh;
  min-height: 100dvh;
  height: auto !important;
  overflow-x: clip;
}
body.admin-layout > .admin-header {
  min-height: 100vh !important;
  min-height: 100dvh !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  flex: 0 0 250px;
}
body.admin-layout > .main-wrap {
  flex: 1 1 0%;
  min-width: 0;
  width: 0;
  max-width: 100%;
}
body.admin-layout .admin-nav {
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
body.admin-layout .admin-logout { width: 100%; }
body.admin-layout .main-wrap main { min-width: 0; max-width: 100%; }
body.admin-layout .main-wrap table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}
body.admin-layout .main-wrap th,
body.admin-layout .main-wrap td { white-space: nowrap; }
body.admin-layout .main-wrap .card,
body.admin-layout .main-wrap .filters,
body.admin-layout .main-wrap .form-grid { min-width: 0; max-width: 100%; }
@media (max-width: 900px) {
  body.admin-layout {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    min-height: 100vh;
    min-height: 100dvh;
    height: auto !important;
    overflow-x: clip;
  }
  body.admin-layout > .admin-header {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    flex: 0 0 auto;
  }
  body.admin-layout .admin-nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    flex-direction: initial !important;
    gap: 6px !important;
    width: 100%;
    max-height: none !important;
    overflow: visible !important;
  }
  body.admin-layout .admin-nav a {
    min-width: 0;
    overflow-wrap: anywhere;
    text-align: left;
  }
  body.admin-layout .admin-logout { margin-top: 8px !important; }
  body.admin-layout > .main-wrap {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    flex: 1 1 auto;
  }
  body.admin-layout .main-wrap main {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding: 12px !important;
  }
  body.admin-layout .main-wrap .filters,
  body.admin-layout .main-wrap .form-grid,
  body.admin-layout .main-wrap .config-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
@media (max-width: 420px) {
  body.admin-layout .admin-nav { grid-template-columns: minmax(0, 1fr) !important; }
  body.admin-layout .admin-nav a { padding: 9px 10px !important; font-size: 13px !important; }
  body.admin-layout .main-wrap main { padding: 10px !important; }
}


/* Corrección directa para Clientes y Facturas: prioridad sobre reglas históricas. */
body.admin-layout { min-height:100vh; min-height:100dvh; height:auto!important; overflow-x:hidden; }
body.admin-layout > .admin-header { box-sizing:border-box; }
body.admin-layout .main-wrap { min-width:0!important; max-width:100%; }
body.admin-layout .main-wrap main { min-width:0!important; max-width:100%!important; }
body.admin-layout .table-responsive {
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  margin-bottom:1rem;
  border-radius:8px;
  background:#fff;
}
body.admin-layout .table-responsive > table,
body.admin-layout .table-responsive > table.table {
  display:table !important;
  width:100%;
  min-width:700px;
  max-width:none;
  margin:0;
  white-space:nowrap;
  border-collapse:collapse;
}
body.admin-layout .filters { display:flex; flex-wrap:wrap; min-width:0; }
body.admin-layout .filters > div { min-width:0; flex:1 1 160px; }
@media (max-width:900px) {
  body.admin-layout { display:flex!important; flex-direction:column!important; align-items:stretch!important; }
  body.admin-layout > .admin-header { position:relative!important; inset:auto!important; width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:visible!important; flex:0 0 auto!important; }
  body.admin-layout .admin-nav { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; width:100%; min-width:0; overflow:visible!important; }
  body.admin-layout .main-wrap, body.admin-layout.admin-sidebar-collapsed .main-wrap { width:100%!important; max-width:100%!important; min-width:0!important; margin:0!important; flex:1 1 auto; }
  body.admin-layout .topbar { position:relative!important; top:auto!important; }
}
@media (max-width:600px) {
  body.admin-layout .admin-nav { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  body.admin-layout .main-wrap main { padding:12px!important; }
  body.admin-layout .main-wrap .card { min-width:0; padding:14px; }
  body.admin-layout .filters > div { flex:1 1 100%; width:100%; }
  body.admin-layout .table-responsive > table { min-width:700px; }
}
@media (max-width:360px) {
  body.admin-layout .admin-nav { grid-template-columns:minmax(0,1fr)!important; }
}