@font-face{font-family:Almarai;font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/Almarai-400.ttf') format('truetype')}
@font-face{font-family:Almarai;font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/Almarai-700.ttf') format('truetype')}
@font-face{font-family:Almarai;font-style:normal;font-weight:800;font-display:swap;src:url('assets/fonts/Almarai-800.ttf') format('truetype')}
:root{--brand:#128982;--dark:#0d605b;--light:#51aea9;--yellow:#ffbd08}*{box-sizing:border-box}body{margin:0;background:#f5f5f5;color:#333;font:14px Almarai,Tahoma,Arial;line-height:1.9}button,input,select{font:inherit}button{cursor:pointer;border:0;background:transparent;color:inherit}button:hover{color:var(--light)}.top{background:#fff;padding:8px 18%;display:flex;justify-content:space-between;font-size:11px;color:#777;border-bottom:1px solid #eee}header{background:#fff;padding:30px 18%;display:flex;align-items:center;justify-content:space-between;gap:50px;height:125px}header img{width:120px}header form{display:flex;border:1px solid var(--brand);min-width:390px;height:36px}input{border:0;padding:6px 12px;min-width:0;flex:1}select{border:0;background:#fff}header form button{background:var(--brand);color:white;width:38px}nav{background:var(--brand);color:white;display:flex;padding:0 1%;align-items:center;height:45px;gap:10px}nav button{font-size:12px;padding:10px}#categories{background:var(--yellow);color:#222;width:280px;align-self:stretch;text-align:right}main{min-height:60vh}.hero{display:grid;grid-template-columns:280px 1fr;gap:10px;padding:12px 4px 0}.hero aside{text-align:center}#cats{background:white;border:1px solid #ddd;text-align:right}#cats button{display:block;border-bottom:1px solid #eee;width:100%;padding:7px 15px;font-size:12px}.hero aside img{width:200px;margin-top:60px}.banner{width:100%;height:420px;object-fit:cover}#products{max-width:930px;margin:0 auto;padding:0 12px 25px}h2{color:var(--brand);font-size:23px;margin:8px 0 0}.grid{display:flex;justify-content:flex-start;gap:15px}.card{width:calc(25% - 12px);border:1px solid #e4e4e4;border-radius:9px;box-shadow:0 3px 6px #00000015;padding:12px;text-align:center;transition:.2s;background:#f7f7f7}.card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0002}.card img{height:190px;width:100%;object-fit:contain;background:#fff;border-radius:8px}.card h3{font-size:13px;font-weight:400;min-height:48px}.price{color:#fa6070;font-weight:bold}.view{display:block;background:var(--brand);color:white;border-radius:7px;padding:7px 22px;margin:8px auto 0;font-size:12px}.group{margin-bottom:25px}footer{background:#fff;display:grid;grid-template-columns:repeat(3,1fr);gap:60px;padding:65px 18%;font-size:12px}footer img{width:85px}footer small{grid-column:1/-1;border-top:1px solid #ddd;text-align:center;padding-top:35px}.assistant{position:fixed;bottom:25px;left:20px;border-radius:30px;background:var(--dark);color:white;box-shadow:0 6px 20px #0003;padding:12px 20px}.mobile{display:none}dialog{border:0;border-radius:15px;width:min(620px,94vw);padding:25px;max-height:85vh}dialog::backdrop{background:#0007}.close{float:left;font-size:25px}dialog img{max-height:230px;max-width:100%}.primary{background:var(--brand);color:#fff;border-radius:8px;padding:10px 22px}.row{padding:15px;border-bottom:1px solid #ddd;display:flex;justify-content:space-between;gap:15px}#dashboard{display:grid;grid-template-columns:220px 1fr;gap:25px;padding:35px;min-height:65vh}#dashboard[hidden]{display:none}.sidebar{background:var(--dark);color:white;border-radius:16px;padding:20px}.sidebar button{display:block;padding:14px;width:100%;text-align:right}.panel{background:white;border-radius:16px;padding:25px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.stats div{background:#eff8f7;padding:25px;border-radius:12px}.note{color:#777;font-size:12px}@media(min-width:1500px){.hero{max-width:1500px;margin:auto}}@media(max-width:700px){.top{padding:6px 14px}.top span:first-child{display:none}header{padding:15px;gap:15px;height:auto;flex-wrap:wrap}header img{width:90px}header form{order:3;min-width:100%;height:42px}nav{height:43px;overflow:auto;white-space:nowrap}nav button{flex-shrink:0}#categories{width:auto}.hero{display:flex;flex-direction:column;padding:8px}.hero aside{order:2}.hero aside img{display:none}#cats{display:none}#cats.open{display:block}.banner{height:auto;min-height:130px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.card{width:100%;padding:8px}.card img{height:155px}h2{font-size:19px;margin-top:18px}.card h3{font-size:12px}footer{padding:30px 20px 95px;gap:20px;grid-template-columns:1fr}footer small{grid-column:auto}.mobile{display:flex;position:fixed;bottom:0;width:100%;background:#fff;box-shadow:0 -3px 15px #0001;justify-content:space-around;padding:12px;z-index:3}.assistant{bottom:72px;left:12px;padding:8px 15px}#dashboard{padding:12px;grid-template-columns:1fr}.sidebar{display:flex;overflow:auto}.sidebar button{min-width:100px}.stats{grid-template-columns:1fr}.panel{padding:16px}}
[hidden]{display:none!important}input,select,textarea{font:inherit}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--brand);outline-offset:3px}.product-open{padding:0;width:100%;text-align:center}.card{display:flex;flex-direction:column;width:calc(25% - 12px)}.card-tools{display:flex;justify-content:space-around;border-top:1px solid #eee;margin-top:8px;font-size:12px}.price del{color:#999;font-size:11px}.grid{flex-wrap:wrap}.hero .banner{object-fit:contain;height:auto;align-self:start}.hero{grid-template-columns:20% 1fr}.hero aside img{max-width:95%}.hero aside #cats button{white-space:normal}.primary:hover,.view:hover{color:#fff;background:var(--dark)}form label{display:block;margin:10px 0}dialog input:not([type=checkbox]),dialog select,dialog textarea,.panel form input:not([type=checkbox]),.panel form select,.panel form textarea{display:block;width:100%;border:1px solid #ddd;border-radius:8px;padding:10px;background:white}dialog input[type=file]{padding:6px}dialog{width:min(850px,94vw)}form textarea{min-height:100px}.row input{max-width:70px;border:1px solid #ddd}.table-wrap{overflow-x:auto;width:100%;margin:16px 0}table{border-collapse:collapse;width:100%;text-align:right;font-size:13px}th,td{padding:12px 9px;border-bottom:1px solid #eee;min-width:90px}th{background:#eff8f7;color:var(--dark)}td button{white-space:nowrap}.panel form{max-width:650px}#adminSearch{border:1px solid #ddd;padding:9px;margin:12px;border-radius:7px}.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:20px}.product-detail>img{width:100%;max-height:330px;object-fit:contain}.thumbnails{display:flex;gap:10px}.thumbnails img{width:65px;height:65px;object-fit:contain;cursor:pointer}.preline{white-space:pre-line}.assistant{display:flex;gap:8px;align-items:center}.assistant img{width:35px;height:35px}.assistant-head{display:flex;gap:15px;align-items:center}.assistant-head img{width:65px}.message{background:#eff8f7;border-radius:12px;padding:12px;margin:10px 0}.message.mine{background:#fff7de}.message small{display:block;color:#777;margin-top:10px}#chat{max-height:280px;overflow:auto}#toast{position:fixed;z-index:100;top:25px;left:50%;transform:translateX(-50%);background:#0d605b;color:white;padding:12px 25px;border-radius:10px;opacity:0;pointer-events:none;max-width:90%;transition:.2s}#toast.visible{opacity:1}.user-info{text-align:center;margin-bottom:20px}.user-info img{width:65px}.check{display:flex!important;gap:10px;align-items:center}.check input{flex:none;width:auto}#filterbar{max-width:930px;margin:20px auto;padding:15px;background:white;border-radius:10px}#filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}#filters input{width:130px;max-width:100%;border:1px solid #ddd;border-radius:5px}#filters input[type=checkbox]{width:auto}.empty{padding:40px;text-align:center}.stats b{font-size:22px}.stats div{overflow-wrap:anywhere}.stats{margin-bottom:25px}footer small{width:100%}#installApp{background:var(--brand);color:white;border-radius:7px;padding:8px}a{color:var(--brand)}.actions{display:flex;gap:12px;align-items:center}@media(max-width:1100px) and (min-width:701px){header{padding:25px 8%;gap:25px}.top{padding:8px 8%}footer{padding:50px 10%}.hero aside img{margin-top:30px}#dashboard{grid-template-columns:190px 1fr;padding:20px}.stats{gap:10px}.stats div{padding:15px}}@media(max-width:700px){.card{width:100%}.product-detail{grid-template-columns:1fr}.product-detail>img{max-height:230px}.sidebar{display:block;padding:15px}.user-info{display:flex;gap:10px;align-items:center;margin:0}.user-info img{width:40px}.user-info h3{font-size:14px}.sidebar button{display:inline-block;width:auto;min-width:unset;padding:9px;font-size:12px}.hero{display:flex}.hero .banner{width:100%}header img{width:85px}header>button{font-size:12px}dialog{padding:18px}#filters input{width:110px}.stats b{font-size:20px}.panel .grid{grid-template-columns:1fr 1fr}.row{flex-wrap:wrap}.top{font-size:10px}footer{padding-bottom:115px}#dashboard{padding-bottom:100px}.card img{height:145px}.assistant img{width:27px}.assistant{font-size:12px}}
@media print{body>*:not(dialog){display:none!important}dialog{position:static;width:100%;max-width:100%;max-height:none;margin:0;padding:0;border:0;overflow:visible}dialog::backdrop{display:none}dialog .close,dialog button{display:none}table{font-size:11px}th,td{min-width:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
#galleryAdmin{display:flex;gap:10px;flex-wrap:wrap}.gallery-item{border:1px solid #ddd;border-radius:8px;padding:8px;text-align:center}.gallery-item img{height:85px;width:85px;object-fit:contain;display:block}.gallery-item button{font-size:12px}.product-detail .primary{margin:4px}

/* Mobile navigation from the supplied ZINOOO reference. */
.mobile-app-header{display:none}
@media(max-width:700px){
  .top{display:none}
  .mobile-app-header{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;grid-template-areas:"cart title phone";align-items:center;gap:8px;direction:ltr;min-height:72px;padding:12px 20px;padding-top:calc(12px + env(safe-area-inset-top,0px));background:#24483f;color:#ffbd08;position:relative;z-index:5}
  .mobile-app-header .mobile-cart{grid-area:cart}
  .mobile-app-header .mobile-phone{grid-area:phone}
  .mobile-app-header .header-title{grid-area:title;direction:rtl;text-align:center;color:#ffbd08;font-size:clamp(16px,4.8vw,20px);font-weight:800;line-height:1.6;margin:0;min-width:0}
  .mobile-app-header .icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:#193a32;border:0;padding:0;text-decoration:none;color:#ffbd08}
  .mobile-app-header .icon-btn img{display:block;width:25px;height:25px;object-fit:contain}
  body>header{padding:10px 14px;height:auto;gap:0}
  body>header>img,body>header>button:not(#installApp){display:none}
  body>header #search{margin:0;order:0}
  .bottom-nav.mobile{direction:rtl;display:flex;flex-direction:row;align-items:center;justify-content:space-around;gap:0;position:fixed;bottom:0;left:0;right:0;width:100%;min-height:74px;background:#24483f;color:#ffbd08;padding:9px 8px calc(9px + env(safe-area-inset-bottom,0px));box-shadow:0 -3px 15px #0002;z-index:20}
  .bottom-nav .nav-item{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;flex:1;min-width:0;text-align:center;font-size:13px;font-weight:700;line-height:1.5;color:#ffbd08;text-decoration:none;padding:0;border:0;background:transparent;font-family:Almarai,Tahoma,Arial}
  .bottom-nav .nav-item:hover,.bottom-nav .nav-item:focus-visible{color:#ffda66}
  .bottom-nav .nav-icon{height:32px;display:flex;align-items:center;justify-content:center}
  .bottom-nav .nav-icon img{display:block;width:25px;height:25px;object-fit:contain}
  .bottom-nav .nav-icon .hub-icon{width:35px;height:35px;margin-bottom:-3px}
  .assistant{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
  body{padding-bottom:calc(74px + env(safe-area-inset-bottom,0px))}
  footer{padding-bottom:35px}
  #dashboard{padding-bottom:25px}
}
@media print{.mobile-app-header,.bottom-nav{display:none!important}}