/* ==========================================================================
   TIMAS style — overrides on top of the Classic base (theme.css).
   White header, cream home slider, red category heroes,
   soft wheat / sage / lavender section panels, square red buttons,
   white product cards on light grey and a light rosemary footer.
   ========================================================================== */

:root {
  --tms-red: #dc0c15;
  --tms-red-dark: #b00a11;
  --tms-red-10: #fde7e8;
  --tms-black: #080F0F;
  --tms-white: #fff;
  --tms-grey-5: #f2f2f2;
  --tms-grey-1: #d9d8d7;
  --tms-grey-cool-5: #b2b1b1;
  --tms-grey-8: #898b8d;
  --tms-grey-11: #53565a;
  --tms-wheat: #f0d8be;
  --tms-sage: #dfe6dc;
  --tms-rosemary: #d6e1e1;
  --tms-lavender: #9fb1bb;
  --tms-champagne: #f7f0ef;
  --tms-blueberry: #2d324b;
  --tms-footer-bg: #d6e2e2;
  --tms-hero-bg: #f0f0f0;

  /* Home slider colours */
  --tms-slider-bg: #f0f0f0;
  --tms-slider-fg: var(--tms-black);
  --tms-slider-line: rgba(1, 1, 1, .2);

  /* Type roles: display = headings + button labels, link = text/navigation links, text = body copy. */
  --tms-font-display: "Unbounded", "Arial Black", Arial, sans-serif;
  --tms-font-link: "Google Sans", "Google Sans Flex", Arial, Helvetica, sans-serif;
  --tms-font-text: "Google Sans Flex", Arial, Helvetica, sans-serif;
  
  /* Header bar colours */
  --tms-header-bg: var(--tms-white);
  --tms-header-fg: var(--tms-black);
  --tms-header-muted: rgba(1, 1, 1, .5);
  --tms-header-line: var(--tms-grey-1);
  --tms-header-accent: var(--tms-red);

  --tms-gutter: 48px;
  --tms-header-h: 96px;
  --tms-topbar-h: 40px;
  --tms-ease: cubic-bezier(.25, .1, .25, 1);
}

/* ---------- Base ---------- */
html { scroll-padding-top: var(--tms-header-h); }
body {
  font-family: var(--tms-font-text);
  font-size: 16px;
  line-height: 1.5;
  color: var(--tms-black);
  background: var(--tms-white);
  -webkit-font-smoothing: antialiased;
}
main { overflow-x: clip; }
/* Text / paragraphs: Google Sans Flex */
html, body, p, li, dd, dt, td, th, label, small, blockquote, figcaption,
input, select, textarea, .form-control, .text-muted, .product-description-short {
  font-family: var(--tms-font-text);
}
/* Text links and navigation links: Google Sans */
a, .top-menu a, .breadcrumb, .breadcrumb a, .breadcrumb span, .dropdown-item, .dropdown-menu a,
.select-title, .select-list, .pagination a, .nav-tabs .nav-link, .footer-container li a,
.user-info a, .blockcart, #contact-link, .language-selector button, .currency-selector button,
.facet-label a, .block-categories a, .quick-view, .all-product-link:not(.btn) {
  font-family: var(--tms-font-link);
}
/* Headings and button labels: Unbounded */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
.btn, button.btn, input.btn, input[type=submit], button[type=submit].btn, .add-to-cart,
.products-section-title, .product-flags li.product-flag, .block-social__title, #block-newsletter-label {
  font-family: var(--tms-font-display);
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { font-family: inherit; }
a { color: var(--tms-red); }
a:hover, a:focus { color: var(--tms-red-dark); text-decoration: none; }
p { color: inherit; }

h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
  color: var(--tms-black);
  font-weight: 600;
  text-transform: none;
  letter-spacing: -.02em;
}
h1, .h1 { font-size: 56px; line-height: 64px; }
h2, .h2 { font-size: 34px; line-height: 44px; }
h3, .h3 { font-size: 24px; line-height: 32px; }
h4, .h4 { font-size: 18px; line-height: 26px; }
.text-muted { color: var(--tms-grey-11) !important; }

.container {
  width: 100%;
  max-width: 1440px;
  padding-left: var(--tms-gutter);
  padding-right: var(--tms-gutter);
}

/* Focus ring for keyboard users only. Bootstrap (Classic) outlines every focused link and
   button, which also shows after a mouse click; that one is removed here. */
:focus:not(:focus-visible) { outline: 0; box-shadow: none; }
:focus-visible { outline: 2px solid var(--tms-black); outline-offset: 2px; }

/* ---------- Buttons ---------- */
.btn {
  border-radius: 0;
  box-shadow: none;
  text-transform: none;
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: 0;
  padding: 20px 32px;
  transition: background-color .2s var(--tms-ease), color .2s var(--tms-ease), border-color .2s var(--tms-ease);
}
.btn-primary, .btn-primary.disabled, .btn-primary:disabled {
  color: var(--tms-white);
  background-color: var(--tms-red);
  border: 0;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
  color: var(--tms-white);
  background-color: var(--tms-red-dark);
  border: 0;
}
.btn-secondary, .btn-tertiary {
  color: var(--tms-black);
  background: transparent;
  border: 1px solid var(--tms-black);
  padding: 19px 31px;
}
.btn-secondary:hover, .btn-secondary:focus, .btn-tertiary:hover, .btn-tertiary:focus {
  color: var(--tms-white);
  background: var(--tms-black);
  border-color: var(--tms-black);
}
.btn-light {
  color: var(--tms-black);
  background: var(--tms-white);
  border: 0;
}
.btn-light:hover, .btn-light:focus { color: var(--tms-white); background: var(--tms-black); }
.btn .material-icons { font-size: 20px; vertical-align: -5px; }

/* Arrow text links ("Read more →") */
.tms-link, .all-product-link:not(.btn), .page-my-account #content .links a {
  font-weight: 700;
}

/* ---------- Forms ---------- */
.form-control, input[type=text], input[type=email], input[type=password], input[type=tel], input[type=search], select.form-control, textarea {
  border-radius: 0;
  border: 1px solid var(--tms-black);
  background: var(--tms-white);
  color: var(--tms-black);
  font-weight: 300;
  min-height: 52px;
  padding: 12px 16px;
}
.form-control:focus, input:focus, textarea:focus {
  outline: 2px solid var(--tms-black);
  outline-offset: 0;
  border-color: var(--tms-black);
  box-shadow: none;
}
.form-control-label, label { font-weight: 500; }
.custom-checkbox input[type=checkbox] + span, .custom-radio { border-radius: 0; border-color: var(--tms-black); }
.custom-radio input[type=radio]:checked + span { background-color: var(--tms-red); }

/* ==========================================================================
   Header
   ========================================================================== */
#header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--tms-header-bg);
  color: var(--tms-header-fg);
  border-bottom: 1px solid var(--tms-header-line);
  box-shadow: none;
  transition: box-shadow .2s var(--tms-ease);
}
/* Negative offset lets the top bar scroll away while the header bar stays stuck
   (checkout has its own header without the bar, so it keeps top: 0). */
#header:has(> .header-topbar) { top: calc(var(--tms-topbar-h) * -1); }
body.is-scrolled #header { box-shadow: 0 2px 16px rgba(1, 1, 1, .12); }
#header a { color: var(--tms-header-fg); }
#header a:hover, #header a:focus { color: var(--tms-header-accent); }
#header .header-banner { background: transparent; }

/* Top bar: single centred line above the header bar. */
#header .header-topbar {
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--tms-topbar-h);
  padding: 0 var(--tms-gutter);
  background: var(--tms-black);
  color: var(--tms-white);
  overflow: hidden;
}
#header .header-topbar__text {
  margin: 0;
  color: inherit;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* TIMAS Top Bar module: contact on the left, message in the centre, language and social links on the right.
   Colours come from the module settings (--tms-topbar-bg / --tms-topbar-fg). */
#header .tms-topbar {
  display: grid;
  /* Contact and language/social keep their natural width; the message takes the rest and is cut with "…". */
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 32px;
  /* Background stays full width; the content lines up with the header bar (max 1920px wide, centred). */
  padding-left: max(var(--tms-gutter), calc((100% - 1920px) / 2 + var(--tms-gutter)));
  padding-right: max(var(--tms-gutter), calc((100% - 1920px) / 2 + var(--tms-gutter)));
  background: var(--tms-topbar-bg, var(--tms-black));
  color: var(--tms-topbar-fg, var(--tms-white));
  overflow: visible;
}
#header .tms-topbar a, #header .tms-topbar button, #header .tms-topbar .dropdown { color: inherit; }
#header .tms-topbar a:hover, #header .tms-topbar a:focus, #header .tms-topbar button:hover { color: inherit; opacity: .8; text-decoration: none; }
#header .tms-topbar__side { display: flex; align-items: center; gap: 24px; min-width: 0; }
#header .tms-topbar__end { justify-content: flex-end; gap: 20px; }
#header .tms-topbar__message { min-width: 0; text-align: center; }
#header .tms-topbar__message .header-topbar__text { display: block; font-weight: 400; }
#header .tms-topbar__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--tms-font-text);
  font-size: 14px;
  line-height: 20px;
  white-space: nowrap;
}
#header .tms-topbar__item .material-icons { color: inherit; font-size: 18px; line-height: 1; }
#header .tms-topbar__lang-current { padding: 0; background: none; border: 0; cursor: pointer; }
#header .tms-topbar__lang-menu { min-width: 160px; margin-top: 10px; padding: 8px 0; border: 1px solid var(--tms-grey-1); border-radius: 0; box-shadow: 0 12px 32px rgba(1, 1, 1, .12); }
#header .tms-topbar__lang-menu .dropdown-item { display: flex; align-items: center; gap: 8px; padding: 8px 16px; color: var(--tms-black); font-size: 14px; }
#header .tms-topbar__lang-menu .dropdown-item:hover { color: var(--tms-white); background: var(--tms-red); opacity: 1; }
#header .tms-topbar__lang-menu .dropdown-item.is-current { font-weight: 700; }
#header .tms-topbar__socials { display: flex; align-items: center; gap: 14px; margin: 0; padding: 0; list-style: none; }
#header .tms-topbar__socials li { display: flex; }
#header .tms-topbar__social { display: inline-flex; align-items: center; color: inherit; }
/* While the Top Bar module shows the phone and language switcher, the white header bar does not repeat them.
   (Below 1200px both move into the mobile menu, so nothing is hidden there.) */
