*{box-sizing:border-box}body{margin:0;background:#05070d;color:#f4f4f7;font:14px Arial,sans-serif}aside{position:fixed;width:235px;min-height:100vh;background:#080a12;border-right:1px solid #1b1f2e;padding:28px 15px}aside .brand{font-weight:900;font-size:17px;margin:0 10px 35px}aside .brand small{display:block;color:#a42cff;font-size:9px;letter-spacing:2px;margin-left:28px;margin-top:3px}aside a{display:block;padding:12px;color:#9ea3b2;text-decoration:none;border-radius:7px;margin:3px 0}aside a:hover,aside a.active{background:#1a0d29;color:#c25cff}main{margin-left:235px;padding:35px 4%;width:calc(100% - 235px)}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}h1{margin:0}header p,.panel p{color:#858b9e}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}.stats div,.panel,.formbox{background:#090c14;border:1px solid #202536;border-radius:10px;padding:20px}.stats small{color:#72788a}.stats b{display:block;font-size:28px;margin-top:9px}.btn{background:linear-gradient(100deg,#741dff,#a62cff);color:#fff;padding:11px 17px;border-radius:7px;text-decoration:none;border:0;cursor:pointer}.panel{margin-bottom:20px}.head{margin-bottom:18px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:13px;border-bottom:1px solid #1d2130;font-size:12px}th{color:#73798a;text-transform:uppercase;font-size:10px}.pill{color:#39df8b;background:#092518;border-radius:20px;padding:5px 8px}.actions a,.actions button{margin-left:5px;color:#c168ff;background:#111522;border:1px solid #2a2e3e;padding:6px;border-radius:5px;text-decoration:none;font-size:11px}.empty{text-align:center;padding:45px}.formpage{margin-left:0;width:100%;max-width:900px;margin:auto}.formpage>a{color:#b55cff}.formbox{margin-top:20px}.formbox label{display:block;color:#aaa;font-size:12px;margin:14px 0}.formbox input,.formbox textarea{width:100%;display:block;background:#070a12;border:1px solid #292e40;color:#eee;padding:11px;border-radius:6px;margin-top:6px}.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}.check input{display:inline;width:auto;margin-right:8px}.variant-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 110px 170px 145px 40px;gap:8px;margin:8px 0}.variant-row input{margin:0}.variant-row button{background:#1a0d15;color:#ff7890;border:1px solid #3a2530;border-radius:5px}.secondary{background:#111520;border:1px solid #303548;color:#ddd;padding:10px 14px;border-radius:7px;margin-top:8px}.save{margin-top:25px;float:right}@media(max-width:800px){aside{width:65px}aside .brand span,aside a{font-size:0;text-align:center}main{margin-left:65px;width:calc(100% - 65px)}.stats{grid-template-columns:repeat(2,1fr)}.variant-row{grid-template-columns:minmax(0,1fr) 100px 95px;gap:8px}}
.muted{display:block;color:#777;font-size:11px;margin-top:4px}.panel select{background:#0c101a;color:#ddd;border:1px solid #303548;border-radius:5px;padding:6px}.panel a{color:#bf64ff;text-decoration:none}

.actions{display:flex;gap:6px;flex-wrap:wrap}.actions form{margin:0}.actions button{border:0;border-radius:6px;padding:7px 10px;cursor:pointer;color:#fff;font-size:11px;font-weight:700}.approve{background:#12a96a}.reject{background:#a93650}.process{background:#7435d8}.status{display:inline-block;padding:5px 8px;border-radius:20px;font-size:10px;font-weight:700;letter-spacing:.3px}.status-por_verificar{background:#3a2b05;color:#ffc94d}.status-pagado{background:#082e20;color:#43e59a}.status-en_proceso{background:#211342;color:#bd8cff}.status-entregado{background:#0c2a32;color:#54d8ee}.status-cancelado{background:#32111a;color:#ff718c}.status-pendiente{background:#242733;color:#c8cedb}@media(max-width:1100px){table{font-size:11px}.actions{flex-direction:column}}

/* V5: carga y vista previa de imagen por producto */
.image-field{margin:18px 0 24px}.image-field>label:first-child{display:block;font-weight:700;margin-bottom:9px}.muted{color:#7f899d;font-size:12px}.image-preview-wrap{width:240px;aspect-ratio:1/1;border:1px solid #2a3042;border-radius:14px;background:#070911;display:flex;align-items:center;justify-content:center;overflow:hidden;margin:8px 0 12px}.product-preview{width:100%;height:100%;object-fit:contain;display:block}.hidden{display:none!important}.empty-preview{color:#697287;text-align:center;font-size:30px}.empty-preview span{font-size:12px}.file-btn{display:inline-flex!important;align-items:center;gap:8px;padding:10px 14px;background:#171c2a;border:1px solid #30384d;border-radius:10px;color:#fff;cursor:pointer!important;font-weight:700!important;margin:0!important}.file-btn input{display:none}.image-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:9px}.remove-image{display:inline-flex!important;align-items:center;gap:6px;margin:0!important;color:#c7cedc;font-size:12px!important}.remove-image input{width:auto!important}
@media(max-width:600px){.image-preview-wrap{width:100%;max-width:280px}}
.form-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.manage-catalog-btn{display:inline-flex;align-items:center;white-space:nowrap;background:#111522;border:1px solid #30384d;color:#d7dbea!important;padding:10px 13px;border-radius:9px;text-decoration:none}.formbox select{width:100%;display:block;background:#070a12;border:1px solid #292e40;color:#eee;padding:11px;border-radius:6px;margin-top:6px}.catalog-hint{font-size:12px;color:#7f899d;margin:-3px 0 16px}.catalog-hint a{color:#bf64ff}.catalog-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:20px 0 28px}.catalog-card{background:#070a12;border:1px solid #252b3b;border-radius:12px;padding:18px}.catalog-card h2{margin:0 0 7px;font-size:18px}.catalog-card p{margin:0 0 14px}.catalog-form{display:grid;gap:9px}.catalog-form input,.catalog-form select{margin:0}.catalog-section-title{margin:28px 0 12px}.category-list{display:grid;gap:8px}.category-item{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#070a12;border:1px solid #252b3b;border-radius:10px;padding:12px 14px}.category-item strong{display:block}.category-item span{display:block;color:#7f899d;font-size:11px;margin-top:4px}.category-item .locked{color:#7f899d;white-space:nowrap}.danger-small{background:#241018;color:#ff718c;border:1px solid #4b2632;border-radius:7px;padding:7px 10px;cursor:pointer}.categories-page{max-width:1000px}.categories-page .formbox{padding:24px}@media(max-width:700px){.form-title-row{flex-direction:column}.catalog-grid{grid-template-columns:1fr}.category-item{align-items:flex-start}}


/* CONTRASTE GLOBAL ADMIN: evita texto claro sobre fondos claros */
.panel,.formbox{color:#e5e7eb}.panel h1,.panel h2,.panel h3,.formbox h1,.formbox h2,.formbox h3{color:#f8fafc}
.panel td,.panel b{color:#e5e7eb}.panel p,.formbox p{color:#94a3b8}

/* =========================================================
   ZONA DIGITAL GAME OVER · ADMINISTRACIÓN PREMIUM
   Identidad visual inspirada en el logo: cyan + azul profundo
   ========================================================= */
:root{--zd-bg:#060b13;--zd-surface:#0d1521;--zd-surface-2:#111c2a;--zd-line:#24354b;--zd-text:#f4f8fc;--zd-muted:#91a1b6;--zd-cyan:#26d3ff;--zd-cyan-2:#00a9e8;--zd-blue:#126ee8;--zd-violet:#7155ff;--zd-green:#35d49a;--zd-shadow:0 22px 60px rgba(0,0,0,.34)}
body{background:radial-gradient(circle at 90% 0%,rgba(20,96,167,.18),transparent 28%),radial-gradient(circle at 0% 15%,rgba(91,54,166,.13),transparent 26%),var(--zd-bg)!important;color:var(--zd-text)!important;letter-spacing:.01em}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.28;background-image:linear-gradient(30deg,transparent 49.5%,rgba(70,100,130,.13) 50%,transparent 50.5%),linear-gradient(150deg,transparent 49.5%,rgba(70,100,130,.1) 50%,transparent 50.5%);background-size:120px 104px;mask-image:linear-gradient(to bottom,black,transparent 72%)}
aside{background:linear-gradient(180deg,#09111d 0%,#070c15 100%)!important;border-right:1px solid #1d2b3d!important;padding:24px 14px!important;box-shadow:16px 0 48px rgba(0,0,0,.18);z-index:5}
aside .brand{display:flex;align-items:center;gap:10px;margin:0 8px 28px!important;font-size:14px!important;line-height:1.1}
aside .brand img{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 6px 12px rgba(38,211,255,.15))}
aside .brand strong{display:block;color:#f7fbff;font-size:15px;letter-spacing:.08em}.brand small{display:block!important;margin:5px 0 0!important;color:var(--zd-cyan)!important;font-size:9px!important;letter-spacing:.28em!important}
aside a{border:1px solid transparent!important;color:#9dacbf!important;padding:11px 12px!important;border-radius:11px!important;margin:5px 0!important;transition:.2s ease!important}
aside a:hover{background:#101c2b!important;border-color:#22354c!important;color:#effaff!important;transform:translateX(2px)}
aside a.active{background:linear-gradient(90deg,rgba(38,211,255,.16),rgba(18,110,232,.12))!important;border-color:rgba(38,211,255,.22)!important;color:#62ddff!important;box-shadow:inset 3px 0 0 var(--zd-cyan)}
main{position:relative;z-index:1;padding:34px 4.5%!important;max-width:none!important}
header{padding:0 0 24px!important;border-bottom:1px solid rgba(43,61,83,.6);margin-bottom:26px!important}header h1{font-size:30px!important;letter-spacing:-.03em;color:#f7fbff!important}header p,.panel p{color:var(--zd-muted)!important}.btn{background:linear-gradient(100deg,var(--zd-cyan),#198be8 52%,#4f7cff)!important;border:0!important;color:#03101b!important;font-weight:900!important;border-radius:12px!important;box-shadow:0 10px 24px rgba(0,169,232,.18);padding:12px 17px!important}.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.panel,.formbox,.stats div{background:linear-gradient(145deg,rgba(16,27,42,.96),rgba(9,16,27,.96))!important;border:1px solid rgba(45,67,93,.82)!important;border-radius:18px!important;box-shadow:var(--zd-shadow)}
.dashboard-grid .stat-card,.stock-grid .stock-card{background:linear-gradient(145deg,#111d2c,#0c1522)!important;border-color:#26394f!important;border-radius:18px!important;position:relative;overflow:hidden}.dashboard-grid .stat-card:before,.stock-grid .stock-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(var(--zd-cyan),var(--zd-blue))}.dashboard-grid .stat-card b{color:#fff!important}.dashboard-grid .stat-card small,.stock-grid .stock-card small{color:#aebdd0!important;letter-spacing:.08em}
.quick a{background:#0e1826!important;border-color:#27394f!important;border-radius:11px!important;color:#d9e7f4!important}.quick a:hover{background:#15243a!important;border-color:#3c6887!important;color:#fff!important}
table{background:transparent!important}th{color:#7f94aa!important}td{color:#d9e6f1!important}.inventory-table td,.inventory-table th{border-color:#243448!important}.inventory-table tr:hover td{background:rgba(34,67,99,.09)}
.stock-pill.normal,.status-entregado,.status-pagado{background:rgba(23,155,101,.16)!important;color:#53e8ae!important;border-color:rgba(53,212,154,.2)!important}.stock-pill.low{background:rgba(230,174,35,.15)!important;color:#ffd56b!important}.stock-pill.out,.status-cancelado{background:rgba(231,78,100,.14)!important;color:#ff8fa0!important}.stock-units b{color:#63d8ff!important}.stock-number{background:#08111d!important;border-color:#30455d!important;color:#fff!important}.save-stock{background:linear-gradient(100deg,var(--zd-cyan),#197bdc)!important;color:#04111b!important}
.formbox{padding:28px!important}.formbox input,.formbox textarea,.formbox select,.panel select{background:#09121e!important;border:1px solid #2b4058!important;color:#edf6ff!important;border-radius:11px!important}.formbox input:focus,.formbox textarea:focus,.formbox select:focus{outline:0;border-color:var(--zd-cyan)!important;box-shadow:0 0 0 3px rgba(38,211,255,.12)}
.formpage>a{display:inline-flex;align-items:center;gap:7px;background:#0d1724;border:1px solid #26384e;padding:10px 13px;border-radius:10px;text-decoration:none;color:#b9d7eb!important;margin-bottom:15px}.catalog-card,.category-item{background:#09121e!important;border-color:#26384e!important}.catalog-card h2,.category-item strong{color:#f6fbff!important}.danger-small{border-radius:9px!important}
.card{background:linear-gradient(145deg,#101a29,#0a121d)!important;border-color:#293c53!important;border-radius:17px!important}.ok{background:rgba(31,174,116,.13)!important;color:#7ff0bb!important;border-color:rgba(53,212,154,.25)!important}.err{background:rgba(222,63,82,.13)!important;color:#ff9aa8!important;border-color:rgba(255,120,140,.25)!important}
@media(max-width:800px){aside .brand{justify-content:center;margin-left:0!important}aside .brand div{display:none}aside .brand img{width:38px;height:38px}main{padding:24px 5%!important}}

/* LOGIN PREMIUM */
.admin-login-page{min-height:100vh;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 12% 18%,rgba(111,68,184,.25),transparent 27%),radial-gradient(circle at 88% 10%,rgba(25,124,213,.25),transparent 30%),#07101b!important}.admin-login-page:before{opacity:.5;background-size:160px 138px;mask-image:none}
.login-shell{position:relative;z-index:2;width:min(1040px,92vw);display:grid;grid-template-columns:1.05fr .95fr;border:1px solid rgba(111,145,179,.25);border-radius:28px;overflow:hidden;background:rgba(10,18,29,.8);box-shadow:0 35px 100px rgba(0,0,0,.45);backdrop-filter:blur(16px)}
.login-panel{min-height:570px;padding:54px;position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(14,33,54,.98),rgba(8,14,25,.96) 65%)}.login-glow{position:absolute;width:260px;height:260px;border-radius:50%;filter:blur(70px);opacity:.32}.glow-one{background:#20d4ff;top:-120px;left:-100px}.glow-two{background:#6542c8;bottom:-130px;right:-90px}.login-logo-wrap{position:relative;width:112px;height:112px;padding:9px;border:1px solid rgba(73,219,255,.3);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.02));box-shadow:0 16px 34px rgba(0,0,0,.25)}.login-logo{width:100%;height:100%;object-fit:contain}.login-brand{position:relative;margin-top:20px;font-weight:900;font-size:21px;letter-spacing:.11em;color:#f6fbff}.login-brand small{display:block!important;margin:7px 0 0!important;color:#56d8ff!important;font-size:10px!important;letter-spacing:.18em!important}.login-copy{position:relative;margin-top:58px}.eyebrow{color:#58dfff;font-size:10px;font-weight:900;letter-spacing:.2em}.login-copy h1{margin:10px 0 13px;color:#fff;font-size:37px;line-height:1.04;letter-spacing:-.045em}.login-copy p{margin:0;color:#9bb0c4;line-height:1.75;max-width:430px}.login-features{position:relative;display:flex;gap:9px;flex-wrap:wrap;margin-top:42px}.login-features span,.login-security span{font-size:11px;color:#a9bdd0;background:rgba(255,255,255,.045);border:1px solid rgba(117,151,182,.17);padding:8px 10px;border-radius:999px}
.login-card{align-self:center;margin:28px;padding:34px;background:linear-gradient(180deg,rgba(18,30,45,.97),rgba(10,17,28,.98));border:1px solid rgba(100,136,170,.28);border-radius:24px;box-shadow:0 20px 50px rgba(0,0,0,.25)}.login-card-head{display:flex;gap:13px;align-items:center;margin-bottom:25px}.login-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,#20d4ff,#246fd9);color:#06111d;font-weight:900;font-size:26px}.login-card h2{margin:0;color:#fff;font-size:24px}.login-card p{margin:5px 0 0;color:#92a6bb}.login-card label{display:block;color:#b7c6d6;font-size:12px;font-weight:800;margin:17px 0 8px}.login-input{display:flex;align-items:center;gap:10px;background:#07111d;border:1px solid #2b425a;border-radius:13px;padding:0 14px;transition:.2s}.login-input:focus-within{border-color:#28d4ff;box-shadow:0 0 0 3px rgba(38,211,255,.12)}.login-input span{filter:saturate(.8);font-size:16px}.login-input input{width:100%;background:transparent!important;border:0!important;box-shadow:none!important;color:#f4f8fc!important;padding:14px 0;font-size:14px}.login-input input:focus{outline:none}.login-submit{width:100%;margin-top:25px;border:0;border-radius:13px;padding:15px 17px;display:flex;align-items:center;justify-content:center;gap:13px;background:linear-gradient(100deg,#1dd2ff,#177be6 56%,#5d65ff);color:#04111c;font-weight:900;font-size:14px;cursor:pointer;box-shadow:0 16px 30px rgba(24,136,232,.22);transition:.2s}.login-submit:hover{transform:translateY(-2px);filter:brightness(1.06)}.login-submit b{font-size:20px}.login-error{margin-bottom:16px;padding:12px 13px;border-radius:12px;background:rgba(231,78,100,.13);border:1px solid rgba(255,118,136,.24);color:#ffb0bb;font-size:12px}.login-security{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:22px;color:#71879c}.login-security span{padding:0;border:0;background:transparent}.login-footer{position:relative;z-index:2;margin-top:18px;color:#6e8297;font-size:10px;letter-spacing:.18em}.login-footer span{color:#35c9ef;margin:0 8px}
@media(max-width:800px){.login-shell{grid-template-columns:1fr}.login-panel{min-height:auto;padding:35px}.login-copy{margin-top:30px}.login-copy h1{font-size:30px}.login-features{margin-top:25px}.login-card{margin:0;padding:30px;border-radius:0}.login-footer{display:none}}


/* SIDEBAR FIJO: el menú completo permanece visible en todas las secciones */
.admin-sidebar{height:100vh;min-height:0;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain}
.admin-sidebar .admin-nav{display:block;flex:0 0 auto}
.admin-sidebar .admin-nav-bottom{margin-top:auto;padding-top:14px;border-top:1px solid rgba(45,67,93,.55)}
.admin-sidebar .admin-nav-bottom a{display:block}
@media(max-width:800px){.admin-sidebar{overflow-y:auto}.admin-sidebar .admin-nav-bottom{margin-top:14px}}


/* CORRECCIÓN FIDELIDAD Y PORTADAS: evita que el contenido se centre debajo del sidebar */
body > main{margin-left:235px!important;margin-right:0!important;width:calc(100% - 235px)!important;max-width:none!important;min-width:0}
@media(max-width:800px){body > main{margin-left:65px!important;width:calc(100% - 65px)!important}}

/* GOOGLE AUTHENTICATOR / TOTP */
.twofa-page{min-height:100vh;margin:0;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 20% 15%,#293a70 0,transparent 32%),radial-gradient(circle at 80% 80%,#143a42 0,transparent 28%),#08111f;color:#243142;font-family:Inter,Arial,sans-serif}
.twofa-card{width:min(100%,480px);box-sizing:border-box;background:linear-gradient(145deg,#fff,#eef1f5);border-radius:22px;padding:28px 30px 24px;box-shadow:0 30px 80px rgba(0,0,0,.38);text-align:left}
.twofa-brand{display:flex;align-items:center;gap:12px;margin-bottom:22px}.twofa-brand img{width:58px;height:58px;object-fit:contain;border-radius:12px;background:#07111d}.twofa-brand strong{display:block;letter-spacing:.08em;font-size:15px}.twofa-brand small{display:block;color:#20a8c9;font-weight:800;letter-spacing:.18em;font-size:9px;margin-top:3px}.twofa-card h1{font-size:29px;line-height:1.08;margin:8px 0 10px;color:#283443}.twofa-card p{color:#687381;line-height:1.5;margin:0 0 20px}.twofa-card label{display:block;font-weight:800;color:#566170;font-size:13px;margin:12px 0 8px}.twofa-code{width:100%;box-sizing:border-box;border:1px solid #a886ff;border-radius:16px;padding:17px 16px;text-align:center;font-size:24px;font-weight:900;letter-spacing:.28em;color:#59616b;background:#fff;outline:none;box-shadow:0 0 0 4px rgba(124,58,237,.06)}.twofa-code:focus{border-color:#6946ef;box-shadow:0 0 0 4px rgba(105,70,239,.13)}.twofa-submit{width:100%;border:0;border-radius:16px;padding:17px;margin-top:18px;color:white;font-size:15px;font-weight:900;letter-spacing:.02em;cursor:pointer;background:linear-gradient(100deg,#ff5f6d,#ff9a3d,#7752df,#3e9cff,#29b67a);box-shadow:0 10px 24px rgba(91,86,220,.22)}.twofa-back{display:block;text-align:center;margin-top:16px;color:#5d6774;text-decoration:none;font-weight:800}.twofa-badges{border-top:1px solid #dfe3e9;margin-top:20px;padding-top:15px;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.twofa-badges span{font-size:11px;color:#73808d;border:1px solid #d6dce3;border-radius:999px;padding:7px 11px;background:#f7f8fa}.qr-wrap{text-align:center;margin:12px 0}.qr-wrap img{width:190px;height:190px;padding:8px;background:#fff;border-radius:14px}.manual-secret{text-align:center;font-size:12px;color:#687381;margin-bottom:10px}.manual-secret code{display:block;word-break:break-all;margin-top:6px;padding:9px;border-radius:9px;background:#e9edf2;color:#354154}.twofa-icon{font-size:40px;margin:4px 0}
@media(max-width:520px){.twofa-page{padding:18px}.twofa-card{padding:24px 20px}.twofa-card h1{font-size:27px}}


/* =========================================================
   2FA ZONA DIGITAL GAME OVER · CONTRASTE DEL LOGO
   Negro / azul noche + cyan eléctrico + acento violeta
   ========================================================= */
.twofa-page{position:relative;overflow:hidden;background:
 radial-gradient(circle at 12% 12%,rgba(0,195,255,.18),transparent 30%),
 radial-gradient(circle at 88% 84%,rgba(105,78,255,.20),transparent 31%),
 linear-gradient(135deg,#030812 0%,#07111d 48%,#081b2b 100%)!important;color:#edf8ff!important}
.twofa-page:before,.twofa-page:after{content:"";position:fixed;pointer-events:none;border-radius:999px;filter:blur(60px);opacity:.35}.twofa-page:before{width:260px;height:260px;background:#00d4ff;left:-130px;bottom:-120px}.twofa-page:after{width:280px;height:280px;background:#6957ff;right:-120px;top:-140px}
.twofa-card{position:relative;z-index:1;width:min(100%,560px)!important;padding:34px 36px 28px!important;color:#eaf6ff!important;text-align:left!important;background:linear-gradient(150deg,rgba(12,24,38,.96),rgba(6,13,23,.98))!important;border:1px solid rgba(70,203,255,.25)!important;border-radius:26px!important;box-shadow:0 30px 90px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.04)!important}
.twofa-card:before{content:"";position:absolute;inset:0;border-radius:26px;padding:1px;background:linear-gradient(135deg,rgba(42,218,255,.48),rgba(105,86,255,.15),rgba(42,218,255,.05));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.twofa-brand{margin-bottom:20px!important}.twofa-brand img{width:62px!important;height:62px!important;padding:5px;background:#050c15!important;border:1px solid rgba(41,213,255,.28)!important;border-radius:16px!important;box-shadow:0 12px 28px rgba(0,0,0,.32)}.twofa-brand strong{color:#f5fbff!important;font-size:15px!important;letter-spacing:.13em!important}.twofa-brand small{color:#36d9ff!important}
.twofa-topline{display:flex;align-items:center;gap:8px;color:#57dfff;font-size:10px;font-weight:900;letter-spacing:.18em;margin:4px 0 14px}.twofa-dot{width:7px;height:7px;border-radius:50%;background:#24d7ff;box-shadow:0 0 15px #24d7ff}
.twofa-card h1{color:#f4fbff!important;font-size:32px!important;letter-spacing:-.025em!important;margin:0 0 10px!important}.twofa-card p{color:#9eb5c8!important;margin-bottom:20px!important}.twofa-card p b{color:#55dfff}
.qr-panel{padding:18px;border:1px solid rgba(77,117,151,.28);border-radius:20px;background:linear-gradient(145deg,rgba(7,19,31,.9),rgba(13,30,46,.7));margin:16px 0 18px}.qr-wrap{margin:0 0 12px!important}.qr-wrap img{width:190px!important;height:190px!important;padding:9px!important;background:#f8fbff!important;border-radius:16px!important;box-shadow:0 14px 35px rgba(0,0,0,.32)}
.manual-secret{color:#8fa7ba!important;margin:0!important}.manual-secret b{display:block;color:#e7f6ff;margin-bottom:5px}.manual-secret span{display:block;font-size:11px}.manual-secret code{background:#07121f!important;color:#5ee1ff!important;border:1px solid rgba(60,208,255,.16)!important;font-size:12px;letter-spacing:.08em}
.twofa-card label{color:#c8dceb!important}.twofa-code{background:#050e18!important;color:#f2fbff!important;border:1px solid #31516f!important;border-radius:16px!important;box-shadow:0 0 0 4px rgba(36,215,255,.035)!important;letter-spacing:.32em!important}.twofa-code:focus{border-color:#28d8ff!important;box-shadow:0 0 0 4px rgba(40,216,255,.12),0 0 24px rgba(40,216,255,.08)!important}.twofa-code::placeholder{color:#62758a!important;letter-spacing:.32em}
.twofa-submit{display:flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(100deg,#19d8ff,#1684e8 55%,#6958ff)!important;color:#03101a!important;border-radius:15px!important;box-shadow:0 14px 30px rgba(22,132,232,.24)!important;transition:.2s}.twofa-submit:hover{transform:translateY(-2px);filter:brightness(1.08)}.twofa-submit span{font-size:19px}
.twofa-badges{border-top:1px solid rgba(76,111,143,.22)!important}.twofa-badges span{color:#a9c0d1!important;background:#0a1522!important;border-color:#233d56!important}.twofa-back{color:#77dfff!important}.twofa-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,#1ed9ff,#286edb);color:#04111b;font-size:28px!important;font-weight:900;box-shadow:0 14px 30px rgba(25,146,231,.22);margin:0 0 14px!important}
.login-error{background:rgba(255,83,110,.11)!important;border-color:rgba(255,108,132,.3)!important;color:#ffb7c3!important}
@media(max-width:620px){.twofa-page{padding:16px!important}.twofa-card{padding:28px 20px 24px!important;border-radius:22px!important}.twofa-card h1{font-size:27px!important}.qr-wrap img{width:175px!important;height:175px!important}}

/* CORRECCIÓN DE CENTRADO 2FA: el ajuste global del panel admin no debe mover la pantalla de autenticación */
body.twofa-page > main.twofa-card{
  margin-left:0!important;
  margin-right:0!important;
  width:min(100%,560px)!important;
  max-width:560px!important;
  min-width:0!important;
}
.twofa-page{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:100vh!important;
  padding:28px!important;
}
.twofa-page > .twofa-card{
  flex:0 1 560px!important;
}
@media(max-width:620px){
  .twofa-page{padding:16px!important}
  body.twofa-page > main.twofa-card{width:100%!important;max-width:560px!important}
}

/* =========================================================
   ZONA DIGITAL · MODO ESCRITORIO COMPACTO MOVIL
   ========================================================= */

@media(max-width:700px){

    html{
        width:100%;
        max-width:100%;
        overflow-x:hidden;
    }

    body{
        width:100%;
        max-width:100%;
        overflow-x:hidden;
        background:var(--zd-bg,#060b13)!important;
    }

    /* Sidebar compacto */
    body > aside,
    aside.admin-sidebar{
        width:78px!important;
        min-width:78px!important;
        padding:18px 8px!important;
        overflow-x:hidden!important;
    }

    aside .brand{
        justify-content:center!important;
        margin:0 0 18px!important;
    }

    aside .brand img{
        width:42px!important;
        height:42px!important;
    }

    aside .brand strong,
    aside .brand small,
    aside .brand div{
        display:none!important;
    }

    aside a{
        width:100%!important;
        min-height:40px;
        padding:9px 4px!important;
        margin:4px 0!important;
        text-align:center!important;
        font-size:0!important;
        white-space:nowrap;
    }

    aside a:first-letter{
        font-size:15px;
    }

    /* Contenido principal */
    body > main{
        margin-left:78px!important;
        width:calc(100% - 78px)!important;
        min-width:0!important;
        max-width:none!important;
        padding:20px 12px 30px!important;
        box-sizing:border-box!important;
    }

    header{
        gap:10px;
        margin-bottom:18px!important;
        padding-bottom:15px!important;
    }

    header h1{
        font-size:22px!important;
        line-height:1.1!important;
    }

    header p{
        font-size:11px!important;
        line-height:1.35!important;
        margin-top:5px!important;
    }

    header .btn{
        padding:9px 10px!important;
        font-size:10px!important;
        white-space:nowrap;
    }

    /* Dashboard */
    .stats{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
        margin-bottom:12px!important;
    }

    .stats div{
        padding:12px!important;
        border-radius:13px!important;
    }

    .stats small{
        font-size:8px!important;
        line-height:1.2!important;
    }

    .stats b{
        font-size:21px!important;
        margin-top:5px!important;
    }

    .panel{
        padding:14px!important;
        margin-bottom:12px!important;
        border-radius:14px!important;
    }

    .panel h1,
    .panel h2{
        font-size:18px!important;
    }

    .panel p{
        font-size:11px!important;
        line-height:1.4!important;
    }

    /* Botones rápidos */
    .quick{
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:6px!important;
    }

    .quick a{
        padding:8px 6px!important;
        font-size:9px!important;
        text-align:center;
    }

    /* Tablas: conservamos el formato escritorio,
       pero el desplazamiento queda encerrado en el panel */
    .panel{
        overflow:hidden!important;
    }

    .panel table{
        width:100%!important;
        min-width:520px!important;
        font-size:9px!important;
    }

    .panel table th,
    .panel table td{
        padding:8px 6px!important;
        font-size:9px!important;
    }

    .panel .inventory-table{
        min-width:620px!important;
    }

    /* Solo la tabla puede desplazarse, no toda la página */
    .panel:has(table){
        overflow-x:auto!important;
        -webkit-overflow-scrolling:touch;
    }

    /* Inventario */
    .stock-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
    }

    .stock-grid .stock-card{
        padding:11px!important;
        border-radius:13px!important;
    }

    .stock-grid .stock-card small{
        font-size:8px!important;
    }

    .stock-number,
    .stock-units b{
        font-size:19px!important;
    }

    /* Formularios */
    .formpage{
        width:100%!important;
        max-width:none!important;
    }

    .formbox{
        padding:16px!important;
        border-radius:14px!important;
    }

    .two{
        grid-template-columns:1fr!important;
        gap:8px!important;
    }

    .variant-row{
        grid-template-columns:minmax(0,1fr) 75px 70px!important;
        gap:5px!important;
    }

    .formbox input,
    .formbox textarea,
    .formbox select{
        font-size:14px!important;
        padding:10px!important;
    }

    .save{
        float:none!important;
        width:100%;
    }

    /* Categorías */
    .categories-page{
        width:100%!important;
        max-width:none!important;
    }

    .catalog-grid{
        grid-template-columns:1fr!important;
    }

    /* Acciones */
    .actions{
        gap:4px!important;
    }

    .actions a,
    .actions button{
        padding:6px 7px!important;
        font-size:9px!important;
        margin-left:0!important;
    }
}


/* =========================================================
   ZONA DIGITAL · MENU LATERAL PLEGABLE
   ========================================================= */

.admin-menu-toggle{
    position:fixed!important;
    z-index:99999!important;
    top:18px!important;
    left:246px!important;
    width:38px!important;
    height:38px!important;
    padding:0!important;
    border:1px solid #30445c!important;
    border-radius:10px!important;
    background:#0d1724!important;
    color:#dff7ff!important;
    font-size:20px!important;
    line-height:36px!important;
    text-align:center!important;
    cursor:pointer!important;
    box-shadow:0 8px 24px rgba(0,0,0,.25)!important;
    transition:left .22s ease,transform .22s ease,background .2s ease!important;
}

.admin-menu-toggle:hover{
    background:#162638!important;
    transform:scale(1.04);
}

body.admin-menu-collapsed > aside.admin-sidebar{
    width:0!important;
    min-width:0!important;
    padding-left:0!important;
    padding-right:0!important;
    border-right:0!important;
    overflow:hidden!important;
}

body.admin-menu-collapsed > main{
    margin-left:0!important;
    margin-right:0!important;
    width:100%!important;
    max-width:none!important;
}

body.admin-menu-collapsed .admin-menu-toggle{
    left:14px!important;
}

@media(max-width:700px){

    .admin-menu-toggle{
        top:10px!important;
        left:88px!important;
        width:34px!important;
        height:34px!important;
        line-height:32px!important;
        font-size:18px!important;
    }

    body.admin-menu-collapsed .admin-menu-toggle{
        left:10px!important;
    }

    body.admin-menu-collapsed > main{
        padding-left:12px!important;
        padding-right:12px!important;
    }

    body:not(.admin-menu-collapsed) > main{
        margin-left:78px!important;
        width:calc(100% - 78px)!important;
    }
}

/* =========================================================
   ZONA DIGITAL · CATEGORIAS ADMIN · ANCHO COMPLETO
   ========================================================= */

.categories-page{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
}

.categories-page .formbox{
    width:100%!important;
    max-width:none!important;
    box-sizing:border-box!important;
}

/* Formularios superiores */
.categories-page .catalog-grid{
    width:100%!important;
    grid-template-columns:
        repeat(2,minmax(0,1fr))!important;
    gap:16px!important;
}

/* Tarjetas */
.categories-page .catalog-card{
    width:100%!important;
    box-sizing:border-box!important;
}

/* Listas */
.categories-page .category-list{
    width:100%!important;
}

.categories-page .category-item{
    width:100%!important;
    box-sizing:border-box!important;
}


/* Más espacio visual en escritorio */
@media(min-width:1101px){

    .categories-page .formbox{
        padding:28px 30px!important;
    }

    .categories-page .catalog-card{
        padding:20px!important;
    }

    .categories-page .category-item{
        min-height:62px!important;
        padding:14px 16px!important;
    }
}


/* Tablet */
@media(max-width:900px){

    .categories-page .catalog-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr))!important;
    }
}


/* Móvil */
@media(max-width:700px){

    .categories-page{
        width:100%!important;
        max-width:none!important;
    }

    .categories-page .catalog-grid{
        grid-template-columns:1fr!important;
        gap:12px!important;
    }

    .categories-page .formbox{
        padding:16px!important;
    }

    .categories-page .catalog-card{
        padding:15px!important;
    }

    .categories-page .category-item{
        width:100%!important;
    }
}


/* =========================================================
   ZONA DIGITAL · CATEGORIAS ADMIN · WIDTH FIX V2
   Liberar completamente el contenedor principal
   ========================================================= */

body > main.formpage.categories-page{
    display:block!important;

    width:calc(100vw - 36px)!important;
    max-width:none!important;

    margin-left:18px!important;
    margin-right:18px!important;

    padding-left:0!important;
    padding-right:0!important;

    box-sizing:border-box!important;
}


/* Caja principal */
body > main.formpage.categories-page > .formbox{
    display:block!important;

    width:100%!important;
    max-width:none!important;

    margin-left:0!important;
    margin-right:0!important;

    box-sizing:border-box!important;
}


/* Formularios superiores */
body > main.formpage.categories-page .catalog-grid{
    width:100%!important;

    display:grid!important;

    grid-template-columns:
        repeat(2,minmax(0,1fr))!important;

    gap:18px!important;
}


/* Tarjetas superiores */
body > main.formpage.categories-page .catalog-card{
    width:100%!important;
    min-width:0!important;

    box-sizing:border-box!important;
}


/* Listas */
body > main.formpage.categories-page .category-list{
    width:100%!important;
}

body > main.formpage.categories-page .category-item{
    width:100%!important;
    min-width:0!important;

    box-sizing:border-box!important;
}


/* Escritorio grande */
@media(min-width:1200px){

    body > main.formpage.categories-page{
        width:calc(100vw - 48px)!important;

        margin-left:24px!important;
        margin-right:24px!important;
    }

    body > main.formpage.categories-page > .formbox{
        padding:30px!important;
    }

    body > main.formpage.categories-page .catalog-card{
        padding:21px!important;
    }

    body > main.formpage.categories-page .category-item{
        min-height:64px!important;

        padding:
            15px
            17px!important;
    }
}


/* Tablet */
@media(max-width:900px){

    body > main.formpage.categories-page{
        width:calc(100vw - 28px)!important;

        margin-left:14px!important;
        margin-right:14px!important;
    }
}


/* Móvil */
@media(max-width:700px){

    body > main.formpage.categories-page{
        width:calc(100vw - 20px)!important;

        margin-left:10px!important;
        margin-right:10px!important;
    }

    body > main.formpage.categories-page > .formbox{
        padding:15px!important;
    }

    body > main.formpage.categories-page .catalog-grid{
        grid-template-columns:1fr!important;
        gap:12px!important;
    }

    body > main.formpage.categories-page .category-item{
        width:100%!important;
    }
}


/* =========================================================
   ZONA DIGITAL · MENÚ ESCRITORIO FIJO
   El menú permanece abierto y fijo en computadora.
   El comportamiento móvil no se modifica.
   ========================================================= */

@media (min-width: 901px){

  /* Ocultar botón de contraer/expandir */
  .admin-menu-toggle{
    display:none !important;
  }

  /* Menú lateral siempre abierto */
  .admin-sidebar{
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:220px !important;
    min-width:220px !important;
    max-width:220px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;

    /* Ocultar visualmente la barra, conservar scroll con rueda */
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
  }

  .admin-sidebar::-webkit-scrollbar{
    width:0 !important;
    height:0 !important;
    display:none !important;
  }

  /* Evitar que el estado colapsado del localStorage
     vuelva a reducir el menú en escritorio */
  body.admin-menu-collapsed .admin-sidebar{
    width:220px !important;
    min-width:220px !important;
    max-width:220px !important;
  }

  /* El contenido conserva espacio para el menú */
  body.admin-menu-collapsed main,
  body.admin-menu-collapsed .admin-main,
  body.admin-menu-collapsed .admin-content{
    margin-left:220px !important;
  }

}


/* =========================================================
   ZONA DIGITAL · AJUSTE DE CONTENIDO EN ESCRITORIO
   Menú fijo + contenido con respiración lateral
   ========================================================= */

@media (min-width: 901px){

  /* Separación visual entre menú y contenido */
  main{
    margin-left:220px !important;
    padding-left:36px !important;
    padding-right:36px !important;
    box-sizing:border-box !important;
  }

  /* Evita que las páginas queden pegadas al borde */
  main.products-page{
    margin-left:220px !important;
    margin-right:0 !important;
    padding-left:36px !important;
    padding-right:36px !important;
    box-sizing:border-box !important;
    width:auto !important;
    max-width:none !important;
  }

  /* El contenido de Productos queda centrado
     dentro del espacio disponible */
  main.products-page > .products-page-header,
  main.products-page > .products-overview{
    width:100% !important;
    max-width:1320px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

}


/* =========================================================
   ZONA DIGITAL · CENTRADO FINAL DEL CONTENIDO
   ========================================================= */

@media (min-width: 901px){

  main.products-page{
    padding-left:56px !important;
    padding-right:56px !important;
  }

  main.products-page > .products-page-header,
  main.products-page > .products-overview{
    max-width:1280px !important;
  }

}


/* =========================================================
   ZONA DIGITAL · ENCABEZADO DASHBOARD
   Corrección de texto y barra superior
   ========================================================= */

@media (min-width: 901px){

  /* Barra superior del Dashboard */
  main > header{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    box-sizing:border-box !important;
    min-height:86px !important;
    margin:0 0 26px !important;
    padding:20px 24px !important;
    overflow:hidden !important;
    border-radius:20px !important;
  }

  /* Contenedor del texto */
  main > header > div:first-child{
    position:relative !important;
    z-index:2 !important;
    min-width:0 !important;
  }

  /* Título Dashboard */
  main > header h1{
    display:block !important;
    position:relative !important;
    margin:0 !important;
    padding:0 !important;
    font-size:30px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:-.8px !important;
    overflow:visible !important;
  }

  /* Descripción */
  main > header p{
    display:block !important;
    margin:6px 0 0 !important;
    padding:0 !important;
    font-size:11px !important;
    line-height:1.35 !important;
  }

  /* Botón Nuevo producto */
  main > header .btn{
    position:relative !important;
    z-index:3 !important;
    flex-shrink:0 !important;
  }

}

/* Ajuste adicional para evitar que reglas globales
   corten visualmente el encabezado */
main > header h1,
main > header p{
  max-width:none !important;
  height:auto !important;
  transform:none !important;
}


/* =========================================================
   ZONA DIGITAL · PRODUCT EDITOR · ASIDE CORRECTO
   El aside interno del editor NO es el menú lateral.
   ========================================================= */

body > main.product-editor .product-editor-grid > aside{
    position:static!important;
    left:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;

    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    min-height:0!important;

    margin:0!important;
    padding:0!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    overflow:visible!important;
    z-index:auto!important;

    box-sizing:border-box!important;
}

body > main.product-editor .product-editor-grid > aside .editor-card{
    width:100%!important;
    box-sizing:border-box!important;
}


/* =========================================================
   ZONA DIGITAL · PRODUCT EDITOR · VARIANTES MOBILE FINAL
   ========================================================= */

@media (max-width:760px){

    body > main.product-editor .variant-row{
        display:grid!important;

        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr)!important;

        grid-template-areas:
            "name name"
            "price stock"
            "delivery quantity"
            "delete delete"!important;

        gap:10px!important;
        width:100%!important;
        min-width:0!important;
        padding:14px!important;
        box-sizing:border-box!important;
    }

    body > main.product-editor .variant-row > .variant-field,
    body > main.product-editor .variant-row > .digital-quantity-field{
        width:100%!important;
        min-width:0!important;
        max-width:none!important;
        box-sizing:border-box!important;
    }

    body > main.product-editor .variant-row > .variant-field:nth-of-type(1){
        grid-area:name!important;
    }

    body > main.product-editor .variant-row > .variant-field:nth-of-type(2){
        grid-area:price!important;
    }

    body > main.product-editor .variant-row > .variant-field:nth-of-type(3){
        grid-area:stock!important;
    }

    body > main.product-editor .variant-row > .variant-field:nth-of-type(4){
        grid-area:delivery!important;
    }

    body > main.product-editor .variant-row > .digital-quantity-field{
        grid-area:quantity!important;
    }

    body > main.product-editor .variant-row input,
    body > main.product-editor .variant-row select{
        width:100%!important;
        max-width:none!important;
        min-width:0!important;
        box-sizing:border-box!important;
    }

    body > main.product-editor .variant-row > .variant-delete{
        grid-area:delete!important;

        position:static!important;
        width:100%!important;
        height:40px!important;
        margin:0!important;
    }
}

/* Teléfonos pequeños: conservar dos columnas para los campos */
@media (max-width:460px){

    body > main.product-editor .variant-row{
        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr)!important;

        grid-template-areas:
            "name name"
            "price stock"
            "delivery quantity"
            "delete delete"!important;
    }

    body > main.product-editor .variant-row > .variant-field,
    body > main.product-editor .variant-row > .digital-quantity-field{
        width:100%!important;
    }
}


/* =========================================================
   ZONA DIGITAL · VARIANTES · ELIMINAR MOBILE
   Botón compacto para no desperdiciar espacio.
   ========================================================= */

@media (max-width:760px){

    body > main.product-editor .variant-row > .variant-delete{
        width:44px!important;
        height:40px!important;
        justify-self:end!important;
        align-self:center!important;

        grid-area:delete!important;

        border-radius:10px!important;
        padding:0!important;
        font-size:18px!important;
    }

    body > main.product-editor .variant-row{
        grid-template-areas:
            "name name"
            "price stock"
            "delivery quantity"
            "delete delete"!important;
    }
}


/* =========================================================
   ZONA DIGITAL · PRODUCT EDITOR · DIGITAL vs MANUAL
   Códigos/unidad se mantiene visible, pero indica su uso.
   ========================================================= */

body > main.product-editor
.variant-row:not(:has(select[name="variant_delivery_type"] option[value="DIGITAL"]:checked))
.digital-quantity-field{
    opacity:.42!important;
    filter:saturate(.45)!important;
}

body > main.product-editor
.variant-row:not(:has(select[name="variant_delivery_type"] option[value="DIGITAL"]:checked))
.digital-quantity-field span{
    color:#667482!important;
}

body > main.product-editor
.variant-row:not(:has(select[name="variant_delivery_type"] option[value="DIGITAL"]:checked))
.digital-quantity-field input{
    color:#7d8994!important;
    border-color:#263746!important;
    box-shadow:none!important;
}

body > main.product-editor
.variant-row:has(select[name="variant_delivery_type"] option[value="DIGITAL"]:checked)
.digital-quantity-field{
    opacity:1!important;
    filter:none!important;
}

body > main.product-editor
.variant-row:has(select[name="variant_delivery_type"] option[value="DIGITAL"]:checked)
.digital-quantity-field input{
    color:#f4f4f7!important;
}

