:root{color-scheme:light;--bg:#f6f7fb;--bg-elevated:#fbfcfe;--surface:#fff;--surface-soft:#f3f5f9;--surface-hover:#eef1f7;--text:#131722;--text-soft:#4c5568;--muted:#7b8497;--line:#e3e7ef;--line-strong:#d4dae5;--primary:#6c5ce7;--primary-hover:#5b4bd6;--primary-soft:#eeebff;--accent:#00a99d;--success:#11976b;--success-soft:#e8f8f1;--danger:#dc4c64;--danger-soft:#fff0f3;--warning:#d58a18;--warning-soft:#fff6e6;--info:#3378df;--info-soft:#edf4ff;--shadow-xs:0 1px 2px #11182708;--shadow-sm:0 2px 8px #1720330a,0 1px 2px #1720330a;--shadow-md:0 12px 30px #1720330d,0 2px 7px #1720330a;--shadow-lg:0 26px 70px #17203318;--radius-sm:9px;--radius:14px;--radius-lg:20px;--radius-xl:28px;--sidebar:264px;--ease:cubic-bezier(.22,1,.36,1)}

html[data-theme=dark]{color-scheme:dark;--bg:#0b0e15;--bg-elevated:#0e121b;--surface:#131823;--surface-soft:#191f2c;--surface-hover:#202737;--text:#f3f5fa;--text-soft:#b8c0d1;--muted:#828da4;--line:#252d3d;--line-strong:#343e52;--primary:#8d7cf6;--primary-hover:#a292ff;--primary-soft:#272141;--accent:#2fc7ba;--success:#43c995;--success-soft:#142e27;--danger:#fa7185;--danger-soft:#351a23;--warning:#f2b84b;--warning-soft:#322919;--info:#71a7ff;--info-soft:#182841;--shadow-xs:0 1px 2px #0004;--shadow-sm:0 3px 10px #0003;--shadow-md:0 15px 36px #0004;--shadow-lg:0 30px 80px #0007}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 14px/1.55 'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;transition:background .25s,color .25s}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 85% -10%,color-mix(in srgb,var(--primary) 8%,transparent),transparent 32%);z-index:-1}
h1,h2,h3,h4,.brand{font-family:Manrope,sans-serif}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
img{display:block;max-width:100%}
.icon{width:18px;height:18px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.icon-sm{width:15px;height:15px}
.icon-lg{width:24px;height:24px}
.container{width:min(1240px,calc(100% - 40px));margin:auto}
.eyebrow{display:flex;align-items:center;gap:7px;color:var(--primary);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.muted{color:var(--muted)}
.header{position:sticky;top:0;z-index:40;border-bottom:1px solid color-mix(in srgb,var(--line) 85%,transparent);background:color-mix(in srgb,var(--bg-elevated) 82%,transparent);backdrop-filter:blur(20px) saturate(140%)}
.nav{height:72px;display:flex;align-items:center;gap:26px}
.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:800;letter-spacing:-.5px}
.brand-mark{width:34px;height:34px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--primary),#9a6cff);border-radius:10px;box-shadow:0 7px 16px color-mix(in srgb,var(--primary) 28%,transparent)}
.brand i{font-style:normal;color:var(--primary)}
.navlinks{display:flex;align-items:center;gap:4px;margin-left:auto}
.navlinks a{padding:9px 13px;border-radius:9px;color:var(--text-soft);font-weight:600;transition:.2s}
.navlinks a:hover{color:var(--text);background:var(--surface-hover)}
.nav-actions{display:flex;align-items:center;gap:8px}
.icon-btn{width:40px;height:40px;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--text-soft);cursor:pointer;transition:.2s}
.icon-btn:hover{color:var(--text);border-color:var(--line-strong);transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.btn{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;border:1px solid transparent;border-radius:10px;background:var(--primary);color:#fff;font-weight:700;cursor:pointer;box-shadow:0 5px 13px color-mix(in srgb,var(--primary) 20%,transparent);transition:transform .18s,box-shadow .18s,background .18s,border .18s}
.btn:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 8px 20px color-mix(in srgb,var(--primary) 28%,transparent)}
.btn:active{transform:translateY(0) scale(.98)}
.btn.secondary,.btn.outline{background:var(--surface);color:var(--text);border-color:var(--line);box-shadow:var(--shadow-xs)}
.btn.secondary:hover,.btn.outline:hover{background:var(--surface-hover);border-color:var(--line-strong);box-shadow:var(--shadow-sm)}
.btn.ghost{background:transparent;color:var(--text-soft);box-shadow:none}
.btn.danger{background:var(--danger);box-shadow:none}
.btn-sm{min-height:34px;padding:0 11px;font-size:13px}
.hero{padding:54px 0 38px}
.hero-card{min-height:480px;padding:clamp(34px,6vw,76px);border:1px solid #ffffff1a;border-radius:var(--radius-xl);background:linear-gradient(125deg,#11162a 3%,#31245d 52%,#5850c8 100%);color:#fff;display:flex;align-items:center;position:relative;overflow:hidden;box-shadow:var(--shadow-lg)}
.hero-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 30%,#9d91ff55,transparent 26%),radial-gradient(circle at 95% 100%,#18cabe38,transparent 32%)}
.hero-card:after{content:"";position:absolute;width:420px;height:420px;border:1px solid #ffffff1c;border-radius:50%;right:-100px;top:-70px;box-shadow:0 0 0 55px #ffffff08,0 0 0 110px #ffffff05}
.hero-content{position:relative;z-index:1;max-width:680px}
.hero h1{font-size:clamp(40px,6vw,72px);line-height:1.02;letter-spacing:-.055em;margin:17px 0 22px}
.hero p{max-width:590px;font-size:18px;line-height:1.65;color:#d9dded}
.hero-actions{display:flex;gap:10px;margin-top:30px}
.section{padding:42px 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:24px}
.section h1,.section h2{margin:3px 0 0;letter-spacing:-.035em}
.section h2{font-size:31px}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.card{position:relative;background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--surface) 94%,var(--primary)));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
.card:hover{border-color:color-mix(in srgb,var(--primary) 35%,var(--line));box-shadow:var(--shadow-md);transform:translateY(-4px)}
.card-body{padding:18px}
.card h3{font-size:16px;letter-spacing:-.02em;margin:10px 0 8px}
.product-image{position:relative;aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,var(--surface-soft),color-mix(in srgb,var(--primary) 8%,var(--surface-soft)));color:var(--muted)}
.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease)}
.card:hover .product-image img{transform:scale(1.055)}
.product-badges{position:absolute;top:12px;left:12px;z-index:2;display:flex;gap:6px}
.badge{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:99px;background:var(--primary-soft);color:var(--primary);font-size:11px;font-weight:700;letter-spacing:.02em}
.badge.success{background:var(--success-soft);color:var(--success)}
.badge.warning{background:var(--warning-soft);color:var(--warning)}
.badge.danger{background:var(--danger-soft);color:var(--danger)}
.price{font:800 20px/1.3 Manrope;color:var(--text);letter-spacing:-.03em}
.old{text-decoration:line-through;color:var(--muted);font-size:12px}
.empty{grid-column:1/-1;min-height:230px;padding:42px;display:grid;place-items:center;text-align:center;border:1px dashed var(--line-strong);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--surface) 62%,transparent);color:var(--muted)}
.empty-icon{width:48px;height:48px;margin:0 auto 14px;display:grid;place-items:center;border-radius:14px;background:var(--primary-soft);color:var(--primary)}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm)}
.catalog-layout{display:grid;grid-template-columns:265px minmax(0,1fr);gap:24px}
.filter-panel{position:sticky;top:96px;align-self:start}
.field{display:grid;gap:7px;margin-bottom:17px}
.field label{font-size:12px;font-weight:700;color:var(--text-soft)}
.input,select,textarea{width:100%;min-height:43px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:10px;background:var(--bg-elevated);color:var(--text);outline:0;transition:border .2s,box-shadow .2s,background .2s}
.input::placeholder,textarea::placeholder{color:var(--muted)}
.input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb,var(--primary) 35%,var(--line))}
.input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 14%,transparent);background:var(--surface)}
textarea{min-height:130px;resize:vertical}
.input-wrap{position:relative}
.input-wrap .icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted)}
.input-wrap .input{padding-left:39px}
.row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
.pagination{display:flex;gap:7px;justify-content:center;margin:32px}
.pagination a{min-width:37px;height:37px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:var(--surface);font-weight:600;transition:.2s}
.pagination a:hover{border-color:var(--primary);color:var(--primary)}
.alert{display:flex;align-items:center;gap:10px;padding:13px 15px;border:1px solid color-mix(in srgb,var(--success) 25%,transparent);border-radius:11px;background:var(--success-soft);color:var(--success);font-weight:600;margin-bottom:18px;animation:slide-in .4s var(--ease)}
.alert.error{background:var(--danger-soft);color:var(--danger);border-color:color-mix(in srgb,var(--danger) 25%,transparent)}
.footer{margin-top:70px;padding:48px 0;border-top:1px solid var(--line);background:var(--bg-elevated);color:var(--muted)}