#header:has(.tms-topbar) .header-bar__contact,
#header:has(.tms-topbar) #_desktop_language_selector { display: none; }
/* If nothing else is left in that area (no cart, account link, ...), drop it so the search icon sits at the edge. */
#header:has(.tms-topbar) .header-bar__utility:not(:has(> :not(.header-bar__contact):not(#_desktop_language_selector))) { display: none; }
@media (max-width: 1199px) {
  /* Narrow desktops: the message gets the space; the e-mail stays, phone 2 is dropped. */
  #header .tms-topbar__contact .tms-topbar__item:nth-child(n+3) { display: none; }
}

#header .header-nav {
  max-height: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--tms-header-fg);
}
.header-bar {
  position: relative;
  display: flex;
  align-items: center;
  gap: 40px;
  min-height: var(--tms-header-h);
  padding: 0 var(--tms-gutter);
  max-width: 1920px;
  margin: 0 auto;
}
.header-bar__logo { flex: 0 0 auto; }
.header-bar__logo h1 { margin: 0; font-size: 0; line-height: 0; }
#header .logo, .header-bar .logo {
  width: auto;
  max-width: 180px;
  max-height: 48px;
  height: auto;
}
.header-bar__menu {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 24px;
  min-width: 0;
}
.header-bar__utility {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 14px;
  font-weight: 400;
}
.header-bar__utility > div, .header-bar__contact > div { display: flex; align-items: center; }
#header .header-nav .right-nav { display: flex; justify-content: flex-end; }

/* Main navigation */
#_desktop_top_menu { flex: 1 1 auto; position: static; }
#_desktop_top_menu .top-menu[data-depth="0"] {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 32px;
  margin: 0;
  padding: 0;
}
#_desktop_top_menu .top-menu[data-depth="0"] > li { position: static; display: block; }
#header .top-menu a[data-depth="0"] {
  display: inline-block;
  padding: 4px 0;
  color: var(--tms-header-fg);
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  text-transform: none;
  background: transparent;
  border-bottom: 2px solid transparent;
}
#header .top-menu a[data-depth="0"]:hover,
#header .top-menu a[data-depth="0"]:focus,
#header .top-menu > li.current > a[data-depth="0"] {
  color: var(--tms-header-fg);
  background: transparent;
  border-bottom-color: var(--tms-header-accent);
}
#header .top-menu .dropdown-item:hover, #header .top-menu .dropdown-item:focus { background: transparent; }

/* Mega menu panel */
#header .top-menu .sub-menu {
  position: absolute;
  top: 100% !important;
  left: 0 !important;
  right: 0;
  width: 100%;
  min-width: 100%;
  margin: 0;
  padding: 48px var(--tms-gutter) 56px;
  background: var(--tms-white);
  border: 0;
  border-top: 1px solid var(--tms-grey-1);
  border-radius: 0;
  box-shadow: 0 24px 40px rgba(1, 1, 1, .08);
  transform: none !important;
}
#header .top-menu .sub-menu ul[data-depth="1"] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 32px 48px;
  max-width: 1344px;
  margin: 0 auto;
  padding: 0;
}
#header .top-menu .sub-menu ul[data-depth="1"] > li { float: none; margin: 0; }
#header .top-menu .sub-menu a {
  color: var(--tms-black);
  padding: 0;
  font-size: 14px;
  line-height: 20px;
  white-space: normal;
}
#header .top-menu .sub-menu a[data-depth="1"] {
  display: block;
  padding-bottom: 12px;
  margin-bottom: 12px;
  font-size: 16px;
  font-weight: 700;
  border-bottom: 1px solid var(--tms-grey-1);
  text-transform: none;
}
#header .top-menu .sub-menu ul[data-depth="2"] li { padding: 4px 0; }
#header .top-menu .sub-menu a:hover { color: var(--tms-red); }

/* Search: icon in the header, opens the full-screen panel below. */
.tms-search-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  padding: 0;
  color: var(--tms-header-fg);
  background: transparent;
  border: 0;
  cursor: pointer;
}
#header .tms-search-toggle .material-icons { font-size: 26px; }
#header .tms-search-toggle:hover .material-icons, #header .tms-search-toggle:focus-visible .material-icons { color: var(--tms-header-accent); }
/* No focus frame on the search icon or inside the panel; the icon turns red and the field underline marks focus. */
.tms-search-toggle:focus, .tms-search-toggle:focus-visible,
.tms-search-modal:focus, .tms-search-modal :focus, .tms-search-modal :focus-visible { outline: 0; box-shadow: none; }

/* Full-screen search panel (moved to <body> by timas-style.js). */
body.tms-search-open { overflow: hidden; }
.tms-search-modal {
  position: fixed;
  inset: 0;
  z-index: 1050;
  overflow-y: auto;
  background: var(--tms-white);
  color: var(--tms-black);
}
.tms-search-modal[hidden] { display: none; }
.tms-search-modal__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--tms-header-h);
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 var(--tms-gutter);
}
.tms-search-modal__logo img { display: block; width: auto; max-width: 180px; max-height: 48px; height: auto; }
.tms-search-modal__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-left: auto;
  padding: 0;
  color: var(--tms-black);
  background: transparent;
  border: 0;
  cursor: pointer;
}
.tms-search-modal__close .material-icons { font-size: 26px; }
.tms-search-modal__close:hover { color: var(--tms-red); }
.tms-search-modal__body {
  max-width: 1230px;
  margin: 0 auto;
  padding: 48px var(--tms-gutter) 80px;
}
.tms-search-modal__title {
  margin: 0 0 120px;
  color: var(--tms-black);
  font-family: var(--tms-font-display);
  font-size: 64px;
  line-height: 72px;
  font-weight: 600;
  letter-spacing: -.02em;
}
.tms-search-modal #search_widget { float: none; min-width: 0; margin: 0; overflow: visible; }
.tms-search-modal #search_widget form { position: relative; border-bottom: 1px solid var(--tms-black); }
.tms-search-modal #search_widget form input[type=text] {
  width: 100%;
  min-height: 72px;
  padding: 16px 48px 16px 48px;
  color: var(--tms-black);
  font-family: var(--tms-font-text);
  font-size: 24px;
  font-weight: 400;
  background: transparent;
  border: 0;
  border-radius: 0;
}
.tms-search-modal #search_widget form input[type=text]::placeholder { color: var(--tms-grey-11); opacity: 1; }
.tms-search-modal #search_widget form input[type=text]:focus { outline: 0; background: transparent; }
.tms-search-modal #search_widget form:focus-within { border-bottom-color: var(--tms-red); }
.tms-search-modal #search_widget form i.search,
.tms-search-modal #search_widget form i.clear {
  position: absolute;
  top: 50%;
  padding: 0;
  color: var(--tms-black);
  font-size: 28px;
  transform: translateY(-50%);
}
.tms-search-modal #search_widget form i.search { left: 0; }
.tms-search-modal #search_widget form i.clear { right: 0; cursor: pointer; }

