/* Yama Cart brand layer for www.shop.yamacart.com (Odoo website 1).
   Source: Yama Cart design system https://claude.ai/artifact/Ed9PspZ5F5Zv7v1TKcRNV3
   Rules: true black and white, square corners, no shadows, no motion,
   magenta = one decision (Add to cart), cyan = structure, yellow = fill only,
   mono for prices and specs. IBM Plex everywhere. */

:root{
  --ink-key:#000000; --ink-cyan:#00AEEF; --ink-magenta:#EC008C; --ink-yellow:#FFD500; --paper:#FFFFFF;
  --ink-cyan-text:#0077A3; --ink-magenta-text:#C2006F;
  --grey-100:#f2f2ec; --grey-200:#e2e2dc; --grey-500:#8f8f89; --grey-600:#6b6b6b; --grey-700:#444444; --grey-900:#141414;
  --note-caveat-ground:#FFF7D6;
  --font-display:"IBM Plex Sans Condensed","Arial Narrow",sans-serif;
  --font-body:"IBM Plex Sans","IBM Plex Sans Arabic",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono","IBM Plex Sans Arabic",ui-monospace,monospace;
  --font-arabic:"IBM Plex Sans Arabic","IBM Plex Sans",sans-serif;
  --tracking-display:-0.035em; --tracking-label:0.16em; --tracking-mono:0.08em;
}

/* ---------- Foundations ---------- */
html body{font-family:var(--font-body) !important;color:var(--ink-key);background:var(--paper) !important}
html[dir="rtl"] body{font-family:var(--font-arabic) !important}
html body #wrapwrap{background:var(--paper) !important}
html body h1,html body h2,html body h3,html body h4,html body h5,html body h6,
html body .h1,html body .h2,html body .h3,html body .h4,html body .h5,html body .h6{font-family:var(--font-body) !important;color:var(--ink-key)}
html[dir="rtl"] body h1,html[dir="rtl"] body h2,html[dir="rtl"] body h3,html[dir="rtl"] body h4,html[dir="rtl"] body h5,html[dir="rtl"] body h6{font-family:var(--font-arabic) !important}
html body .btn,html body .nav-link,html body input,html body select,html body textarea{font-family:inherit !important}
html body a{color:var(--ink-cyan-text)}
html body a:hover{color:var(--ink-magenta)}
html body *,html body *::before,html body *::after{border-radius:0 !important;box-shadow:none !important;transition:none !important;animation:none !important}
html{scroll-behavior:auto !important}
html body [class*="rounded"],html body [class*="o_search_radius"] *{border-radius:0 !important}
html body input[type="radio"]{border-radius:50% !important}
html body .text-muted{color:var(--grey-600) !important}
html body .bg-light,html body .bg-100,html body .text-bg-light{background-color:var(--grey-100) !important;color:var(--ink-key) !important}
html body .badge{font-family:var(--font-mono) !important;letter-spacing:var(--tracking-mono);text-transform:uppercase;font-weight:500}
/* Postcard layout of the old theme: run the page flat, edge to edge */
html body #wrapwrap{padding-left:0 !important;padding-right:0 !important}
html body #wrapwrap > *{max-width:none !important;margin-bottom:0 !important;margin-top:0 !important}
html body .ym-art-panel{display:none !important}

/* ---------- Buttons ---------- */
html body .btn{font-weight:600 !important;border-width:1px !important}
html body .btn-primary,html body .btn-secondary,html body .btn-fill-primary{background:var(--ink-key) !important;border-color:var(--ink-key) !important;color:var(--paper) !important}
html body .btn-primary:hover,html body .btn-secondary:hover{background:var(--grey-900) !important;border-color:var(--grey-900) !important;color:var(--paper) !important}
html body .btn-outline-primary,html body .btn-light,html body .btn-outline-secondary{background:var(--paper) !important;border-color:var(--ink-key) !important;color:var(--ink-key) !important}
html body .btn-outline-primary:hover,html body .btn-light:hover,html body .btn-outline-secondary:hover{background:var(--ink-key) !important;color:var(--paper) !important}
/* The one decision per view: Add to cart */
html body #add_to_cart,html body .js_check_product.a-submit,html body button[name="add_to_cart"],html body .o_wsale_product_btn_primary,
html body a[name="website_sale_main_button"],html body .o_wsale_checkout_btn,html body a[href="/shop/checkout?try_skip_step=true"]{background:var(--ink-magenta) !important;border-color:var(--ink-magenta) !important;color:var(--paper) !important}
html body #add_to_cart:hover,html body button[name="add_to_cart"]:hover,html body .o_wsale_product_btn_primary:hover{background:var(--ink-magenta-text) !important;border-color:var(--ink-magenta-text) !important}
html body .btn:focus-visible,html body a:focus-visible,html body input:focus-visible{outline:2px solid var(--ink-key) !important;outline-offset:2px}
html body .form-control,html body .form-select{border:1px solid var(--grey-200) !important;background-color:var(--paper)}
html body .form-control:focus,html body .form-select:focus{border-color:var(--ink-key) !important}
html body .form-check-input:checked{background-color:var(--ink-key) !important;border-color:var(--ink-key) !important}

