:root{--navy:#0c1a37;--blue:#2263df;--light:#f4f7fb;--ink:#1e2c44}*{box-sizing:border-box}[hidden]{display:none!important}.catalog-hero{padding:95px 0 65px;background:linear-gradient(135deg,#0b1d41,#144c90);color:white}.catalog-hero.small{padding:80px 0 55px}.catalog-hero h1{color:white;font-size:clamp(30px,4vw,54px);margin:12px 0}.catalog-hero p{color:#d1e2f6}.catalog-hero form{display:flex;gap:8px;margin-top:22px;max-width:750px}.catalog-hero input{flex:1;min-width:0;padding:15px;border:0;border-radius:8px}.catalog-layout{display:grid;grid-template-columns:225px minmax(0,1fr);gap:35px}.catalog-sidebar{border:1px solid #e2e9f3;border-radius:12px;padding:20px;height:max-content}.catalog-sidebar a{display:block;padding:11px 0;text-decoration:none;color:#45556f;border-bottom:1px solid #edf0f6}.catalog-main h2{display:flex;justify-content:space-between;align-items:center}.catalog-main h2 small{font-size:15px;font-weight:400}.table-scroll{overflow:auto;border:1px solid #e2e9f3;border-radius:12px}.catalog-table{width:100%;border-collapse:collapse;min-width:760px}.catalog-table th{background:#eef3fa;text-align:left;color:#34435e}.catalog-table td,.catalog-table th{padding:16px;border-bottom:1px solid #e7edf5}.catalog-table a{color:#1555c1;text-decoration:none}.pagination{display:flex;gap:6px;margin-top:23px}.page{padding:8px 13px;border:1px solid #dde5f3;border-radius:6px;text-decoration:none}.page.selected{background:#1555c1;color:white}.product-detail{display:grid;grid-template-columns:1fr 1.3fr;gap:45px}.product-photo{background:#f4f6fa;border-radius:14px;min-height:380px;display:grid;place-items:center;color:#8c9bb0}.product-photo img{max-width:95%;max-height:420px;object-fit:contain}.product-info dl{display:grid;grid-template-columns:140px 1fr;gap:15px;border-top:1px solid #e1e7f1;padding-top:20px;margin-bottom:26px}.product-info dt{font-weight:700}.product-info dd{margin:0}.specs{white-space:pre-wrap;overflow-wrap:anywhere;background:#f6f8fb;padding:20px}.brand-directory{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.brand-directory>a{padding:25px;border:1px solid #dde6f1;border-radius:12px;text-decoration:none}.brand-directory h2{color:var(--navy)}.admin-body{margin:0;font-family:Inter,Arial,sans-serif;background:#f5f7fb;color:#25344e}.admin-body button,.admin-body input,.admin-body select,.admin-body textarea{font:inherit}.admin-body button{cursor:pointer;background:#245dd6;border:0;color:white;border-radius:7px;padding:11px 17px;font-weight:600}.admin-brand{font-weight:850;color:#fff;font-size:25px;letter-spacing:-.8px}.admin-brand span{color:#68a9ff}.login-card{width:min(440px,calc(100% - 30px));margin:10vh auto;padding:35px;background:white;border-radius:16px;box-shadow:0 12px 50px #0f254014}.login-card .admin-brand{color:#0f234a}.login-card label,.edit-form label{display:grid;gap:7px;margin:15px 0;color:#465570;font-size:14px;font-weight:600}.login-card input,.edit-form input:not([type=checkbox]),.edit-form select,.edit-form textarea,.toolbar input{width:100%;padding:12px;border:1px solid #d9e2ef;border-radius:8px;background:white;color:#26344d}.login-card button{width:100%;margin-top:12px}.login-card p{color:#72819a}.login-card #login-error{color:#a22}.admin-side{position:fixed;left:0;top:0;bottom:0;width:242px;background:#0d1c37;color:white;padding:27px 16px;display:flex;flex-direction:column}.sidebar-label{font-size:11px;letter-spacing:1.6px;color:#758cab;margin:48px 12px 15px}.admin-side nav button{display:block;width:100%;background:transparent;text-align:left;padding:14px 16px;color:#a8bcd7;margin:3px 0}.admin-side nav button.active,.admin-side nav button:hover{background:#1e3965;color:white}.side-bottom{margin-top:auto;display:grid;gap:10px}.side-bottom a{color:#b6cee8;text-decoration:none;padding:8px}.side-bottom button{background:#213656}.admin-main{margin-left:242px}.admin-top{background:#fff;border-bottom:1px solid #e3eaf4;padding:24px 40px;display:flex;justify-content:space-between;align-items:center}.admin-top h1{margin:5px 0 0;font-size:25px}.admin-top small{color:#8190a9}.admin-content{padding:30px 40px}.panel{background:white;border:1px solid #e2e9f2;padding:26px;border-radius:11px;margin-bottom:22px;box-shadow:0 2px 9px #101a3406}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:22px}.stat{padding:25px;background:white;border:1px solid #e2e9f2;border-radius:11px}.stat span{display:block;color:#76869f}.stat strong{display:block;font-size:34px;margin-top:13px}.toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:0 0 19px}.toolbar input{max-width:390px}.table-panel{overflow:auto;padding:0}.admin-body table{border-collapse:collapse;width:100%;white-space:nowrap}.admin-body td,.admin-body th{padding:15px 20px;text-align:left;border-bottom:1px solid #edf1f6}.admin-body th{background:#f8fafc;color:#61728d;font-size:12px;text-transform:uppercase;letter-spacing:.6px}.admin-body a{color:#2a63c8}.admin-body .mini{padding:7px 11px;background:#e9effb;color:#2053aa}.edit-form{max-width:850px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.two-col .wide{grid-column:span 2}.edit-actions{display:flex;gap:10px}.admin-body .subtle{background:#e5ebf4;color:#3b4a63}.admin-body #message:not(:empty){padding:15px;border-radius:7px;margin-bottom:16px}.admin-body #message.ok{background:#e4f6ec;color:#196039}.admin-body #message.error{background:#fff0f0;color:#a33}.status{background:#e8f1ff;padding:5px 10px;border-radius:50px;text-transform:capitalize}@media(max-width:950px){.catalog-layout,.product-detail{grid-template-columns:1fr}.brand-directory{grid-template-columns:1fr 1fr}.admin-side{width:195px}.admin-main{margin-left:195px}.admin-content{padding:20px}.stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.admin-side{position:static;width:auto}.admin-side nav{display:flex;overflow:auto}.admin-side nav button{white-space:nowrap;width:auto}.sidebar-label,.side-bottom{display:none}.admin-main{margin:0}.admin-top{padding:20px}.stats,.two-col,.brand-directory{grid-template-columns:1fr}.two-col .wide{grid-column:auto}.catalog-hero form{flex-direction:column}}