/* Autocomplete results live inside the panel as a plain list. */
.tms-search-modal .ui-autocomplete.searchbar-autocomplete {
  position: static !important;
  width: 100% !important;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 16px 0 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.tms-search-modal .ui-autocomplete.searchbar-autocomplete li { border-bottom: 1px solid var(--tms-grey-1); }
.tms-search-modal .ui-autocomplete.searchbar-autocomplete li a,
.tms-search-modal .ui-autocomplete.searchbar-autocomplete li a.ui-state-focus {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 0;
  color: var(--tms-black);
  font-family: var(--tms-font-link);
  font-size: 16px;
  background: transparent;
  border: 0;
}
.tms-search-modal .ui-autocomplete.searchbar-autocomplete li a:hover,
.tms-search-modal .ui-autocomplete.searchbar-autocomplete li a.ui-state-focus { color: var(--tms-red); background: transparent; }
.tms-search-modal .ui-autocomplete.searchbar-autocomplete .autocomplete-thumbnail { float: none; width: 56px; margin: 0; }

/* Utility links: contact, language, currency, account, cart */
#header .header-nav .material-icons { color: var(--tms-header-fg); font-size: 22px; line-height: 1; vertical-align: middle; }
#header .header-nav .user-info,
#header .header-nav .blockcart,
#header .header-nav #contact-link,
#header .header-nav .language-selector,
#header .header-nav .currency-selector { margin: 0; color: var(--tms-header-fg); }
#header .header-nav #_desktop_contact_link #contact-link { margin: 0; }
#header .header-nav .user-info a, #header .header-nav #contact-link a { display: inline-flex; align-items: center; gap: 6px; }
#header .header-nav .user-info .logout { margin-right: 12px; }
#header .header-nav .blockcart {
  height: auto;
  padding: 0;
  background: transparent;
  margin-left: 0;
}
#header .header-nav .blockcart .header { display: flex; align-items: center; gap: 6px; color: var(--tms-header-fg); }
#header .header-nav .blockcart a { color: var(--tms-header-fg); }
#header .header-nav .blockcart a:hover { color: var(--tms-header-accent); }
#header .header-nav .cart-products-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  font-size: 12px;
  font-weight: 700;
  color: var(--tms-header-fg);
  background: var(--tms-header-accent);
}
#header .header-nav .blockcart.inactive .cart-products-count { color: var(--tms-header-fg); background: var(--tms-grey-5); }
#header .expand-more { color: var(--tms-header-fg); }
#header .dropdown-menu {
  margin-top: 12px;
  padding: 8px 0;
  border: 0;
  border-radius: 0;
  background: var(--tms-white);
  box-shadow: 0 12px 32px rgba(1, 1, 1, .12);
}
#header .dropdown-menu .dropdown-item, #header .dropdown-menu a { color: var(--tms-black); padding: 8px 16px; font-size: 14px; }
#header .dropdown-menu .dropdown-item:hover, #header .dropdown-menu .current .dropdown-item { color: var(--tms-red); background: var(--tms-grey-5); }
#header .language-selector button, #header .currency-selector button { color: var(--tms-header-fg); font-size: 14px; }
#header .header-nav .language-selector-wrapper .h6,
#header .header-nav .currency-selector .expand-more + .h6 { display: none; }

#header .header-top { padding: 0; background: transparent; }

/* Header layout switch: compact mobile bar below 1200px (phones and tablets), full bar above.
   timas-style.js moves Classic's mobile breakpoint to the same width. */
@media (max-width: 1199px) {
  :root { --tms-header-h: 64px; }
  #header .tms-desktop-only { display: none !important; }
  .header-bar { min-height: 64px; }
  #header .header-nav .user-info a span, #header .header-nav .blockcart .header > span:not(.cart-products-count) { display: none; }
}
@media (min-width: 1200px) {
  #header .tms-mobile-only { display: none !important; }
}

/* Mobile header */
.header-bar__mobile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 64px;
}
.header-bar__mobile .top-logo img { max-height: 36px; width: auto; }
.header-bar__mobile-actions { display: flex; align-items: center; gap: 16px; }
#header .header-bar__mobile #menu-icon { cursor: pointer; margin: 0; }
#header .header-bar__mobile #menu-icon .material-icons { font-size: 28px; color: var(--tms-header-fg); }
#mobile_top_menu_wrapper {
  margin: 0;
  padding: 8px 24px 32px;
  background: var(--tms-white);
  color: var(--tms-black);
  max-height: calc(100vh - 64px);
  overflow-y: auto;
}
#mobile_top_menu_wrapper a, #mobile_top_menu_wrapper .material-icons { color: var(--tms-black) !important; }
#mobile_top_menu_wrapper .top-menu a[data-depth="0"] {
  display: block;
  padding: 16px 0;
  font-size: 18px;
  font-weight: 700;
  border-bottom: 1px solid var(--tms-grey-1);
}
#mobile_top_menu_wrapper .top-menu .sub-menu { background: var(--tms-white); }
#mobile_top_menu_wrapper .top-menu .sub-menu ul[data-depth="0"] > li { border-bottom-color: var(--tms-grey-1); }
#mobile_top_menu_wrapper .js-top-menu-bottom { padding-top: 16px; }
#mobile_top_menu_wrapper .js-top-menu-bottom a { color: var(--tms-black); }
#mobile_top_menu_wrapper .js-top-menu-bottom .dropdown-menu { position: static; float: none; box-shadow: none; }
/* Tablets get the dropdown language button (Classic shows a <select> only below 768px). */
#mobile_top_menu_wrapper .js-top-menu-bottom .language-selector button,
#mobile_top_menu_wrapper .js-top-menu-bottom .currency-selector button { padding: 12px 0; color: var(--tms-black); }

/* ==========================================================================
   Wrapper, breadcrumb, page heroes
   ========================================================================== */
#wrapper {
  padding-top: 0;
  background: var(--tms-white);
  box-shadow: none;
}
#wrapper .breadcrumb {
  margin: 0;
  padding: 32px 0 24px;
  background: transparent;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
}
#wrapper .breadcrumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; }
#wrapper .breadcrumb li { display: inline-flex; align-items: center; }
#wrapper .breadcrumb li a, #wrapper .breadcrumb li span { color: var(--tms-black); }
#wrapper .breadcrumb li a:hover span { text-decoration: underline; }
#wrapper .breadcrumb li::after {
  content: "";
  width: 6px;
  height: 6px;
  margin: 0 12px 0 10px;
  border-right: 1.5px solid currentColor;
  border-top: 1.5px solid currentColor;
  transform: rotate(45deg);
  opacity: .7;
}
#wrapper .breadcrumb li:last-child::after { display: none; }
#wrapper .breadcrumb li:last-child span { font-weight: 800; }
#index #wrapper .breadcrumb, #wrapper .breadcrumb[data-depth="1"] { display: none; }

/* Category hero: full-width light grey band with dark text */
.page-hero {
  background: var(--tms-hero-bg);
  color: var(--tms-black);
  margin-bottom: 64px;
}
.page-hero .breadcrumb li a, .page-hero .breadcrumb li span { color: var(--tms-black) !important; }
.page-hero .breadcrumb li::after { color: var(--tms-grey-11); }
.page-hero .block-category {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 48px;
  min-height: 0;
  margin: 0;
  padding: 40px 0 88px;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.page-hero .block-category--with-cover { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); padding-bottom: 64px; }
.page-hero .block-category--compact { padding: 16px 0 48px; }
.page-hero .block-category h1 {
  margin: 0 0 20px;
  color: var(--tms-black);
  font-size: 56px;
  line-height: 64px;
}
.page-hero #category-description,
.page-hero #category-description p,
.page-hero #category-description li,
.page-hero #category-description strong {
  max-width: 760px;
  color: var(--tms-black) !important;
  font-size: 20px;
  line-height: 30px;
  font-weight: 300;
}
.page-hero #category-description a { color: var(--tms-black); text-decoration: underline; }
.page-hero #category-description a:hover { color: var(--tms-red); }
.page-hero .category-cover { margin: 0; }
.page-hero .category-cover img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 460px;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* ==========================================================================
   Home page
   ========================================================================== */
.page-home > * + * { margin-top: 24px; }

/* Hero slider: cream band, headline left, picture right */
#carousel.hero-slider {
  /* Slides are capped at this width and centred; controls use --tms-slider-edge to line up with them. */
  --tms-slider-max: 1920px;
  --tms-slider-edge: max(var(--tms-gutter), calc((100% - var(--tms-slider-max)) / 2 + var(--tms-gutter)));
  position: relative;
  left: auto;
  right: auto;
  width: auto;
  margin: 0 calc(50% - 50vw) 0;
  background: var(--tms-slider-bg);
  color: var(--tms-slider-fg);
}
#index #content-wrapper > .page-home:first-child,
#index #wrapper > .container > .row { margin-top: 0; }
.hero-slider .carousel-inner {
  height: auto !important;
  max-width: var(--tms-slider-max);
  margin: 0 auto;
  overflow: hidden;
  box-shadow: none;
}
.hero-slider .carousel-item { height: auto; }
#carousel.hero-slider .carousel-item figure.hero-slider__slide {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
  align-items: center;
  gap: 48px;
  width: 100%;
  min-height: 460px;
  margin: 0;
  padding: 24px var(--tms-gutter) 72px;
}
.hero-slider .hero-slider__caption {
  position: static;
  max-width: 640px;
  color: var(--tms-slider-fg);
}
.hero-slider .hero-slider__title {
  margin: 0 0 20px;
  color: var(--tms-slider-fg);
  font-size: 56px;
  line-height: 64px;
}
.hero-slider .hero-slider__text, .hero-slider .hero-slider__text p {
  margin: 0;
  color: var(--tms-slider-fg) !important;
  font-size: 20px;
  line-height: 30px;
  font-weight: 300;
}
.hero-slider .hero-slider__text h3 { color: var(--tms-slider-fg); font-size: 16px; font-weight: 400; margin-bottom: 12px; }
.hero-slider .hero-slider__cta { margin-top: 32px; }
.hero-slider .hero-slider__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.hero-slider .carousel-indicators.hero-slider__indicators {
  position: absolute;
  left: auto;
  right: var(--tms-slider-edge);
  bottom: 32px;
  width: auto;
  margin: 0;
  display: flex;
  gap: 8px;
}
.hero-slider .carousel-indicators li {
  width: 66px;
  height: 2px;
  margin: 0;
  border: 0;
  border-radius: 0;
  text-indent: -999px;
  background: var(--tms-slider-line);
}
.hero-slider .carousel-indicators li.active { width: 66px; height: 2px; background: var(--tms-red); }
.hero-slider .direction { position: absolute; left: var(--tms-slider-edge); bottom: 20px; display: flex; gap: 12px; }
/* Square outlined prev/next buttons; Bootstrap's gradient, text-shadow and fade are removed. */
.hero-slider .carousel-control {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--tms-black);
  background: transparent;
  background-image: none;
  border: 2px solid var(--tms-black);
  border-radius: 0;
  opacity: 1;
  text-shadow: none;
  transition: background-color .2s var(--tms-ease), color .2s var(--tms-ease);
}
.hero-slider .carousel-control:hover, .hero-slider .carousel-control:focus { color: var(--tms-white); background: var(--tms-black); opacity: 1; text-decoration: none; }
.hero-slider .carousel-control:focus-visible { outline: 2px solid var(--tms-black); outline-offset: 2px; }
.hero-slider .carousel-control .icon-next, .hero-slider .carousel-control .icon-prev {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0;
  font-size: 24px;
  line-height: 1;
  text-shadow: none;
}
.hero-slider .carousel-control .icon-next::before, .hero-slider .carousel-control .icon-prev::before { content: none; }
.hero-slider .carousel-control .icon-next i, .hero-slider .carousel-control .icon-prev i {
  font-size: 24px;
  line-height: 1;
  color: inherit;
  text-shadow: none;
}
/* Classic colours the chevron on hover with a more specific selector. */
#carousel.hero-slider .carousel-control .icon-next i, #carousel.hero-slider .carousel-control .icon-prev i,
#carousel.hero-slider .carousel-control .icon-next:hover i, #carousel.hero-slider .carousel-control .icon-prev:hover i { color: inherit; }