/* ---------- Header ---------- */
html body header#top,html body header#top .navbar,html body .navbar,html body .o_main_navbar,
html body .navbar.o_header_affix,html body header .o_header_mobile{background:var(--paper) !important;background-image:none !important}
html body header#top{border-bottom:1px solid var(--grey-200)}
html body header#top .navbar .nav-link,html body .navbar .nav-link{color:var(--ink-key) !important;font-weight:600;font-size:15px}
html body .navbar .nav-link:hover,html body .navbar .nav-link.active{color:var(--ink-magenta) !important;background:transparent !important}
html body header [aria-label="Top"]{background:var(--grey-100) !important;border-color:var(--grey-200) !important}
html body header [aria-label="Top"] .nav-link,html body header [aria-label="Top"] .btn,html body header [aria-label="Top"] a,
html body header [aria-label="Top"] .text-muted,html body header [aria-label="Top"] span{font-family:var(--font-mono) !important;font-size:12px !important;letter-spacing:var(--tracking-mono);text-transform:uppercase;color:var(--ink-key) !important}
html body header .o_border_contrast{border-color:var(--grey-200) !important}
/* Logo: full lockup at 96px on desktop (the size ladder floor), icon on phones */
html body header .navbar-brand.logo img,html body header .navbar-brand.logo span img{content:url("/web/content/19639/yama-cart-logo-light.svg");height:96px !important;max-height:96px !important;width:96px !important;max-width:96px !important}
@media (max-width:991px){
  html body header .o_header_mobile .navbar-brand.logo.ym-mob-home{display:none !important}
  html body header .o_header_mobile .o_main_nav{flex-wrap:nowrap !important;align-items:center}
  html body header .navbar-brand.logo img,html body header .navbar-brand.logo span img{content:url("/web/content/19641/yama-cart-icon-small.svg");height:40px !important;max-height:40px !important;width:40px !important;max-width:40px !important}
  html body header .o_header_mobile .navbar-brand.logo{display:flex !important;align-items:center}
  html body header .o_header_mobile .navbar-brand.logo::after{content:"Yama Cart™";font-family:var(--font-display);font-weight:700;font-size:20px;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--ink-key);margin-inline-start:10px;white-space:nowrap}
  @media (max-width:370px){html body header .o_header_mobile .navbar-brand.logo::after{font-size:16px;margin-inline-start:8px}}
  html body header .o_header_mobile .o_header_mobile_buttons_wrap{flex-wrap:nowrap !important}
}

/* Search */
html body .o_searchbar_form .search-query,html body .o_header_search input{border:1px solid var(--ink-key) !important;background:var(--paper) !important;color:var(--ink-key) !important;padding:8px 14px !important}
html body .o_searchbar_form .search-query:focus{box-shadow:none !important}
html body .o_searchbar_form .btn,html body .oe_search_button{background:var(--ink-key) !important;border-color:var(--ink-key) !important;color:var(--paper) !important}
html body .o_searchbar_form .btn .fa,html body .oe_search_button .fa{color:var(--paper) !important}
/* Header call to action ("Contact Us") is a key button, not the decision */
html body header .btn-primary{background:var(--ink-key) !important;color:var(--paper) !important}
/* Yama Business link: the white PNG disappears on paper, so show its name in mono instead */
html body .yb-hdr img,html body .yb-hdr-mob img{display:none !important}
html body .yb-hdr-txt{display:inline !important;color:var(--ink-key) !important;font-family:var(--font-mono) !important;font-size:11px !important;letter-spacing:var(--tracking-mono);text-transform:uppercase;max-width:none !important;font-weight:500 !important}
html body .yb-hdr-mob-txt{font-family:var(--font-mono);font-size:11px;color:var(--ink-key);letter-spacing:var(--tracking-mono)}
/* Cart and wishlist counters: data, in mono, on cyan structure */
html body .my_cart_quantity,html body .my_wish_quantity{background:var(--ink-cyan) !important;color:var(--ink-key) !important;font-family:var(--font-mono) !important}
html body header .fa,html body header .oi{color:var(--ink-key) !important}
html body .navbar-toggler{border-color:var(--ink-key) !important}
html body .navbar-toggler-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23000' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important}
/* Phone menu (was navy) */
html body #top_menu_collapse_mobile,html body .o_navbar_mobile.offcanvas{background:var(--paper) !important;color:var(--ink-key) !important}
html body #top_menu_collapse_mobile a,html body .o_navbar_mobile a,html body .o_navbar_mobile .nav-link{color:var(--ink-key) !important}
html body .o_navbar_mobile .btn-close{filter:none !important}
html body .dropdown-menu{border:1px solid var(--ink-key) !important}

