/* AUSKET DESIGN SYSTEM — restrained black/white with only a little official blue.
 * BASE: pure #000000 black, #FFFFFF white, and grayscale neutrals only.
 * ACCENT: #2699F7 reserved for logo, selected underline and accessible focus.
 * Native emoji artwork may retain its own colours.
 * NEVER render blue text on black backgrounds.
 * This stylesheet is intentionally last to override older prototype themes.
 */
:root {
  --ausket-blue:#2699F7;
  --ausket-black:#000000;
  --ausket-white:#FFFFFF;
  --ausket-paper:#FFFFFF;
  --ausket-surface:#FAFAFA;
  --ausket-surface-strong:#F4F4F4;
  --ausket-muted:#626262;
  --ausket-muted-inverse:#CDCDCD;
  --ausket-border:#E8E8E8;
  --font-latin:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --font-arabic:'IBM Plex Sans Arabic',Tahoma,Arial,sans-serif;
  --brand:#2699F7;
  --ink:#000000;
  --bg:#FFFFFF;
  --white:#FFFFFF;
  --ux-blue:#2699F7;
  --ux-dark:#000000;
  --ux-border:#E8E8E8;
  --ux-muted:#626262;
  --ux-bg:#FFFFFF;
}
html,body{font-family:var(--font-latin);color:var(--ausket-black)}
body{background:#FFFFFF;line-height:1.5}
button,input,select,textarea{font:inherit}
button{font-weight:600}
:lang(ar),[dir="rtl"],[lang="ar"]{font-family:var(--font-arabic);letter-spacing:normal}
h1,h2,h3,h4,h5,h6{font-family:inherit;font-weight:700}
h1,h2{letter-spacing:-.035em}
:lang(ar) h1,:lang(ar) h2,[dir="rtl"] h1,[dir="rtl"] h2{letter-spacing:normal}
.product-title,.ux-service-body strong,.ux-item-title,.fu-item strong{font-weight:650}
.nav-link,.header-action,.footer-column button{font-weight:600}
.search-field input{font-weight:400}
.eyebrow,.fu-demo-label,.ux-demo-label{font-weight:700}

/* Structural colours: plain white, black, and neutral grey surfaces. */
.site-header{background:#FFFFFF}
.search-field{background:#F7F7F7;border-color:#E8E8E8}
.search-field:focus-within{border-color:#000000;box-shadow:0 0 0 2px #00000010}
.delivery,.header-action,.nav-link{color:#000000}
.nav-link.active,.nav-link:hover{color:#000000;border-bottom-color:var(--ausket-blue)}
.header-action b{background:#000000;color:#FFFFFF;border-color:#FFFFFF}
.quick-entry-item,.category-card{background:#FAFAFA;border-color:transparent}
.quick-entry-item:hover,.category-card:hover{background:#F2F2F2;border-color:transparent}
.quick-entry-icon{background:#EEEEEE;color:#000000}
.eyebrow,.ux-demo-label,.ux-kind,.ux-service-body small,.fu-demo-label{
  color:#555555;
}
.eyebrow i{background:var(--ausket-blue)} /* Tiny brand accent only */
.hero-content,.food-feature,.food-page-hero{background:#F7F7F7;border-color:transparent}
.hero-content h1 em,.food-feature h2 em,.ux-page-title h1 em,
.fu-page-head h1 em,.seller-intro h1 em{color:#000000}
.hero-content p,.food-feature p,.subtitle{color:#606060}
.hero-art{background:linear-gradient(145deg,#F7F7F7 0%,#E7E7E7 56%,#D8D8D8 100%)}
.hero-art-grain{background:transparent}
.food-feature-art{background:linear-gradient(140deg,#F1F1F1,#DEDEDE)}
.hero-circle{border-color:#FFFFFF80}
.art-caption{color:#363636}
.mini-star{background:#FFFFFF;color:#000000}
.floating{background:#FFFFFF;color:#000000}
.floating small{color:#686868}
.tone-blue,.tone-peach,.tone-lilac,.tone-rose,
.tone-lime,.tone-sand,.tone-mint,.tone-lavender{background:#F4F4F4}
.category-card{background-image:none;color:#000000}
.category-card small,.category-card strong{color:#000000}
.category-go,.small-arrow{background:#000000;color:#FFFFFF}
.product-card,.restaurant-card,.ux-service-card{background:#FFFFFF}
.product-visual:before,.visual-shine{background:#FFFFFF55}
.product-emoji,.category-symbol,.restaurant-visual .product-emoji{filter:none}
.favorite.is-fav{color:#000000;background:#F0F0F0}
.p-rating svg,.restaurant-rating svg{color:#000000}
.p-tag,.fu-state,.ux-demo-label,.fu-demo-label{background:#F1F1F1;color:#000000}
.p-body .merchant,.p-body .p-rating,.restaurant-info p,.sample-chip{color:#696969}
.add-button{background:#000000;color:#FFFFFF}
.restaurant-rating{background:#F5F5F5;color:#000000}
.plate{border-color:#F7F7F7}

/* Primary buttons are black; blue is intentionally NOT the dominant CTA colour. */
.btn-lime,.btn-lime:hover,.btn-dark,.search-submit{
  background:#000000;
  color:#FFFFFF;
}
.btn-lime:hover,.btn-dark:hover,.search-submit:hover{background:#242424;color:#FFFFFF}
.btn-disabled{background:#ECECEC;color:#686868}
.ux-filter.selected,.fu-pill.selected,.filter-chip.selected{
  background:#000000;color:#FFFFFF;border-color:#000000;
}
.ux-filter:not(.selected),.fu-pill:not(.selected),.filter-chip:not(.selected){
  background:#FFFFFF;color:#000000;border-color:#E8E8E8;
}
.ux-filter:hover:not(.selected),.fu-pill:hover:not(.selected){background:#F4F4F4}
.ux-outline,.fu-outline{background:#FFFFFF;color:#000000;border-color:#D9D9D9}
input:focus-visible,button:focus-visible,a:focus-visible,
select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--ausket-blue);
  outline-offset:3px;
}

/* Cross-category and future phase screens: monochrome backgrounds. */
.ux-service-emoji,.ux-detail-visual,.ux-search-product span,
.fu-emoji,.ux-service-art,.fu-entry-icon,
.location-icon{background:#F1F1F1;color:#000000}
.ux-detail-visual{background:linear-gradient(140deg,#F6F6F6,#E8E8E8)}
.ux-disclaimer,.ux-form,.ux-info-grid>section,.ux-metrics>div,
.ux-search-product,.ux-empty,.ux-activity>div,
.ux-request,.ux-account-grid>section,
.fu-phase-card,.fu-entry,.fu-item,.fu-disclaimer,.fu-metrics>div,
.fu-order,.fu-notification,.fu-thread,.fu-policy,.fu-platforms article{
  background:#F8F8F8;
}
.ux-service-card,.fu-review,.fu-track,.fu-row{border-color:#E9E9E9}
.fu-phase-card:hover,.fu-item:hover{background:#F1F1F1}
.ux-service-card:hover{box-shadow:0 5px 18px #00000014}
.fu-bubbles p.fu-right{background:#E9E9E9}
.fu-row-actions button,.fu-reply-options button,.fu-order>button,
.fu-notification button,.fu-platform-action{
  background:#EAEAEA;color:#000000;
}
.fu-row-actions button:hover,.fu-reply-options button:hover,
.fu-order>button:hover,.fu-notification button:hover{background:#DEDEDE;color:#000000}
.fu-stars,.fu-stepper>span.past{color:#000000}
.fu-stepper>span.past{border-color:#000000}
.fu-table th{background:#F5F5F5;color:#000000}
.fu-table td,.fu-table th{border-bottom-color:#EAEAEA}
.fu-review small,.fu-phase-card small,.fu-item small{color:#666666}
.ux-back,.ux-link-button,.ux-text-link,.ux-empty button,
.fu-phase-card b,.fu-entry b{color:#000000}
.ux-back:hover,.ux-text-link:hover,.fu-phase-card:hover b{text-decoration:underline}
.fu-state{border-radius:7px}

/* True black on all dark sections. Blue lettering is forbidden here. */
.noticebar,.promise-strip,.seller-banner,.seller-intro,.footer,.toast{
  background:#000000;
  color:var(--ausket-white);
}
.noticebar .demo-notice,.noticebar .notice-trust,
.noticebar .notice-row,.noticebar .notice-row svg{
  color:var(--ausket-white);
}
.seller-banner h2,.seller-banner h2 em,.seller-banner .eyebrow,
.seller-banner .seller-graphic,.seller-banner .seller-graphic strong,
.seller-intro h1,.seller-intro h1 em,.seller-grid span{
  color:var(--ausket-white);
}
.seller-banner p,.seller-banner small,.seller-intro p,
.seller-grid p{color:var(--ausket-muted-inverse)}
.seller-banner .btn-lime,.seller-intro .btn-lime{
  background:#FFFFFF;color:#000000;
}
.seller-banner .btn-lime:hover,.seller-intro .btn-lime:hover{
  background:#EAEAEA;color:#000000;
}
.promise-strip,.promise-strip .promise-items,.promise-strip svg,
.promise-strip strong{color:var(--ausket-white)}
.footer h4,.footer .footer-column h4,.footer .footer-payment-copy strong{color:var(--ausket-white)}
.footer-about p,.footer-column p,.footer-column button,
.footer-payment-copy span,.footer-bottom,.footer-bottom span{
  color:var(--ausket-muted-inverse);
}
.footer-column button:hover,.footer-preview-link,
.footer-preview-link:hover,.footer-chip,.footer-chip:hover{color:var(--ausket-white)}
.footer-chip{border:1px solid #777777;background:transparent}
.footer-preview-link{text-decoration:underline;text-decoration-color:#777777;text-underline-offset:3px}
.footer-social .social-icon{color:#FFFFFF;background:transparent;border-color:transparent}
.footer-social a.social-icon:hover{color:#FFFFFF;border-color:#FFFFFF;background:#FFFFFF1A}
.footer .payment-tile{background:#FFFFFF;color:#000000}
.footer .payment-mada-logo{color:#000000}
.footer .footer-payments,.footer .footer-bottom{border-top-color:transparent}

/* Preserve compact sizing across all viewport widths. */
.brand-logo{width:132px;max-width:100%;height:auto}
.footer-logo{width:145px;height:auto}
.social-icon{width:36px;height:36px;flex-basis:36px}
.social-icon svg{width:17px;height:17px}
.payment-tile{width:74px;height:43px}
.payment-mada-logo{width:48px;height:30px}
@media(max-width:780px){.brand-logo{width:124px}}
@media(max-width:480px){
  .brand-logo{width:116px}
  .social-icon{width:34px;height:34px;flex-basis:34px}
  .payment-tile{width:calc((100vw - 52px)/5);max-width:72px;height:39px}
  .payment-mada-logo{width:44px;height:28px}
}