/* TIMAS teaser panels: soft colour boxes with centred heading and red CTA */
.featured-products,
.product-accessories,
#content .featured-products {
  position: relative;
  margin: 24px 0 0;
  padding: 120px 0;
  background: var(--tms-wheat);
}
#content.page-home .featured-products[data-type="newproducts"] { background: var(--tms-sage); }
#content.page-home .featured-products[data-type="bestsellers"] { background: var(--tms-rosemary); }
#content.page-home .featured-products[data-type="onsale"] { background: var(--tms-lavender); }
.featured-products .products-section-title,
.product-accessories .products-section-title,
.products-section-title {
  max-width: 660px;
  margin: 0 auto 48px;
  text-align: center !important;
  font-size: 34px;
  line-height: 44px;
  font-weight: 600;
  text-transform: none;
}
.featured-products .products,
.product-accessories .products {
  max-width: 1392px;
  margin: 0 auto;
  padding: 0 24px;
}
.products-section-cta { margin-top: 48px; text-align: center; clear: both; }
.featured-products .all-product-link.btn, .product-accessories .all-product-link.btn, #products .all-product-link.btn {
  float: none;
  display: inline-block;
  color: var(--tms-white);
  font-weight: 600;
}
.featured-products .all-product-link.btn:hover, .featured-products .all-product-link.btn:focus { color: var(--tms-white); }

/* Custom text block: editorial text on white */
#custom-text {
  max-width: 1104px;
  margin: 24px auto 0;
  padding: 120px 24px;
  text-align: left;
  background: transparent;
  border-radius: 0;
}
#custom-text h2, #custom-text h3 { font-size: 34px; line-height: 44px; font-weight: 600; margin: 0 0 20px; text-transform: none; }
#custom-text strong { font-weight: 600; }
#custom-text p { max-width: 760px; margin: 0 0 16px; color: var(--tms-black); font-size: 16px; line-height: 26px; }
#custom-text p.dark { color: var(--tms-black); }

/* Banner: edge-to-edge image */
.banner { display: block; margin: 24px 0 0; }
.banner img { display: block; width: 100%; height: auto; }

/* Reassurance: TIMAS icon-grid with hairline dividers */
#block-reassurance { margin: 0; }
#block-reassurance ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}
#block-reassurance li {
  flex: 1 1 220px;
  padding: 24px 40px;
  border: 0;
  border-left: 1px solid var(--tms-grey-1);
}
#block-reassurance li:first-child { border-left: 0; }
#block-reassurance li .block-reassurance-item { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 0; }
#block-reassurance img { width: 48px; height: 48px; margin: 0; }
#block-reassurance li .block-reassurance-item span,
#block-reassurance span.h6 {
  color: var(--tms-black);
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}
#product #block-reassurance { margin-top: 32px; background: var(--tms-grey-5); box-shadow: none; }
#product #block-reassurance li { flex-basis: 100%; padding: 16px 24px; border-left: 0; border-bottom: 1px solid var(--tms-white); }

/* ==========================================================================
   Product miniatures (TIMAS product cards)
   ========================================================================== */
.products { display: flex; flex-wrap: wrap; }
.products .product, .products .js-product { display: flex; margin-bottom: 24px; }
.product-miniature { width: 100%; margin: 0; }
.product-miniature .thumbnail-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  margin: 0;
  background: var(--tms-white);
  border: 0;
  box-shadow: none;
  transition: box-shadow .25s var(--tms-ease);
}
.product-miniature .thumbnail-container:hover,
.product-miniature .thumbnail-container:focus-within { box-shadow: 0 8px 28px rgba(1, 1, 1, .08); }
.product-miniature .thumbnail-container:hover .product-description::after,
.product-miniature .thumbnail-container:focus .product-description::after { display: none; }
.product-miniature .thumbnail-top { position: relative; }
.product-miniature .product-thumbnail {
  display: block;
  height: auto;
  padding: 32px;
  background: var(--tms-white);
}
.product-miniature .product-thumbnail img {
  position: static;
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
  transition: transform .4s var(--tms-ease);
}
.product-miniature:hover .product-thumbnail img { transform: scale(1.03); }
.product-miniature .product-description {
  position: static;
  flex: 1 1 auto;
  width: 100%;
  height: auto;
  min-height: 0;
  padding: 24px 24px 28px;
  text-align: left;
  background: var(--tms-white);
  border-top: 1px solid var(--tms-grey-1);
  box-shadow: none;
}
.product-miniature .product-title {
  margin: 0 0 8px;
  font-size: 16px;
  line-height: 24px;
  text-align: left;
  text-transform: none;
}
.product-miniature .product-title a {
  color: var(--tms-black);
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}
.product-miniature .product-title a:hover { color: var(--tms-red); }
.product-miniature .product-price-and-shipping {
  text-align: left;
  color: var(--tms-black);
  font-size: 16px;
  font-weight: 700;
}
.product-miniature .regular-price { color: var(--tms-grey-8); font-weight: 400; margin-right: 6px; }
.product-miniature .discount-product { color: var(--tms-red); font-weight: 700; margin-right: 6px; }

/* Quick view + variants bar */
.product-miniature .highlighted-informations {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: auto;
  padding: 12px 24px;
  background: rgba(255, 255, 255, .96);
  box-shadow: none;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .2s var(--tms-ease), transform .2s var(--tms-ease);
}
.product-miniature .thumbnail-container:hover .highlighted-informations,
.product-miniature .thumbnail-container:focus-within .highlighted-informations { opacity: 1; transform: none; bottom: 0; }
.product-miniature .highlighted-informations .quick-view { color: var(--tms-black); font-size: 12px; font-weight: 500; }
.product-miniature .highlighted-informations .quick-view:hover { color: var(--tms-red); }
/* Quick view is removed from the card template, so the hover bar only remains for colour variants. */
.product-miniature .highlighted-informations.no-variants { display: none; }
/* Wishlist heart is injected by the blockwishlist module; hidden on cards (still on the product page). */
.product-miniature .wishlist-button-add { display: none !important; }
.product-miniature .variant-links { width: auto; min-height: 0; padding: 0; background: transparent; margin: 0; }
.variant-links .color, .product-variants .color { width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--tms-grey-1); box-shadow: none; }

/* Flags */
.product-flags { padding: 16px; gap: 8px; }
.product-flags li.product-flag {
  margin: 0;
  padding: 4px 10px;
  min-width: 0;
  min-height: 0;
  font-size: 12px;
  line-height: 18px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--tms-white);
  background: var(--tms-black);
  box-shadow: none;
}
.product-flags li.product-flag.discount,
.product-flags li.product-flag.discount-amount,
.product-flags li.product-flag.discount-percentage,
.product-flags li.product-flag.on-sale { background: var(--tms-red); width: fit-content; text-align: left; }
.product-flags li.product-flag.new { background: var(--tms-black); }

/* ==========================================================================
   Listing pages
   ========================================================================== */
#category #wrapper, #search #wrapper, #best-sales #wrapper, #new-products #wrapper,
#prices-drop #wrapper, #manufacturer #wrapper, #supplier #wrapper { padding-bottom: 96px; }

#products, #js-product-list { background: transparent; }
#js-product-list .products, #products .products {
  margin: 0 -12px;
}
#js-product-list .products .product, #products .products .product { padding: 0 12px; }
/* TIMAS product grid sits on light grey */
#category #content-wrapper #main, #search #content-wrapper #main,
#best-sales #content-wrapper #main, #new-products #content-wrapper #main,
#prices-drop #content-wrapper #main, #manufacturer #content-wrapper #main, #supplier #content-wrapper #main {
  background: transparent;
}
#js-product-list {
  padding: 24px 24px 8px;
  background: var(--tms-grey-5);
}
#js-product-list .products { margin: 0 -12px; }

