/* Role-specific navigation and panels; additive to the existing Stitch storefront. */
.cs-role-nav{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:12px 0 18px;padding:9px;background:#fff;border:1px solid #dce4ed;border-radius:9px}
.cs-role-nav a{min-height:42px;display:inline-flex;align-items:center;gap:7px;padding:10px 13px;border-radius:6px;color:#293c54;font-weight:700;font-size:13px;line-height:1.25}
.cs-role-nav a:hover,.cs-role-nav a[aria-current=page]{background:#fff0e7;color:#93350f}
.cs-role-nav .material-symbols-outlined{font-size:19px}
.cs-role-nav a:focus-visible,.cs-role-section a:focus-visible,.cs-role-section button:focus-visible,.cs-role-section :is(input,select,textarea):focus-visible{outline:3px solid #1a55a1;outline-offset:2px}
.cs-role-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;border:1px solid #e1e6ef;background:#fff;border-radius:10px;padding:18px;margin:8px 0 12px}
.cs-role-heading h1{font-size:24px;color:#192b42;font-weight:800;margin:4px 0}
.cs-role-heading p,.cs-role-section-head p{color:#4c5e74;font-size:13px;line-height:1.5;margin:4px 0 0}
.cs-role-eyebrow{display:block;color:#96390f;font-size:10px;font-weight:800;letter-spacing:.1em}
.cs-vendor-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 18px}
.cs-role-kpi{padding:16px;border:1px solid #dde5ee;border-radius:9px;background:#fff;min-width:0;display:grid;gap:8px}
.cs-role-kpi>span{color:#53637a;font-size:12px;font-weight:700}
.cs-role-kpi>strong{color:#192b42;font-size:27px;font-weight:800;line-height:1.3;overflow-wrap:anywhere}
.cs-role-kpi>strong.cs-role-compact-value{font-size:17px}
.cs-role-kpi>small{color:#52617a;font-size:11px}
.cs-role-section{margin:14px 0 22px}
.cs-role-section-head{padding:2px 0 12px}
.cs-role-section-head h2{font-size:19px;font-weight:800;color:#192b42;margin:3px 0}
.cs-vendor-products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cs-vendor-product{border:1px solid #dde5ee;background:#fff;border-radius:10px;padding:17px;min-width:0}
.cs-vendor-product-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}
.cs-vendor-product h3{font-size:15px;margin:4px 0;font-weight:750;overflow-wrap:anywhere;color:#192b42}
.cs-vendor-product p{color:#52617a;line-height:1.5}
.cs-role-pill{background:#edf5fd;border:1px solid #d7e4f2;color:#244b70;padding:5px 8px;border-radius:15px;font-size:11px;font-weight:700;white-space:nowrap}
.cs-role-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cs-vendor-product label{font-size:12px;font-weight:750;color:#34435a;display:block;min-width:0}
.cs-vendor-product .field{font-size:14px;min-width:0;width:100%;max-width:100%;margin:6px 0 11px}
.cs-vendor-product textarea{min-height:80px;resize:vertical}
.cs-role-actions{display:flex;justify-content:flex-end;gap:9px}
.cs-role-section .btn{min-height:40px}
.cs-role-pagination{margin:16px 0}
.cs-role-kpis>a{border:1px solid #dae4ee;border-radius:10px}
.cs-role-kpis>a:hover{border-color:#d68964;background:#fff9f5}
@media(max-width:950px){.cs-vendor-products{grid-template-columns:1fr}}
@media(max-width:700px){.cs-vendor-overview{grid-template-columns:1fr}.cs-role-nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.cs-role-nav a{white-space:nowrap;flex:0 0 auto;min-height:44px}.cs-role-heading{padding:14px}.cs-role-heading h1{font-size:21px}.cs-role-form-grid{grid-template-columns:1fr}.cs-vendor-product{padding:14px}}
@media(prefers-reduced-motion:reduce){.cs-role-nav *, .cs-role-section *{scroll-behavior:auto!important;transition-duration:.01ms!important}}

.cs-role-logout{margin:0 0 0 auto;display:flex;align-items:center}
.cs-role-logout button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;background:#f5f6f8;border:1px solid #dce4ed;border-radius:6px;color:#314258;padding:8px 12px;font-weight:700;font-size:13px;cursor:pointer}
.cs-role-logout button:hover{background:#fff0e7;color:#93350f}
.cs-role-logout button:focus-visible{outline:3px solid #1a55a1;outline-offset:2px}
.cs-role-logout .material-symbols-outlined{font-size:19px}

.cs-vendor-stock-status{font-size:12px;margin:0 0 9px;color:#4d6077}.cs-vendor-product label.cs-vendor-stock-confirm{display:flex;align-items:flex-start;gap:9px;border:1px solid #d7e0eb;background:#f8fafc;padding:10px;border-radius:7px;line-height:1.5;margin:0 0 12px;font-size:12px}.cs-vendor-stock-confirm input{width:16px;height:16px;flex:0 0 16px;margin-top:1px}