/* ---------- Shop grid and product page ---------- */
html body .oe_product_cart,html body .o_wsale_product_grid_wrapper > *{border:1px solid var(--grey-200) !important;background:var(--paper) !important}
html body .o_wsale_product_grid_item:hover,html body .oe_product_cart:hover{transform:none !important}
html body .o_wsale_products_item_title a,html body .o_wsale_products_item_title{color:var(--ink-key) !important;font-family:var(--font-body) !important;font-weight:500 !important;font-size:15px !important;line-height:1.4 !important}
html body .product_price,html body .product_price span,html body .oe_price,html body .oe_currency_value,html body .oe_default_price,
html body .js_product .product_price h3,html body #product_details .oe_price_h4,html body td.td-price,html body .monetary_field{font-family:var(--font-mono) !important;letter-spacing:0.02em;color:var(--ink-key)}
html body .o_website_rating_static,html body .o_website_rating_static .fa{color:var(--grey-600) !important}
html body #product_details h1{font-family:var(--font-display) !important;font-weight:700 !important;text-transform:uppercase;letter-spacing:var(--tracking-display);line-height:1}
html[dir="rtl"] body #product_details h1{font-family:var(--font-arabic) !important;text-transform:none;letter-spacing:0;line-height:1.3}
html body .o_wsale_products_main_row h1,html body #products_grid_before + * h1,html body .o_wsale_products_header h1{font-family:var(--font-display) !important;text-transform:uppercase;letter-spacing:var(--tracking-display)}
html body #products_grid_before .nav-link,html body .o_wsale_products_categories a{color:var(--ink-key) !important}
html body #products_grid_before .nav-link.active,html body .o_categories_collapse .active{color:var(--ink-key) !important;font-weight:600;border-inline-start:2px solid var(--ink-cyan)}
html body .accordion-button{color:var(--ink-key) !important}
html body .css_attribute_color{border:1px solid var(--grey-200) !important}
html body .o_ribbon,html body .o_ribbons span{font-family:var(--font-mono) !important;text-transform:uppercase;letter-spacing:var(--tracking-mono)}
html body .pagination .page-link{color:var(--ink-key) !important;border-color:var(--grey-200) !important}
html body .pagination .active .page-link{background:var(--ink-key) !important;border-color:var(--ink-key) !important;color:var(--paper) !important}
html body .o_wsale_floating_bar,html body .o_wsale_filmstrip_wrapper{background:var(--paper) !important;border:1px solid var(--ink-key) !important}
html body .o_wizard .o_wizard_step_active .o_wizard_circle,html body .progress-bar{background:var(--ink-key) !important}
html body .alert-warning{background:var(--note-caveat-ground) !important;border:0 !important;border-inline-start:5px solid var(--ink-yellow) !important;color:var(--ink-key) !important}
html body .alert-danger{background:var(--paper) !important;border:0 !important;border-inline-start:5px solid var(--ink-magenta) !important;color:var(--ink-key) !important}
html body .alert-info,html body .alert-success{background:var(--grey-100) !important;border:0 !important;border-inline-start:5px solid var(--ink-cyan) !important;color:var(--ink-key) !important}

/* ---------- Floating buttons: WhatsApp and the assistant ---------- */
html body #ym-wa-btn{background:var(--ink-key) !important;width:52px !important;height:52px !important}
html body #ym-wa-btn svg{fill:var(--paper) !important}
html body .ym-wa-float,html body [id^="ym-albot"],html body [class*="albot-btn"],html body [class*="albot-fab"]{background:var(--ink-cyan) !important;color:var(--ink-key) !important}