#js-product-list-top,
#products .products-selection {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 24px;
  padding: 0;
  border: 0;
}
#js-product-list-top .total-products p,
.products-selection .total-products p { margin: 0; font-size: 14px; color: var(--tms-black); }
/* Sort toolbar: "Sort by:" label + compact dropdown, right aligned. Classic grid columns are neutralised. */
.products-selection > [class*="col-"] { flex: 0 0 auto; width: auto; max-width: none; padding: 0; }
.products-selection .total-products { flex: 1 1 auto; }
.products-selection .sort-by-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin: 0;
}
.products-selection .sort-by-row > [class*="col-"] { flex: 0 0 auto; width: auto; max-width: none; padding: 0; }
.products-selection .sort-by {
  margin: 0;
  color: var(--tms-black);
  font-size: 14px;
  line-height: 20px;
  text-align: right;
  white-space: nowrap;
}
.products-selection .sort-by-row > .products-sort-order { position: relative; width: 260px; }
.products-sort-order .select-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  height: 48px;
  margin: 0;
  padding: 0 12px 0 16px;
  color: var(--tms-black);
  font-size: 14px;
  line-height: 20px;
  text-align: left;
  background: var(--tms-white);
  border: 1px solid var(--tms-black);
  border-radius: 0;
  box-shadow: none;
  cursor: pointer;
}
.products-sort-order .select-title .material-icons {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  float: none !important;
  margin: 0;
  font-size: 24px;
  line-height: 24px;
  vertical-align: middle;
  transition: transform .2s var(--tms-ease);
}
.products-sort-order.show .select-title .material-icons, .products-sort-order .select-title[aria-expanded="true"] .material-icons { transform: rotate(180deg); }
.products-sort-order .dropdown-menu {
  left: 0;
  right: 0;
  width: 100%;
  min-width: 100%;
  margin: -1px 0 0;
  padding: 8px 0;
  text-align: left;
  background: var(--tms-white);
  border: 1px solid var(--tms-black);
  border-radius: 0;
  box-shadow: 0 12px 32px rgba(1, 1, 1, .12);
}
.products-sort-order .select-list {
  display: block;
  padding: 10px 16px;
  color: var(--tms-black);
  font-size: 14px;
  line-height: 20px;
}
.products-sort-order .select-list.current { color: var(--tms-red); font-weight: 700; }
.products-sort-order .select-list:hover, .products-sort-order .select-list:focus { color: var(--tms-white); background: var(--tms-red); text-decoration: none; }
.products-selection .filter-button .btn { height: 48px; padding: 0 20px; }
@media (max-width: 767px) {
  .products-selection .total-products { display: none; }
  .products-selection > [class*="col-"]:not(.total-products):not(.showing) { flex: 1 1 100%; }
  .products-selection .sort-by-row { justify-content: stretch; }
  .products-selection .sort-by-row > .products-sort-order { flex: 1 1 auto; width: auto; }
  .products-selection .showing { flex: 1 1 100%; margin-top: 12px; font-size: 14px; text-align: left; }
}

#subcategories, #subcategories.card { margin: 0 0 40px; padding: 0; border: 0; background: transparent; }
#subcategories .subcategory-heading { font-size: 22px; line-height: 30px; margin-bottom: 24px; }
#subcategories ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0; margin: 0; border-top: 1px solid var(--tms-grey-1); }
#subcategories ul li { width: auto; margin: 0; padding: 20px; border-right: 1px solid var(--tms-grey-1); border-bottom: 1px solid var(--tms-grey-1); text-align: left; }
#subcategories ul li:hover { background: var(--tms-grey-5); }
#subcategories ul li .subcategory-image { padding: 0 0 12px; }
#subcategories ul li .subcategory-image a { padding: 0; border: 0; }
#subcategories ul li .subcategory-name { color: var(--tms-black); font-size: 14px; font-weight: 700; text-transform: none; }

/* Pagination */
.pagination { margin: 32px 0 16px; font-size: 14px; }
.pagination .page-list { padding: 0; background: transparent; box-shadow: none; }
.pagination a, .pagination .current a { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 8px; color: var(--tms-black); font-weight: 500; }
.pagination .current a { color: var(--tms-white); background: var(--tms-red); font-size: 14px; }
.pagination a:hover { color: var(--tms-red); }

/* Left column + faceted search */
#left-column { padding-top: 0; }
#left-column .block-categories, #search_filters, #search_filters_brands, #search_filters_suppliers {
  padding: 0;
  margin-bottom: 32px;
  background: transparent;
  border: 0;
  box-shadow: none;
}
#left-column .block-categories .h6, #search_filters .h6, #search_filters > p.h6 {
  margin-bottom: 16px;
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 1.08px;
  text-transform: uppercase;
  color: var(--tms-grey-11);
}
#left-column .block-categories a { color: var(--tms-black); }
#left-column .block-categories a:hover { color: var(--tms-red); }
#search_filters .facet { padding: 16px 0; border-top: 1px solid var(--tms-grey-1); }
#search_filters .facet .facet-title { font-size: 16px; font-weight: 700; color: var(--tms-black); text-transform: none; }
#search_filters .facet .facet-label a { color: var(--tms-black); font-size: 14px; }
#search_filters .facet .facet-label.active a, #search_filters .facet .facet-label a:hover { color: var(--tms-red); }
#search_filters .js-search-filters-clear-all, .active_filters .filter-block .close { color: var(--tms-red); }
.active_filters { padding: 16px 0; background: transparent; margin-bottom: 16px; }
.active_filters .active-filter-title { font-weight: 700; font-size: 14px; }
.active_filters .filter-block {
  padding: 6px 12px;
  margin: 4px 8px 4px 0;
  font-size: 14px;
  background: var(--tms-white);
  border: 1px solid var(--tms-black);
  box-shadow: none;
}

.block-category-footer, #js-product-list-footer .card { border: 0; box-shadow: none; background: transparent; }

/* ==========================================================================
   Product page
   ========================================================================== */
#product #wrapper { padding-bottom: 96px; }
#product #content { max-width: none; }
#product .product-cover, #product .images-container .product-cover {
  margin-bottom: 16px;
  background: var(--tms-grey-5);
}
#product .product-cover img { background: transparent; box-shadow: none; mix-blend-mode: multiply; }
#product .product-cover .layer { background: rgba(255, 255, 255, .4); }
#product .product-cover .layer .zoom-in { color: var(--tms-black); }
#product .product-images > li.thumb-container .thumb { border: 2px solid transparent; background: var(--tms-grey-5); }
#product .product-images > li.thumb-container .thumb.selected,
#product .product-images > li.thumb-container .thumb:hover { border: 2px solid var(--tms-black); }
#product h1, #product .h1 {
  margin: 0 0 20px;
  font-size: 34px;
  line-height: 44px;
  text-transform: none;
}
#product .product-prices { margin: 24px 0; }
#product .product-prices .current-price, #product .product-price { color: var(--tms-black); font-size: 30px; line-height: 40px; font-weight: 700; }
#product .product-discount .regular-price { color: var(--tms-grey-8); }
#product .discount { background: var(--tms-red); color: var(--tms-white); font-weight: 700; }
#product .tax-shipping-delivery-label { color: var(--tms-grey-11); font-size: 14px; }
#product #product-description-short, #product .product-information { color: var(--tms-black); font-size: 16px; line-height: 26px; }
.product-actions .control-label { font-size: 14px; font-weight: 700; color: var(--tms-black); }
.product-variants > .product-variants-item select { min-height: 48px; border: 1px solid var(--tms-black); border-radius: 0; box-shadow: none; }
.product-variants > .product-variants-item .color.active, .product-variants > .product-variants-item .color:hover { border: 2px solid var(--tms-black); }
.product-variants > .product-variants-item .input-color:checked + span { border: 2px solid var(--tms-black); }
.product-variants > .product-variants-item .input-radio:checked + span { background-color: var(--tms-black); border-color: var(--tms-black); color: var(--tms-white); }
.product-variants > .product-variants-item .radio-label { border-radius: 0; box-shadow: none; border: 1px solid var(--tms-black); font-weight: 500; }
.product-quantity .qty .input-group { height: 62px; }
.product-quantity #quantity_wanted { height: 62px; border: 1px solid var(--tms-black); color: var(--tms-black); font-weight: 700; }
.bootstrap-touchspin .btn-touchspin { height: 31px; border-color: var(--tms-black); background: var(--tms-white); border-radius: 0 !important; }
.product-quantity .add .btn, .product-add-to-cart .add-to-cart {
  height: 62px;
  min-width: 240px;
  padding: 20px 32px;
  font-size: 16px;
}
.product-add-to-cart .add-to-cart .material-icons { line-height: 1; }
#product-availability { font-size: 14px; font-weight: 500; }
#product-availability .product-available { color: #2d462d; }
#product-availability .product-unavailable, #product-availability .product-last-items { color: var(--tms-red); }
.social-sharing { margin-top: 24px; }

/* Tabs */
.tabs {
  margin-top: 64px;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.tabs .nav-tabs { border-bottom: 1px solid var(--tms-grey-1); display: flex; flex-wrap: wrap; gap: 32px; }
.tabs .nav-tabs .nav-item { margin: 0; }
.tabs .nav-tabs .nav-link {
  padding: 16px 0;
  margin-bottom: -1px;
  color: var(--tms-black);
  font-size: 16px;
  font-weight: 500;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
}
.tabs .nav-tabs .nav-link.active, .tabs .nav-tabs .nav-link:hover {
  color: var(--tms-black);
  border: 0;
  border-bottom: 2px solid var(--tms-red);
  background: transparent;
}
.tabs .tab-pane { padding: 32px 0; font-size: 16px; line-height: 26px; }
.product-features > dl.data-sheet dd.value, .product-features > dl.data-sheet dt.name {
  padding: 12px 16px;
  margin-right: 0;
  margin-bottom: 0;
  font-size: 14px;
  background: transparent;
  border-bottom: 1px solid var(--tms-grey-1);
}
.product-features > dl.data-sheet dt.name { font-weight: 700; color: var(--tms-black); text-transform: none; }
.product-features > dl.data-sheet dd.value:nth-of-type(even), .product-features > dl.data-sheet dt.name:nth-of-type(even) { background: var(--tms-grey-5); }

/* Accessories / related products on product page */
#product .product-accessories,
#product .featured-products {
  margin: 80px calc(50% - 50vw) 0;
  padding: 96px var(--tms-gutter);
  background: var(--tms-grey-5);
}

