:root{--ink:#163b38;--muted:#71817e;--teal:#0f625e;--teal-dark:#0b504d;--mint:#e8f4ef;--mint-strong:#d6ebe2;--coral:#ef8b77;--paper:#f5f8f6;--line:#e7eeea;--white:#fff;--shadow:0 12px 30px rgba(16,63,58,.075)}
*{box-sizing:border-box}
html{background:#eef4f1}
body{margin:0;color:var(--ink);font-family:"Noto Sans Arabic",Tahoma,Arial,sans-serif;font-size:15px;line-height:1.55;background:var(--paper);min-height:100vh}
button,input{font:inherit}
button{cursor:pointer}
.app-shell{max-width:1120px;min-height:100vh;margin:auto;padding:0 42px 20px;background:var(--paper)}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;margin:0 -42px;padding:0 42px;background:linear-gradient(112deg,#0b504d,#13716a);color:#fff;box-shadow:0 6px 18px rgba(12,71,66,.13)}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit}
.brand-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;color:#fff;background:#ffffff20;border:1px solid #ffffff2c;box-shadow:0 6px 12px #083e3b22}
.brand-mark svg{width:28px;height:28px}
.brand-copy{display:grid;line-height:1.3}
.brand-copy strong{font-size:16px;letter-spacing:.1px}
.brand-copy small{font-size:12px;color:#d4e9e3;margin-top:3px}
.cart-button{position:relative;display:flex;align-items:center;gap:7px;padding:10px 13px;border:1px solid #ffffff42;border-radius:13px;background:#ffffff18;color:#fff;font-size:13px;font-weight:700;text-decoration:none;backdrop-filter:blur(8px)}
.cart-button svg{width:19px;height:19px;color:#fff}
.cart-count{height:21px;min-width:21px;padding:0 5px;display:grid;place-items:center;border-radius:99px;background:var(--coral);color:white;font-size:11px}
.intro{position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;min-height:145px;margin:22px 0 20px;padding:23px 25px;border:1px solid #dcece5;border-radius:21px;background:linear-gradient(115deg,#e4f3ec 0%,#edf6ef 57%,#f9eae5 100%);box-shadow:0 10px 24px rgba(24,83,71,.055)}
.intro:after{content:"";position:absolute;left:-32px;top:-60px;width:190px;height:190px;border:1px solid #fff9;border-radius:50%;box-shadow:0 0 0 24px #ffffff38,0 0 0 48px #ffffff24;pointer-events:none}
.intro-copy,.demo-tag{position:relative;z-index:1}
.eyebrow{display:flex;align-items:center;gap:8px;color:var(--teal);font-size:13px;font-weight:700}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--coral)}
h1,h2,h3,p{margin:0}
.intro h1{font-size:30px;line-height:1.35;margin-top:7px;font-weight:800;letter-spacing:-.5px;color:#123f3a}
.intro p{color:var(--muted);font-size:14px;margin-top:5px}
.demo-tag{display:inline-flex;align-items:center;gap:6px;border:1px solid #efc3b8;background:#fff7f4;color:#a85e4c;padding:6px 12px;border-radius:99px;font-weight:700;font-size:12px;margin-bottom:5px;box-shadow:0 3px 8px #bd725013}
.search-area{display:grid;gap:16px}
.search-box{height:54px;background:#fff;border:1px solid #e3ece7;border-radius:16px;display:flex;align-items:center;gap:11px;padding:0 16px;box-shadow:0 5px 15px #123c3709}
.search-box:focus-within{border-color:#8cbdb3;box-shadow:0 0 0 3px #0f625e12}
.search-box svg{width:20px;height:20px;color:#82928e;flex:none}
.search-box input{border:0;outline:0;background:transparent;min-width:0;flex:1;color:var(--ink);font-size:14px}
.search-box input::placeholder{color:#a2aeaa}
.search-submit{border:0;border-radius:9px;background:#eaf4ef;color:var(--teal);padding:7px 12px;font-size:12px;font-weight:700;white-space:nowrap}
.search-submit:hover{background:#dceee5}
.category-list{grid-column:1/-1;display:flex;align-items:stretch;gap:11px;overflow-x:auto;padding:2px 1px 12px;direction:rtl;scrollbar-width:thin;scrollbar-color:#b8cec5 transparent;overscroll-behavior-inline:contain}
.category-list::-webkit-scrollbar{height:6px}.category-list::-webkit-scrollbar-thumb{border-radius:99px;background:#b8cec5}.category-list::-webkit-scrollbar-track{background:transparent}
.category-item{width:94px;min-height:112px;flex:none;display:flex;flex-direction:column;align-items:center;gap:7px;padding:7px 6px 8px;border:1px solid #e5ede9;border-radius:16px;background:#fff;color:#49635d;text-align:center;text-decoration:none;box-shadow:0 3px 9px #123c3708;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.category-item:hover{transform:translateY(-2px);border-color:#a6c9bd;box-shadow:0 8px 18px #123c3712}
.category-item.active{border-color:#438a7a;background:#f1f8f4;color:var(--teal);box-shadow:0 0 0 2px #0f625e15}
.category-image{width:78px;height:67px;flex:none;display:grid;place-items:center;overflow:hidden;border-radius:11px;background-color:#eef6f1;background-image:var(--category-image-url);background-position:center;background-repeat:no-repeat;background-size:cover}
.category-image-placeholder{background:linear-gradient(145deg,#e4f2eb,#f8eee8);color:#54877a}
.category-image-placeholder svg{width:39px;height:39px}
.category-image-all{background:linear-gradient(145deg,#e1f0e8,#d5e9df);color:#287166}
.category-image-all svg{width:29px;height:29px;fill:currentColor}
.category-name{width:100%;min-height:29px;display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:11px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.load-more{display:grid;justify-items:center;gap:10px;padding:23px 0 8px}
.load-more-status{color:var(--muted);font-size:12px}
.load-more-button{min-width:190px;height:42px;padding:0 18px;border:1px solid #cfe1d8;border-radius:12px;background:#fff;color:var(--teal);font-size:13px;font-weight:800;box-shadow:0 4px 12px #123c3708}
.load-more-button:hover{border-color:#80b5a6;background:#f4faf6}
.load-more-button:disabled{cursor:wait;opacity:.65}
.catalog{padding-top:27px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:15px}
.section-heading h2{font-size:19px;font-weight:800;letter-spacing:-.2px}
.section-heading p{font-size:12px;color:var(--muted);margin-top:3px}
.sample-note{font-size:12px;color:#8b9692;padding-bottom:3px}
.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.product-card{overflow:hidden;border:1px solid #e3ece7;border-radius:21px;background:#fff;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease}
.product-card:hover{transform:translateY(-3px);box-shadow:0 17px 38px #123f3918}
.product-photo{position:relative;aspect-ratio:1/1;background-image:var(--photo-url);background-repeat:no-repeat;background-size:cover;background-position:center;background-color:#eef7f2}
.product-photo.photo-missing{display:grid;place-items:center;background:linear-gradient(145deg,#f2f8f5,#e8f3ee)}
.photo-placeholder{display:grid;justify-items:center;gap:8px;color:#8aa69b;font-size:12px;font-weight:600}
.photo-placeholder svg{width:52px;height:52px;opacity:.8}
.product-label{position:absolute;right:12px;top:12px;background:#fffffff0;color:#35635d;border:1px solid #ffffffb5;padding:5px 10px;border-radius:99px;font-size:11px;font-weight:700;box-shadow:0 3px 9px #183c3a12}
.product-info{padding:14px 15px 15px}
.product-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.product-title-row h3{font-size:16px;font-weight:800}
.product-detail{font-size:12px;color:var(--muted);margin-top:4px;min-height:24px}
.price-stock{display:flex;justify-content:space-between;align-items:center;margin-top:13px;padding-top:11px;border-top:1px solid #eff2f0;gap:6px}
.catalog-admin-create{margin:0 0 24px;padding:18px;border:1px solid #e4ece8;border-radius:16px;background:#fbfdfc}
.catalog-admin-create summary{cursor:pointer;font-weight:800;color:#286b5f}
.catalog-product-form{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:12px;margin-top:16px;align-items:end}
.catalog-description-field{grid-column:span 2}
.catalog-row-edit{display:grid;grid-template-columns:repeat(2,minmax(130px,1fr));gap:8px;min-width:440px}
.catalog-row-edit label{display:grid;gap:4px;font-size:12px;font-weight:700;color:#58645f}
.catalog-row-edit label.wide{grid-column:1/-1}
.catalog-row-edit input,.catalog-row-edit select,.catalog-row-edit textarea,.catalog-product-form input,.catalog-product-form select,.catalog-product-form textarea{width:100%;min-height:38px;padding:8px 10px;border:1px solid #dce5e0;border-radius:9px;background:#fff;color:#25342e;font:inherit}
.catalog-row-edit textarea,.catalog-product-form textarea{resize:vertical}
.catalog-admin-create .staff-filter-submit{min-height:40px;white-space:nowrap}
.price-stock strong{color:var(--teal);font-size:17px;font-weight:800;white-space:nowrap}
.price-stock small{font-size:11px;font-weight:600}
.stock-label{display:inline-flex;align-items:center;gap:5px;font-size:10.5px!important;color:#39746c!important;white-space:nowrap;background:#edf7f1;padding:4px 7px;border-radius:8px}
.stock-label i{width:6px;height:6px;border-radius:50%;background:#55a47f;box-shadow:0 0 0 3px #55a47f20}
.stock-label.out-of-stock{background:#fbefed;color:#a75f52!important}.stock-label.out-of-stock i{background:#cb7565;box-shadow:0 0 0 3px #cb756520}
.qty-row{display:flex;align-items:center;justify-content:space-between;margin-top:12px;color:#7a8984;font-size:12px}
.stepper{display:flex;align-items:center;gap:8px;padding:3px;border:1px solid var(--line);border-radius:9px;background:#fbfcfb}
.stepper button{width:27px;height:25px;display:grid;place-items:center;border:0;border-radius:6px;background:var(--mint);color:var(--teal);font-size:18px;line-height:1}
.stepper button:disabled,.add-button:disabled{cursor:not-allowed;opacity:.48}
.stepper output{min-width:17px;text-align:center;color:var(--ink);font-size:13px;font-weight:700}
.add-button{margin-top:10px;width:100%;height:42px;display:flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:12px;color:white;background:linear-gradient(110deg,#0f625e,#15766d);font-size:12px;font-weight:700;box-shadow:0 5px 12px #0f625e20;transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.add-button:hover{background:var(--teal-dark)}
.add-button.request-add{background:linear-gradient(110deg,#a66b27,#c18b43)}
.add-button.request-add:hover{background:#925c20}
.add-button:active{transform:scale(.985)}
.add-button svg{width:17px;height:17px}
.empty-state{text-align:center;margin:20px 0;color:var(--muted);padding:28px;background:#fff;border:1px dashed var(--line);border-radius:16px}
.basket-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);align-items:start;gap:18px;padding-top:5px}
.basket-panel,.order-summary{border:1px solid #e3ece7;border-radius:20px;background:#fff;box-shadow:var(--shadow)}
.basket-panel{padding:21px}
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:1px solid #edf1ef}
.panel-heading h2,.summary-heading h2{font-size:18px;font-weight:800}
.panel-heading p,.summary-heading p{margin-top:3px;color:var(--muted);font-size:12px}
.back-to-shop{display:inline-flex;align-items:center;gap:7px;text-decoration:none;color:var(--teal);font-size:12px;font-weight:700;white-space:nowrap}
.back-to-shop:hover{text-decoration:underline}
.basket-items{display:grid}
.basket-row{display:grid;grid-template-columns:86px minmax(0,1fr) auto;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid #edf1ef}
.basket-row:last-child{border-bottom:0;padding-bottom:0}
.basket-photo{width:86px;aspect-ratio:1;border-radius:15px;background-image:var(--photo-url);background-size:cover;background-position:center;background-repeat:no-repeat;background-color:#eef7f2}
.basket-photo.photo-missing{display:grid;place-items:center;background:linear-gradient(145deg,#f2f8f5,#e8f3ee);color:#8aa69b}
.basket-photo.photo-missing svg{width:38px;height:38px}
.basket-item-details{min-width:0}
.basket-item-details h3{font-size:14px;font-weight:800}
.basket-unit-price{margin-top:3px;color:var(--muted);font-size:12px}
.basket-stock-warning{margin-top:3px;color:#a75f52;font-size:11px;font-weight:700;line-height:1.5}
.basket-item-controls{display:flex;align-items:center;gap:12px;margin-top:9px}
.remove-item{border:0;background:transparent;color:#b56555;padding:5px 0;font-size:11px;font-weight:700}
.remove-item:hover{text-decoration:underline}
.basket-line-total{color:var(--teal);font-size:14px;white-space:nowrap}
.basket-line-total small{font-size:10px}
.empty-basket{padding:32px 14px;text-align:center}
.empty-icon{width:48px;height:48px;margin:0 auto 10px;display:grid;place-items:center;border-radius:16px;background:var(--mint);color:var(--teal);font-size:26px}
.empty-basket h3{font-size:16px;font-weight:800}
.empty-basket p{max-width:360px;margin:6px auto 14px;color:var(--muted);font-size:13px}
.empty-shop-link{width:auto;display:inline-flex;text-decoration:none;padding:0 16px}
.empty-shop-link:hover{color:white;text-decoration:none}
.order-summary{padding:20px}
.summary-heading{display:flex;align-items:center;gap:11px;padding-bottom:15px;border-bottom:1px solid #edf1ef}
.summary-icon{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:13px;background:#e7f4ed;color:var(--teal);font-weight:800}
.summary-line{display:flex;justify-content:space-between;align-items:center;padding:12px 0;color:#73827e;font-size:13px}
.summary-line strong{color:var(--ink);font-size:14px}
.total-line{margin-top:1px;padding-top:14px;border-top:1px solid #edf1ef;color:var(--ink);font-weight:700}
.total-line strong{color:var(--teal);font-size:20px;font-weight:800}
.total-line small{font-size:11px}
.shipping-note{margin:0 0 17px;color:#85938e;font-size:11px}
.order-form{display:grid;gap:8px;padding-top:15px;border-top:1px solid #edf1ef}
.order-form h3{margin-bottom:3px;font-size:15px;font-weight:800}
.order-form label{margin-top:4px;color:#52635e;font-size:12px;font-weight:700}
.order-form label span{color:#899691;font-weight:400}
.order-form input,.order-form textarea{width:100%;min-width:0;border:1px solid #e3ece7;border-radius:10px;background:#fbfcfb;color:var(--ink);padding:10px 12px;outline:none;font:inherit;font-size:13px;resize:vertical}
.order-form input:focus,.order-form textarea:focus{border-color:#8cbdb3;box-shadow:0 0 0 3px #0f625e12}
.order-form input::placeholder,.order-form textarea::placeholder{color:#a2aeaa}
.order-submit{height:45px;margin-top:6px;border:0;border-radius:12px;background:linear-gradient(110deg,#0f625e,#15766d);color:white;font:inherit;font-size:13px;font-weight:800;box-shadow:0 5px 12px #0f625e20}
.order-submit:disabled{cursor:not-allowed;background:#aebdb8;box-shadow:none}
.demo-disclaimer{color:#8a9692;font-size:11px;line-height:1.7}
.order-confirmation{margin-top:18px;border:1px solid #b9ddc8;border-radius:15px;background:#edf8f1;padding:16px 18px;color:#286247;font-size:14px;font-weight:700;line-height:1.8}
.staff-nav{border:1px solid #ffffff42;border-radius:11px;padding:8px 11px;color:#fff;text-decoration:none;font-size:12px;font-weight:700}
.staff-nav:hover{background:#ffffff18}
.staff-login-wrap{min-height:calc(100vh - 205px);display:grid;place-items:center;padding:25px 0}
.staff-login-card{width:min(100%,440px);padding:30px;border:1px solid #e3ece7;border-radius:22px;background:#fff;box-shadow:var(--shadow)}
.staff-login-mark{width:48px;height:48px;display:grid;place-items:center;margin-bottom:20px;border-radius:16px;background:var(--teal);color:#fff;font-size:22px;font-weight:800}
.staff-login-card h1{margin-top:8px;font-size:24px;font-weight:800}
.staff-login-card>p{margin-top:7px;color:var(--muted);font-size:13px;line-height:1.8}
.staff-login-form{display:grid;gap:9px;margin-top:22px}
.staff-login-form label{margin-top:5px;color:#52635e;font-size:12px;font-weight:700}
.staff-login-form input,.staff-filter select,.staff-filter input{min-width:0;border:1px solid #e3ece7;border-radius:10px;background:#fbfcfb;color:var(--ink);padding:10px 12px;outline:none;font:inherit;font-size:13px}
.staff-login-form input:focus,.staff-filter select:focus,.staff-filter input:focus{border-color:#8cbdb3;box-shadow:0 0 0 3px #0f625e12}
.staff-login-form .order-submit{margin-top:10px}
.staff-intro{align-items:center}
.staff-intro-actions{position:relative;z-index:1;display:flex;align-items:center;gap:9px;flex-wrap:wrap}.staff-report-link{display:inline-flex;min-height:40px;align-items:center;justify-content:center;padding:0 14px;border:1px solid #d7e7e0;border-radius:11px;background:#fff;color:var(--teal);font-size:12px;font-weight:800;text-decoration:none}.staff-report-link:hover{background:#f2f8f5}
.staff-logout,.staff-confirm,.staff-reject{min-height:40px;padding:0 15px;border-radius:11px;font:inherit;font-size:12px;font-weight:800}
.staff-logout{border:1px solid #d7e7e0;background:#fff;color:var(--teal)}
.staff-orders-panel,.staff-order-detail{margin-top:20px;padding:21px;border:1px solid #e3ece7;border-radius:20px;background:#fff;box-shadow:var(--shadow)}
.staff-orders-toolbar{display:flex;align-items:stretch;flex-direction:column;gap:15px;margin-bottom:17px}
.staff-orders-toolbar h2,.staff-lines-title{font-size:18px;font-weight:800}
.staff-orders-toolbar p{margin-top:3px;color:var(--muted);font-size:12px}
.staff-filter{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px;align-items:end;padding:15px;border:1px solid #edf2ef;border-radius:15px;background:#f9fbfa}.staff-filter-field{display:flex;min-width:0;flex-direction:column;gap:6px}.staff-filter-wide{grid-column:span 2}.staff-filter input,.staff-filter select{width:100%;height:42px}.staff-filter label{font-size:12px;font-weight:700}.staff-filter-submit,.staff-filter-clear{display:flex;min-height:42px;align-items:center;justify-content:center;border:0;border-radius:10px;padding:9px 13px;font:inherit;font-size:13px;font-weight:750;text-decoration:none;cursor:pointer;white-space:nowrap}.staff-filter-submit{background:#146b60;color:white}.staff-filter-clear{background:#edf3f0;color:#40544e}
.staff-product-filter{display:grid;grid-template-columns:minmax(190px,1.35fr) repeat(2,minmax(150px,1fr)) minmax(150px,.9fr) auto auto;gap:11px;align-items:end;padding:15px;border:1px solid #edf2ef;border-radius:15px;background:#f9fbfa}.staff-product-filter input,.staff-product-filter select{width:100%;height:42px;border:1px solid #e3ece7;border-radius:10px;background:#fbfcfb;color:var(--ink);padding:10px 12px;outline:none;font:inherit;font-size:13px}.staff-product-filter input:focus,.staff-product-filter select:focus{border-color:#8cbdb3;box-shadow:0 0 0 3px #0f625e12}.staff-product-report-table{min-width:1220px}
.staff-table-wrap{width:100%;overflow-x:auto}
.staff-table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:12px}
.staff-table th,.staff-table td{padding:12px 10px;border-bottom:1px solid #edf1ef;text-align:right}
.staff-table th{background:#f6faf7;color:#62736e;font-weight:800}
.staff-table td{color:#435650}
.staff-table tbody tr:hover{background:#fbfdfb}
.staff-status{display:inline-flex;padding:5px 9px;border-radius:99px;font-size:10px;font-weight:800;white-space:nowrap}
.status-Pending{background:#fff4df;color:#9a6a18}
.status-Confirmed{background:#e8f6ed;color:#34744d}
.status-Rejected{background:#fbefed;color:#a75f52}
.staff-view-link{color:var(--teal);font-weight:800;text-decoration:none}
.staff-view-link:hover{text-decoration:underline}
.staff-empty{padding:34px 12px;text-align:center;color:var(--muted)}
.staff-alert,.staff-success{margin:12px 0;padding:11px 14px;border-radius:11px;font-size:12px;line-height:1.7}
.staff-alert{border:1px solid #efd0c9;background:#fff4f1;color:#9f574b}
.staff-success{border:1px solid #c5e2ce;background:#f1faf3;color:#34744d}
.staff-customer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0;padding:16px;border-radius:15px;background:#f7faf8}
.staff-customer-grid>div{display:grid;gap:4px;min-width:0}
.staff-customer-grid span{color:var(--muted);font-size:11px}
.staff-customer-grid strong{overflow-wrap:anywhere;font-size:13px}
.staff-customer-grid a{color:var(--teal);text-decoration:none}
.staff-lines-title{margin:18px 0 12px}
.staff-order-total{display:flex;justify-content:space-between;align-items:center;padding:15px 4px;color:var(--muted);font-size:13px}
.staff-order-total strong{color:var(--teal);font-size:20px}
.staff-order-actions{display:flex;gap:10px;padding-top:13px;border-top:1px solid #edf1ef}
.staff-order-actions form{flex:1}
.staff-confirm,.staff-reject{width:100%;border:0;color:#fff}
.staff-confirm{background:linear-gradient(110deg,#0f625e,#15766d)}
.staff-reject{background:#a75f52}
.page-footer{display:flex;align-items:center;justify-content:center;gap:8px;color:#8a9893;font-size:12px;padding:30px 0 5px}
.footer-mark{width:22px;height:22px;display:grid;place-items:center;color:white;background:var(--teal);border-radius:7px;font-weight:800;font-family:Arial,sans-serif}
.footer-separator{color:#c2ccc7}
.toast{position:fixed;z-index:5;bottom:24px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#153d39;color:white;padding:11px 18px;border-radius:12px;box-shadow:0 10px 30px #153d3940;font-size:13px;font-weight:600;transition:all .24s ease;white-space:nowrap}
.toast.show{opacity:1;transform:translate(-50%,0)}
button:focus-visible,input:focus-visible{outline:3px solid #61afa1;outline-offset:2px}
@media(max-width:760px){.app-shell{padding:0 22px 18px}.topbar{height:70px;margin:0 -22px;padding:0 22px}.intro{min-height:136px;margin-top:18px;padding:20px}.intro h1{font-size:27px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.product-info{padding:12px}.product-title-row h3{font-size:14px}.price-stock strong{font-size:15px}.add-button{font-size:11px}.sample-note{font-size:11px}}
@media(max-width:760px){.catalog-product-form{grid-template-columns:1fr 1fr}.catalog-description-field{grid-column:1/-1}.catalog-row-edit{min-width:340px}}
.category-directory-search{margin:16px 0 20px;background:#fffdfc;border-color:#f0e1e0}
.category-page-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.category-tile{min-height:250px;aspect-ratio:1/1.12;justify-content:flex-end;padding:0;overflow:hidden;border:2px solid #ead9dc;border-radius:23px;background:#f4e2e4;box-shadow:0 8px 22px #6e45420d}
.category-tile:nth-child(4n+2){border-color:#d9e5d8;background:#e0eadf}
.category-tile:nth-child(4n+3){border-color:#d6e4dd;background:#dfeae5}
.category-tile:nth-child(4n+4){border-color:#e7dfd0;background:#ece4d6}
.category-tile:hover{transform:translateY(-3px);border-color:#c7acae;box-shadow:0 14px 28px #6e454214}
.category-tile.is-selected{box-shadow:0 0 0 3px #fff,0 0 0 6px #8cac9c}
.category-tile-image{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit;background-size:cover;background-position:center}
.category-tile-image.category-image-all{background:linear-gradient(145deg,#f7e7e7,#e0ece4)}
.category-tile-image svg{width:55px;height:55px;opacity:.65}
.category-tile::after{content:"";position:absolute;inset:57% 0 0;background:linear-gradient(180deg,transparent,#a9707bca);pointer-events:none}
.category-tile:nth-child(4n+2)::after{background:linear-gradient(180deg,transparent,#6c8c78d9)}
.category-tile:nth-child(4n+3)::after{background:linear-gradient(180deg,transparent,#6b9786dc)}
.category-tile:nth-child(4n+4)::after{background:linear-gradient(180deg,transparent,#a5835bd9)}
.category-tile-name{position:absolute;z-index:1;right:0;bottom:0;width:100%;min-height:70px;display:grid;place-items:center;padding:10px 8px;color:#fff;font-size:22px;font-weight:800;text-shadow:0 2px 8px #0005;line-height:1.35}
.category-tile-arrow{display:none}
@media(max-width:900px){.category-page-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.category-page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.category-tile{min-height:210px;border-radius:20px}.category-tile-name{min-height:60px;font-size:19px}.category-directory-search{margin:8px 0 16px}}
@media(max-width:380px){.category-tile{min-height:185px}.category-tile-name{font-size:17px}}
.mobile-bottom-nav{display:none}
@media(max-width:760px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .mobile-bottom-nav{position:fixed;z-index:120;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(4,1fr);min-height:62px;padding:7px 8px calc(7px + env(safe-area-inset-bottom));border-top:1px solid #e8e5e1;background:#fffdfbf2;backdrop-filter:blur(14px);box-shadow:0 -5px 18px #4936290c}
  .mobile-bottom-nav a{display:grid;justify-items:center;align-content:center;gap:2px;color:#8d8884;text-decoration:none;font-size:10px;font-weight:700}
  .mobile-bottom-nav svg{width:21px;height:21px}
  body.category-catalog-page{background:#faf7f3}
  body.category-catalog-page .app-shell{background:#faf7f3}
  body.category-catalog-page .topbar{background:linear-gradient(110deg,#f4e5e3,#eee2dc);color:#493f3d;box-shadow:0 5px 16px #6e45420c}
  body.category-catalog-page .brand-mark{background:#ffffff9c;border-color:#ffffffd9;color:#946c70}
  body.category-catalog-page .brand-copy small{color:#796b68}
  body.category-catalog-page .cart-button{border-color:#ffffff;color:#604e4c;background:#fff9}
  body.category-catalog-page .cart-button svg{color:#755b58}
  body.category-catalog-page .cart-count{background:#b5838a}
  body.category-catalog-page .category-page-hero{display:none}
  body.category-catalog-page .category-directory .section-heading{display:none}
  body.category-catalog-page .category-directory{margin-top:0}
}
@media(max-width:760px){.basket-layout{grid-template-columns:1fr;gap:13px}.basket-panel,.order-summary{padding:17px}}
@media(max-width:760px){.staff-orders-panel,.staff-order-detail{padding:15px}.staff-filter{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}.staff-filter-wide{grid-column:span 2}.staff-filter-submit,.staff-filter-clear{width:100%}.staff-customer-grid{grid-template-columns:1fr}.staff-intro{flex-direction:row}.staff-table{min-width:760px}}
@media(max-width:760px){.staff-product-filter{grid-template-columns:1fr 1fr;padding:12px}.staff-product-filter .staff-filter-field:first-child{grid-column:span 2}.staff-intro-actions{max-width:100%}}
@media(max-width:420px){.staff-filter{grid-template-columns:1fr}.staff-filter-wide{grid-column:span 1}}
@media(max-width:420px){.staff-product-filter{grid-template-columns:1fr}.staff-product-filter .staff-filter-field:first-child{grid-column:span 1}.staff-intro-actions{justify-content:flex-start}}
@media(max-width:420px){.app-shell{padding-right:16px;padding-left:16px}.topbar{margin-right:-16px;margin-left:-16px;padding-right:16px;padding-left:16px}.brand-mark{width:39px;height:39px}.intro{min-height:130px;margin-top:15px;padding:17px;border-radius:18px}.intro h1{font-size:25px}.intro p{font-size:13px}.product-grid{gap:10px}.product-info{padding:10px}.product-title-row{align-items:flex-start}.product-title-row h3{font-size:13px}.product-detail{font-size:11px}.price-stock{flex-wrap:wrap;gap:4px}.price-stock strong{font-size:14px}.stock-label{font-size:9.5px!important;padding:3px 6px}.qty-row{font-size:10px}.stepper{gap:5px}.stepper button{width:24px;height:23px}.add-button{height:39px;font-size:10.5px}.sample-note{max-width:110px;text-align:left;line-height:1.4}}
@media(max-width:420px){.basket-panel,.order-summary{padding:14px}.panel-heading{align-items:flex-start}.panel-heading h2{font-size:16px}.back-to-shop{font-size:10px}.basket-row{grid-template-columns:68px minmax(0,1fr);gap:10px}.basket-photo{width:68px;border-radius:12px;grid-row:span 2}.basket-line-total{grid-column:2;grid-row:2;justify-self:start;margin-top:-6px}.basket-item-details h3{font-size:13px}.basket-item-controls{gap:8px}.remove-item{font-size:10px}}
@media(min-width:761px){.search-area{grid-template-columns:1fr;align-items:stretch}}
@media(max-width:420px){.category-list{gap:8px}.category-item{width:82px;min-height:105px;padding:6px 5px 7px;border-radius:14px}.category-image{width:68px;height:60px}.category-name{font-size:10.5px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* Beauty shop mobile catalog: photo-led category tiles and a calm boutique palette. */
.category-directory-search{margin:10px 0 18px;border:1px solid #eee2df;border-radius:18px;background:#fffdfc;box-shadow:0 8px 24px #6e45420a}
.category-page-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.category-tile{min-height:250px;aspect-ratio:1/1.12;justify-content:flex-end;gap:0;padding:0;overflow:hidden;border:1px solid #eadbd8;border-radius:23px;background:#f4e6e3;box-shadow:0 9px 24px #6e45420c}
.category-tile:nth-child(4n+2){border-color:#dce6d9;background:#e6ede1}
.category-tile:nth-child(4n+3){border-color:#d9e6df;background:#e4eee8}
.category-tile:nth-child(4n+4){border-color:#e8dfd2;background:#eee8dc}
.category-tile:hover{transform:translateY(-3px);border-color:#d1b5b3;box-shadow:0 15px 28px #6e454218}
.category-tile.is-selected{box-shadow:0 0 0 3px #fff,0 0 0 6px #9ab9a8}
.category-tile-image{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit;background-size:cover;background-position:center}
.category-tile-image.category-image-all{background:linear-gradient(145deg,#f6e9e7,#e0ece5)}
.category-tile-image svg{width:55px;height:55px;opacity:.68}
.category-tile::after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(180deg,transparent,#9a6670d9);pointer-events:none}
.category-tile:nth-child(4n+2)::after{background:linear-gradient(180deg,transparent,#698775dc)}
.category-tile:nth-child(4n+3)::after{background:linear-gradient(180deg,transparent,#698f80df)}
.category-tile:nth-child(4n+4)::after{background:linear-gradient(180deg,transparent,#9a805cde)}
.category-tile-name{position:absolute;z-index:1;right:0;bottom:0;width:100%;min-height:70px;display:grid;place-items:center;padding:10px 8px;color:#fff;font-size:21px;font-weight:800;text-shadow:0 2px 8px #0005;line-height:1.35}
.category-tile-arrow{display:none}
.product-card{border-color:#eadfda;border-radius:20px;background:#fffdfb;box-shadow:0 8px 24px #60463e0c}
.product-card:hover{box-shadow:0 15px 32px #60463e18}
.product-photo{background-color:#f6efeb}
.product-label{border-color:#f1e3df;background:#fffaf8;color:#795d59}
.add-button{background:linear-gradient(110deg,#a76f79,#bd8790);box-shadow:0 8px 16px #a76f7924}
.add-button:hover{background:linear-gradient(110deg,#94616b,#ad7780)}
@media(max-width:900px){.category-page-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
  .category-page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .category-tile{min-height:210px;border-radius:20px}
  .category-tile-name{min-height:60px;font-size:18px}
  .category-directory-search{margin:8px 0 16px}
}
@media(max-width:380px){.category-tile{min-height:185px}.category-tile-name{font-size:16px}}
.product-type-list{display:flex;gap:9px;overflow-x:auto;padding:3px 1px 11px;direction:rtl;scrollbar-width:thin;scrollbar-color:#cbb5b0 transparent}
.product-type-chip{flex:none;display:inline-flex;align-items:center;justify-content:center;min-height:37px;padding:0 15px;border:1px solid #eaded9;border-radius:999px;background:#fffdfb;color:#735c57;font-size:12px;font-weight:750;text-decoration:none;white-space:nowrap}
.product-type-chip:hover,.product-type-chip.is-active{border-color:#bd8790;background:#f6e9e8;color:#845860}
.category-type-list{margin:16px 0 4px}
.product-type-label{display:inline-flex;margin:0 0 10px;padding:4px 9px;border:1px solid #efe2dd;border-radius:999px;background:#fbf4f1;color:#795e58;font-size:10px;font-weight:750}
.category-name-edit,.category-type-edit,.category-type-add{display:flex;align-items:end;gap:7px}
.category-name-edit{margin-bottom:12px}
.category-name-edit label{display:grid;flex:1;gap:5px;color:#64736d;font-size:11px;font-weight:700}
.category-name-edit input,.category-type-edit input,.category-type-add input{width:100%;min-width:0;min-height:36px;padding:7px 9px;border:1px solid #dfe8e3;border-radius:9px;background:#fff;color:#243f38;font:inherit;font-size:12px}
.category-name-edit button,.category-type-edit button,.category-type-add button{min-height:36px;flex:none;padding:7px 10px;font-size:10px}
.category-type-manager{display:grid;gap:7px;margin-bottom:12px;padding:10px;border:1px solid #e9eee9;border-radius:12px;background:#fafcf9}
.category-type-manager>strong{color:#45665b;font-size:11px}
.category-type-edit input{background:#fff}
.category-type-add{padding-top:7px;border-top:1px solid #e8eee9}
.category-products .product-grid{scroll-margin-top:100px}
.category-name-edit input:focus,.category-type-edit input:focus,.category-type-add input:focus{outline:2px solid #c9969d;outline-offset:1px;border-color:#bd8790}
.category-type-manager .category-type-edit input{flex:1}
.category-type-add input{flex:1}
.staff-nav{white-space:nowrap}
.contact-nav{flex:none;padding:9px 13px;border:1px solid #ffffff42;border-radius:12px;background:#ffffff12;color:#fff;text-decoration:none;font-size:12px;font-weight:750;white-space:nowrap}
.contact-nav:hover{background:#ffffff24}
.page-footer a{color:var(--teal);font-weight:700;text-decoration:none}
.page-footer a:hover{text-decoration:underline}
.contact-hero{align-items:center;min-height:190px}
.contact-hero-mark{position:relative;z-index:1;flex:none;width:82px;height:82px;display:grid;place-items:center;border:1px solid #ffffffc9;border-radius:26px;background:linear-gradient(145deg,#0f625e,#378c78);color:#fff;font-family:Georgia,serif;font-size:44px;font-weight:700;box-shadow:0 12px 25px #0f625e25}
.contact-panel{margin:0 auto;max-width:820px;padding:24px;border:1px solid #e3ece7;border-radius:22px;background:#fff;box-shadow:var(--shadow)}
.contact-heading{margin-bottom:19px}
.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.contact-card{min-width:0;min-height:112px;display:flex;align-items:center;gap:13px;padding:16px;border:1px solid #e6eee9;border-radius:17px;background:linear-gradient(145deg,#fff,#fbfdfb);color:var(--ink);text-decoration:none;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
a.contact-card:hover{transform:translateY(-2px);border-color:#a7cec0;box-shadow:0 10px 22px #164a3b10}
.contact-icon{width:45px;height:45px;flex:none;display:grid;place-items:center;border-radius:14px;background:#eaf5ef;color:var(--teal)}
.contact-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contact-card-copy{min-width:0;display:grid;gap:3px;flex:1}
.contact-card-copy small{color:#7c8c86;font-size:11px;font-weight:700}
.contact-card-copy strong{overflow-wrap:anywhere;color:#1d4941;font-size:14px;font-weight:800}
.contact-card-copy em{color:var(--teal);font-size:10px;font-style:normal;font-weight:700}
.contact-card-arrow{align-self:center;color:#93aaa0;font-size:19px}
.contact-address{grid-column:1/-1}
.contact-not-configured{display:grid;gap:5px;padding:17px 19px;border:1px dashed #d4e5dc;border-radius:15px;background:#f7fbf8;color:#667b72;font-size:13px}
.contact-not-configured strong{color:#245e53;font-size:14px}
.contact-not-configured bdi{color:#246b60;font-weight:800}
.contact-back-link{display:inline-flex;margin-top:19px;color:var(--teal);font-size:12px;font-weight:800;text-decoration:none}
.contact-back-link:hover{text-decoration:underline}
@media(max-width:600px){.contact-panel{padding:17px;border-radius:18px}.contact-grid{grid-template-columns:1fr;gap:10px}.contact-card{min-height:96px;padding:13px}.contact-address{grid-column:auto}.contact-hero-mark{width:61px;height:61px;border-radius:19px;font-size:33px}.contact-hero{min-height:155px}}
@media(max-width:420px){.contact-nav{padding:8px 9px;font-size:11px}.cart-button{gap:5px;padding:9px 8px;font-size:11px}.cart-button svg{width:17px;height:17px}.contact-hero-mark{width:50px;height:50px;border-radius:16px;font-size:27px}.contact-hero{gap:8px}}
/* Sticky site header and primary navigation */
.topbar{position:sticky;top:0;z-index:100;}
.main-nav{display:flex;align-items:center;justify-content:center;gap:5px;margin-inline:auto;padding:5px;border:1px solid #ffffff2e;border-radius:13px;background:#ffffff10}
.main-nav-link{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 13px;border-radius:9px;color:#f4fffb;text-decoration:none;font-size:12px;font-weight:750;white-space:nowrap;transition:background .16s ease,color .16s ease}
.main-nav-link:hover,.main-nav-link:focus-visible{background:#ffffff20;color:#fff}
.category-list{scroll-margin-top:96px}
@media(max-width:760px){.topbar{height:auto;min-height:70px;flex-wrap:wrap;justify-content:space-between;gap:6px;padding-top:8px;padding-bottom:8px}.brand{order:1}.cart-button{order:2}.main-nav{order:3;flex:1 0 100%;margin:0;justify-content:space-around;padding:3px}.main-nav-link{flex:1;min-height:34px;padding:0 8px;font-size:11px}.staff-nav{order:4}}
@media(max-width:420px){.topbar{gap:5px}.main-nav{width:100%}.main-nav-link{font-size:10.5px}.category-list{scroll-margin-top:106px}}
.category-page-hero{min-height:165px;align-items:center}
.category-home-link{position:relative;z-index:1;flex:none;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border:1px solid #c7ded3;border-radius:11px;background:#ffffffa8;color:var(--teal);font-size:11px;font-weight:800;text-decoration:none}
.category-home-link:hover{background:#fff;border-color:#89b9a5}
.category-directory{margin-top:22px}
.category-type-menu{margin:18px 0 22px;padding:18px 20px 8px;border:1px solid #e5ece8;border-radius:18px;background:linear-gradient(140deg,#fff,#f7fbf8);box-shadow:0 7px 22px #194b3908;scroll-margin-top:96px}
.category-type-menu .section-heading{margin:0 0 8px}
.category-type-menu .section-heading h2{margin:0;color:#245d52;font-size:18px}
.category-type-menu .section-heading p{margin:5px 0 0;color:#778980;font-size:12px}
.category-page-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.category-tile{position:relative;min-width:0;min-height:166px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;padding:14px 12px;border:1px solid #e3ece7;border-radius:19px;background:linear-gradient(145deg,#fff,#fbfdfb);color:var(--ink);text-align:center;text-decoration:none;box-shadow:0 6px 18px #174a3b08;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.category-tile:hover{transform:translateY(-3px);border-color:#a7cdbf;box-shadow:0 12px 24px #174a3b12}
.category-tile.is-selected{border-color:#408a78;background:linear-gradient(145deg,#f3faf6,#e8f4ed);box-shadow:0 0 0 2px #0f625e16}
.category-tile-image{width:88px;height:82px;display:grid;place-items:center;overflow:hidden;border-radius:15px;background-color:#eef6f1;background-image:var(--category-image-url);background-position:center;background-repeat:no-repeat;background-size:cover}
.category-tile-image svg{width:42px;height:42px}
.category-tile-image.category-image-all svg{width:33px;height:33px;fill:currentColor}
.category-tile-name{max-width:100%;overflow-wrap:anywhere;color:#345c51;font-size:13px;font-weight:800;line-height:1.4}
.category-tile-arrow{position:absolute;left:11px;bottom:10px;color:#8ca99c;font-size:17px}
.category-products{padding-top:30px;scroll-margin-top:100px}
.category-search{margin:0 0 17px}
@media(max-width:900px){.category-page-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media(max-width:600px){.category-page-hero{min-height:145px;gap:8px}.category-home-link{padding:0 9px;font-size:10px}.category-page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.category-tile{min-height:145px;padding:11px;border-radius:16px}.category-tile-image{width:76px;height:72px;border-radius:13px}.category-tile-name{font-size:12px}.category-products{padding-top:23px}}
@media(max-width:600px){.category-type-menu{margin:14px 0 18px;padding:14px 13px 6px;border-radius:15px}.category-type-menu .section-heading h2{font-size:16px}.category-type-menu .section-heading p{font-size:11px}}
@media(max-width:380px){.category-page-hero{align-items:flex-start;flex-direction:column}.category-home-link{align-self:flex-start}.category-tile{min-height:132px}.category-tile-image{width:68px;height:64px}}
.product-image-admin{margin-top:20px}
.product-image-search{grid-template-columns:minmax(220px,1fr) auto auto;max-width:760px}
.product-image-table{min-width:780px}
.product-admin-thumb{display:block;width:66px;height:66px;object-fit:cover;border:1px solid #e3ece7;border-radius:12px;background:#f5f8f6}
.product-admin-no-thumb{display:grid;width:66px;height:66px;place-items:center;border:1px dashed #cbd9d2;border-radius:12px;color:#8a9893;font-size:10px}
.product-image-upload{display:flex;align-items:center;gap:9px;min-width:300px}
.product-image-upload input[type=file]{max-width:300px;min-width:0;color:#596a65;font:inherit;font-size:11px}
.product-image-upload button{min-width:88px;flex:none}
@media(max-width:760px){.topbar{gap:7px}.staff-nav{padding:7px 8px;font-size:10px}.product-image-search{grid-template-columns:1fr auto auto}.product-image-upload{min-width:280px}}
@media(max-width:760px){.catalog-product-form{grid-template-columns:1fr 1fr}.catalog-description-field{grid-column:1/-1}.catalog-row-edit{min-width:340px}}
@media(max-width:480px){.product-image-search{grid-template-columns:1fr 1fr}.product-image-search .staff-filter-field{grid-column:span 2}.product-image-search .staff-filter-submit,.product-image-search .staff-filter-clear{width:100%}}
.category-image-admin{margin-top:20px}
.category-image-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.category-image-card{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:14px;min-width:0;padding:14px;border:1px solid #e6eee9;border-radius:17px;background:linear-gradient(145deg,#fff,#fbfdfb);box-shadow:0 5px 18px #174a3b08}
.category-admin-preview{width:112px;height:112px;object-fit:cover;border:1px solid #e7eeea;border-radius:14px;background:#f2f7f4}
.category-admin-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#8b9d95;font-size:11px}
.category-admin-empty svg{width:45px;height:45px}
.category-image-card-copy{min-width:0}
.category-image-card-copy h3{overflow-wrap:anywhere;margin:0 0 11px;color:#203b34;font-size:14px;font-weight:800}
.category-image-upload{display:grid;gap:8px}
.category-file-label{display:flex;min-height:37px;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1px dashed #bad4c9;border-radius:9px;background:#f6faf7;color:#23695c;padding:6px 10px;font-size:11px;font-weight:750;cursor:pointer}
.category-file-label input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.category-image-upload button{min-height:37px;padding:7px 10px;font-size:11px}
@media(max-width:950px){.category-image-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.category-image-grid{grid-template-columns:1fr;gap:10px}.category-image-card{grid-template-columns:86px minmax(0,1fr);gap:11px;padding:11px}.category-admin-preview{width:86px;height:86px;border-radius:12px}.category-image-card-copy h3{font-size:13px;margin-bottom:8px}}
/* Premium home-page hero */
.home-hero{isolation:isolate;min-height:252px;align-items:center;gap:20px;margin:24px 0 22px;padding:27px 34px;border:1px solid #d8e9e1;border-radius:25px;background:radial-gradient(ellipse at 17% 10%,#fff9 0,transparent 28%),linear-gradient(112deg,#e0f1e9 0%,#f2f7f1 48%,#fff1eb 100%);box-shadow:0 15px 36px rgba(19,81,68,.09)}
.home-hero:after{left:auto;right:34%;top:-110px;width:300px;height:300px;border-color:#ffffff80;box-shadow:0 0 0 28px #ffffff36,0 0 0 58px #ffffff20}
.home-hero:before{content:"";position:absolute;z-index:-1;left:-8%;bottom:-78%;width:430px;height:300px;border-radius:50%;background:radial-gradient(ellipse,#d4eae0a6,transparent 70%);pointer-events:none}
.hero-copy{position:relative;z-index:2;max-width:610px;flex:1 1 58%}
.hero-copy .eyebrow{gap:9px;font-size:12px;letter-spacing:.15px}
.hero-copy .eyebrow i{width:9px;height:9px;box-shadow:0 0 0 4px #ef8b7720}
.home-hero h1{max-width:590px;margin-top:13px;color:#123f3a;font-size:clamp(25px,3.2vw,38px);line-height:1.32;font-weight:850;letter-spacing:-.8px}
.home-hero p{max-width:470px;margin-top:8px;color:#687d76;font-size:14px;line-height:1.8}
.hero-cta{display:inline-flex;align-items:center;gap:10px;min-height:42px;margin-top:18px;padding:0 16px;border:1px solid #0f625e;border-radius:12px;background:linear-gradient(115deg,#0e625c,#187b6d);color:white;text-decoration:none;font-size:12px;font-weight:800;box-shadow:0 7px 16px #0f625e24;transition:transform .18s,box-shadow .18s}
.hero-cta:hover{transform:translateY(-2px);box-shadow:0 10px 20px #0f625e30}
.hero-cta svg{width:17px;height:17px;transform:scaleX(-1)}
.hero-visual{position:relative;z-index:1;flex:0 0 34%;align-self:stretch;min-width:230px;min-height:190px;display:flex;align-items:center;justify-content:center}
.hero-product{position:absolute;display:grid;place-items:center;filter:drop-shadow(0 12px 11px #345f4c22)}
.hero-product svg{width:100%;height:100%}
.hero-product-back{left:24%;top:27px;width:83px;height:132px;transform:rotate(-9deg)}
.hero-product-front{left:46%;top:45px;width:91px;height:131px;transform:rotate(7deg)}
.hero-mini-card{position:absolute;left:1%;bottom:10px;display:flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid #ffffffd9;border-radius:14px;background:#ffffffc9;box-shadow:0 8px 22px #315c4a16;backdrop-filter:blur(10px)}
.hero-mini-mark{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(145deg,#0f625e,#398879);color:#fff;font-family:Georgia,serif;font-weight:700}
.hero-mini-card>span:last-child{display:grid;gap:1px}.hero-mini-card small{color:#85948d;font-size:8px;letter-spacing:.3px}.hero-mini-card strong{color:#28564c;font-size:10px}
.hero-spark{position:absolute;color:#d99a79}.hero-spark-one{top:23px;right:18%;font-size:22px}.hero-spark-two{top:67px;left:11%;font-size:18px;color:#76aa96}
.hero-status{position:absolute;top:4px;right:1%;margin:0;border-color:#d4e7dd;background:#ffffffc9;color:#54796b;font-size:10px}
@media(max-width:760px){.home-hero{min-height:220px;gap:8px;margin:18px 0;padding:20px;border-radius:20px}.home-hero:after{right:29%;width:225px;height:225px}.hero-copy{flex-basis:62%}.home-hero h1{font-size:25px}.home-hero p{font-size:12px}.hero-cta{min-height:38px;margin-top:13px;padding:0 12px;font-size:11px}.hero-visual{flex-basis:33%;min-width:150px;min-height:175px}.hero-product-back{left:13%;top:35px;width:65px;height:105px}.hero-product-front{left:39%;top:49px;width:71px;height:104px}.hero-mini-card{left:-4%;bottom:3px;padding:6px 8px}.hero-mini-mark{width:25px;height:25px}.hero-mini-card small{font-size:7px}.hero-mini-card strong{font-size:9px}}
@media(max-width:480px){.home-hero{min-height:203px;padding:16px 14px;gap:0}.home-hero h1{font-size:20px;letter-spacing:-.4px}.home-hero .eyebrow{font-size:10px}.home-hero p{font-size:11px;line-height:1.6}.hero-copy{flex-basis:64%}.hero-visual{flex-basis:32%;min-width:112px;min-height:160px}.hero-product-back{left:4%;top:37px;width:52px;height:88px}.hero-product-front{left:31%;top:49px;width:57px;height:87px}.hero-mini-card{left:-9%;bottom:0;gap:5px;padding:5px 6px}.hero-mini-mark{width:21px;height:21px;font-size:11px}.hero-mini-card small{font-size:6px}.hero-mini-card strong{font-size:8px}.hero-spark-one{right:9%;font-size:16px}.hero-spark-two{left:2%;font-size:14px}.hero-status{top:0;right:-4%;font-size:8px;padding:4px 7px}}
.featured-slider{position:relative;display:block;min-height:300px;overflow:hidden;padding:0;background:radial-gradient(ellipse at 15% 15%,#fff9 0,transparent 28%),linear-gradient(112deg,#e4f3eb 0%,#f5f8f1 48%,#fff0e9 100%)}
.featured-slider:after{right:34%;left:auto;top:-120px;width:330px;height:330px;border-color:#ffffff80;box-shadow:0 0 0 30px #ffffff36,0 0 0 62px #ffffff20}
.featured-slides{position:absolute;inset:0}
.featured-slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:30px 6.5% 42px;opacity:0;visibility:hidden;transform:translateX(18px);transition:opacity .55s ease,transform .55s ease,visibility .55s}
.featured-slide.is-active{opacity:1;visibility:visible;transform:translateX(0)}
.featured-slide .hero-copy{flex:1 1 58%;max-width:620px}
.featured-slide h1{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.featured-slide .hero-copy p{max-width:490px}
.featured-price{margin-top:12px;color:#12665e;font-size:25px;font-weight:850;letter-spacing:.2px}.featured-price small{font-size:12px}
.featured-slide .hero-cta{margin-top:13px}
.featured-product-visual{position:relative;z-index:1;flex:0 0 34%;height:230px;display:grid;place-items:center}
.featured-product-visual img{position:relative;z-index:1;max-width:78%;max-height:215px;object-fit:contain;filter:drop-shadow(0 18px 16px #315c4a2e);border-radius:12px}
.featured-orbit{position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle at 42% 38%,#fff 0,#ffffffb5 35%,#d5eade 72%,#c8e0d4 100%);box-shadow:inset 0 0 0 1px #ffffffb5,0 12px 32px #47856f12}
.featured-product-caption{position:absolute;z-index:2;bottom:0;max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:7px 13px;border:1px solid #ffffffd9;border-radius:30px;background:#ffffffd9;color:#31584e;font-size:11px;font-weight:800;box-shadow:0 6px 18px #315c4a15}
.featured-slider-controls{position:absolute;z-index:3;right:6.5%;bottom:16px;display:flex;align-items:center;gap:12px}
.featured-slider-controls>button{width:30px;height:30px;display:grid;place-items:center;border:1px solid #cfe2d8;border-radius:50%;background:#ffffffc9;color:#176b60;font:inherit;font-size:20px;line-height:1;cursor:pointer;transition:background .15s,transform .15s}
.featured-slider-controls>button:hover{background:#fff;transform:scale(1.06)}
.featured-slider-dots{display:flex;align-items:center;gap:6px}
.featured-slider-dots button{width:7px;height:7px;padding:0;border:0;border-radius:9px;background:#a9c7b8;cursor:pointer;transition:width .2s,background .2s}
.featured-slider-dots button.is-active{width:21px;background:#146b60}
.slider-toggle-form{min-width:142px}
.slider-toggle-button{min-height:36px;padding:7px 10px;border:1px solid #c8ddd2;border-radius:9px;background:#f5faf7;color:#23695c;font:inherit;font-size:11px;font-weight:800;white-space:nowrap;cursor:pointer}
.slider-toggle-button.is-selected{border-color:#b8ddc5;background:#eaf7ee;color:#34744d}
.slider-toggle-button:disabled{border-color:#e5eae7;background:#f5f6f5;color:#a0aaa5;cursor:not-allowed}
@media(max-width:760px){.featured-slider{min-height:250px;margin:18px 0;border-radius:20px}.featured-slide{gap:10px;padding:20px 5% 44px}.featured-slide h1{font-size:24px}.featured-slide .hero-copy p{font-size:11px}.featured-product-visual{flex-basis:34%;height:185px}.featured-product-visual img{max-height:165px;max-width:85%}.featured-orbit{width:165px;height:165px}.featured-price{font-size:21px}.featured-slider-controls{right:5%;bottom:10px}}
@media(max-width:480px){.featured-slider{min-height:220px;padding:0}.featured-slide{gap:3px;padding:16px 4% 39px}.featured-slide .hero-copy{flex-basis:63%}.featured-slide h1{font-size:18px;line-height:1.35}.featured-slide .hero-copy p{font-size:10px;line-height:1.5}.featured-slide .eyebrow{font-size:9px}.featured-price{margin-top:8px;font-size:18px}.featured-price small{font-size:10px}.featured-slide .hero-cta{min-height:34px;margin-top:9px;padding:0 10px;font-size:10px}.featured-product-visual{flex-basis:35%;height:160px}.featured-product-visual img{max-width:92%;max-height:135px}.featured-orbit{width:125px;height:125px}.featured-product-caption{bottom:-1px;padding:5px 8px;font-size:8px}.featured-slider-controls{gap:8px;bottom:8px}.featured-slider-controls>button{width:25px;height:25px;font-size:17px}.featured-slider-dots{gap:4px}.featured-slider-dots button{width:6px;height:6px}.featured-slider-dots button.is-active{width:16px}}
.product-image-table{min-width:930px}
@media(max-width:760px){.slider-toggle-form{min-width:130px}}

/* Final overrides for the mobile beauty catalog and its category cards. */
.category-page-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.category-tile{min-height:250px;aspect-ratio:1/1.12;justify-content:flex-end;gap:0;padding:0;overflow:hidden;border:1px solid #eadbd8;border-radius:23px;background:#f4e6e3;box-shadow:0 9px 24px #6e45420c}
.category-tile:nth-child(4n+2){border-color:#dce6d9;background:#e6ede1}.category-tile:nth-child(4n+3){border-color:#d9e6df;background:#e4eee8}.category-tile:nth-child(4n+4){border-color:#e8dfd2;background:#eee8dc}
.category-tile-image{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit;background-size:cover;background-position:center}
.category-tile::after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(180deg,transparent,#9a6670d9);pointer-events:none}
.category-tile:nth-child(4n+2)::after{background:linear-gradient(180deg,transparent,#698775dc)}.category-tile:nth-child(4n+3)::after{background:linear-gradient(180deg,transparent,#698f80df)}.category-tile:nth-child(4n+4)::after{background:linear-gradient(180deg,transparent,#9a805cde)}
.category-tile-name{position:absolute;z-index:1;right:0;bottom:0;width:100%;min-height:70px;display:grid;place-items:center;padding:10px 8px;color:#fff;font-size:21px;font-weight:800;text-shadow:0 2px 8px #0005;line-height:1.35}
.category-tile-arrow{display:none}
.product-card{border-color:#eadfda;border-radius:20px;background:#fffdfb;box-shadow:0 8px 24px #60463e0c}
.product-photo{background-color:#f6efeb}.product-label{border-color:#f1e3df;background:#fffaf8;color:#795d59}
.add-button{background:linear-gradient(110deg,#a76f79,#bd8790);box-shadow:0 8px 16px #a76f7924}.add-button:hover{background:linear-gradient(110deg,#94616b,#ad7780)}
@media(max-width:900px){.category-page-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.category-page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.category-tile{min-height:210px;border-radius:20px}.category-tile-name{min-height:60px;font-size:18px}}
@media(max-width:380px){.category-tile{min-height:185px}.category-tile-name{font-size:16px}}