/* ---------- Yama Cart components used by the homepage and footer ---------- */
.yc{font-family:var(--font-body);color:var(--ink-key)}
html[dir="rtl"] .yc{font-family:var(--font-arabic)}
.yc-wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.yc-sec{padding:96px 0}
.yc-sec-tight{padding:56px 0}
.yc-ground{background:var(--grey-100)}
.yc-label{font-family:var(--font-mono);font-size:12px;font-weight:500;line-height:1.8;letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--ink-cyan-text);margin:0 0 8px}
.yc-mono{font-family:var(--font-mono);font-size:13px;line-height:1.8;letter-spacing:var(--tracking-mono);text-transform:uppercase;color:var(--ink-key)}
.yc-mono-muted{color:var(--grey-600)}
.yc-display{font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-display);line-height:1;color:var(--ink-key);margin:0}
.yc-xl{font-size:96px}
.yc-m{font-size:40px;letter-spacing:-0.02em}
.yc-s{font-size:24px}
html[dir="rtl"] .yc-display{font-family:var(--font-arabic);text-transform:none;letter-spacing:0;line-height:1.3}
html[dir="rtl"] .yc-xl{font-size:64px}
html[dir="rtl"] .yc-m{font-size:40px}
.yc-lead{font-size:21px;line-height:1.65;max-width:68ch;color:var(--grey-700);margin:24px 0 0}
.yc-body{font-size:17px;line-height:1.65;color:var(--grey-700);margin:0}
.yc-body-s{font-size:15px;line-height:1.65;color:var(--grey-700);margin:0}
.yc-sh{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;border-bottom:2px solid var(--ink-key);padding-bottom:8px;margin-bottom:28px}
.yc-btn{display:inline-block;font-family:var(--font-body);font-weight:600;font-size:15px;line-height:1.2;padding:14px 22px;border:0;text-decoration:none !important;cursor:pointer;white-space:nowrap}
html[dir="rtl"] .yc-btn{font-family:var(--font-arabic)}
.yc-btn-decision{background:var(--ink-magenta);color:var(--paper) !important}
.yc-btn-decision:hover{background:var(--ink-magenta-text);color:var(--paper) !important}
.yc-btn-key{background:var(--ink-key);color:var(--paper) !important}
.yc-btn-key:hover{background:var(--grey-900);color:var(--paper) !important}
.yc-link{color:var(--ink-cyan-text) !important;text-decoration:underline !important;text-underline-offset:3px;font-weight:600}
.yc-link:hover{color:var(--ink-magenta) !important}
.yc-strip{background:var(--grey-100);border-bottom:1px solid var(--grey-200);padding:10px 0;text-align:center}
.yc-hero{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:center}
.yc-hero-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:40px}
.yc-hero-product{display:flex;flex-direction:column;gap:14px}
.yc-hero-product img{width:100%;max-width:440px;aspect-ratio:1/1;object-fit:contain;background:var(--paper);display:block}
.yc-grid{display:grid;gap:22px}
.yc-grid-3{grid-template-columns:repeat(3,1fr)}
.yc-grid-4{grid-template-columns:repeat(4,1fr)}
.yc-card{display:flex;flex-direction:column;gap:8px;background:var(--paper);border:1px solid var(--grey-200);padding:16px;text-decoration:none !important;color:var(--ink-key) !important;height:100%}
.yc-card:hover{border-color:var(--ink-key)}
.yc-card:hover .yc-card-title{color:var(--ink-magenta)}
.yc-card img{width:100%;aspect-ratio:1/1;object-fit:contain;background:var(--paper);display:block;margin-bottom:8px}
.yc-card-title{font-family:var(--font-display);font-weight:700;font-size:24px;line-height:1;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--ink-key);margin:0}
html[dir="rtl"] .yc-card-title{font-family:var(--font-arabic);text-transform:none;letter-spacing:0;line-height:1.3;font-size:22px}
.yc-pname{font-size:15px;line-height:1.4;font-weight:500;color:var(--ink-key);margin:0;flex-grow:1}
.yc-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.yc-col{border-top:2px solid var(--ink-key);padding-top:14px}
.yc-col h3{font-family:var(--font-body);font-weight:600;font-size:21px;line-height:1.3;margin:4px 0 8px}
html[dir="rtl"] .yc-col h3{font-family:var(--font-arabic)}
.yc-brands{display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:center}
.yc-print{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:end;border:1px solid var(--grey-200);border-top:5px solid var(--ink-cyan);padding:40px;background:var(--paper)}
/* Footer: the page's one inverse section */
.yc-foot{background:var(--ink-key);color:var(--paper);padding:56px 0 0}
.yc-foot a{color:var(--paper) !important;text-decoration:none}
.yc-foot a:hover{color:var(--ink-magenta) !important}
.yc-foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:40px;padding-bottom:40px}
.yc-foot h5{font-family:var(--font-mono) !important;font-size:12px;font-weight:500;letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--grey-500) !important;margin:0 0 14px;border-bottom:1px solid var(--grey-900);padding-bottom:8px}
.yc-foot ul{list-style:none;margin:0;padding:0}
.yc-foot li{margin:0 0 8px;font-size:15px;line-height:1.5}
.yc-foot .yc-mono{color:var(--paper)}
.yc-foot .yc-mono-muted{color:var(--grey-500)}
.yc-foot-logo{width:112px;height:112px;display:block}
.yc-foot-base{border-top:1px solid var(--grey-900);padding:14px 0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px}