/* Quick view + modals */
.modal-content { border-radius: 0; border: 0; }
.quickview .modal-content { background: var(--tms-white); }
#blockcart-modal .modal-header { background: var(--tms-red); }
#blockcart-modal .modal-title, #blockcart-modal .modal-header .close .material-icons { color: var(--tms-white); }
#blockcart-modal .modal-title i.material-icons { color: var(--tms-white); }
#blockcart-modal .product-name { color: var(--tms-black); font-weight: 700; }
#blockcart-modal .cart-content p.product-total { background: var(--tms-grey-5); }

/* ==========================================================================
   Cart, checkout, account, CMS
   ========================================================================== */
.card, .cart-grid-body .card, .cart-grid-right .card, .cart-summary, #order-summary-content .card {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: var(--tms-grey-5);
}
.cart-grid-body .card-block h1 { font-size: 24px; line-height: 32px; text-transform: none; }
.cart-item { border-bottom: 1px solid var(--tms-grey-1); }
.product-line-grid-body > .product-line-info > .label { color: var(--tms-black); font-weight: 700; }
.cart-summary-line .label, .cart-summary-line .value { color: var(--tms-black); }
.cart-summary-totals .cart-total { background: var(--tms-white); }
.block-promo .promo-code { background: var(--tms-white); }
body#checkout section.checkout-step { border-bottom: 1px solid var(--tms-grey-1); box-shadow: none; }
body#checkout section.checkout-step .step-title { font-size: 18px; font-weight: 600; text-transform: none; }
body#checkout section.checkout-step.-current .step-title { color: var(--tms-red); }
body#checkout section.checkout-step .step-number { border-radius: 0; }
body#checkout #header { position: static; }

.page-content.page-cms, #content.page-content, .page-content {
  padding: 0;
  background: transparent;
  box-shadow: none;
  border: 0;
}
.page-header h1 { margin: 24px 0 32px; font-size: 34px; line-height: 44px; }
#cms .page-header h1 { font-size: 56px; line-height: 64px; }
/* Classic justifies CMS page text (.page-content.page-cms); TIMAS uses normal left-aligned text. */
#cms .page-content.page-cms { max-width: 860px; font-size: 16px; line-height: 26px; text-align: left; }
.page-my-account #content .links a span.link-item {
  padding: 32px 24px;
  border-radius: 0;
  box-shadow: none;
  background: var(--tms-grey-5);
  color: var(--tms-black);
  font-weight: 700;
}
.page-my-account #content .links a:hover span.link-item { background: var(--tms-red); color: var(--tms-white); }
.page-my-account #content .links a i { color: var(--tms-red); }
.page-my-account #content .links a:hover i { color: var(--tms-white); }
.page-footer .account-link, .page-footer .text-sm-center a { color: var(--tms-red); font-weight: 700; }
.table thead th, .thead-default th { background: var(--tms-black); color: var(--tms-white); border: 0; }
.alert { border-radius: 0; }
.alert-info { background: var(--tms-rosemary); border-color: var(--tms-rosemary); color: var(--tms-black); }

/* ==========================================================================
   Footer: light rosemary (#d6e2e2) with dark content.
   On #d6e2e2: text and links (#080F0F) ~14:1, muted (#53565a) ~5.7:1.
   ========================================================================== */
#footer {
  --tms-footer-fg: var(--tms-black);
  --tms-footer-link: var(--tms-black);
  --tms-footer-muted: var(--tms-grey-11);
  --tms-footer-line: rgba(8, 15, 15, .16);
  margin-top: 0;
  padding: 0;
  background: var(--tms-footer-bg);
  color: var(--tms-footer-fg);
}
#footer :focus-visible { outline-color: var(--tms-black); }

/* Pre-footer (newsletter) */
.footer-before { background: transparent; color: var(--tms-footer-fg); padding: 72px 0; border-bottom: 1px solid var(--tms-footer-line); }
.footer-before .row { align-items: center; }
.footer-before .block_newsletter {
  border: 0;
  max-width: none;
  margin: 0;
  padding: 0 15px;
  background: transparent;
  width: 100%;
  flex: 1 1 100%;
}
.footer-before .block_newsletter > .row { display: flex; flex-wrap: wrap; align-items: center; }
.footer-before #block-newsletter-label {
  margin: 0 0 16px;
  color: var(--tms-footer-fg);
  font-size: 26px;
  line-height: 36px;
  font-weight: 600;
}
.footer-before .block_newsletter form { position: relative; }
.footer-before .block_newsletter form .input-wrapper { overflow: hidden; }
.footer-before .block_newsletter form input[type=email] {
  width: 100%;
  height: 62px;
  padding: 12px 16px;
  color: var(--tms-black);
  border: 1px solid var(--tms-black);
  border-right: 0;
  background: var(--tms-white);
}
.footer-before .block_newsletter form input[type=email]::placeholder { color: var(--tms-grey-11); opacity: 1; }
.footer-before .block_newsletter form input[type=email]:focus { outline: 2px solid var(--tms-black); outline-offset: 0; }
.footer-before .block_newsletter form input.btn { height: 62px; padding: 0 32px; }
.footer-before .block_newsletter p { color: var(--tms-footer-muted); font-size: 12px; line-height: 18px; padding-top: 12px; }
.footer-before .block_newsletter .alert { color: var(--tms-black); }
.footer-before .block-social .block-social__title { color: var(--tms-footer-fg); }
.footer-before .block-social ul li { filter: none; }

.footer-container {
  margin: 0;
  padding: 64px 0 32px;
  color: var(--tms-footer-fg);
  background: transparent;
  box-shadow: none;
  overflow: visible;
  border: 0;
}
.footer-container .footer-main { display: flex; flex-wrap: wrap; row-gap: 32px; }
.block-social {
  text-align: center;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid var(--tms-footer-line);
}
.block-social__title, #footer .block-social__title {
  margin: 0 0 16px;
  color: var(--tms-footer-fg);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 1.08px;
  text-transform: uppercase;
}
.block-social ul { display: flex; justify-content: center; gap: 16px; margin: 0; padding: 0; }
/* Social icons are SVG backgrounds; brightness(0) renders them in solid black. */
.block-social ul li {
  width: 32px;
  height: 32px;
  margin: 0;
  background-color: transparent;
  background-size: 24px 24px;
  background-position: center;
  border-radius: 0;
  filter: brightness(0);
  transition: opacity .2s var(--tms-ease);
}
.block-social ul li:hover { background-color: transparent; opacity: .7; }

.footer-container .links .h3,
.footer-container .h3,
#footer .footer-container .links p.h3,
.footer-container .block-contact .block-contact-title,
.footer-container .myaccount-title, #footer .footer-container .myaccount-title a {
  margin: 0 0 20px;
  color: var(--tms-footer-fg);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 1.08px;
  text-transform: uppercase;
}
.footer-container .links ul { margin: 0; padding: 0; background: transparent; }
.footer-container .links ul > li { margin: 0 0 20px; }
.footer-container li a, .footer-container .links ul > li a, #footer .footer-container a {
  color: var(--tms-footer-link);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.footer-container li a:hover, .footer-container li a:focus,
#footer .footer-container a:hover, #footer .footer-container a:focus { color: var(--tms-footer-fg); text-decoration: underline; }
.footer-container .block-contact { color: var(--tms-footer-muted); font-size: 14px; line-height: 22px; }
.footer-container .block-contact #contact-infos { color: var(--tms-footer-muted); }
.footer-container .block-contact a, .footer-container .block-contact span { color: var(--tms-footer-fg); }
.footer-container .footer-after { margin-top: 24px; }
.footer-container .footer-after #block-reassurance li { border-color: var(--tms-footer-line); }
.footer-container .footer-after #block-reassurance span { color: var(--tms-footer-fg); }
.footer-container .footer-after #block-reassurance img { filter: brightness(0); }

.footer-legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px 36px;
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--tms-footer-line);
  color: var(--tms-footer-muted);
  font-size: 14px;
}
.footer-legal p { margin: 0; color: var(--tms-footer-muted); }
.footer-legal__links { display: flex; flex-wrap: wrap; gap: 12px 36px; margin: 0; padding: 0; list-style: none; }
#footer .footer-legal a { color: var(--tms-footer-link); font-weight: 400; }
#footer .footer-legal a:hover, #footer .footer-legal a:focus { color: var(--tms-footer-fg); text-decoration: underline; }

/* Mobile accordion titles in footer */
.footer-container .links .title { padding: 16px 0; border-bottom: 1px solid var(--tms-footer-line); }
.footer-container .links .title .h3 { margin: 0; color: var(--tms-footer-fg); }
.footer-container .links .navbar-toggler .material-icons { color: var(--tms-footer-fg); }
.footer-container .links ul > li { border-color: var(--tms-footer-line); }
.footer-container .links ul.collapse { background: transparent; }