/* Enterprise shell */.admin{display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);min-height:100vh;transition:grid-template-columns .35s var(--ease)}
.admin.collapsed{--sidebar:78px}
.sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:18px 14px;border-right:1px solid var(--line);background:color-mix(in srgb,var(--bg-elevated) 92%,transparent);backdrop-filter:blur(18px);z-index:30;overflow:hidden}
.sidebar-top{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 6px}
.sidebar .brand-text,.nav-label,.nav-group-label,.profile-copy{white-space:nowrap;transition:opacity .18s}
.admin.collapsed .brand-text,.admin.collapsed .nav-label,.admin.collapsed .nav-group-label,.admin.collapsed .profile-copy{opacity:0;pointer-events:none;width:0}
.sidebar-toggle{border:0;background:transparent;color:var(--muted);cursor:pointer;padding:7px;border-radius:8px}
.sidebar-toggle:hover{background:var(--surface-hover);color:var(--text)}
.sidebar-toggle .icon{transition:transform .3s var(--ease)}
.admin.collapsed .sidebar-top{justify-content:center}
.admin.collapsed .sidebar .brand-name{display:none}
.admin.collapsed .sidebar-toggle{position:absolute;top:76px;left:23px;width:32px;height:32px;display:grid;place-items:center;padding:0;border:1px solid var(--line);background:var(--surface);color:var(--primary);box-shadow:var(--shadow-sm);z-index:3}
.admin.collapsed .sidebar-toggle .icon{transform:rotate(180deg)}
.admin.collapsed .side-search{margin-top:50px}
.side-search{height:40px;margin:15px 2px 7px;padding:0 11px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--muted);overflow:hidden}
.side-search input{min-width:0;width:100%;padding:0;border:0;outline:0;background:transparent;color:var(--text);white-space:nowrap}.side-search input::placeholder{color:var(--muted)}
.admin-search-results{position:absolute;right:88px;top:58px;width:min(400px,calc(100vw - 30px));max-height:360px;overflow:auto;padding:7px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:var(--shadow-lg);z-index:50}.admin-search-results[hidden]{display:none}.admin-search-result{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:9px;color:var(--text-soft);font-weight:600}.admin-search-result:hover,.admin-search-result.active{background:var(--primary-soft);color:var(--primary)}.admin-search-empty{padding:20px;text-align:center;color:var(--muted)}
.sidebar-nav{display:grid;gap:3px;margin-top:12px;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:4px;padding-bottom:12px;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
.sidebar-nav::-webkit-scrollbar{width:5px}
.sidebar-nav::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:99px}
.sidebar-nav::-webkit-scrollbar-track{background:transparent}
.nav-group-label{margin:19px 12px 7px;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.sidebar-nav a{height:42px;padding:0 11px;display:flex;align-items:center;gap:12px;border-radius:10px;color:var(--text-soft);font-weight:600;white-space:nowrap;transition:.2s}
.sidebar-nav a:hover{background:var(--surface-hover);color:var(--text)}
.sidebar-nav a.active{background:var(--primary-soft);color:var(--primary)}
.sidebar-nav a.active:before{content:"";position:absolute;left:0;width:3px;height:20px;border-radius:0 5px 5px 0;background:var(--primary)}
.sidebar-footer{margin-top:auto;flex:0 0 auto;padding-top:6px;background:inherit}
.profile{display:flex;align-items:center;gap:10px;padding:10px 8px;border-top:1px solid var(--line)}
.avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(145deg,var(--primary),#a168f5);color:white;font-weight:800}
.profile-copy{display:grid;line-height:1.3;font-size:12px}
.profile-copy small{color:var(--muted)}
.admin-content{min-width:0}
.admin-header{height:68px;padding:0 30px;display:flex;align-items:center;gap:18px;position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(18px)}
.breadcrumbs{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}
.header-search{width:min(400px,40vw);margin-left:auto}
.admin-main{padding:30px}
.page-title{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:24px}
.page-title h1{font-size:27px;letter-spacing:-.04em;margin:3px 0 0}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.metric{padding:20px}
.metric:hover{transform:translateY(-2px)}
.metric-top{display:flex;align-items:center;justify-content:space-between}
.metric-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:11px;background:var(--primary-soft);color:var(--primary)}
.metric strong{display:block;font:800 29px/1.2 Manrope;letter-spacing:-.04em;margin:18px 0 4px}
.dashboard-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;margin-top:18px}
.activity-list{display:grid}
.activity-item{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.activity-item:last-child{border:0}
.table-wrap{overflow:auto;padding:0}
.table-toolbar{padding:15px;display:flex;gap:10px;border-bottom:1px solid var(--line)}
.table{width:100%;border-collapse:collapse}
.table th{height:43px;padding:0 16px;text-align:left;background:var(--surface-soft);color:var(--muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.table td{padding:14px 16px;border-top:1px solid var(--line);white-space:nowrap}
.table tbody tr{transition:background .15s}
.table tbody tr:hover{background:var(--surface-hover)}
.actions{display:flex;gap:6px}
.form-section{padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.form-section h3{margin:0 0 4px;font-size:15px}
.form-section>p{margin:0 0 18px;color:var(--muted);font-size:13px}
.checks{display:flex;gap:18px;flex-wrap:wrap}
.check{display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft);cursor:pointer}
.login{min-height:100vh;display:grid;grid-template-columns:minmax(440px,1.05fr) minmax(430px,.95fr);background:var(--bg-elevated)}
.login-visual{position:relative;overflow:hidden;padding:60px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,#11162a,#29214d 55%,#5145b8);color:#fff}
.login-visual:before{content:"";position:absolute;width:580px;height:580px;border:1px solid #ffffff17;border-radius:50%;right:-230px;top:-190px;box-shadow:0 0 0 80px #ffffff08,0 0 0 160px #ffffff05}
.login-visual:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 85%,#25c8ba33,transparent 28%)}
.login-quote{position:relative;z-index:1;max-width:570px}
.login-quote h1{font-size:clamp(38px,4vw,62px);line-height:1.05;letter-spacing:-.055em;margin:0 0 20px}
.login-quote p{font-size:17px;color:#cdd2e5}
.login-form-area{display:grid;place-items:center;padding:40px}
.login-card{width:min(430px,100%)}
.login-card h2{font-size:28px;letter-spacing:-.04em;margin:34px 0 8px}
.login-card>.muted{margin-bottom:28px}
.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--muted);cursor:pointer;padding:7px}
.remember{display:flex;align-items:center;justify-content:space-between;margin:5px 0 20px;font-size:13px}
.login-foot{margin-top:24px;text-align:center}
.product-detail{display:grid;grid-template-columns:1.08fr .92fr;gap:42px;margin-top:24px}
.product-gallery{position:sticky;top:95px;align-self:start}
.product-main-image{aspect-ratio:1;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:var(--surface-soft);display:grid;place-items:center}
.product-main-image img{width:100%;height:100%;object-fit:cover}
.product-info h1{font-size:clamp(34px,4vw,52px);line-height:1.08;letter-spacing:-.05em;margin:14px 0}
.product-price{padding:18px 0;border-block:1px solid var(--line);margin:22px 0}
.product-actions{display:flex;gap:9px;flex-wrap:wrap}
.detail-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}
.detail-chip{padding:12px;border-radius:10px;background:var(--surface-soft);font-size:12px}
.detail-chip b{display:block;margin-bottom:2px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.07em}
@keyframes slide-in{from{opacity:0;transform:translateY(-8px)}
to{opacity:1;transform:none}
}
@keyframes fade-up{from{opacity:0;transform:translateY(10px)}
to{opacity:1;transform:none}
}
.animate-in{animation:fade-up .55s var(--ease) both}
.skeleton{background:linear-gradient(90deg,var(--surface-soft),var(--surface-hover),var(--surface-soft));background-size:200%;animation:shimmer 1.4s infinite}
@keyframes shimmer{to{background-position:-200%}
}

@media(max-width:1050px){.grid{grid-template-columns:repeat(3,1fr)}
.admin{--sidebar:78px}
.brand-text,.nav-label,.nav-group-label,.profile-copy{opacity:0;width:0}
.dashboard-grid{grid-template-columns:1fr}
.login{grid-template-columns:1fr}
.login-visual{display:none}
}
@media(max-width:800px){.grid{grid-template-columns:repeat(2,1fr)}
.catalog-layout,.product-detail{grid-template-columns:1fr}
.filter-panel,.product-gallery{position:static}
.admin{display:block}
.sidebar{position:fixed;left:0;width:min(300px,86vw);transform:translateX(-105%);transition:transform .3s var(--ease);box-shadow:var(--shadow-lg);visibility:hidden}
.admin.mobile-open .sidebar{left:0}
.admin.mobile-open .sidebar{transform:none;visibility:visible}
.admin.collapsed .sidebar-top{justify-content:space-between}
.admin.collapsed .sidebar-toggle{position:static;width:auto;height:auto;padding:7px;border:0;background:transparent;box-shadow:none}
.admin.collapsed .sidebar-toggle .icon{transform:none}
.sidebar-backdrop{position:fixed;inset:0;z-index:25;display:block;border:0;background:#070a12a8;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;cursor:pointer}
.admin.mobile-open .sidebar-backdrop{opacity:1;visibility:visible}
body.admin-menu-open{overflow:hidden;touch-action:none}
.admin-header{padding:0 18px}
.header-search{display:none}
.admin-main{padding:22px 18px}
.metrics{grid-template-columns:repeat(2,1fr)}
.row{grid-template-columns:1fr}
.sidebar .brand-text,.sidebar .nav-label,.sidebar .nav-group-label,.sidebar .profile-copy{opacity:1;width:auto}
.mobile-menu{display:inline-grid!important}
}
@media(max-width:560px){.container{width:min(100% - 28px,1240px)}
.navlinks{display:none}
.hero{padding-top:24px}
.hero-card{min-height:430px;padding:30px 25px}
.hero h1{font-size:43px}
.hero-actions,.page-title{align-items:stretch;flex-direction:column}
.grid,.metrics,.detail-list{grid-template-columns:1fr}
.section{padding:30px 0}
.admin-main{padding:18px 14px}
.table td,.table th{padding-inline:12px}
.login-form-area{padding:25px}
.product-info h1{font-size:36px}
}

.catalog-subcategories{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-14px 0 24px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft)}
.catalog-subcategories-label{margin-right:3px;color:var(--text-soft);font-size:12px;font-weight:800}
.catalog-subcategory-link{padding:6px 11px;border-radius:999px;color:var(--text-soft);font-size:12px;font-weight:700;transition:.2s}
.catalog-subcategory-link:hover,.catalog-subcategory-link.active{background:var(--surface);color:var(--primary);box-shadow:var(--shadow-xs)}

form[action$="/admin3d/categorias/salvar"] input[name="displayOrder"]{height:43px;min-height:43px;align-self:start}