@media (max-width:991px){
  .yc-sec{padding:56px 0}
  .yc-hero{grid-template-columns:1fr;gap:40px}
  .yc-xl{font-size:58px}
  html[dir="rtl"] .yc-xl{font-size:44px}
  .yc-grid-3,.yc-grid-4{grid-template-columns:repeat(2,1fr);gap:14px}
  .yc-cols{grid-template-columns:1fr;gap:28px}
  .yc-print{grid-template-columns:1fr;padding:28px 20px}
  .yc-foot-grid{grid-template-columns:1fr 1fr;gap:28px}
  .yc-card{padding:14px}
  .yc-card-title{font-size:24px}
}
@media (max-width:480px){
  .yc-xl{font-size:44px}
  .yc-m{font-size:32px}
  .yc-lead{font-size:17px}
  .yc-hero-actions .yc-btn{width:100%;text-align:center}
  .yc-sh{flex-direction:column;align-items:flex-start;gap:4px}
}

/* ---------- Fixes after the first preview pass ---------- */
html body .o_searchbar_form .search-query,html body .o_searchbar_form .form-control,html body .o_searchbar_form .btn,html body .o_search_radius_pill *{border-radius:0 !important}
html body header .o_searchbar_form .btn .fa,html body header .o_searchbar_form .btn .oi,html body header .oe_search_button .oi,html body header .oe_search_button .fa{color:var(--paper) !important}
/* Buy now is a second action, so it is key, not magenta: one decision per view */
html body button[name="add_to_cart"][data-action="buy_now"]{background:var(--ink-key) !important;border-color:var(--ink-key) !important;color:var(--paper) !important}
/* Card secondary buttons (compare, wishlist): paper with a hairline */
html body .o_wsale_product_btn .btn.o_add_compare,html body .o_wsale_product_btn .btn.o_add_wishlist,html body .o_wsale_product_btn .btn:not(.o_wsale_product_btn_primary){background:var(--paper) !important;border:1px solid var(--grey-200) !important;color:var(--ink-key) !important}
html body .o_wsale_product_btn .btn:not(.o_wsale_product_btn_primary):hover{border-color:var(--ink-key) !important}
/* Product page returns and delivery block (was a navy gradient band) */
html body #ym_product_return_policy > div{border:1px solid var(--grey-200) !important}
html body #ym_product_return_policy > div > div:first-child{background:var(--paper) !important;border-bottom:2px solid var(--ink-key)}
html body #ym_product_return_policy > div > div:first-child > span:first-child{display:none !important}
html body #ym_product_return_policy > div > div:first-child > span{color:var(--ink-key) !important;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-label);font-size:12px !important;font-weight:500 !important}
html body #ym_product_return_policy > div > div:first-child > a{color:var(--ink-cyan-text) !important}
html body #ym_product_return_policy > div > div:last-child{background:var(--grey-100) !important}
html body #ym_product_return_policy p{color:var(--ink-key) !important}
html body #ym_product_return_policy p + p{color:var(--grey-700) !important}
html body #ym_product_return_policy span[style*="25a244"]{color:var(--ink-cyan-text) !important}
html body #ym_product_return_policy a{color:var(--ink-cyan-text) !important}

/* ---------- Go-live fixes (1 Nov 2026) ---------- */
/* Phone: keep the 2-column cards inside the screen (long words like INSTRUMENTS pushed the grid wider than the phone) */
.yc-grid>*{min-width:0}
.yc-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.yc-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:991px){.yc-grid-3,.yc-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.yc-card-title{font-size:19px;overflow-wrap:break-word}html[dir="rtl"] .yc-card-title{font-size:18px}}
/* Arabic phone header shows the Arabic brand name */
@media (max-width:991px){html[dir="rtl"] body header .o_header_mobile .navbar-brand.logo::after{content:"ياما كارت™";font-family:var(--font-arabic);text-transform:none;letter-spacing:0}}

/* Short header like Yama Print (1 Nov): no Contact Us button; contact lives in the footer and WhatsApp */
html body header li:has(> .oe_structure .btn_cta),html body header .btn_cta{display:none !important}