/* Checkout uses its own minimal footer; same colours. */
body#checkout #footer { background: var(--tms-footer-bg); color: var(--tms-footer-fg); }
body#checkout #footer a, body#checkout #footer .text-sm-center a { color: var(--tms-footer-link); }
body#checkout #footer a:hover { color: var(--tms-footer-fg); }
body#checkout #footer #block-reassurance span { color: var(--tms-footer-fg); }
body#checkout #footer #block-reassurance img { filter: brightness(0); }

/* Back to top */
.back-to-top {
  position: fixed;
  right: var(--tms-gutter);
  bottom: 24px;
  z-index: 90;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  color: var(--tms-white);
  background: var(--tms-red);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .2s var(--tms-ease), transform .2s var(--tms-ease), visibility .2s, background-color .2s;
}
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.back-to-top:hover, .back-to-top:focus { color: var(--tms-white); background: var(--tms-red-dark); }
.back-to-top .material-icons { font-size: 28px; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1199px) {
  :root { --tms-gutter: 32px; }
  .header-bar { gap: 24px; }
  #_desktop_top_menu .top-menu[data-depth="0"] { gap: 4px 20px; }
  #header .header-nav .user-info span.hidden-sm-down,
  #header .header-nav .blockcart .header > span.hidden-sm-down,
  .header-bar__contact { display: none; }
  h1, .h1, .hero-slider .hero-slider__title, .page-hero .block-category h1 { font-size: 46px; line-height: 54px; }
}

@media (max-width: 991px) {
  /* Top bar is desktop only. */
  :root { --tms-topbar-h: 0px; }
  #header .header-topbar { display: none; }
  #carousel.hero-slider .carousel-item figure.hero-slider__slide { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-top: 40px; }
  .page-hero .block-category--with-cover { grid-template-columns: minmax(0, 1fr); }
  .featured-products, .product-accessories, #content .featured-products { padding: 80px 0; }
}

@media (max-width: 767px) {
  :root { --tms-gutter: 24px; --tms-header-h: 64px; }
  .header-bar { min-height: 64px; }
  .tms-search-modal__body { padding-top: 24px; }
  .tms-search-modal__title { margin-bottom: 56px; font-size: 40px; line-height: 48px; }
  .tms-search-modal #search_widget form input[type=text] { min-height: 56px; padding: 12px 40px; font-size: 18px; }
  .tms-search-modal #search_widget form i.search, .tms-search-modal #search_widget form i.clear { font-size: 24px; }
  h1, .h1, .hero-slider .hero-slider__title, .page-hero .block-category h1, #cms .page-header h1 { font-size: 32px; line-height: 40px; }
  h2, .h2, .products-section-title, .featured-products .products-section-title, #custom-text h2 { font-size: 24px; line-height: 32px; }
  h3, .h3 { font-size: 20px; line-height: 28px; }
  #product h1, #product .h1 { font-size: 24px; line-height: 32px; }

  #header .header-nav .user-info a span, #header .header-nav .blockcart .header > span:not(.cart-products-count) { display: none; }

  #carousel.hero-slider .carousel-item figure.hero-slider__slide { min-height: 0; padding: 32px var(--tms-gutter) 80px; }
  .hero-slider .hero-slider__text, .hero-slider .hero-slider__text p { font-size: 18px; line-height: 27px; }
  .hero-slider .carousel-indicators li, .hero-slider .carousel-indicators li.active { width: 40px; }

  .featured-products, .product-accessories, #content .featured-products { padding: 64px 0; }
  .featured-products .products { padding: 0 8px; }
  #custom-text { padding: 64px var(--tms-gutter); }

  .page-hero { margin-bottom: 40px; }
  .page-hero .block-category { padding: 24px 0 48px; }
  .page-hero #category-description, .page-hero #category-description p { font-size: 18px; line-height: 27px; }

  #js-product-list { padding: 16px 16px 4px; margin: 0 calc(var(--tms-gutter) * -1); }
  .product-miniature .product-thumbnail { padding: 24px; }
  .product-miniature .product-title a { font-size: 16px; line-height: 24px; }

  #block-reassurance li { flex-basis: 100%; border-left: 0; border-top: 1px solid var(--tms-grey-1); padding: 24px 0; }
  #block-reassurance li:first-child { border-top: 0; }

  .footer-before { padding: 48px 0; }
  .footer-before #block-newsletter-label { font-size: 20px; line-height: 28px; }
  .footer-container { padding-top: 48px; }
  .footer-container .footer-main, .footer-container .footer-main .links > .row { margin-left: 0; margin-right: 0; row-gap: 0; }
  .footer-container .footer-main > *, .footer-container .footer-main .links .wrapper { flex: 0 0 100%; max-width: 100%; width: 100%; padding-left: 0; padding-right: 0; }
  .hero-slider .direction { display: none; }
  .footer-container .links ul > li { margin-bottom: 0; }
  .footer-container .links ul > li a { display: block; padding: 10px 0; }
  .footer-legal { justify-content: flex-start; }
  .back-to-top { right: 16px; bottom: 16px; }

  .tabs .nav-tabs { gap: 20px; }
}

/* Classic colour leftovers mapped to the TIMAS palette */
#header .header-nav .blockcart.active, #header .header-nav .blockcart.active:hover { background: transparent; }
.product-discount .regular-price, .product-line-info .regular-price { color: var(--tms-grey-8); }
.has-discount .discount, .product-line-grid .has-discount .discount { color: var(--tms-white); background: var(--tms-red); }
.has-discount.product-price, .has-discount .price { color: var(--tms-red); }
.product-line-grid-body .has-discount .price, .product-price.has-discount .current-price-value { color: var(--tms-red); }
.cart-grid-body .card-block h1, .cart-grid-body h1.h1 { font-weight: 600; }
#blockcart-modal .cart-content .cart-products-count { color: var(--tms-black); }

/* Prices are text, not headings (Classic marks them up with .h5/.h6). */
.product-prices, .product-prices .h5, .product-prices .h6, .product-price, .current-price, .current-price-value,
.product-discount, .product-discount .regular-price, .product-prices .discount, .cart-summary-line .value {
  font-family: var(--tms-font-text);
}

/* Footer logo: transparent PNG straight on the footer colour. */
.footer-brand {
  display: flex;
  justify-content: center;
  margin: 0 0 40px;
}
.footer-brand a {
  display: inline-flex;
  align-items: center;
  padding: 0;
  background: transparent;
}
#footer .footer-brand a:hover { text-decoration: none; opacity: .9; }
.footer-brand .logo {
  display: block;
  width: auto;
  max-width: 180px;
  max-height: 48px;
  height: auto;
}
@media (max-width: 767px) {
  .footer-brand { margin-bottom: 32px; }
}

/* ==========================================================================
   TIMAS CTA module (modules/timascta): image left, text and button right,
   on a wheat panel. Without an image the text spans the full panel.
   ========================================================================== */
.tms-cta { margin: 0 0 64px; background: var(--tms-wheat); color: var(--tms-black); }
.tms-cta__inner {
  display: grid;
  grid-template-columns: minmax(0, 370px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(32px, 8vw, 112px);
  padding: 40px clamp(24px, 8vw, 126px);
}
.tms-cta--no-image .tms-cta__inner { grid-template-columns: minmax(0, 1fr); padding-top: 64px; padding-bottom: 64px; }
.tms-cta__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  /* Whole image fitted inside the square; any leftover space shows the panel colour. */
  object-fit: contain;
}
.tms-cta__body { max-width: 560px; }
.tms-cta__title {
  margin: 0 0 16px;
  color: var(--tms-black);
  font-size: 44px;
  line-height: 48px;
}
.tms-cta__text, .tms-cta__text p { margin: 0; color: var(--tms-black); font-size: 16px; line-height: 24px; }
.tms-cta__text p + p { margin-top: 12px; }
.tms-cta__text a { color: var(--tms-black); text-decoration: underline; }
.tms-cta__button { margin-top: 24px; padding: 14px 24px; }
@media (max-width: 767px) {
  .tms-cta { margin-bottom: 48px; }
  .tms-cta__inner { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 24px; }
  .tms-cta__title { font-size: 28px; line-height: 36px; }
}

/* ==========================================================================
   TIMAS Services module (modules/timasservices): heading, 3-column card grid
   with thin dividers (2 on tablets, 1 on phones), optional button.
   ========================================================================== */
.tms-services { margin: 80px 0; color: var(--tms-black); }
.tms-services__header { max-width: 760px; margin: 0 auto 40px; text-align: center; }
.tms-services__title { margin: 0 0 12px; }
.tms-services__intro { margin: 0; color: var(--tms-black); font-size: 18px; line-height: 28px; }
.tms-services__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}
.tms-services__item { padding: 32px 28px 36px; border-left: 1px solid var(--tms-grey-1); }
.tms-services__item:nth-child(3n+1) { border-left: 0; }
.tms-services__icon { display: block; width: 48px; height: 48px; margin: 0 0 16px -4px; color: var(--tms-red); }
.tms-services__item-title { margin: 0 0 8px; color: var(--tms-black); font-size: 18px; line-height: 24px; font-weight: 600; letter-spacing: -.01em; }
.tms-services__item-text { margin: 0; color: var(--tms-black); font-size: 14px; line-height: 22px; }
.tms-services__footer { margin-top: 48px; text-align: center; }
@media (max-width: 991px) {
  .tms-services__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tms-services__item:nth-child(3n+1) { border-left: 1px solid var(--tms-grey-1); }
  .tms-services__item:nth-child(2n+1) { border-left: 0; }
}
@media (max-width: 575px) {
  .tms-services { margin: 56px 0; }
  .tms-services__header { margin-bottom: 16px; text-align: left; }
  .tms-services__intro { font-size: 16px; line-height: 24px; }
  .tms-services__grid { grid-template-columns: minmax(0, 1fr); }
  .tms-services__item, .tms-services__item:nth-child(3n+1), .tms-services__item:nth-child(2n+1) { padding: 24px 0; border-left: 0; border-top: 1px solid var(--tms-grey-1); }
}

/* "All products" category page: if the Popular products block is shown there, its
   "All products" button would link back to the same page, so it is hidden. */
.category-depth-level-1 .featured-products[data-type="popularproducts"] .products-section-cta { display: none; }

/* "All products" page: the product list is replaced by the On sale block (see category.tpl). */
.category-depth-level-1 #products { display: none; }

/* ==========================================================================
   TIMAS Categories List module (modules/timascategorieslist): centred heading,
   four columns of category links with small icons (2 on tablets, 1 on phones), optional button.
   ========================================================================== */
.tms-catlist { margin: 80px 0; color: var(--tms-black); }
#index .tms-catlist > .container { padding-left: 0; padding-right: 0; }
.tms-catlist__header { max-width: 760px; margin: 0 auto 40px; text-align: center; }
.tms-catlist__title { margin: 0 0 12px; }
.tms-catlist__subtitle { margin: 0; color: var(--tms-black); font-size: 18px; line-height: 28px; }
.tms-catlist__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 32px; }
.tms-catlist__block-title {
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--tms-grey-1);
  color: var(--tms-black);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 1.08px;
  text-transform: uppercase;
}
.tms-catlist__links { margin: 0; padding: 0; list-style: none; }
.tms-catlist__links li + li { margin-top: 4px; }
.tms-catlist__link { display: flex; align-items: center; gap: 12px; padding: 6px 0; color: var(--tms-black); font-size: 15px; line-height: 20px; font-weight: 500; }
.tms-catlist__link:hover, .tms-catlist__link:focus { color: var(--tms-red); text-decoration: none; }
.tms-catlist__link:hover .tms-catlist__name { text-decoration: underline; }
.tms-catlist__icon { flex: 0 0 40px; width: 40px; height: 40px; object-fit: contain; background: var(--tms-grey-5); }
.tms-catlist__icon--empty { display: block; }
.tms-catlist__footer { margin-top: 48px; text-align: center; }
@media (max-width: 991px) {
  .tms-catlist__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .tms-catlist { margin: 56px 0; }
  .tms-catlist__header { text-align: left; }
  .tms-catlist__subtitle { font-size: 16px; line-height: 24px; }
  .tms-catlist__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}
/* Categories List: phones get an accordion (title row with +/−), like the footer link blocks. */
@media (min-width: 768px) {
  .tms-catlist__links.collapse { display: block; }
}
@media (max-width: 767px) {
  .tms-catlist__grid { gap: 0; }
  .tms-catlist__block { border-bottom: 1px solid var(--tms-grey-1); }
  .tms-catlist__block:first-child { border-top: 1px solid var(--tms-grey-1); }
  .tms-catlist__toggle { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 0; cursor: pointer; }
  .tms-catlist__toggle .tms-catlist__block-title { margin: 0; padding: 0; border: 0; font-size: 14px; line-height: 20px; }
  .tms-catlist__toggle .material-icons { font-size: 24px; line-height: 1; color: var(--tms-black); }
  .tms-catlist__toggle .collapse-icons .remove,
  .tms-catlist__toggle[aria-expanded="true"] .collapse-icons .add { display: none; }
  .tms-catlist__toggle[aria-expanded="true"] .collapse-icons .remove { display: block; }
  .tms-catlist__links.collapse { display: none; }
  .tms-catlist__links.collapse.in { display: block; padding-bottom: 16px; }
}

/* Product lists on phones: the "Back to top" button is centred under the list. */
#js-product-list .up { text-align: center !important; }

/* Hero slider, stacked layout (phones and tablets): every slide has the same height.
   The title always takes exactly 2 lines and the description 3 lines; longer text ends with "…". */
@media (max-width: 991px) {
  .hero-slider .hero-slider__title,
  .hero-slider .hero-slider__text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .hero-slider .hero-slider__title { -webkit-line-clamp: 2; line-clamp: 2; height: 108px; }
  .hero-slider .hero-slider__text { -webkit-line-clamp: 3; line-clamp: 3; height: 90px; }
  .hero-slider .hero-slider__text p { display: inline; }
}
@media (max-width: 767px) {
  .hero-slider .hero-slider__title { height: 80px; }
  .hero-slider .hero-slider__text { height: 81px; }
}

/* Sitemap page (templates/cms/sitemap.tpl): offers | categories with icons (3 columns) | pages. */
.tms-sitemap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr) minmax(0, 1fr); gap: 40px 48px; margin-bottom: 80px; }
.tms-sitemap__group h2 {
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--tms-grey-1);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 1.08px;
  text-transform: uppercase;
}
.tms-sitemap__group ul { margin: 0; padding: 0; list-style: none; }
.tms-sitemap__group li { margin: 0; }
.tms-sitemap__group a { display: inline-block; padding: 6px 0; color: var(--tms-black); font-size: 15px; line-height: 20px; }
.tms-sitemap__group a:hover, .tms-sitemap__group a:focus { color: var(--tms-red); text-decoration: underline; }
.tms-sitemap__group--categories > .tms-sitemap__categories > li > .tms-sitemap__categories { column-count: 3; column-gap: 32px; }
.tms-sitemap__categories > li { break-inside: avoid; }
.tms-sitemap__categories--sub .tms-sitemap__categories--sub { padding-left: 44px; }
.tms-sitemap__category { display: flex !important; align-items: center; gap: 12px; }
.tms-sitemap__icon { flex: 0 0 32px; width: 32px; height: 32px; object-fit: contain; background: var(--tms-grey-5); }
@media (max-width: 991px) {
  .tms-sitemap { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .tms-sitemap__group--categories { grid-column: 1 / -1; grid-row: 2; }
  .tms-sitemap__group--categories > .tms-sitemap__categories > li > .tms-sitemap__categories { column-count: 2; }
}
@media (max-width: 575px) {
  .tms-sitemap { grid-template-columns: minmax(0, 1fr); }
  .tms-sitemap__group--categories { grid-row: auto; }
  .tms-sitemap__group--categories > .tms-sitemap__categories > li > .tms-sitemap__categories { column-count: 1; }
}

/* Contact page: the form heading ("Контакт") matches "Контакт информации" in the left column,
   same size and the same top line (Classic pads the form box 16px at the top). */
#contact .contact-form { padding-top: 0; }
#contact .contact-form h3 { margin: 0 0 24px; font-size: 18px; line-height: 26px; letter-spacing: -.02em; }
/* Contact form: labels above their fields, everything starting on the "Контакт" heading's left edge. */
#contact .contact-form .form-group.row > [class*="col-"],
#contact .contact-form .form-group.row > [class*="offset-"] {
  float: none;
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
}
#contact .contact-form .form-control-label { padding-top: 0; padding-bottom: 8px; text-align: left; }

/* Product page: "Request a quote" button under the short description. */
.tms-quote { margin: 24px 0 32px; }
@media (max-width: 575px) {
  .tms-quote__button { display: block; width: 100%; text-align: center; }
}

/* Dropdown fields (contact subject, country, ...): our white form background removes Classic's arrow,
   so a chevron is drawn on the right to show there are options to choose from. */
select.form-control,
select.form-control-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-right: 48px;
  background: var(--tms-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080F0F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center / 20px 20px;
  cursor: pointer;
}
select.form-control::-ms-expand { display: none; }

/* TIMAS Logos module: the height set in the module wins (inline max-height); wider logos may use more room.
   The compact phone/tablet header keeps its 36px logo. */
.tms-logo { display: inline-flex; align-items: center; }
#header .tms-logo .logo, .footer-brand .tms-logo .logo { width: auto; height: auto; max-width: 320px; }
#header .header-bar__mobile .top-logo img { max-height: 36px !important; }
/* Hanging header logo (TIMAS Logos > "hang below the header"): the logo keeps its full height and overlaps
   the white bar's edges instead of making the bar taller. Desktop: starts 10px above the bar.
   Phones/tablets (compact header, no top bar): own height, starts 6px inside the bar; shrinks while the menu is open. */
@media (min-width: 1200px) {
  #_desktop_logo .tms-logo--hang {
    position: relative;
    display: block;
    width: calc(var(--tms-logo-h) * var(--tms-logo-ratio));
    height: var(--tms-header-h);
  }
  #_desktop_logo .tms-logo--hang .logo {
    position: absolute;
    top: -10px;
    left: 0;
    z-index: 3;
    width: auto;
    height: var(--tms-logo-h);
    max-width: none;
    max-height: none !important;
  }
}
@media (max-width: 1199px) {
  #header .header-bar__mobile #_mobile_logo .tms-logo--hang {
    position: relative;
    display: block;
    width: calc(var(--tms-logo-hm) * var(--tms-logo-ratio));
    height: 64px;
  }
  #header .header-bar__mobile #_mobile_logo .tms-logo--hang .logo {
    position: absolute;
    top: 6px;
    left: 0;
    z-index: 3;
    width: auto;
    height: var(--tms-logo-hm);
    max-width: none;
    max-height: none !important;
    transition: height .2s var(--tms-ease);
  }
  #header.is-open .header-bar__mobile #_mobile_logo .tms-logo--hang .logo { height: 52px; }
}