/* Fonts: Lato + Open Sans loaded once via <link> in themes/default/shop/views/header.php
   (no @import here - avoids a duplicate Google Fonts request). */

*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/* ---------------------------------------------------------------------
     Layout
     --------------------------------------------------------------------- */

.ds-container {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding-left: 1rem;
  padding-right: 1rem;
  max-width: var(--ds-container);
}

.ds-section {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

@media (min-width: 768px) {
  .ds-section {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }
}

.ds-section-title {
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.025em;
}

@media (min-width: 768px) {
  .ds-section-title {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.ds-section-title {
  color: var(--ds-ink-900);
}

.ds-section-sub {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  color: var(--ds-ink-500);
}

/* ---------------------------------------------------------------------
     Buttons
     --------------------------------------------------------------------- */

.ds-btn {
  display: inline-flex;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 3px;
  border-width: 1px;
  border-color: transparent;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  line-height: 1;
  text-decoration-line: none;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}

.ds-btn:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-offset-width: 2px;
  --tw-ring-color: var(--ds-brand-500);
}

.ds-btn--primary {
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
  --tw-shadow: 0 3px 11px 0 rgba(0,0,0,0.1);
  --tw-shadow-colored: 0 3px 11px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.ds-btn--primary:hover {
  background: var(--ds-yellow-dark);
  color: var(--ds-on-primary);
  --tw-translate-y: -0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  --tw-shadow: 0 6px 18px rgba(0,0,0,0.12);
  --tw-shadow-colored: 0 6px 18px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.ds-btn--accent {
  background: var(--ds-accent-500);
  --tw-text-opacity: 1;
  color: rgb(51 51 51 / var(--tw-text-opacity, 1));
  --tw-shadow: 0 3px 11px 0 rgba(0,0,0,0.1);
  --tw-shadow-colored: 0 3px 11px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.ds-btn--accent:hover {
  background: var(--ds-accent-600);
  --tw-translate-y: -0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  --tw-shadow: 0 6px 18px rgba(0,0,0,0.12);
  --tw-shadow-colored: 0 6px 18px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.ds-btn--outline {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  color: var(--ds-brand-700);
  border-color: var(--ds-ink-200);
}

.ds-btn--outline:hover {
  border-color: var(--ds-brand-500);
  color: var(--ds-brand-700);
  --tw-shadow: 0 3px 11px 0 rgba(0,0,0,0.1);
  --tw-shadow-colored: 0 3px 11px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.ds-btn--ghost {
  background-color: transparent;
  color: var(--ds-ink-700);
}

.ds-btn--ghost:hover {
  background: var(--ds-ink-100);
}

.ds-btn--sm {
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.75rem;
  line-height: 1rem;
}

.ds-btn--lg {
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  font-size: 1rem;
  line-height: 1.5rem;
}

.ds-btn--block {
  width: 100%;
}

/* ---------------------------------------------------------------------
     Forms
     --------------------------------------------------------------------- */

.ds-input {
  width: 100%;
  border-radius: 3px;
  border-width: 1px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  border-color: var(--ds-ink-200);
  color: var(--ds-ink-900);
}

.ds-input::-moz-placeholder {
  color: var(--ds-ink-400);
}

.ds-input::placeholder {
  color: var(--ds-ink-400);
}

.ds-input:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  border-color: var(--ds-brand-500);
  --tw-ring-color: var(--ds-brand-100);
}

.ds-label {
  margin-bottom: 0.375rem;
  display: block;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  color: var(--ds-ink-700);
}

/* Search bar (input + button) */

.ds-search {
  display: flex;
  width: 100%;
  align-items: stretch;
  overflow: hidden;
  border-radius: 999px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-shadow: 0 3px 11px 0 rgba(0,0,0,0.1);
  --tw-shadow-colored: 0 3px 11px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  border: 1px solid var(--ds-ink-200);
}

.ds-search input {
  min-width: 0px;
  flex: 1 1 0%;
  border-width: 0px;
  background-color: transparent;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  outline: 2px solid transparent;
  outline-offset: 2px;
  color: var(--ds-ink-900);
}

.ds-search button {
  display: flex;
  cursor: pointer;
  align-items: center;
  gap: 0.5rem;
  border-width: 0px;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  background: var(--ds-brand-600);
}

.ds-search button:hover {
  background: var(--ds-brand-700);
}

/* ---------------------------------------------------------------------
     Cards
     --------------------------------------------------------------------- */

.ds-card {
  display: flex;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  border-radius: 3px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  border: 1px solid var(--ds-ink-200);
  box-shadow: var(--ds-shadow);
}

.ds-card:hover {
  box-shadow: var(--ds-shadow-lg);
  --tw-translate-y: -0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

/* Product card */

.ds-product {
  position: relative;
  display: flex;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  border-radius: 3px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  border: 1px solid var(--ds-ink-200);
  box-shadow: var(--ds-shadow);
}

.ds-product:hover {
  box-shadow: var(--ds-shadow-lg);
  --tw-translate-y: -0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.ds-product__media {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: var(--ds-ink-50);
}

.ds-product__media img {
  height: 100%;
  width: 100%;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 500ms;
  -o-object-fit: contain;
     object-fit: contain;
  padding: 12px;
}

.ds-product:hover .ds-product__media img {
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.ds-product__tags {
  pointer-events: none;
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  right: 0.75rem;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.ds-product__body {
  display: flex;
  flex: 1 1 0%;
  flex-direction: column;
  gap: 0.25rem;
  padding: 1rem;
}

.ds-product__title {
  margin: 0px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  line-height: 1.375;
}

.ds-product__title a {
  color: var(--ds-ink-900);
  text-decoration-line: none;
}

.ds-product__title a:hover {
  color: var(--ds-brand-600);
}

.ds-product__meta {
  margin: 0px;
  font-size: 0.75rem;
  line-height: 1rem;
  color: var(--ds-ink-400);
}

.ds-product__meta a {
  color: var(--ds-ink-400);
  text-decoration-line: none;
}

.ds-product__footer {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding-top: 0.75rem;
}

/* Price */

.ds-price {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  color: var(--ds-brand-700);
}

.ds-price--old {
  margin-left: 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  text-decoration-line: line-through;
  color: var(--ds-ink-400);
}

/* ---------------------------------------------------------------------
     Badges & chips
     --------------------------------------------------------------------- */

.ds-badge {
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border-radius: 999px;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}

.ds-badge--sale {
  background: var(--ds-sale);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.ds-badge--new {
  background: var(--ds-brand-600);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.ds-badge--in {
  background: #dcfce7;
  color: #166534;
}

.ds-badge--low {
  background: #fef3c7;
  color: #92400e;
}

.ds-badge--out {
  background: var(--ds-ink-200);
  color: var(--ds-ink-600);
}

.ds-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  text-decoration-line: none;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  border: 1px solid var(--ds-ink-200);
  color: var(--ds-ink-700);
}

.ds-chip:hover {
  border-color: var(--ds-brand-500);
  color: var(--ds-brand-700);
  --tw-shadow: 0 3px 11px 0 rgba(0,0,0,0.1);
  --tw-shadow-colored: 0 3px 11px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

/* ---------------------------------------------------------------------
     Alerts
     --------------------------------------------------------------------- */

.ds-alert {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  border-radius: 3px;
  padding: 1rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.ds-alert--info {
  background: var(--ds-brand-50);
  color: var(--ds-brand-800);
}

.ds-alert--success {
  background: #dcfce7;
  color: #166534;
}

.ds-alert--warning {
  background: #fef3c7;
  color: #92400e;
}

.ds-alert--danger {
  background: #ffe4e6;
  color: #9f1239;
}

/* ---------------------------------------------------------------------
     Trust strip (homepage)
     --------------------------------------------------------------------- */

.ds-trust {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1rem;
}

@media (min-width: 640px) {
  .ds-trust {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.ds-trust__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  border-radius: 3px;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding: 1rem;
  border: 1px solid var(--ds-ink-200);
}

.ds-trust__icon {
  display: flex;
  height: 2.75rem;
  width: 2.75rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--ds-brand-50);
  color: var(--ds-brand-600);
}

/* ---------------------------------------------------------------------
     Product grid
     --------------------------------------------------------------------- */

.ds-grid {
  display: grid;
  gap: 1rem;
}

@media (min-width: 768px) {
  .ds-grid {
    gap: 1.25rem;
  }
}

.ds-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 768px) {
  .ds-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .ds-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* ---------------------------------------------------------------------
     Breadcrumb
     --------------------------------------------------------------------- */

.ds-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  line-height: 1rem;
  color: var(--ds-ink-400);
}

.ds-breadcrumb a {
  color: var(--ds-ink-500);
  text-decoration-line: none;
}

.ds-breadcrumb a:hover {
  color: var(--ds-brand-600);
}

.tw-absolute {
  position: absolute;
}

.tw-relative {
  position: relative;
}

.tw-sticky {
  position: sticky;
}

.tw-left-3 {
  left: 0.75rem;
}

.tw-right-3 {
  right: 0.75rem;
}

.tw-top-0 {
  top: 0px;
}

.tw-top-3 {
  top: 0.75rem;
}

.tw-z-40 {
  z-index: 40;
}

.tw-m-0 {
  margin: 0px;
}

.tw-mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.tw-mb-1\.5 {
  margin-bottom: 0.375rem;
}

.tw-mb-3 {
  margin-bottom: 0.75rem;
}

.tw-mb-4 {
  margin-bottom: 1rem;
}

.tw-mb-6 {
  margin-bottom: 1.5rem;
}

.tw-mb-8 {
  margin-bottom: 2rem;
}

.tw-mr-1 {
  margin-right: 0.25rem;
}

.tw-mt-0\.5 {
  margin-top: 0.125rem;
}

.tw-mt-1 {
  margin-top: 0.25rem;
}

.tw-mt-6 {
  margin-top: 1.5rem;
}

.tw-mt-8 {
  margin-top: 2rem;
}

.tw-mt-auto {
  margin-top: auto;
}

.tw-line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.tw-block {
  display: block;
}

.tw-flex {
  display: flex;
}

.tw-inline-flex {
  display: inline-flex;
}

.tw-grid {
  display: grid;
}

.tw-hidden {
  display: none;
}

.tw-h-10 {
  height: 2.5rem;
}

.tw-h-11 {
  height: 2.75rem;
}

.tw-h-14 {
  height: 3.5rem;
}

.tw-h-56 {
  height: 14rem;
}

.tw-h-9 {
  height: 2.25rem;
}

.tw-h-full {
  height: 100%;
}

.tw-w-10 {
  width: 2.5rem;
}

.tw-w-11 {
  width: 2.75rem;
}

.tw-w-20 {
  width: 5rem;
}

.tw-w-9 {
  width: 2.25rem;
}

.tw-w-full {
  width: 100%;
}

.tw-min-w-0 {
  min-width: 0px;
}

.tw-max-w-2xl {
  max-width: 42rem;
}

.tw-max-w-md {
  max-width: 28rem;
}

.tw-flex-1 {
  flex: 1 1 0%;
}

.tw-shrink-0 {
  flex-shrink: 0;
}

.tw--translate-y-0 {
  --tw-translate-y: -0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.tw-cursor-pointer {
  cursor: pointer;
}

.tw-select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.tw-list-none {
  list-style-type: none;
}

.tw-grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.tw-flex-col {
  flex-direction: column;
}

.tw-flex-wrap {
  flex-wrap: wrap;
}

.tw-items-start {
  align-items: flex-start;
}

.tw-items-end {
  align-items: flex-end;
}

.tw-items-center {
  align-items: center;
}

.tw-items-stretch {
  align-items: stretch;
}

.tw-justify-center {
  justify-content: center;
}

.tw-justify-between {
  justify-content: space-between;
}

.tw-gap-1 {
  gap: 0.25rem;
}

.tw-gap-2 {
  gap: 0.5rem;
}

.tw-gap-3 {
  gap: 0.75rem;
}

.tw-gap-4 {
  gap: 1rem;
}

.tw-gap-5 {
  gap: 1.25rem;
}

.tw-gap-8 {
  gap: 2rem;
}

.tw-space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}

.tw-space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}

.tw-overflow-hidden {
  overflow: hidden;
}

.tw-overflow-x-auto {
  overflow-x: auto;
}

.tw-whitespace-nowrap {
  white-space: nowrap;
}

.tw-rounded-ds {
  border-radius: 3px;
}

.tw-rounded-ds-lg {
  border-radius: 5px;
}

.tw-rounded-pill {
  border-radius: 999px;
}

.tw-border {
  border-width: 1px;
}

.tw-border-0 {
  border-width: 0px;
}

.tw-border-transparent {
  border-color: transparent;
}

.tw-bg-transparent {
  background-color: transparent;
}

.tw-bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.tw-p-0 {
  padding: 0px;
}

.tw-p-4 {
  padding: 1rem;
}

.tw-p-8 {
  padding: 2rem;
}

.tw-px-2\.5 {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}

.tw-px-3\.5 {
  padding-left: 0.875rem;
  padding-right: 0.875rem;
}

.tw-px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.tw-px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.tw-px-7 {
  padding-left: 1.75rem;
  padding-right: 1.75rem;
}

.tw-py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.tw-py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.tw-py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.tw-py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.tw-py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.tw-py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.tw-pt-3 {
  padding-top: 0.75rem;
}

.tw-pt-6 {
  padding-top: 1.5rem;
}

.tw-pt-8 {
  padding-top: 2rem;
}

.tw-text-center {
  text-align: center;
}

.tw-text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

.tw-text-\[11px\] {
  font-size: 11px;
}

.tw-text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}

.tw-text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.tw-text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.tw-text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.tw-text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}

.tw-font-bold {
  font-weight: 700;
}

.tw-font-extrabold {
  font-weight: 800;
}

.tw-font-medium {
  font-weight: 500;
}

.tw-font-semibold {
  font-weight: 600;
}

.tw-uppercase {
  text-transform: uppercase;
}

.tw-leading-none {
  line-height: 1;
}

.tw-leading-snug {
  line-height: 1.375;
}

.tw-leading-tight {
  line-height: 1.25;
}

.tw-tracking-tight {
  letter-spacing: -0.025em;
}

.tw-tracking-wide {
  letter-spacing: 0.025em;
}

.tw-text-ink-900 {
  --tw-text-opacity: 1;
  color: rgb(51 51 51 / var(--tw-text-opacity, 1));
}

.tw-text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.tw-line-through {
  text-decoration-line: line-through;
}

.tw-no-underline {
  text-decoration-line: none;
}

.tw-opacity-60 {
  opacity: 0.6;
}

.tw-opacity-70 {
  opacity: 0.7;
}

.tw-opacity-90 {
  opacity: 0.9;
}

.tw-shadow-ds {
  --tw-shadow: 0 3px 11px 0 rgba(0,0,0,0.1);
  --tw-shadow-colored: 0 3px 11px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.tw-shadow-ds-md {
  --tw-shadow: 0 6px 18px rgba(0,0,0,0.12);
  --tw-shadow-colored: 0 6px 18px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.tw-outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.tw-ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.tw-transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.tw-duration-200 {
  transition-duration: 200ms;
}

/* =========================================================================
   CSS ARCHITECTURE SUMMARY (shop)
   See README.md · docs/CSS_DUPLICATE_CASE_STUDY.md · docs/CSS_WORKFLOW.md

   OVERRIDE STRATEGY (intentional layers — do not "dedupe" casually):
     Vendor/legacy (libs.min → styles.min)
       → Feature extras (assets/custom/shop.css)
       → THIS design system (shop-ui.css) WINS for shared selectors
       → Optional agent-widget.css

   body.shop-site.shop-autima-shell scopes Autima shape; Nest BOOST (later in
   this file) intentionally redefines --shop-radius / page-bg — later block wins.

   !important: bridge over Bootstrap 3 / styles.min — do not strip in bulk.
   Edit THIS file only; rebuild: cd themes/default/shop/ui-src && npm run build
   Do not hand-edit themes/default/shop/assets/css/shop-ui.css

   TABLE OF CONTENTS (search these banners):
     A) Design tokens (:root --ds-*)
     B) Scope helper / live-shop bridge / premium restyle
     C) Cart & checkout / mobile polish
     D) Autima shell (shop-autima-shell) — Phase A–D shape
     E) Nest visual BOOST — winning token overrides
     F) Phase E commerce (cart, checkout, PDP)
     G) Autima color enforcement / listing / header lock
     H) Product views (list|grid) / listing spacing polish
   ========================================================================= */

/* =========================================================================
   A) Autima Storefront — Design Tokens
   Exact palette from template/autima (index-5.html / assets/scss/_variabls.scss).
   Variable names (--ds-yellow, --ds-brand-*) kept for shop-autima-shell compatibility.
   ========================================================================= */

:root {
  /* Autima $primary_color ? structural charcoal */
  --ds-brand-50: #f8f9f9;
  --ds-brand-100: #eef0f1;
  --ds-brand-200: #e5e5e5;
  --ds-brand-300: #dddddd;
  --ds-brand-400: #9e9e9e;
  --ds-brand-500: #757575;
  --ds-brand-600: #505050;
  --ds-brand-700: #3e444a;
  --ds-brand-800: #2b3137;
  --ds-brand-900: #3e444a;
  /* Autima $secondary_color ? brand yellow CTA (legacy token name --ds-yellow) */
  --ds-yellow: #ffd54c;
  --ds-yellow-dark: #ffb322;
  --ds-primary: #ffd54c;
  --ds-primary-dark: #ffb322;
  --ds-primary-rgb: 255, 213, 76;
  --ds-primary-light: rgba(255, 213, 76, 0.25);
  /* Autima puts dark text on yellow (categories_title, search hover) */
  --ds-on-primary: #333333;
  /* Autima accents */
  --ds-accent-400: #ffb322;
  --ds-accent-500: #b2e515;
  --ds-accent-600: #9bc812;
  --ds-brand-2: #b2e515;
  --ds-hot: #fd5018;
  --ds-scheme: #b2e515;
  /* Autima text / surfaces from _variabls.scss */
  --ds-ink-50: #f8f9f9;
  --ds-ink-100: #f6fafb;
  --ds-ink-200: #e9e9e9;
  --ds-ink-300: #dddddd;
  --ds-ink-400: #a4a4a4;
  --ds-ink-500: #919191;
  --ds-ink-600: #757575;
  --ds-ink-700: #505050;
  --ds-ink-900: #333333;
  --ds-sale: #dc2925;
  --ds-success: #b2e515;
  --ds-warning: #ffb322;
  --ds-info: #27b7d5;
  --ds-link: #2777d0;
  --ds-border: #e9e9e9;
  --ds-border-strong: #dddddd;
  --ds-soft: #f6fafb;
  --ds-page: #ffffff;
  --ds-muted-bg: #f0f0f0;
  --ds-radius: 3px;
  --ds-radius-lg: 5px;
  --ds-radius-pill: 999px;
  --ds-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.1);
  --ds-shadow-md: 0 6px 18px rgba(0, 0, 0, 0.12);
  --ds-shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.14);
  /* Autima fonts: Open Sans body, Lato headings */
  --ds-font:
    "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial,
    sans-serif;
  --ds-font-heading: "Lato", var(--ds-font);
  --ds-container: 1140px;
}

/* =========================================================================
   Scope helper
   `.ds-scope` opts an element subtree into the design-system base styles
   (font + box-sizing) without touching the rest of the Bootstrap page.
   ========================================================================= */

.ds-scope,
.ds-scope *,
.ds-scope *::before,
.ds-scope *::after {
  box-sizing: border-box;
}

.ds-scope {
  font-family: var(--ds-font);
  color: var(--ds-ink-900);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* =========================================================================
   Live-shop bridge
   Refines existing storefront elements to the AutoCare design system WITHOUT
   changing any markup or JavaScript. This file is linked last in header.php,
   so these rules win over the theme's styles.min.css at equal specificity.
   ========================================================================= */

/* Primary action buttons -> Autima Nest green with white label. */

.blue .btn-theme,
.btn-theme {
  color: var(--ds-on-primary);
  background-color: var(--ds-yellow);
  border-color: var(--ds-yellow);
  font-weight: 600;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.blue .btn-theme:hover,
.blue .btn-theme:focus,
.blue .btn-theme.focus,
.blue .btn-theme:active,
.blue .btn-theme.active,
.blue .btn-theme:active:hover,
.blue .btn-theme:active:focus,
.open > .blue .btn-theme.dropdown-toggle,
.btn-theme:hover,
.btn-theme:focus {
  color: var(--ds-on-primary);
  background-color: var(--ds-yellow-dark);
  border-color: var(--ds-yellow-dark);
}

.blue .btn-theme:hover {
  box-shadow: var(--ds-shadow-md);
}

.blue .btn-theme[disabled],
.blue .btn-theme.disabled {
  background-color: var(--ds-yellow);
  border-color: var(--ds-yellow);
  opacity: 0.55;
}

/* Category chips: replace the off-brand Bootstrap-blue hover with on-brand charcoal. */

.shop-category-chip:hover,
.shop-category-chip:focus {
  background: var(--ds-brand-700);
  border-color: var(--ds-brand-700);
  color: #fff;
}

/* Header search button -> charcoal with yellow icon (matches the design system). */

.main-header .btn-search {
  background: var(--ds-brand-900);
  border-color: var(--ds-brand-900);
  color: var(--ds-yellow);
}

.main-header .btn-search:hover,
.main-header .btn-search:focus {
  background: var(--ds-brand-700);
  border-color: var(--ds-brand-700);
  color: var(--ds-yellow);
}

/* Footer: keep the on-brand black, but fix the off-brand blue link hover and
   align the accent yellow exactly; give social icons a clean charcoal->yellow. */

.footer .footer-bottom {
  background-color: var(--ds-yellow);
}

.blue .footer a {
  color: var(--ds-yellow);
}

.blue .footer a:hover {
  color: #ffffff;
}

.footer .title-footer {
  border-bottom-color: rgba(var(--ds-primary-rgb), 0.35);
}

.blue .footer .follow-us li a {
  background-color: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.blue .footer .follow-us li a:hover {
  background-color: var(--ds-yellow);
  color: var(--ds-on-primary);
}

/* footer-bottom sits on Nest green -> white for contrast */

.footer .footer-bottom,
.footer .footer-bottom .copyright,
.blue .footer .footer-bottom a {
  color: var(--ds-on-primary);
}

/* Product card: subtle wishlist-heart affordance (turns red on hover). */

.shop-card__btns .add-to-wishlist {
  color: #8a8f98;
}

.shop-card__btns .add-to-wishlist:hover,
.shop-card__btns .add-to-wishlist:focus {
  color: var(--ds-sale);
  border-color: var(--ds-sale);
}

/* =========================================================================
   Live storefront premium restyle (CSS-only; markup & JS untouched)
   Brings the live shop up to the approved design-system look & feel.
   ========================================================================= */

/* Premium typography across the shop */

body.shop-site {
  font-family: var(--ds-font);
  color: var(--ds-ink-900);
}

.shop-site h1,
.shop-site h2,
.shop-site h3,
.shop-site h4,
.shop-site h5,
.shop-site h6,
.shop-site .navbar,
.shop-site .btn {
  font-family: var(--ds-font);
}

/* Header search bar -> pill */

.main-header .search-box .input-group {
  border-radius: var(--ds-radius-pill);
  box-shadow: var(--ds-shadow);
  background: #fff;
}

.main-header .search-box .form-control {
  height: 46px;
  border: 1px solid var(--ds-ink-200);
  border-right: 0;
  border-radius: var(--ds-radius-pill) 0 0 var(--ds-radius-pill);
  padding-left: 20px;
  box-shadow: none;
  font-size: 14px;
}

.main-header .search-box .form-control:focus {
  border-color: var(--ds-brand-900);
}

.main-header .search-box .btn-search {
  height: 46px;
  border-radius: 0 var(--ds-radius-pill) var(--ds-radius-pill) 0;
  padding-left: 18px;
  padding-right: 18px;
}

/* -------------------------------------------------------------------------
   Header bar -> single contained row like the mockup:
   logo | flexible search | account + cart actions.
   ------------------------------------------------------------------------- */

.main-header .shop-header-bar {
  display: flex;
  align-items: center;
  gap: 18px;
}

.main-header .logo {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
}

.main-header .logo img {
  max-height: 56px;
  width: auto;
}

.main-header .search-box {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.main-header .shop-header-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

.main-header .shop-header-link {
  color: var(--ds-ink-500);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  padding: 0 4px;
}

.main-header .shop-header-link:hover,
.main-header .shop-header-link:focus {
  color: var(--ds-brand-900);
}

/* Account -> ghost button (mockup) */

.main-header .shop-header-account {
  height: 46px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #fff;
  border: 1px solid var(--ds-ink-200);
  color: var(--ds-ink-900);
  font-weight: 600;
  border-radius: var(--ds-radius);
}

.main-header .shop-header-account:hover,
.main-header .shop-header-account:focus,
.main-header .shop-header-account[aria-expanded="true"] {
  border-color: var(--ds-brand-900);
  color: var(--ds-ink-900);
  background: #fff;
}

/* Login form dropdown needs room for the form fields */

.main-header .dropdown-menu-login {
  width: 320px;
  max-width: calc(100vw - 24px);
  padding: 16px;
}

/* Cart -> primary yellow button (mockup) */

.main-header .cart-btn .shopping-cart {
  height: 46px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  border-radius: var(--ds-radius);
}

.main-header .cart-btn .cart-total-items {
  background: var(--ds-brand-900);
  color: var(--ds-yellow);
  border-radius: var(--ds-radius-pill);
  font-size: 11px;
  font-weight: 700;
  min-width: 20px;
  padding: 1px 6px;
  line-height: 16px;
  text-align: center;
}

.main-header .cart-btn .cart-total-items:empty {
  display: none;
}

@media (max-width: 767px) {
  /* Grid is deterministic here: logo top-left, actions top-right, search below */

  .main-header .shop-header-bar {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "logo actions"
      "search search";
    align-items: center;
    gap: 10px 12px;
  }

  .main-header .logo {
    grid-area: logo;
    justify-self: start;
    text-align: left;
    margin: 0;
    min-width: 0;
    /* allow the column to shrink; prevents the logo's intrinsic
                     width from forcing the row wider than the viewport */
  }

  .main-header .logo img {
    max-height: 46px;
    max-width: 100%;
  }

  .main-header .shop-header-actions {
    grid-area: actions;
    justify-self: end;
  }

  .main-header .search-box {
    grid-area: search;
    width: 100%;
  }

  .main-header .shop-header-account {
    height: 42px;
    padding: 0 12px;
  }
}

/* Trust strip -> consistent cards with hover lift */

.shop-home-trust .featurs-item,
.featurs .featurs-item {
  background: #fff;
  border: 1px solid var(--ds-ink-200);
  border-radius: var(--ds-radius);
  padding: 16px 14px;
  box-shadow: var(--ds-shadow);
  transition:
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.shop-home-trust .featurs-item:hover,
.featurs .featurs-item:hover {
  box-shadow: var(--ds-shadow-md);
  transform: translateY(-2px);
}

/* Trust strip -> mockup `ds-trust` layout: contained section (no full-width
   grey band), horizontal cards (icon left, title + subtitle right). */

.shop-trust-section {
  padding-top: 32px;
}

.shop-trust {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.shop-trust__item {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #fff;
  border: 1px solid var(--ds-ink-200);
  border-radius: var(--ds-radius);
  padding: 16px 18px;
  box-shadow: var(--ds-shadow);
  transition:
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.shop-trust__item:hover {
  box-shadow: var(--ds-shadow-md);
  transform: translateY(-2px);
}

.shop-trust__icon {
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  border-radius: var(--ds-radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
  font-size: 18px;
}

.shop-trust__title {
  font-weight: 600;
  font-size: 14px;
  color: var(--ds-ink-900);
  line-height: 1.3;
}

.shop-trust__sub {
  font-size: 12px;
  color: var(--ds-ink-500);
}

@media (max-width: 767px) {
  .shop-trust {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .shop-trust-section {
    padding-top: 20px;
  }
}

/* Product cards: premium polish */

.shop-card {
  border-radius: var(--ds-radius);
  border: 1px solid var(--ds-ink-200);
  box-shadow: var(--ds-shadow);
  transition:
    box-shadow 0.22s ease,
    transform 0.22s ease;
}

.shop-card:hover {
  box-shadow: var(--ds-shadow-lg);
  transform: translateY(-3px);
}

.shop-card__price-current {
  color: var(--ds-brand-900);
}

/* -------------------------------------------------------------------------
   Product card actions -> match the approved mockup (compact, icon-only).
   The footer becomes a single row: price on the left, a small icon-only
   yellow cart button on the right. The qty stepper and wishlist heart are
   hidden from the card so it reads like the mockup. Both controls stay in
   the DOM, so the existing add-to-cart JS still works (qty defaults to 1),
   and the wishlist remains available on the product detail page.
   ------------------------------------------------------------------------- */

.shop-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

/* Price: current value prominent, old price strikethrough inline beside it
   (mockup shows "MVR 480.00  MVR 560.00"). DOM order is old-then-current, so
   flex `order` is used to put the current price first. */

.shop-card__price {
  margin-bottom: 0;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
}

.shop-card__price-current {
  order: 1;
}

.shop-card__price-old {
  order: 2;
  display: inline;
  margin: 0;
}

.shop-card__actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  margin: 0;
}

/* Hide the qty stepper from the card (input stays in DOM with value="1"). */

.shop-card__qty {
  display: none !important;
}

/* Collapse the justified button group and drop the wishlist heart so only
   the icon-only cart button shows, exactly like the mockup. */

.shop-card__btns {
  width: auto;
  display: flex;
}

.shop-card__btns > .btn-group:first-child {
  display: none;
  /* wishlist button group */
}

.shop-card__btns > .btn-group {
  float: none;
  display: block;
  width: auto;
}

/* Add-to-cart -> mockup `ds-btn ds-btn--primary ds-btn--sm`: a compact,
   padding-based yellow button (icon only) with a soft shadow that lifts on
   hover. The "Add to Cart" label is hidden via font-size:0; icon restored. */

.shop-card__btns .add-to-cart {
  font-size: 0;
  line-height: 1;
  width: auto;
  height: auto;
  padding: 8px 14px;
  /* ds-btn--sm: py-2 px-3.5 */
  border: 1px solid transparent;
  /* Force all four corners: the button is the last child of a Bootstrap
     .btn-group-justified, which otherwise flattens the left corners. */
  border-radius: var(--ds-radius) !important;
  /* rounded-ds */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--ds-shadow);
  transition:
    background 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.shop-card__btns .add-to-cart .fa {
  font-size: 14px;
  margin: 0;
}

.shop-card__btns .add-to-cart:hover,
.shop-card__btns .add-to-cart:focus {
  background: var(--ds-yellow-dark);
  box-shadow: var(--ds-shadow-md);
  transform: translateY(-2px);
}

/* -------------------------------------------------------------------------
   Product card visuals -> match the mockup `ds-product`:
   - square media, full product shown (contain) on a light bg, no divider
   - seamless white footer (no grey bar / top border)
   - filled pill badges (in stock / low / out / sale)
   ------------------------------------------------------------------------- */

.shop-card__media {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: var(--ds-ink-50);
  border-bottom: 0;
  overflow: hidden;
  flex-shrink: 0;
}

.shop-card__img-link {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--ds-ink-50);
}

.shop-card__img-link img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center center;
     object-position: center center;
  box-sizing: border-box;
  padding: 14px;
  background: transparent;
  transition: transform 0.25s ease;
}

.shop-card__img-link:hover img,
.shop-card__img-link:focus img,
.shop-card__img-link.is-reveal img,
.shop-card:focus-within .shop-card__img-link img {
  -o-object-fit: contain;
     object-fit: contain;
  transform: scale(1.03);
  background: transparent;
}

.shop-card__tags {
  padding: 12px;
}

.shop-card .shop-stock-badge {
  border-radius: var(--ds-radius-pill);
  padding: 4px 9px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border: 0;
}

.shop-card .shop-stock-in {
  background: #dcfce7;
  color: #166534;
  border: 0;
}

.shop-card .shop-stock-low {
  background: #fef3c7;
  color: #92400e;
  border: 0;
}

.shop-card .shop-stock-out {
  background: var(--ds-ink-200);
  color: var(--ds-ink-700);
  border: 0;
}

.shop-card__tag--sale {
  border-radius: var(--ds-radius-pill);
  background: var(--ds-sale);
  padding: 4px 10px;
  font-size: 10px;
}

.shop-card__body {
  padding: 14px 14px 8px;
}

.shop-card__footer {
  background: transparent;
  border-top: 0;
  padding: 0 14px 14px;
}

/* -------------------------------------------------------------------------
   Hero carousel -> match the mockup look (keeps the real AutoCare banner).
   Contained width with large rounded corners + soft shadow, circular modern
   arrows, and pill-style indicator dots. Markup/JS untouched.
   ------------------------------------------------------------------------- */

.shop-site #slider.carousel {
  max-width: 1170px;
  margin: 18px auto 0;
  border-radius: var(--ds-radius-lg);
  overflow: hidden;
  box-shadow: var(--ds-shadow-md);
}

@media (max-width: 1202px) {
  .shop-site #slider.carousel {
    margin-left: 16px;
    margin-right: 16px;
  }
}

.shop-site #slider .shop-hero-img {
  width: 100%;
  max-width: 100%;
}

/* Arrows -> one circular button per side (style the control only; icon has no second circle) */

.shop-site #slider .carousel-control {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  top: 50%;
  bottom: auto;
  margin-top: -21px;
  background: rgba(11, 12, 14, 0.55);
  background-image: none;
  border-radius: 50%;
  opacity: 1;
  text-shadow: none;
  filter: none;
  text-decoration: none;
  transition:
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}

.shop-site #slider .carousel-control.left {
  left: 14px;
  right: auto;
  background-image: none;
}

.shop-site #slider .carousel-control.right {
  right: 14px;
  left: auto;
  background-image: none;
}

.shop-site #slider .carousel-control .fa,
.shop-site #slider .carousel-control span {
  position: static !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  top: auto !important;
  background: transparent !important;
  border-radius: 0 !important;
  color: #fff;
  font-size: 18px;
  line-height: 1 !important;
  text-shadow: none;
}

.shop-site #slider .carousel-control:hover,
.shop-site #slider .carousel-control:focus {
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
  opacity: 1;
  outline: none;
}

.shop-site #slider .carousel-control:hover .fa,
.shop-site #slider .carousel-control:focus .fa {
  background: transparent !important;
  color: var(--ds-on-primary);
}

/* Indicator dots -> pill style, active one widens to AutoCare yellow */

.shop-site #slider .carousel-indicators {
  bottom: 14px;
}

.shop-site #slider .carousel-indicators li {
  width: 8px;
  height: 8px;
  margin: 0 4px;
  border: 0;
  border-radius: var(--ds-radius-pill);
  background: rgba(255, 255, 255, 0.6);
  transition:
    width 0.2s ease,
    background 0.2s ease;
}

.shop-site #slider .carousel-indicators li.active {
  width: 24px;
  height: 8px;
  margin: 0 4px;
  background: var(--ds-yellow);
}

/* Section headings (e.g. "Featured Products") -> match mockup header row:
   title + subtitle on the left, an outline "View all" button on the right. */

.shop-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin: 6px 0 22px;
}

.shop-section-title {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--ds-ink-900);
}

.shop-section-sub {
  margin: 4px 0 0;
  font-size: 14px;
  color: var(--ds-ink-500);
}

.shop-section-head__cta {
  flex: 0 0 auto;
}

/* Outline button (design-system look) for use inside the live Bootstrap shop */

.shop-site .btn.btn-outline-ds {
  background: #fff;
  border: 1px solid var(--ds-ink-200);
  color: var(--ds-brand-900);
  font-weight: 600;
  border-radius: var(--ds-radius);
  padding: 8px 16px;
}

.shop-site .btn.btn-outline-ds:hover,
.shop-site .btn.btn-outline-ds:focus {
  border-color: var(--ds-brand-900);
  color: var(--ds-brand-900);
  box-shadow: var(--ds-shadow);
}

@media (max-width: 480px) {
  .shop-section-title {
    font-size: 20px;
  }
}

/* Tighten category chip row spacing */

.shop-category-chips {
  gap: 8px;
}

/* Announcement bar (top of every shop page) */

.shop-announcement-bar {
  background: var(--ds-brand-900);
  color: #fff;
  font-size: 12.5px;
  letter-spacing: 0.01em;
}

.shop-announcement-bar .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 7px;
  padding-bottom: 7px;
}

.shop-announcement-bar i {
  color: var(--ds-yellow);
  margin-right: 4px;
}

.shop-announcement-bar__phone {
  font-weight: 600;
  white-space: nowrap;
}

/* Products listing: refine the Filters panel (scoped to the sidebar) */

.page-contents #sticky-con .title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ds-ink-500);
  margin: 18px 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ds-ink-100);
}

.page-contents #min-price,
.page-contents #max-price {
  border-radius: 10px;
  border: 1px solid var(--ds-ink-200);
  height: 40px;
  box-shadow: none;
}

.page-contents #min-price:focus,
.page-contents #max-price:focus {
  border-color: var(--ds-brand-900);
  box-shadow: none;
}

.page-contents #sticky-con .checkbox label {
  font-size: 14px;
  color: var(--ds-ink-700);
}

/* =========================================================================
   Cart & Checkout ? panels as design-system cards
   ========================================================================= */

.page-contents .panel.panel-default {
  border: 1px solid var(--ds-ink-200);
  border-radius: var(--ds-radius);
  box-shadow: var(--ds-shadow);
  overflow: hidden;
  background: #fff;
}

.page-contents .panel.panel-default > .panel-heading {
  background: #fff;
  border-bottom: 1px solid var(--ds-ink-100);
  font-size: 14px;
  font-weight: 700;
  color: var(--ds-ink-900);
  padding: 14px 18px;
}

.page-contents .panel.panel-default > .panel-heading a {
  color: var(--ds-ink-500);
  font-weight: 600;
}

.page-contents .panel.panel-default > .panel-heading a:hover {
  color: var(--ds-brand-900);
}

.page-contents .panel.panel-default .panel-footer,
.page-contents .panel.panel-default .panel.panel-footer {
  background: var(--ds-ink-50);
  border-top: 1px solid var(--ds-ink-100);
  padding: 12px 18px;
}

/* Cart table */

.page-contents #cart-table > thead > tr > th {
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ds-ink-500);
  border-bottom: 1px solid var(--ds-ink-200);
  padding: 12px 14px;
}

.page-contents #cart-table > tbody > tr > td {
  vertical-align: middle;
  padding: 14px;
  color: var(--ds-ink-900);
}

.page-contents #cart-table .quantity-input,
.page-contents #cart-table input[type="text"] {
  border-radius: 10px;
  border: 1px solid var(--ds-ink-200);
  text-align: center;
}

/* Cart totals: emphasise the grand total */

.page-contents #cart-totals > tbody > tr:last-child,
.page-contents .cart-totals > tbody > tr:last-child {
  font-weight: 800;
  font-size: 15px;
  color: var(--ds-ink-900);
  border-top: 2px solid var(--ds-ink-200);
}

/* Checkout tabs */

.page-contents .nav-tabs {
  border-bottom: 1px solid var(--ds-ink-200);
}

.page-contents .nav-tabs > li > a {
  color: var(--ds-ink-500);
  font-weight: 600;
  border: none;
  border-radius: 0;
}

.page-contents .nav-tabs > li.active > a,
.page-contents .nav-tabs > li.active > a:hover,
.page-contents .nav-tabs > li.active > a:focus {
  color: var(--ds-brand-900);
  border: none;
  border-bottom: 2px solid var(--ds-yellow);
  background: transparent;
}

/* Bring the green Login button onto the AutoCare palette (storefront only) */

body.shop-site .btn-success {
  background: var(--ds-brand-900);
  border-color: var(--ds-brand-900);
  color: #fff;
  font-weight: 600;
}

body.shop-site .btn-success:hover,
body.shop-site .btn-success:focus,
body.shop-site .btn-success:active {
  background: var(--ds-brand-700);
  border-color: var(--ds-brand-700);
  color: #fff;
}

/* =========================================================================
   Mobile polish
   ========================================================================= */

/* Guard against any stray horizontal overflow on the storefront */

body.shop-site {
  overflow-x: hidden;
}

/* The products listing nests a Bootstrap .row inside #results (which is not a
   padded column), so the row's negative margins spilled past the viewport on
   phones and clipped the card buttons. Neutralise it; the card columns keep
   their own padding for gutters. */

#results > .row {
  margin-left: 0;
  margin-right: 0;
}

@media (max-width: 767px) {
  /* Root cause of right-edge clipping on phones: Bootstrap rows carry -15px
     side margins, and several shop pages nest rows without a balancing padded
     column, so content spilled ~15px past the viewport. Neutralise row margins
     on the storefront at phone width; column padding still provides gutters. */

  .page-contents .row {
    margin-left: 0;
    margin-right: 0;
  }

  /* Cart/checkout cards: a touch tighter on phones */

  .page-contents .panel.panel-default > .panel-heading {
    padding: 12px 14px;
    font-size: 13px;
  }

  /* Keep the cart table from forcing horizontal scroll */

  .page-contents #cart-table > tbody > tr > td,
  .page-contents #cart-table > thead > tr > th {
    padding: 10px 8px;
  }

  /* Checkout: stack the totals card under the form with breathing room */

  .page-contents .panel.panel-default {
    margin-bottom: 16px;
  }

  /* Card action buttons: ensure the Add-to-Cart label never truncates */

  .shop-card__btns .btn {
    white-space: nowrap;
  }
}

/* =========================================================================
   Autima-style shop overlay (shape/spacing only ? AutoCare --ds-* colors preserved)
   Enabled via body.shop-site.shop-autima-shell (see header.php)
   Autima index-5 layout language + Nest soft-card/form cohesion with admin.
   Do NOT import Autima style.css or Nest main.css (breaks Bootstrap 3).
   ========================================================================= */

body.shop-site.shop-autima-shell {
  --shop-radius: 0.5rem;
  --shop-radius-lg: 0.75rem;
  --shop-shadow: 5px 5px 15px rgba(0, 0, 0, 0.05);
  --shop-shadow-hover: 20px 20px 40px rgba(0, 0, 0, 0.07);
  --shop-input-h: 41px;
  --shop-input-bg: var(--ds-soft);
  --shop-border: var(--ds-border);
  --shop-header-bar-bg: var(--ds-brand-900);
  --shop-nav-active: var(--ds-yellow);
  --shop-page-bg: var(--ds-page);
  --ds-radius: var(--shop-radius);
  --ds-radius-lg: var(--shop-radius-lg);
  background-color: var(--shop-page-bg);
  color: var(--ds-ink-600);
}

body.shop-site.shop-autima-shell #wrapper {
  background-color: var(--shop-page-bg);
}

/* Autima headings (Lato) */

body.shop-site.shop-autima-shell h1,
body.shop-site.shop-autima-shell h2,
body.shop-site.shop-autima-shell h3,
body.shop-site.shop-autima-shell h4,
body.shop-site.shop-autima-shell h5,
body.shop-site.shop-autima-shell h6,
body.shop-site.shop-autima-shell .shop-section-title,
body.shop-site.shop-autima-shell .title-footer,
body.shop-site.shop-autima-shell .navbar-nav > li > a {
  font-family: var(--ds-font-heading);
  font-weight: 700;
}

/* --- Phase A: Buttons (radius/height only; colors stay --ds-*) --- */

body.shop-site.shop-autima-shell .btn-theme,
body.shop-site.shop-autima-shell .blue .btn-theme {
  border-radius: var(--shop-radius) !important;
  font-weight: 600;
  min-height: 40px;
  padding-top: 10px;
  padding-bottom: 10px;
}

body.shop-site.shop-autima-shell .btn-default,
body.shop-site.shop-autima-shell .btn-primary,
body.shop-site.shop-autima-shell .btn-success {
  border-radius: var(--shop-radius);
  font-weight: 600;
}

/* --- Phase A: Announcement / top header (Autima header_top) --- */

body.shop-site.shop-autima-shell .shop-announcement-bar {
  background: var(--ds-brand-900);
  color: #fff;
  font-size: 13px;
  padding: 8px 0;
  border-bottom: none;
}

body.shop-site.shop-autima-shell .shop-announcement-bar a,
body.shop-site.shop-autima-shell .shop-announcement-bar__phone {
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell .top-header {
  background: #fff;
  border-bottom: 1px solid var(--shop-border);
  font-size: 13px;
  padding: 6px 0;
}

body.shop-site.shop-autima-shell .top-header a {
  color: var(--ds-ink-500);
  font-weight: 500;
}

body.shop-site.shop-autima-shell .top-header a:hover {
  color: var(--ds-brand-900);
}

/* --- Phase A: Main header (Autima header_middle) --- */

body.shop-site.shop-autima-shell .main-header {
  background: #fff;
  box-shadow: none;
  border-bottom: 1px solid var(--shop-border);
  padding-top: 12px;
  padding-bottom: 12px;
}

body.shop-site.shop-autima-shell .main-header .search-box .input-group {
  border-radius: var(--shop-radius);
  box-shadow: none;
  background: var(--shop-input-bg);
  border: 1px solid transparent;
  overflow: visible;
}

body.shop-site.shop-autima-shell .main-header .search-box .form-control {
  height: var(--shop-input-h);
  background: var(--shop-input-bg);
  border: none;
  border-radius: var(--shop-radius) 0 0 var(--shop-radius);
  box-shadow: none;
  padding-left: 16px;
}

body.shop-site.shop-autima-shell .main-header .search-box .form-control:focus {
  background: #fff;
  border: none;
  box-shadow: none;
}

body.shop-site.shop-autima-shell .main-header .search-box .btn-search {
  height: var(--shop-input-h);
  border-radius: 0 var(--shop-radius) var(--shop-radius) 0;
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  padding-left: 16px;
  padding-right: 16px;
}

body.shop-site.shop-autima-shell .main-header .search-box .btn-search:hover,
body.shop-site.shop-autima-shell .main-header .search-box .btn-search:focus {
  background: var(--ds-yellow-dark) !important;
  border-color: var(--ds-yellow-dark) !important;
  color: var(--ds-on-primary) !important;
}

/* ——— Header search (white bar + black icon button) ——— */

body.shop-site.shop-autima-shell .main-header .search-box.shop-live-search {
  position: relative;
  overflow: visible;
  z-index: 40;
  flex: 1 1 auto;
  max-width: 560px;
  min-width: 0;
}

body.shop-site.shop-autima-shell .shop-search-form {
  position: relative;
  margin: 0;
}

body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .shop-search-field.input-group {
  display: flex;
  align-items: stretch;
  width: 100%;
  position: relative;
  overflow: visible;
  background: #fff;
  border: 0;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.18s ease;
}

body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .shop-search-field.input-group:focus-within {
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);
}

body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .shop-search-field__input.form-control,
body.shop-site.shop-autima-shell .main-header .shop-live-search .form-control {
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
  height: 48px;
  margin: 0;
  padding: 0 44px 0 18px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 6px 0 0 6px !important;
  box-shadow: none !important;
  font-size: 14px;
  line-height: 48px;
  color: #333;
}

body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .form-control::-moz-placeholder {
  color: #9a9a9a;
  opacity: 1;
}

body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .form-control::placeholder {
  color: #9a9a9a;
  opacity: 1;
}

body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .form-control::-webkit-search-decoration,
body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .form-control::-webkit-search-cancel-button,
body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .form-control::-webkit-search-results-button,
body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .form-control::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

body.shop-site.shop-autima-shell .shop-search-clear {
  position: absolute;
  right: 64px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #666;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  background: #f0f0f0;
  border: 0;
  padding: 0;
}

body.shop-site.shop-autima-shell .shop-search-clear[hidden] {
  display: none !important;
}

body.shop-site.shop-autima-shell .shop-search-clear:hover,
body.shop-site.shop-autima-shell .shop-search-clear:focus {
  color: #111;
  background: #e4e4e4;
  outline: none;
}

body.shop-site.shop-autima-shell .shop-search-field__submit {
  flex: 0 0 56px;
  width: 56px;
  padding: 0;
  position: relative;
}

body.shop-site.shop-autima-shell .main-header .shop-live-search .btn-search {
  width: 100% !important;
  height: 48px !important;
  min-width: 0 !important;
  margin: 0;
  border: 0 !important;
  border-radius: 0 6px 6px 0 !important;
  background: #1a1a1a !important;
  color: #fff !important;
  font-size: 16px;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: none !important;
  transition: background 0.15s ease;
}

body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .btn-search:hover,
body.shop-site.shop-autima-shell
  .main-header
  .shop-live-search
  .btn-search:focus {
  background: #2d2d2d !important;
  color: #fff !important;
  transform: none;
}

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell .shop-search-clear {
    right: 52px;
  }

  body.shop-site.shop-autima-shell .main-header .search-box.shop-live-search {
    max-width: none;
  }
}

/* Live search typeahead panel */

body.shop-site.shop-autima-shell .shop-search-suggest {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 8px);
  background: #fff;
  border: 1px solid #ebebeb;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
  border-radius: 12px;
  max-height: min(420px, 70vh);
  overflow: auto;
  z-index: 1200;
  animation: shopSuggestIn 0.16s ease-out;
}

/* Bring suggest above sticky nav / page content (stacking context) */

body.shop-site.shop-autima-shell .header_middle.main-header.is-suggest-open,
body.shop-site.shop-autima-shell.shop-suggest-open .header_middle.main-header {
  z-index: 1300 !important;
  overflow: visible !important;
}

body.shop-site.shop-autima-shell .shop-live-search.is-suggest-open,
body.shop-site.shop-autima-shell
  .header_middle
  .shop-live-search.is-suggest-open {
  z-index: 1301 !important;
  position: relative;
  overflow: visible !important;
}

body.shop-site.shop-autima-shell
  .shop-live-search.is-suggest-open
  .shop-search-suggest,
body.shop-site.shop-autima-shell .shop-search-suggest:not([hidden]) {
  z-index: 1302 !important;
  pointer-events: auto;
}

body.shop-site.shop-autima-shell.shop-suggest-open .header_bottom.sticky-header,
body.shop-site.shop-autima-shell.shop-suggest-open nav.navbar.header_bottom {
  z-index: 50 !important;
}

body.shop-site.shop-autima-shell .header_middle .shop-header-bar,
body.shop-site.shop-autima-shell .header_middle .container,
body.shop-site.shop-autima-shell .header_middle .shop-search-form {
  overflow: visible !important;
}

@keyframes shopSuggestIn {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

body.shop-site.shop-autima-shell .shop-search-suggest__status {
  padding: 12px 16px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #888;
  border-bottom: 1px solid #f0f0f0;
}

body.shop-site.shop-autima-shell .shop-search-suggest__list {
  list-style: none;
  margin: 0;
  padding: 4px 0;
}

body.shop-site.shop-autima-shell .shop-search-suggest__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  text-decoration: none;
  color: inherit;
  border-bottom: 0;
  cursor: pointer;
  transition: background 0.12s ease;
}

body.shop-site.shop-autima-shell .shop-search-suggest__item:hover,
body.shop-site.shop-autima-shell .shop-search-suggest__item.is-active {
  background: #faf7eb;
  text-decoration: none;
  color: inherit;
}

body.shop-site.shop-autima-shell .shop-search-suggest__thumb {
  width: 48px;
  height: 48px;
  -o-object-fit: contain;
     object-fit: contain;
  background: #f7f7f7;
  border: 1px solid #eee;
  border-radius: 8px;
  flex: 0 0 48px;
}

body.shop-site.shop-autima-shell .shop-search-suggest__meta {
  min-width: 0;
  flex: 1;
}

body.shop-site.shop-autima-shell .shop-search-suggest__name {
  display: block;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #1a1a1a;
}

body.shop-site.shop-autima-shell .shop-search-suggest__name mark {
  background: rgba(255, 213, 76, 0.45);
  color: inherit;
  font-weight: 700;
  padding: 0 1px;
  border-radius: 2px;
}

body.shop-site.shop-autima-shell .shop-search-suggest__code {
  display: block;
  font-size: 11px;
  color: #8a8a8a;
  margin-top: 2px;
}

body.shop-site.shop-autima-shell .shop-search-suggest__price {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 700;
  color: #1a1a1a;
  white-space: nowrap;
}

body.shop-site.shop-autima-shell .shop-search-suggest__all {
  display: block;
  padding: 14px 16px;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: #1a1a1a;
  background: linear-gradient(180deg, #fff 0%, #fafafa 100%);
  border-top: 1px solid #eee;
  text-decoration: none;
  border-radius: 0 0 12px 12px;
}

body.shop-site.shop-autima-shell .shop-search-suggest__all:hover {
  background: #fff8d6;
  text-decoration: none;
  color: #1a1a1a;
}

body.shop-site.shop-autima-shell .main-header .shop-header-account {
  height: var(--shop-input-h);
  border-radius: var(--shop-radius);
  border-color: var(--shop-border);
  background: #fff;
  box-shadow: none;
}

body.shop-site.shop-autima-shell .main-header .cart-btn .shopping-cart {
  height: var(--shop-input-h);
  border-radius: var(--shop-radius);
  box-shadow: none;
}

body.shop-site.shop-autima-shell .main-header .dropdown-menu {
  border-radius: var(--shop-radius);
  border-color: var(--shop-border);
  box-shadow: var(--shop-shadow-hover);
  padding: 8px 0;
}

body.shop-site.shop-autima-shell .main-header .dropdown-menu > li > a {
  padding: 8px 16px;
  font-weight: 500;
}

body.shop-site.shop-autima-shell .main-header #cart-contents {
  min-width: 280px;
  padding: 8px 12px;
}

body.shop-site.shop-autima-shell .main-header .table-cart {
  margin-bottom: 8px;
}

body.shop-site.shop-autima-shell .main-header .table-cart > tbody > tr > td {
  border-top-color: var(--shop-border);
  vertical-align: middle;
}

/* --- Phase A: Navbar (Autima header_bottom) --- */

body.shop-site.shop-autima-shell nav.navbar.navbar-default {
  background: var(--ds-brand-900) !important;
  border: none !important;
  border-radius: 0 !important;
  margin-bottom: 0;
  min-height: 48px;
  box-shadow: var(--shop-shadow);
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li
  > a {
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  padding: 14px 16px;
  text-transform: capitalize;
  letter-spacing: 0.01em;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li
  > a:hover,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li
  > a:focus,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li.open
  > a,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li.active
  > a {
  background: transparent !important;
  color: var(--ds-yellow) !important;
}

body.shop-site.shop-autima-shell nav.navbar.navbar-default .navbar-toggle {
  border-color: rgba(255, 255, 255, 0.25);
  margin-top: 8px;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-toggle
  .icon-bar {
  background-color: #fff;
}

body.shop-site.shop-autima-shell nav.navbar.navbar-default .navbar-toggle:hover,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-toggle:focus {
  background: rgba(255, 255, 255, 0.08);
}

body.shop-site.shop-autima-shell nav.navbar.navbar-default .dropdown-menu {
  border-radius: var(--shop-radius);
  border: 1px solid var(--shop-border);
  box-shadow: var(--shop-shadow-hover);
  padding: 8px 0;
  margin-top: 0;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .dropdown-menu
  > li
  > a {
  color: var(--ds-ink-700) !important;
  font-weight: 500;
  padding: 8px 18px;
  font-family: var(--ds-font);
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .dropdown-menu
  > li
  > a:hover {
  background: var(--ds-ink-50);
  color: var(--ds-brand-900) !important;
}

body.shop-site.shop-autima-shell nav.navbar .btn-cart-xs {
  border-radius: var(--shop-radius);
  background: var(--ds-yellow);
  border-color: var(--ds-yellow);
  color: var(--ds-on-primary);
  font-weight: 700;
  margin-top: 8px;
  margin-right: 8px;
}

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell nav.navbar.navbar-default .navbar-collapse {
    background: var(--ds-brand-800);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  body.shop-site.shop-autima-shell nav.navbar.navbar-default .dropdown-menu {
    background: transparent;
    border: none;
    box-shadow: none;
  }

  body.shop-site.shop-autima-shell
    nav.navbar.navbar-default
    .dropdown-menu
    > li
    > a {
    color: rgba(255, 255, 255, 0.85) !important;
    padding-left: 28px;
  }
}

/* --- Phase A: Footer (Autima footer_widgets dark band) --- */

body.shop-site.shop-autima-shell section.footer {
  background: var(--ds-brand-900) !important;
  color: rgba(255, 255, 255, 0.78);
  margin-top: 40px;
  padding-top: 40px;
  border-top: none;
}

body.shop-site.shop-autima-shell section.footer .title-footer {
  color: #fff;
  border-bottom: 1px solid rgba(var(--ds-primary-rgb), 0.28);
  margin-bottom: 16px;
  padding-bottom: 10px;
  font-size: 16px;
}

body.shop-site.shop-autima-shell section.footer .title-footer span {
  color: #fff;
}

body.shop-site.shop-autima-shell.blue section.footer a,
body.shop-site.shop-autima-shell section.footer a {
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell.blue section.footer a:hover,
body.shop-site.shop-autima-shell section.footer a:hover {
  color: #fff;
}

body.shop-site.shop-autima-shell section.footer .follow-us li a {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  border-radius: var(--shop-radius);
}

body.shop-site.shop-autima-shell section.footer .follow-us li a:hover {
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
}

body.shop-site.shop-autima-shell section.footer .footer-bottom {
  background: var(--ds-yellow) !important;
  margin-top: 28px;
  padding: 14px 0;
}

body.shop-site.shop-autima-shell section.footer .footer-bottom,
body.shop-site.shop-autima-shell section.footer .footer-bottom .copyright,
body.shop-site.shop-autima-shell section.footer .footer-bottom a {
  color: var(--ds-on-primary) !important;
}

/* --- Phase B: Hero carousel --- */

body.shop-site.shop-autima-shell #slider.carousel {
  margin-bottom: 0;
  border-radius: 0;
  overflow: hidden;
  background: var(--ds-brand-900);
}

body.shop-site.shop-autima-shell #slider .carousel-control {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  top: 50%;
  bottom: auto;
  margin-top: -24px;
  background: rgba(11, 12, 14, 0.45);
  background-image: none !important;
  border-radius: 50%;
  opacity: 1;
  text-shadow: none;
  line-height: 1;
  font-size: 16px;
}

body.shop-site.shop-autima-shell #slider .carousel-control.left {
  left: 16px;
  background-image: none !important;
}

body.shop-site.shop-autima-shell #slider .carousel-control.right {
  right: 16px;
  background-image: none !important;
}

body.shop-site.shop-autima-shell #slider .carousel-control .fa,
body.shop-site.shop-autima-shell #slider .carousel-control span {
  background: transparent !important;
  color: inherit;
}

body.shop-site.shop-autima-shell #slider .carousel-control:hover {
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
}

body.shop-site.shop-autima-shell #slider .carousel-indicators {
  bottom: 16px;
}

body.shop-site.shop-autima-shell #slider .carousel-indicators li {
  width: 10px;
  height: 10px;
  margin: 0 4px;
  border: none;
  background: rgba(255, 255, 255, 0.45);
  border-radius: 50%;
}

body.shop-site.shop-autima-shell #slider .carousel-indicators .active {
  width: 10px;
  height: 10px;
  background: var(--ds-yellow);
  margin: 0 4px;
}

body.shop-site.shop-autima-shell #slider .carousel-caption {
  background: rgba(11, 12, 14, 0.55);
  border-radius: var(--shop-radius);
  padding: 10px 16px;
  left: 12%;
  right: 12%;
  bottom: 48px;
  font-family: var(--ds-font-heading);
  font-weight: 600;
}

/* --- Phase B: Trust strip (Autima shipping_area) --- */

body.shop-site.shop-autima-shell .shop-trust-section {
  padding-top: 28px;
  padding-bottom: 8px;
}

body.shop-site.shop-autima-shell .shop-trust__item {
  border: 1px solid var(--shop-border);
  border-radius: var(--shop-radius);
  box-shadow: none;
  background: #fff;
  padding: 18px 20px;
}

body.shop-site.shop-autima-shell .shop-trust__item:hover {
  box-shadow: var(--shop-shadow);
  transform: translateY(-2px);
}

body.shop-site.shop-autima-shell .shop-trust__icon {
  width: 52px;
  height: 52px;
  border-radius: var(--shop-radius);
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
}

/* --- Phase B: Section titles (Autima section_title hairline) --- */

body.shop-site.shop-autima-shell .shop-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  position: relative;
  margin-bottom: 22px;
  padding-bottom: 0;
  border-bottom: none;
}

body.shop-site.shop-autima-shell .shop-section-head::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: var(--ds-ink-200);
  z-index: 0;
}

body.shop-site.shop-autima-shell .shop-section-head__text {
  position: relative;
  z-index: 1;
  background: var(--shop-page-bg);
  padding-right: 18px;
}

body.shop-site.shop-autima-shell .shop-section-title {
  margin: 0;
  font-size: 24px;
  line-height: 1.25;
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .shop-section-sub {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--ds-ink-500);
  font-family: var(--ds-font);
  font-weight: 400;
}

body.shop-site.shop-autima-shell .shop-section-head__cta {
  position: relative;
  z-index: 1;
  background: var(--shop-page-bg);
  padding-left: 14px;
  border-radius: var(--shop-radius);
  font-weight: 600;
}

body.shop-site.shop-autima-shell .shop-category-chips {
  margin-bottom: 20px;
}

body.shop-site.shop-autima-shell .shop-category-chip {
  border-radius: var(--shop-radius);
  border-color: var(--shop-border);
  font-weight: 600;
}

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell .shop-section-head {
    flex-direction: column;
    align-items: flex-start;
  }

  body.shop-site.shop-autima-shell .shop-section-head::before {
    display: none;
  }

  body.shop-site.shop-autima-shell .shop-section-head__text {
    background: transparent;
    padding-right: 0;
  }

  body.shop-site.shop-autima-shell .shop-section-title {
    font-size: 20px;
  }
}

/* --- Phase B: Product cards (Autima single_product + Nest soft card) --- */

body.shop-site.shop-autima-shell
  .shop-products-grid:not(.shop-listing-layout):not(.shop-autima-layout) {
  gap: 16px;
}

body.shop-site.shop-autima-shell .shop-card,
body.shop-site.shop-autima-shell .ds-product {
  border: 1px solid var(--shop-border);
  border-radius: var(--shop-radius);
  box-shadow: none;
  background: #fff;
  overflow: hidden;
  transition:
    box-shadow 0.22s ease,
    transform 0.22s ease,
    border-color 0.22s ease;
}

body.shop-site.shop-autima-shell .shop-card:hover,
body.shop-site.shop-autima-shell .ds-product:hover {
  box-shadow: var(--shop-shadow-hover);
  transform: translateY(-3px);
  border-color: var(--ds-ink-300);
}

body.shop-site.shop-autima-shell .shop-card__media,
body.shop-site.shop-autima-shell .shop-card__body {
  padding-left: 12px;
  padding-right: 12px;
}

body.shop-site.shop-autima-shell .shop-card__media {
  padding-top: 12px;
}

body.shop-site.shop-autima-shell .shop-card__title {
  font-family: var(--ds-font-heading);
  font-weight: 600;
  font-size: 14px;
  line-height: 1.35;
}

body.shop-site.shop-autima-shell .shop-card__title a {
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .shop-card__title a:hover {
  color: var(--ds-brand-700);
}

body.shop-site.shop-autima-shell .shop-card__footer {
  padding: 0 12px 14px;
  border-top: none;
}

body.shop-site.shop-autima-shell .shop-card__btns .add-to-cart {
  border-radius: var(--shop-radius) !important;
  box-shadow: none;
}

body.shop-site.shop-autima-shell .shop-card__tag--sale {
  border-radius: var(--shop-radius);
  background: var(--ds-sale);
}

/* --- Phase C: Listing filters + legacy product sidebar --- */

body.shop-site.shop-autima-shell .shop-filter-panel,
body.shop-site.shop-autima-shell #sticky-con,
body.shop-site.shop-autima-shell .shop-filter-panel .panel,
body.shop-site.shop-autima-shell .page-contents .panel.panel-default {
  border: 1px solid var(--shop-border);
  border-radius: var(--shop-radius);
  box-shadow: none;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop-filter-panel .title,
body.shop-site.shop-autima-shell .page-contents .panel-heading {
  font-family: var(--ds-font-heading);
  font-weight: 700;
  background: #fff;
  border-bottom: 1px solid var(--shop-border);
  border-radius: var(--shop-radius) var(--shop-radius) 0 0;
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .shop-filter-toggle {
  border-radius: var(--shop-radius);
  background: var(--ds-brand-900);
  color: var(--ds-yellow);
  border: none;
  font-weight: 600;
  padding: 10px 14px;
}

body.shop-site.shop-autima-shell .shop-filter-panel .form-control,
body.shop-site.shop-autima-shell .page-contents .form-control,
body.shop-site.shop-autima-shell .bootstrap-select .btn {
  height: var(--shop-input-h);
  background: var(--shop-input-bg);
  border: 1px solid transparent;
  border-radius: var(--shop-radius);
  box-shadow: none;
}

body.shop-site.shop-autima-shell .shop-filter-panel .form-control:focus,
body.shop-site.shop-autima-shell .page-contents .form-control:focus {
  background: #fff;
  border-color: var(--ds-ink-300);
  box-shadow: none;
}

body.shop-site.shop-autima-shell .bootstrap-select .btn {
  display: flex;
  align-items: center;
}

body.shop-site.shop-autima-shell .pagination > li > a,
body.shop-site.shop-autima-shell .pagination > li > span {
  border-radius: var(--shop-radius) !important;
  margin: 0 2px;
  border-color: var(--shop-border);
  color: var(--ds-ink-700);
}

body.shop-site.shop-autima-shell .pagination > .active > a,
body.shop-site.shop-autima-shell .pagination > .active > span {
  background: var(--ds-brand-900);
  border-color: var(--ds-brand-900);
  color: var(--ds-yellow);
}

/* Legacy .product cards (sidebar featured carousel) */

body.shop-site.shop-autima-shell .product,
body.shop-site.shop-autima-shell .product-card,
body.shop-site.shop-autima-shell .thumbnail.product {
  border: 1px solid var(--shop-border);
  border-radius: var(--shop-radius);
  box-shadow: none;
  background: #fff;
  overflow: hidden;
}

body.shop-site.shop-autima-shell .product:hover,
body.shop-site.shop-autima-shell .thumbnail.product:hover {
  box-shadow: var(--shop-shadow);
}

body.shop-site.shop-autima-shell .product .image_overlay,
body.shop-site.shop-autima-shell .image_overlay {
  background: rgba(11, 12, 14, 0.45);
}

body.shop-site.shop-autima-shell .sidebar .carousel,
body.shop-site.shop-autima-shell #featured-products,
body.shop-site.shop-autima-shell .carousel.slide .carousel-control {
  border-radius: var(--shop-radius);
}

body.shop-site.shop-autima-shell .sidebar .carousel .carousel-control {
  background-image: none;
  background: rgba(11, 12, 14, 0.4);
  width: 32px;
  height: 32px;
  top: 40%;
  margin-top: 0;
  border-radius: var(--shop-radius);
  opacity: 1;
  line-height: 32px;
  font-size: 12px;
}

body.shop-site.shop-autima-shell .sidebar .carousel .carousel-control:hover {
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
}

/* --- Phase C: PDP --- */

body.shop-site.shop-autima-shell .shop-page-card {
  border: 1px solid var(--shop-border) !important;
  border-radius: var(--shop-radius) !important;
  box-shadow: var(--shop-shadow);
  overflow: hidden;
}

body.shop-site.shop-autima-shell .shop-page-card > .panel-heading {
  background: #fff !important;
  border-bottom: 1px solid var(--shop-border);
  font-family: var(--ds-font-heading);
  font-weight: 700;
  font-size: 16px;
  padding: 14px 18px;
}

body.shop-site.shop-autima-shell .shop-page-card > .panel-body {
  padding: 18px;
}

body.shop-site.shop-autima-shell .page-contents .quantity-input,
body.shop-site.shop-autima-shell .page-contents .btn-minus,
body.shop-site.shop-autima-shell .page-contents .btn-plus {
  border-radius: var(--shop-radius);
  height: var(--shop-input-h);
}

body.shop-site.shop-autima-shell .page-contents .input-group-addon.btn-minus,
body.shop-site.shop-autima-shell .page-contents .input-group-addon.btn-plus {
  background: var(--shop-input-bg);
  border-color: transparent;
  color: var(--ds-ink-700);
}

body.shop-site.shop-autima-shell .page-contents .nav-tabs > li > a {
  border-radius: var(--shop-radius) var(--shop-radius) 0 0;
  font-family: var(--ds-font-heading);
}

/* --- Phase D: Soft forms (Nest fill) + transactional pages --- */

body.shop-site.shop-autima-shell .form-control,
body.shop-site.shop-autima-shell select.form-control,
body.shop-site.shop-autima-shell textarea.form-control {
  min-height: var(--shop-input-h);
  background: var(--shop-input-bg);
  border: 1px solid transparent;
  border-radius: var(--shop-radius);
  box-shadow: none;
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell textarea.form-control {
  min-height: 96px;
}

body.shop-site.shop-autima-shell .form-control:focus {
  background: #fff;
  border-color: var(--ds-ink-300);
  box-shadow: none;
  outline: none;
}

body.shop-site.shop-autima-shell .input-group-addon {
  border-radius: var(--shop-radius);
  background: var(--shop-input-bg);
  border-color: transparent;
  color: var(--ds-ink-500);
}

body.shop-site.shop-autima-shell .dropdown-menu-login .form-control {
  margin-bottom: 8px;
}

body.shop-site.shop-autima-shell .page-contents .panel.panel-default,
body.shop-site.shop-autima-shell .page-contents .shop-page-card {
  border-radius: var(--shop-radius);
}

body.shop-site.shop-autima-shell .page-contents #cart-table,
body.shop-site.shop-autima-shell .page-contents .table {
  border-color: var(--shop-border);
}

body.shop-site.shop-autima-shell .page-contents #cart-table > thead > tr > th,
body.shop-site.shop-autima-shell .page-contents .table > thead > tr > th {
  background: var(--ds-ink-50);
  border-bottom: 1px solid var(--shop-border);
  font-family: var(--ds-font-heading);
  font-weight: 700;
  color: var(--ds-ink-700);
  font-size: 13px;
}

body.shop-site.shop-autima-shell .page-contents #cart-table > tbody > tr > td,
body.shop-site.shop-autima-shell .page-contents .table > tbody > tr > td {
  border-top-color: var(--shop-border);
  vertical-align: middle;
}

body.shop-site.shop-autima-shell .page-contents .panel-footer,
body.shop-site.shop-autima-shell #cart-helper.panel-footer {
  background: var(--ds-ink-50);
  border-top: 1px solid var(--shop-border);
  border-radius: 0 0 var(--shop-radius) var(--shop-radius);
}

body.shop-site.shop-autima-shell .page-contents .btn-primary {
  background: var(--ds-brand-900);
  border-color: var(--ds-brand-900);
  color: #fff;
}

body.shop-site.shop-autima-shell .page-contents .btn-primary:hover,
body.shop-site.shop-autima-shell .page-contents .btn-primary:focus {
  background: var(--ds-brand-700);
  border-color: var(--ds-brand-700);
  color: #fff;
}

body.shop-site.shop-autima-shell .page-contents .alert {
  border-radius: var(--shop-radius);
  border: none;
  box-shadow: none;
}

body.shop-site.shop-autima-shell .breadcrumb {
  background: transparent;
  padding-left: 0;
  margin-bottom: 12px;
}

body.shop-site.shop-autima-shell .breadcrumb > li + li:before {
  color: var(--ds-ink-400);
}

body.shop-site.shop-autima-shell .page-contents {
  padding-top: 20px;
  padding-bottom: 32px;
}

/* Soften selectpicker dropdowns under shell */

body.shop-site.shop-autima-shell .bootstrap-select.btn-group .dropdown-menu {
  border-radius: var(--shop-radius);
  border-color: var(--shop-border);
  box-shadow: var(--shop-shadow-hover);
}

body.shop-site.shop-autima-shell .bootstrap-select .dropdown-toggle:focus {
  outline: none !important;
}

/* =========================================================================
   Nest visual BOOST (high-impact) — sits on top of shop-autima-shell
   INTENTIONAL TOKEN OVERRIDE: redefines --shop-radius / shadows / page-bg
   after the earlier Autima shell block (same selector, later in cascade wins).
   Do not "dedupe" these with the Phase A values — that would change visuals.
   Colors remain --ds-* only. Safe: CSS-only, no markup/URL changes.
   ========================================================================= */

body.shop-site.shop-autima-shell {
  --shop-radius: 10px;
  --shop-radius-lg: 14px;
  --shop-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.04);
  --shop-shadow-hover: 0 10px 28px rgba(18, 38, 63, 0.1);
  --shop-input-h: 48px;
  --shop-page-bg: #f4f6f8;
  --ds-radius: 10px;
  --ds-radius-lg: 14px;
  --ds-shadow: var(--shop-shadow);
  --ds-shadow-md: var(--shop-shadow-hover);
  font-size: 15px;
  line-height: 1.55;
}

/* Sticky white header stack (Nest main-header feel) */

body.shop-site.shop-autima-shell > #wrapper > header {
  position: sticky;
  top: 0;
  z-index: 1040;
  background: #fff;
  box-shadow: 0 4px 18px rgba(18, 38, 63, 0.06);
}

body.shop-site.shop-autima-shell .shop-announcement-bar {
  padding: 10px 0 !important;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
}

body.shop-site.shop-autima-shell .shop-announcement-bar .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

body.shop-site.shop-autima-shell .main-header {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
  border-bottom: none !important;
  background: #fff !important;
}

body.shop-site.shop-autima-shell .main-header .logo img {
  max-height: 64px !important;
}

body.shop-site.shop-autima-shell .main-header .search-box .input-group {
  border-radius: 999px !important;
  background: var(--ds-ink-100) !important;
  border: 2px solid transparent !important;
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}

body.shop-site.shop-autima-shell
  .main-header
  .search-box
  .input-group:focus-within {
  background: #fff !important;
  border-color: var(--ds-yellow) !important;
  box-shadow: 0 0 0 4px rgba(var(--ds-primary-rgb), 0.25);
}

body.shop-site.shop-autima-shell .main-header .search-box .form-control {
  height: 52px !important;
  font-size: 15px !important;
  padding-left: 22px !important;
  border-radius: 999px 0 0 999px !important;
  background: transparent !important;
}

body.shop-site.shop-autima-shell .main-header .search-box .btn-search {
  height: 52px !important;
  min-width: 56px;
  border-radius: 0 999px 999px 0 !important;
  font-size: 18px;
}

body.shop-site.shop-autima-shell .main-header .shop-header-account,
body.shop-site.shop-autima-shell .main-header .cart-btn .shopping-cart {
  height: 52px !important;
  border-radius: 999px !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
  font-weight: 700 !important;
}

body.shop-site.shop-autima-shell .main-header .shop-header-account {
  border: 2px solid var(--ds-ink-200) !important;
}

body.shop-site.shop-autima-shell .main-header .shop-header-account:hover {
  border-color: var(--ds-brand-900) !important;
  background: var(--ds-ink-50) !important;
}

body.shop-site.shop-autima-shell .main-header .cart-btn .shopping-cart {
  box-shadow: 0 6px 16px rgba(var(--ds-primary-rgb), 0.35) !important;
}

body.shop-site.shop-autima-shell .main-header .cart-btn .shopping-cart:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(var(--ds-primary-rgb), 0.45) !important;
}

body.shop-site.shop-autima-shell .main-header .cart-btn .cart-total-items {
  min-width: 22px !important;
  height: 22px;
  line-height: 22px !important;
  font-size: 12px !important;
}

/* Nav: Nest-like pill active states on charcoal bar */

body.shop-site.shop-autima-shell nav.navbar.navbar-default {
  min-height: 56px !important;
  padding: 6px 0 !important;
  box-shadow: none !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li
  > a {
  padding: 12px 18px !important;
  margin: 4px 2px;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li
  > a:hover,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li.open
  > a {
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--ds-yellow) !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li.active
  > a {
  background: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
}

/* Hero: inset rounded stage (Nest content-main spacing) */

body.shop-site.shop-autima-shell.shop-homepage #slider.carousel {
  margin: 20px auto 0 !important;
  max-width: 1200px;
  width: calc(100% - 30px);
  border-radius: var(--shop-radius-lg) !important;
  overflow: hidden !important;
  box-shadow: var(--shop-shadow-hover);
}

body.shop-site.shop-autima-shell #slider .shop-hero-img,
body.shop-site.shop-autima-shell #slider .item img {
  width: 100%;
  min-height: 220px;
  -o-object-fit: cover;
     object-fit: cover;
}

body.shop-site.shop-autima-shell #slider .carousel-control {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  top: 50% !important;
  bottom: auto !important;
  margin-top: -24px !important;
  border-radius: 50% !important;
  background: #fff !important;
  background-image: none !important;
  color: var(--ds-brand-900) !important;
  box-shadow: 0 6px 18px rgba(18, 38, 63, 0.15);
  opacity: 1 !important;
  line-height: 1 !important;
  font-size: 18px !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Kill nested second circle on the FA icon (was causing duplicate arrows) */

body.shop-site.shop-autima-shell #slider .carousel-control .fa,
body.shop-site.shop-autima-shell #slider .carousel-control span {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: 1 !important;
  text-shadow: none !important;
}

body.shop-site.shop-autima-shell #slider .carousel-control:hover,
body.shop-site.shop-autima-shell #slider .carousel-control:focus {
  background: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  opacity: 1 !important;
}

body.shop-site.shop-autima-shell #slider .carousel-control:hover .fa,
body.shop-site.shop-autima-shell #slider .carousel-control:focus .fa {
  background: transparent !important;
  color: inherit !important;
}

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell #slider .carousel-control {
    width: 40px !important;
    height: 40px !important;
    margin-top: -20px !important;
    font-size: 15px !important;
  }

  body.shop-site.shop-autima-shell #slider .carousel-control.left {
    left: 10px !important;
  }

  body.shop-site.shop-autima-shell #slider .carousel-control.right {
    right: 10px !important;
  }
}

body.shop-site.shop-autima-shell #slider .carousel-indicators {
  bottom: 20px !important;
}

body.shop-site.shop-autima-shell #slider .carousel-indicators li {
  width: 12px !important;
  height: 12px !important;
  margin: 0 5px !important;
  background: rgba(255, 255, 255, 0.55) !important;
  border: 2px solid #fff !important;
}

body.shop-site.shop-autima-shell #slider .carousel-indicators .active {
  width: 28px !important;
  border-radius: 999px !important;
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
}

/* Trust strip ? Nest icontext cards */

body.shop-site.shop-autima-shell .shop-trust-section {
  padding-top: 36px !important;
  padding-bottom: 8px;
}

body.shop-site.shop-autima-shell .shop-trust {
  gap: 20px !important;
}

body.shop-site.shop-autima-shell .shop-trust__item {
  padding: 22px 24px !important;
  border-radius: var(--shop-radius-lg) !important;
  border: 1px solid var(--ds-border) !important;
  box-shadow: var(--shop-shadow) !important;
  gap: 16px !important;
}

body.shop-site.shop-autima-shell .shop-trust__item:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shop-shadow-hover) !important;
  border-color: var(--ds-yellow) !important;
}

body.shop-site.shop-autima-shell .shop-trust__icon {
  width: 58px !important;
  height: 58px !important;
  border-radius: 50% !important;
  font-size: 22px !important;
  box-shadow: 0 6px 14px rgba(var(--ds-primary-rgb), 0.35);
}

body.shop-site.shop-autima-shell .shop-trust__title {
  font-size: 16px !important;
  font-family: var(--ds-font-heading);
  font-weight: 700 !important;
}

body.shop-site.shop-autima-shell .shop-trust__sub {
  font-size: 13px !important;
}

/* Section titles ? larger Nest content-header */

body.shop-site.shop-autima-shell .shop-section-title {
  font-size: 28px !important;
  letter-spacing: -0.02em;
}

body.shop-site.shop-autima-shell .shop-section-sub {
  font-size: 14px !important;
}

body.shop-site.shop-autima-shell .page-contents {
  padding-top: 28px !important;
  padding-bottom: 48px !important;
}

body.shop-site.shop-autima-shell .shop-home-cta {
  margin-top: 28px;
}

body.shop-site.shop-autima-shell .shop-home-cta .btn-theme {
  min-height: 48px !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 20px rgba(var(--ds-primary-rgb), 0.35);
}

/* Product cards — Nest card (homepage .shop-products-grid only; not listing layout) */

body.shop-site.shop-autima-shell
  .shop-products-grid:not(.shop-listing-layout):not(.shop-autima-layout) {
  gap: 22px !important;
}

body.shop-site.shop-autima-shell .shop-card,
body.shop-site.shop-autima-shell .ds-product {
  border: 1px solid var(--ds-border) !important;
  border-radius: var(--shop-radius-lg) !important;
  box-shadow: var(--shop-shadow) !important;
  background: #fff !important;
  padding-bottom: 4px;
}

body.shop-site.shop-autima-shell .shop-card:hover,
body.shop-site.shop-autima-shell .ds-product:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--shop-shadow-hover) !important;
  border-color: rgba(var(--ds-primary-rgb), 0.55) !important;
}

body.shop-site.shop-autima-shell .shop-card__media {
  padding: 16px 16px 8px !important;
  overflow: hidden;
}

body.shop-site.shop-autima-shell .shop-card__media img {
  border-radius: var(--shop-radius);
  transition: transform 0.35s ease;
}

body.shop-site.shop-autima-shell .shop-card:hover .shop-card__media img {
  transform: scale(1.06);
}

body.shop-site.shop-autima-shell .shop-card__body {
  padding: 8px 16px 4px !important;
}

body.shop-site.shop-autima-shell .shop-card__title {
  font-size: 15px !important;
  min-height: 2.6em;
}

body.shop-site.shop-autima-shell .shop-card__footer {
  padding: 10px 16px 16px !important;
}

body.shop-site.shop-autima-shell .shop-card__price-current {
  font-size: 18px !important;
  font-weight: 800 !important;
  font-family: var(--ds-font-heading);
}

body.shop-site.shop-autima-shell .shop-card__btns .add-to-cart {
  border-radius: 999px !important;
  padding: 10px 16px !important;
  box-shadow: 0 4px 12px rgba(var(--ds-primary-rgb), 0.35);
}

body.shop-site.shop-autima-shell .shop-card__btns .add-to-cart:hover {
  transform: scale(1.05);
}

body.shop-site.shop-autima-shell .shop-card__tag,
body.shop-site.shop-autima-shell .shop-card__tag--sale {
  border-radius: 999px !important;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 4px 10px !important;
}

/* Category chips */

body.shop-site.shop-autima-shell .shop-category-chip {
  border-radius: 999px !important;
  padding: 8px 16px !important;
  font-weight: 700 !important;
  border-width: 2px !important;
  transition:
    transform 0.15s ease,
    background 0.15s ease;
}

body.shop-site.shop-autima-shell .shop-category-chip:hover {
  transform: translateY(-2px);
}

/* Filters / listing panels */

body.shop-site.shop-autima-shell .shop-filter-panel,
body.shop-site.shop-autima-shell #sticky-con > *,
body.shop-site.shop-autima-shell .page-contents .panel.panel-default,
body.shop-site.shop-autima-shell .shop-page-card {
  border-radius: var(--shop-radius-lg) !important;
  box-shadow: var(--shop-shadow) !important;
  overflow: hidden;
}

body.shop-site.shop-autima-shell .shop-filter-panel {
  padding: 8px;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop-filter-panel .title,
body.shop-site.shop-autima-shell .page-contents .panel-heading,
body.shop-site.shop-autima-shell .shop-page-card > .panel-heading {
  font-size: 16px !important;
  padding: 16px 18px !important;
  background: #fff !important;
  border-bottom: 1px solid var(--ds-border) !important;
}

body.shop-site.shop-autima-shell .shop-filter-toggle {
  border-radius: 999px !important;
  padding: 12px 18px !important;
  box-shadow: 0 6px 16px rgba(11, 12, 14, 0.18);
}

body.shop-site.shop-autima-shell .form-control,
body.shop-site.shop-autima-shell select.form-control,
body.shop-site.shop-autima-shell .bootstrap-select .btn {
  min-height: 48px !important;
  border-radius: var(--shop-radius) !important;
  background: #f4f5f9 !important;
  border: 1px solid transparent !important;
  font-size: 14px;
}

body.shop-site.shop-autima-shell .form-control:focus {
  background: #fff !important;
  border-color: var(--ds-yellow) !important;
  box-shadow: 0 0 0 3px rgba(var(--ds-primary-rgb), 0.28) !important;
}

/* Legacy sidebar products */

body.shop-site.shop-autima-shell .product,
body.shop-site.shop-autima-shell .thumbnail.product {
  border: 1px solid var(--ds-border) !important;
  border-radius: var(--shop-radius-lg) !important;
  box-shadow: var(--shop-shadow) !important;
  padding: 10px;
}

/* Footer — denser Nest-dark band */

body.shop-site.shop-autima-shell section.footer {
  margin-top: 74px !important;
  padding-top: 0px !important;
  padding-bottom: 0 !important;
}

body.shop-site.shop-autima-shell section.footer .title-footer {
  font-size: 18px !important;
  margin-bottom: 18px !important;
  padding-bottom: 12px !important;
}

body.shop-site.shop-autima-shell section.footer .follow-us li a {
  width: 42px;
  height: 42px;
  line-height: 42px;
  text-align: center;
  border-radius: 50% !important;
  display: inline-block;
  transition:
    transform 0.2s ease,
    background 0.2s ease;
}

body.shop-site.shop-autima-shell section.footer .follow-us li a:hover {
  transform: translateY(-3px) scale(1.05);
}

body.shop-site.shop-autima-shell section.footer .footer-bottom {
  margin-top: 40px !important;
  padding: 18px 0 !important;
  font-weight: 600;
}

/* Mobile menu + header */

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell.shop-homepage #slider.carousel {
    width: calc(100% - 20px);
    margin-top: 12px !important;
    border-radius: var(--shop-radius) !important;
  }

  body.shop-site.shop-autima-shell .main-header {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  body.shop-site.shop-autima-shell .main-header .logo img {
    max-height: 48px !important;
  }

  body.shop-site.shop-autima-shell .main-header .search-box .form-control,
  body.shop-site.shop-autima-shell .main-header .search-box .btn-search {
    height: 46px !important;
  }

  body.shop-site.shop-autima-shell nav.navbar.navbar-default .navbar-collapse {
    margin: 8px 12px 12px;
    border-radius: var(--shop-radius-lg);
    padding: 8px;
    background: var(--ds-brand-800) !important;
  }

  body.shop-site.shop-autima-shell
    nav.navbar.navbar-default
    .navbar-nav
    > li
    > a {
    margin: 2px 0;
  }

  body.shop-site.shop-autima-shell .shop-section-title {
    font-size: 22px !important;
  }

  body.shop-site.shop-autima-shell
    .shop-products-grid:not(.shop-listing-layout):not(.shop-autima-layout) {
    gap: 14px !important;
  }
}

/* =========================================================================
   Phase E ? Cart, Checkout, PDP (Nest soft commerce under shop-autima-shell)
   Reversible: remove body.shop-autima-shell
   ========================================================================= */

/* --- Transaction page chrome --- */

body.shop-site.shop-autima-shell .shop-tx-page {
  padding-top: 8px;
  padding-bottom: 40px;
}

body.shop-site.shop-autima-shell .shop-tx-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin: 20px 0 18px;
}

body.shop-site.shop-autima-shell .shop-tx-title {
  margin: 0;
  font-family: var(--ds-font-heading);
  font-weight: 700;
  font-size: 28px;
  color: var(--ds-ink-900);
  line-height: 1.2;
}

body.shop-site.shop-autima-shell .shop-tx-sub {
  margin: 6px 0 0;
  font-size: 14px;
  color: var(--ds-ink-500);
}

body.shop-site.shop-autima-shell .shop-tx-steps {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

body.shop-site.shop-autima-shell .shop-tx-step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--ds-font-heading);
  font-weight: 700;
  font-size: 13px;
  color: var(--ds-ink-400);
}

body.shop-site.shop-autima-shell .shop-tx-step__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ds-ink-100);
  color: var(--ds-ink-500);
  font-size: 12px;
}

body.shop-site.shop-autima-shell .shop-tx-step.is-active {
  color: var(--ds-brand-900);
}

body.shop-site.shop-autima-shell .shop-tx-step.is-active .shop-tx-step__num {
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
}

body.shop-site.shop-autima-shell .shop-tx-step.is-done {
  color: var(--ds-ink-700);
}

body.shop-site.shop-autima-shell .shop-tx-step.is-done .shop-tx-step__num {
  background: var(--ds-brand-900);
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell .shop-tx-step__sep {
  width: 28px;
  height: 2px;
  background: var(--ds-ink-200);
  border-radius: 2px;
}

body.shop-site.shop-autima-shell .shop-tx-card__head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  background: #fff !important;
  border-bottom: 1px solid var(--ds-border) !important;
  padding: 16px 20px !important;
}

body.shop-site.shop-autima-shell .shop-tx-card__title {
  font-family: var(--ds-font-heading);
  font-weight: 700;
  font-size: 16px;
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .shop-tx-card__title .fa {
  margin-right: 8px;
  color: var(--ds-ink-400);
}

body.shop-site.shop-autima-shell .shop-tx-card__link {
  font-size: 13px;
  font-weight: 600;
  color: var(--ds-ink-500);
  text-decoration: none;
}

body.shop-site.shop-autima-shell .shop-tx-card__link:hover {
  color: var(--ds-brand-900);
}

body.shop-site.shop-autima-shell .shop-tx-card__body--flush {
  padding: 0 !important;
}

body.shop-site.shop-autima-shell .shop-tx-card__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  background: #f8fafc !important;
  border-top: 1px solid var(--ds-border) !important;
  padding: 14px 18px !important;
}

body.shop-site.shop-autima-shell .shop-tx-empty {
  padding: 56px 24px;
  text-align: center;
}

body.shop-site.shop-autima-shell .shop-tx-empty__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
  font-size: 24px;
  margin-bottom: 16px;
}

body.shop-site.shop-autima-shell .shop-tx-empty__title {
  font-family: var(--ds-font-heading);
  font-weight: 700;
  margin: 0 0 18px;
  color: var(--ds-ink-900);
}

/* Quiet Nest cart table (no heavy striping) */

body.shop-site.shop-autima-shell .shop-tx-table,
body.shop-site.shop-autima-shell #cart-table.shop-tx-table {
  margin: 0;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop-tx-table > thead > tr > th,
body.shop-site.shop-autima-shell #cart-table.shop-tx-table > thead > tr > th {
  background: #f8fafc !important;
  border: none !important;
  border-bottom: 1px solid var(--ds-border) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--ds-ink-500) !important;
  padding: 14px 12px !important;
}

body.shop-site.shop-autima-shell .shop-tx-table > tbody > tr > td,
body.shop-site.shop-autima-shell #cart-table.shop-tx-table > tbody > tr > td {
  border: none !important;
  border-bottom: 1px solid #f1f5f9 !important;
  padding: 16px 12px !important;
  vertical-align: middle !important;
  background: #fff !important;
}

body.shop-site.shop-autima-shell
  .shop-tx-table.table-striped
  > tbody
  > tr:nth-child(odd)
  > td,
body.shop-site.shop-autima-shell
  #cart-table.table-striped
  > tbody
  > tr:nth-child(odd)
  > td {
  background: #fff !important;
}

body.shop-site.shop-autima-shell .shop-tx-table > tbody > tr:hover > td {
  background: #fafbfc !important;
}

body.shop-site.shop-autima-shell .shop-tx-summary {
  position: sticky;
  top: 100px;
}

body.shop-site.shop-autima-shell .shop-tx-summary-wrap {
  margin-top: 0;
}

body.shop-site.shop-autima-shell .shop-tx-totals {
  margin-bottom: 16px;
}

body.shop-site.shop-autima-shell .shop-tx-totals > tbody > tr > td,
body.shop-site.shop-autima-shell .shop-tx-totals > tr > td,
body.shop-site.shop-autima-shell #cart-totals > tbody > tr > td,
body.shop-site.shop-autima-shell #cart-totals > tr > td {
  border: none !important;
  padding: 10px 0 !important;
  background: transparent !important;
  font-size: 14px;
  color: var(--ds-ink-700);
}

body.shop-site.shop-autima-shell .shop-tx-totals tr.active td,
body.shop-site.shop-autima-shell .shop-tx-totals__grand td,
body.shop-site.shop-autima-shell .cart-totals tr.active td {
  background: transparent !important;
  border-top: 1px solid var(--ds-border) !important;
  padding-top: 14px !important;
  font-size: 16px !important;
  font-family: var(--ds-font-heading);
  font-weight: 700;
  color: var(--ds-ink-900) !important;
}

body.shop-site.shop-autima-shell .shop-tx-checkout-btn,
body.shop-site.shop-autima-shell .shop-tx-submit {
  border-radius: 999px !important;
  font-weight: 700 !important;
  box-shadow: 0 6px 16px rgba(var(--ds-primary-rgb), 0.35);
}

body.shop-site.shop-autima-shell .shop-tx-btn-muted {
  color: var(--ds-ink-500) !important;
  border-color: var(--ds-border) !important;
  background: #fff !important;
}

body.shop-site.shop-autima-shell .shop-tx-note {
  margin-top: 16px;
  font-size: 12px;
}

body.shop-site.shop-autima-shell .shop-tx-divider {
  border: none;
  border-top: 1px solid var(--ds-border);
  margin: 22px 0;
}

body.shop-site.shop-autima-shell .shop-tx-tabs {
  border-bottom: 1px solid var(--ds-border);
  margin-bottom: 0;
}

body.shop-site.shop-autima-shell .shop-tx-tabs > li > a {
  font-family: var(--ds-font-heading);
  font-weight: 700;
  color: var(--ds-ink-500);
  border: none !important;
  border-radius: 0 !important;
  padding: 12px 16px;
}

body.shop-site.shop-autima-shell .shop-tx-tabs > li.active > a,
body.shop-site.shop-autima-shell .shop-tx-tabs > li.active > a:hover,
body.shop-site.shop-autima-shell .shop-tx-tabs > li.active > a:focus {
  color: var(--ds-brand-900) !important;
  background: transparent !important;
  border: none !important;
  box-shadow: inset 0 -3px 0 var(--ds-yellow);
}

body.shop-site.shop-autima-shell .shop-checkout-payment label {
  border-radius: 12px !important;
  border: 1px solid var(--ds-border) !important;
  background: #fff;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}

body.shop-site.shop-autima-shell
  .shop-checkout-payment
  label:has(input:checked) {
  border-color: var(--ds-yellow) !important;
  background: rgba(var(--ds-primary-rgb), 0.12) !important;
  box-shadow: 0 0 0 3px rgba(var(--ds-primary-rgb), 0.2);
}

body.shop-site.shop-autima-shell .shop-tx-address {
  border: 1px solid var(--ds-border);
  border-radius: 12px;
  padding: 14px 16px;
  background: #fff;
  margin-bottom: 12px;
}

body.shop-site.shop-autima-shell .shop-tx-address:has(input:checked) {
  border-color: var(--ds-yellow);
  background: rgba(var(--ds-primary-rgb), 0.08);
}

body.shop-site.shop-autima-shell .shop-tx-well {
  border: 1px solid var(--ds-border) !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell .shop-checkout-section__title {
  font-family: var(--ds-font-heading);
  font-weight: 700;
  font-size: 15px;
  margin: 0 0 14px;
}

/* --- PDP (Autima product-details.html) --- */

body.shop-site.shop-autima-shell .shop-pdp-page {
  padding-bottom: 56px;
  background: #fff;
}

/* Breadcrumb */

body.shop-site.shop-autima-shell .shop-pdp-breadcrumb {
  margin: 20px 0 18px;
}

body.shop-site.shop-autima-shell .shop-pdp-breadcrumb__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 0;
  font-size: 13px;
  color: var(--ds-ink-600);
}

body.shop-site.shop-autima-shell
  .shop-pdp-breadcrumb__list
  li:not(:last-child)::after {
  content: "/";
  margin: 0 8px;
  color: #c4c4c4;
}

body.shop-site.shop-autima-shell .shop-pdp-breadcrumb__list a {
  color: var(--ds-ink-600);
  text-decoration: none;
}

body.shop-site.shop-autima-shell .shop-pdp-breadcrumb__list a:hover {
  color: var(--ds-hot);
}

body.shop-site.shop-autima-shell
  .shop-pdp-breadcrumb__list
  li[aria-current="page"] {
  color: var(--ds-ink-900);
  font-weight: 600;
}

/* Card shell */

body.shop-site.shop-autima-shell .shop-pdp-card {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  margin: 0 !important;
}

body.shop-site.shop-autima-shell .shop-pdp-card__body {
  padding: 0 !important;
}

body.shop-site.shop-autima-shell .shop-pdp-layout {
  margin-bottom: 28px;
}

/* Gallery */

body.shop-site.shop-autima-shell .shop-pdp-gallery {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: var(--shop-radius, 6px);
  padding: 16px;
  margin-bottom: 20px;
}

body.shop-site.shop-autima-shell .shop-pdp-zoom {
  border: 1px solid var(--ds-border);
  border-radius: var(--shop-radius, 6px);
  overflow: hidden;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop-pdp-main-img {
  border: none !important;
  border-radius: 0 !important;
  background: #fff;
  width: 100%;
  max-height: 480px;
  -o-object-fit: contain;
     object-fit: contain;
  margin: 0 auto;
  display: block;
  transition: opacity 0.25s ease;
}

body.shop-site.shop-autima-shell .shop-pdp-zoom a:hover .shop-pdp-main-img {
  opacity: 0.92;
}

body.shop-site.shop-autima-shell .shop-pdp-thumbs {
  position: static !important;
  width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 0;
  text-align: left;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  left: auto !important;
  bottom: auto !important;
}

body.shop-site.shop-autima-shell .shop-pdp-thumbs > li {
  width: 72px !important;
  height: 72px !important;
  text-indent: 0 !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: 3px !important;
  overflow: hidden;
  background: #fff;
  opacity: 1 !important;
  margin: 0 !important;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

body.shop-site.shop-autima-shell .shop-pdp-thumbs > li:hover {
  border-color: #cfcfcf !important;
}

body.shop-site.shop-autima-shell .shop-pdp-thumbs > li.active {
  border-color: var(--ds-yellow) !important;
  box-shadow: 0 0 0 1px var(--ds-yellow);
}

body.shop-site.shop-autima-shell .shop-pdp-thumbs > li img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border: none !important;
  border-radius: 0 !important;
}

/* Summary / buy column (product_d_right) */

body.shop-site.shop-autima-shell .shop-pdp-summary {
  padding: 4px 0 8px 8px;
}

body.shop-site.shop-autima-shell .shop-pdp-title {
  margin: 0 0 10px;
  font-family: var(--ds-font-heading);
  font-weight: 400;
  font-size: 22px;
  color: var(--ds-ink-900);
  line-height: 1.35;
  text-transform: capitalize;
}

body.shop-site.shop-autima-shell .shop-pdp-subtitle {
  margin: -4px 0 12px;
  font-size: 14px;
  color: var(--ds-ink-600);
}

body.shop-site.shop-autima-shell .shop-pdp-summary__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  margin-bottom: 16px;
}

body.shop-site.shop-autima-shell .shop-pdp-code {
  margin: 0;
  font-size: 13px;
  color: var(--ds-ink-600);
}

body.shop-site.shop-autima-shell .shop-pdp-code span {
  font-weight: 600;
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .shop-pdp-stock {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 3px;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.02em;
}

body.shop-site.shop-autima-shell .shop-pdp-stock--yes {
  background: rgba(22, 163, 74, 0.1);
  color: #15803d;
}

body.shop-site.shop-autima-shell .shop-pdp-stock--no {
  background: rgba(220, 41, 37, 0.1);
  color: var(--ds-sale);
}

/* Price (Autima #FD5018) */

body.shop-site.shop-autima-shell .shop-pdp-price {
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--ds-border) !important;
  border-radius: 0 !important;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 14px;
}

body.shop-site.shop-autima-shell .shop-pdp-price__label {
  display: none;
}

body.shop-site.shop-autima-shell .shop-pdp-price__current,
body.shop-site.shop-autima-shell .shop-pdp-price .current_price {
  font-family: var(--ds-font-heading);
  font-weight: 700;
  font-size: 24px;
  color: var(--ds-hot) !important;
  line-height: 1.2;
}

body.shop-site.shop-autima-shell .shop-pdp-price__was,
body.shop-site.shop-autima-shell .shop-pdp-price .old_price {
  font-size: 18px;
  color: #a0a0a0;
  text-decoration: line-through;
  font-weight: 400;
}

body.shop-site.shop-autima-shell .shop-pdp-price__promo-dates {
  width: 100%;
  font-size: 12px;
  color: var(--ds-ink-600);
}

/* Category / brand chips */

body.shop-site.shop-autima-shell .shop-pdp-chips {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 20px;
  font-size: 14px;
  color: var(--ds-ink-600);
}

body.shop-site.shop-autima-shell .shop-pdp-chips a {
  color: var(--ds-ink-900);
  font-weight: 500;
  text-decoration: none;
}

body.shop-site.shop-autima-shell .shop-pdp-chips a:hover {
  color: var(--ds-hot);
}

/* Buy box */

body.shop-site.shop-autima-shell .shop-pdp-buybox {
  border: none;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

body.shop-site.shop-autima-shell .shop-pdp-label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  text-transform: capitalize;
  color: var(--ds-ink-900);
  margin-bottom: 8px;
}

body.shop-site.shop-autima-shell .shop-pdp-variant-select {
  margin-bottom: 18px;
}

body.shop-site.shop-autima-shell .shop-pdp-qty-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin-bottom: 18px;
}

body.shop-site.shop-autima-shell .shop-pdp-qty-row > .shop-pdp-label {
  margin: 0;
  min-width: 70px;
}

body.shop-site.shop-autima-shell .shop-pdp-qty {
  width: 140px;
  max-width: 100%;
}

body.shop-site.shop-autima-shell .shop-pdp-qty .input-group-addon,
body.shop-site.shop-autima-shell .shop-pdp-qty .form-control {
  height: 42px;
  border-color: #ebebeb;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop-pdp-qty .input-group-addon {
  cursor: pointer;
  color: var(--ds-ink-700);
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

body.shop-site.shop-autima-shell .shop-pdp-qty .input-group-addon:hover {
  background: var(--ds-yellow);
  color: var(--ds-on-primary);
}

body.shop-site.shop-autima-shell .shop-pdp-qty .form-control {
  font-weight: 600;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell .shop-pdp-actions {
  margin-bottom: 8px;
}

body.shop-site.shop-autima-shell .shop-pdp-actions__group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
}

body.shop-site.shop-autima-shell .shop-pdp-actions .btn-theme,
body.shop-site.shop-autima-shell .shop-pdp-atc-btn {
  border-radius: 3px !important;
  font-weight: 600;
  text-transform: capitalize;
  min-width: 200px;
  height: 42px;
  line-height: 1.2;
  padding: 0 22px !important;
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  box-shadow: none !important;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}

body.shop-site.shop-autima-shell .shop-pdp-actions .btn-theme:hover,
body.shop-site.shop-autima-shell .shop-pdp-atc-btn:hover {
  background: var(--ds-ink-900) !important;
  border-color: var(--ds-ink-900) !important;
  color: #fff !important;
}

body.shop-site.shop-autima-shell .shop-pdp-actions .btn-default,
body.shop-site.shop-autima-shell .shop-pdp-actions .add-to-wishlist {
  border-radius: 3px !important;
  border: 1px solid var(--ds-border) !important;
  background: #fff !important;
  color: var(--ds-ink-900) !important;
  width: 48px;
  height: 42px;
  padding: 0 !important;
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    color 0.2s ease;
}

body.shop-site.shop-autima-shell .shop-pdp-actions .add-to-wishlist:hover {
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
}

body.shop-site.shop-autima-shell .shop-pdp-oos {
  border-radius: 3px;
  border: 1px solid var(--ds-border);
  background: var(--ds-soft);
  margin: 0;
}

/* Specs / description tabs (product_d_info) */

body.shop-site.shop-autima-shell .shop-pdp-info {
  margin-top: 8px;
  border: 1px solid var(--ds-border);
  border-radius: var(--shop-radius, 6px);
  background: #fff;
  overflow: hidden;
}

body.shop-site.shop-autima-shell .shop-pdp-info__tabs {
  border-bottom: 1px solid var(--ds-border);
  background: #fafafa;
  padding: 0 12px;
}

body.shop-site.shop-autima-shell .shop-pdp-info__tabs .nav-tabs {
  border: none;
  margin: 0;
}

body.shop-site.shop-autima-shell .shop-pdp-info__tabs .nav-tabs > li {
  margin-bottom: 0;
}

body.shop-site.shop-autima-shell .shop-pdp-info__tabs .nav-tabs > li > a {
  border: none !important;
  border-radius: 0 !important;
  margin: 0;
  padding: 14px 18px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ds-ink-600);
  background: transparent !important;
  text-transform: capitalize;
}

body.shop-site.shop-autima-shell .shop-pdp-info__tabs .nav-tabs > li.active > a,
body.shop-site.shop-autima-shell .shop-pdp-info__tabs .nav-tabs > li > a:hover {
  color: var(--ds-ink-900) !important;
  background: transparent !important;
  box-shadow: inset 0 -2px 0 var(--ds-yellow);
}

body.shop-site.shop-autima-shell .shop-pdp-info__content {
  padding: 22px 24px 28px;
}

body.shop-site.shop-autima-shell .shop-pdp-details,
body.shop-site.shop-autima-shell .product_info_content {
  margin: 0;
  border: none !important;
  box-shadow: none !important;
  font-size: 14px;
  line-height: 1.75;
  color: var(--ds-ink-700);
}

body.shop-site.shop-autima-shell .shop-pdp-details p,
body.shop-site.shop-autima-shell .product_info_content p {
  margin-bottom: 14px;
}

body.shop-site.shop-autima-shell .shop-pdp-meta {
  border: none;
  border-radius: 0;
  overflow: visible;
  background: transparent;
}

body.shop-site.shop-autima-shell .shop-pdp-meta-table {
  margin: 0 !important;
  width: 100%;
}

body.shop-site.shop-autima-shell .shop-pdp-meta-table > tbody > tr > td {
  border: none !important;
  border-bottom: 1px solid #f0f0f0 !important;
  padding: 12px 8px !important;
  background: #fff !important;
  vertical-align: middle;
  font-size: 14px;
}

body.shop-site.shop-autima-shell
  .shop-pdp-meta-table
  > tbody
  > tr
  > td:first-child {
  color: var(--ds-ink-600);
  font-weight: 600;
  width: 36%;
  font-size: 13px;
  text-transform: capitalize;
}

body.shop-site.shop-autima-shell .shop-pdp-meta-table.table-bordered,
body.shop-site.shop-autima-shell
  .shop-pdp-meta-table.table-striped
  > tbody
  > tr:nth-child(odd)
  > td {
  background: #fff !important;
  border-color: transparent !important;
}

body.shop-site.shop-autima-shell .shop-pdp-variant {
  background: #f4f4f4 !important;
  color: var(--ds-ink-700) !important;
  border-radius: 3px !important;
  font-weight: 600;
  margin: 2px;
  display: inline-block;
  padding: 4px 10px;
}

body.shop-site.shop-autima-shell .shop-pdp-option-head {
  background: var(--ds-brand-900) !important;
  color: var(--ds-yellow) !important;
  font-family: var(--ds-font-heading);
  font-weight: 700;
}

body.shop-site.shop-autima-shell .shop-pdp-combo-title {
  display: block;
  margin: 16px 0 8px;
  font-size: 15px;
  color: var(--ds-ink-900);
}

/* Share strip */

body.shop-site.shop-autima-shell .shop-pdp-share {
  margin-top: 20px;
  padding-top: 8px;
}

body.shop-site.shop-autima-shell .shop-pdp-share > p {
  background: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  border-radius: 3px 3px 0 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Related */

body.shop-site.shop-autima-shell .shop-pdp-related {
  margin-top: 36px;
  margin-bottom: 48px;
  padding-top: 8px;
  border-top: 1px solid var(--ds-border);
}

body.shop-site.shop-autima-shell .shop-pdp-related .shop-section-title {
  font-size: 22px;
  font-weight: 400;
  text-transform: capitalize;
}

body.shop-site.shop-autima-shell .shop-pdp-related .shop-section-title strong {
  font-weight: 700;
}

body.shop-site.shop-autima-shell .shop-pdp-related .shop-section-sub {
  color: var(--ds-ink-600);
}

/* --- PDP Featured rail (sidebar2 #carousel-example) --- */

body.shop-site.shop-autima-shell .shop-pdp-aside {
  margin-top: 20px;
}

body.shop-site.shop-autima-shell .shop-pdp-page #sticky-con.shop-featured-rail,
body.shop-site.shop-autima-shell .shop-featured-rail,
body.shop-site.shop-autima-shell #sticky-con.shop-featured-rail {
  border: none !important;
  border-radius: var(--shop-radius, 6px);
  background: #fff;
  padding: 14px 12px 16px;
  box-shadow: none;
}

body.shop-site.shop-autima-shell .shop-featured-rail__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ds-border);
}

body.shop-site.shop-autima-shell .shop-featured-rail__title,
body.shop-site.shop-autima-shell
  .shop-pdp-page
  #sticky-con
  .shop-featured-rail__title.title {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  font-family: var(--ds-font-heading);
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
  text-transform: capitalize !important;
  color: var(--ds-ink-900) !important;
  float: none !important;
  flex: 1 1 auto;
}

body.shop-site.shop-autima-shell .shop-featured-rail__controls-wrap,
body.shop-site.shop-autima-shell .shop-featured-rail__controls {
  float: none !important;
  display: flex;
  align-items: center;
  gap: 6px;
  position: static !important;
}

body.shop-site.shop-autima-shell .shop-featured-rail__controls a.btn,
body.shop-site.shop-autima-shell
  .shop-featured-rail__controls
  a.shop-featured-rail__nav,
body.shop-site.shop-autima-shell .shop-featured-rail__controls a.left,
body.shop-site.shop-autima-shell .shop-featured-rail__controls a.right {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 3px !important;
  border: 1px solid var(--ds-border) !important;
  background: #fff !important;
  background-image: none !important;
  color: var(--ds-ink-900) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
  float: none !important;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

body.shop-site.shop-autima-shell .shop-featured-rail__controls a.btn .fa,
body.shop-site.shop-autima-shell
  .shop-featured-rail__controls
  a.shop-featured-rail__nav
  .fa {
  display: inline-block;
  margin: 0;
  font-size: 12px;
  line-height: 1;
  color: inherit;
}

body.shop-site.shop-autima-shell .shop-featured-rail__controls a.btn:hover,
body.shop-site.shop-autima-shell .shop-featured-rail__controls a.btn:focus,
body.shop-site.shop-autima-shell
  .shop-featured-rail__controls
  a.shop-featured-rail__nav:hover,
body.shop-site.shop-autima-shell
  .shop-featured-rail__controls
  a.shop-featured-rail__nav:focus {
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  opacity: 1 !important;
}

body.shop-site.shop-autima-shell .shop-featured-rail__carousel {
  margin: 0;
}

body.shop-site.shop-autima-shell .shop-featured-rail__list.featured-products {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

body.shop-site.shop-autima-shell .shop-featured-rail__card.product {
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--ds-border);
  border-radius: 3px;
  background: #fff;
  overflow: hidden;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

body.shop-site.shop-autima-shell .shop-featured-rail__card.product:hover {
  border-color: #d8d8d8;
  box-shadow: 0 6px 16px rgba(18, 38, 63, 0.08);
}

body.shop-site.shop-autima-shell .shop-featured-rail__details.details {
  position: relative;
  padding: 10px 10px 12px;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop-featured-rail__price-row {
  margin-bottom: 8px;
  min-height: 1.2em;
}

body.shop-site.shop-autima-shell .shop-featured-rail__price.product_price {
  display: block;
  float: none !important;
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  text-align: left;
}

body.shop-site.shop-autima-shell .shop-featured-rail__now,
body.shop-site.shop-autima-shell .shop-featured-rail__price .text-price-lr,
body.shop-site.shop-autima-shell .shop-featured-rail__price .mvrprduct-lr-1 {
  font-family: var(--ds-font-heading);
  font-size: 15px;
  font-weight: 700;
  color: var(--ds-hot) !important;
  line-height: 1.3;
}

body.shop-site.shop-autima-shell .shop-featured-rail__was,
body.shop-site.shop-autima-shell .shop-featured-rail__price del.text-red {
  font-size: 12px;
  font-weight: 400;
  color: #a0a0a0 !important;
  text-decoration: line-through;
}

body.shop-site.shop-autima-shell .shop-featured-rail__badge.badge {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  border-radius: 3px !important;
  background: var(--ds-sale) !important;
  color: #fff !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 3px 7px;
}

body.shop-site.shop-autima-shell .shop-featured-rail__img.order-img {
  display: block;
  width: 100%;
  height: 120px;
  -o-object-fit: contain;
     object-fit: contain;
  margin: 0 auto 10px;
  background: #fafafa;
  border: 1px solid #f0f0f0;
  border-radius: 3px;
  padding: 6px;
  transition: opacity 0.2s ease;
}

body.shop-site.shop-autima-shell
  .shop-featured-rail__card:hover
  .shop-featured-rail__img {
  opacity: 0.92;
}

body.shop-site.shop-autima-shell .shop-featured-rail__meta.stats-container {
  position: static !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  text-align: left;
}

body.shop-site.shop-autima-shell .shop-featured-rail__name.product_name {
  display: block;
  margin: 0 0 6px;
  font-family: var(--ds-font-heading);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .shop-featured-rail__name a {
  color: inherit;
  text-decoration: none;
}

body.shop-site.shop-autima-shell .shop-featured-rail__name a:hover {
  color: var(--ds-hot);
}

body.shop-site.shop-autima-shell .shop-featured-rail__taxons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  line-height: 1.4;
}

body.shop-site.shop-autima-shell .shop-featured-rail__taxons .link,
body.shop-site.shop-autima-shell .shop-featured-rail__meta a.link {
  color: var(--ds-ink-600);
  text-decoration: none;
  font-size: 11px;
}

body.shop-site.shop-autima-shell .shop-featured-rail__taxons .link:hover,
body.shop-site.shop-autima-shell .shop-featured-rail__meta a.link:hover {
  color: var(--ds-hot);
}

body.shop-site.shop-autima-shell .shop-featured-rail__sep {
  color: #c4c4c4 !important;
  pointer-events: none;
}

body.shop-site.shop-autima-shell .shop-featured-rail__atc.add-to-cart {
  border-radius: 3px !important;
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  font-weight: 600;
  font-size: 11px;
  text-transform: capitalize;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell .shop-featured-rail__atc.add-to-cart:hover {
  background: var(--ds-ink-900) !important;
  border-color: var(--ds-ink-900) !important;
  color: #fff !important;
}

@media (max-width: 991px) {
  body.shop-site.shop-autima-shell .shop-pdp-summary {
    padding-left: 0;
    margin-top: 8px;
  }

  body.shop-site.shop-autima-shell .shop-pdp-aside {
    margin-top: 24px;
  }

  body.shop-site.shop-autima-shell .shop-featured-rail__img.order-img {
    height: 140px;
  }
}

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell .shop-tx-title {
    font-size: 22px;
  }

  body.shop-site.shop-autima-shell .shop-tx-summary {
    position: static;
    margin-top: 16px;
  }

  body.shop-site.shop-autima-shell .shop-tx-table-wrap {
    margin: 0 -4px;
  }

  body.shop-site.shop-autima-shell .shop-pdp-title {
    font-size: 18px;
    margin-bottom: 12px;
  }

  body.shop-site.shop-autima-shell .shop-pdp-price__current,
  body.shop-site.shop-autima-shell .shop-pdp-price .current_price {
    font-size: 22px;
  }

  body.shop-site.shop-autima-shell .shop-pdp-thumbs > li {
    width: 56px !important;
    height: 56px !important;
  }

  body.shop-site.shop-autima-shell .shop-pdp-actions .btn-theme,
  body.shop-site.shop-autima-shell .shop-pdp-atc-btn {
    min-width: 0;
    flex: 1 1 auto;
  }

  body.shop-site.shop-autima-shell .shop-pdp-info__content {
    padding: 16px;
  }

  body.shop-site.shop-autima-shell .shop-pdp-info__tabs .nav-tabs > li > a {
    padding: 12px 12px;
    font-size: 13px;
  }

  body.shop-site.shop-autima-shell .shop-pdp-qty-row {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* =========================================================================
   Autima color enforcement (exact index-5 / _variabls.scss palette)
   Yellow CTAs use dark #333 labels (Autima categories_title / search hover).
   ========================================================================= */

body.shop-site .btn-theme,
body.shop-site .blue .btn-theme,
body.shop-site.shop-autima-shell .btn-theme,
body.shop-site.shop-autima-shell .shop-card__btns .add-to-cart,
body.shop-site.shop-autima-shell .shop-tx-checkout-btn,
body.shop-site.shop-autima-shell .shop-tx-submit,
body.shop-site.shop-autima-shell nav.navbar .btn-cart-xs,
body.shop-site.shop-autima-shell .shop-trust__icon {
  color: var(--ds-on-primary) !important;
}

/* Search button on yellow header: white glyph on charcoal (Autima) */

body.shop-site.shop-autima-shell .header_middle .search-box .btn-search {
  color: #fff !important;
}

/* Transparent Autima cart control ? do not inherit yellow btn-theme fill */

body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .shopping-cart.btn-theme {
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ds-ink-900) !important;
}

body.shop-site.shop-autima-shell .pagination > .active > a,
body.shop-site.shop-autima-shell .pagination > .active > span {
  background: var(--ds-brand-900) !important;
  border-color: var(--ds-brand-900) !important;
  color: var(--ds-yellow) !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li.active
  > a,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default
  .navbar-nav
  > li.active
  > a:hover {
  background: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  border-radius: 999px;
}

body.shop-site.shop-autima-shell section.footer .footer-bottom,
body.shop-site.shop-autima-shell section.footer .footer-bottom .copyright,
body.shop-site.shop-autima-shell section.footer .footer-bottom a {
  color: var(--ds-on-primary) !important;
}

body.shop-site.shop-autima-shell h1,
body.shop-site.shop-autima-shell h2,
body.shop-site.shop-autima-shell h3,
body.shop-site.shop-autima-shell h4,
body.shop-site.shop-autima-shell h5,
body.shop-site.shop-autima-shell h6,
body.shop-site.shop-autima-shell .shop-section-title,
body.shop-site.shop-autima-shell .shop-tx-title,
body.shop-site.shop-autima-shell .shop-pdp-title {
  font-family: var(--ds-font-heading);
  color: var(--ds-ink-900);
}

/* Autima product price uses $secondary_color2 (#fd5018) */

body.shop-site.shop-autima-shell a:hover {
  color: var(--ds-yellow-dark);
}

body.shop-site.shop-autima-shell .shop-card__price-current,
body.shop-site.shop-autima-shell .shop-pdp-price__current {
  color: var(--ds-hot) !important;
}

body.shop-site.shop-autima-shell .shop-announcement-bar {
  background: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
}

body.shop-site.shop-autima-shell .shop-announcement-bar a,
body.shop-site.shop-autima-shell .shop-announcement-bar__phone {
  color: var(--ds-brand-900) !important;
}

/* =========================================================================
   Autima shop-list.html ? products listing (shop-autima-list)
   Mirrors template/autima/shop-list.html structure under shop-autima-shell.
   ========================================================================= */

/* Hide legacy global breadcrumb ? page has Autima breadcrumb */

body.shop-site.shop-autima-shell.shop-products-autima .breadcrumb-container,
body.shop-site.shop-autima-shell:has(.shop-autima-list) .breadcrumb-container {
  display: none !important;
}

/* Kill Phase C white rounded filter cards on Autima products page
   NOTE: Do NOT zero #sticky-con / widget_inner padding — that killed sidebar spacing. */

body.shop-site.shop-autima-shell .shop-autima-list .shop-filter-panel .panel {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .sidebar_widget {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 30px !important;
  overflow: visible !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-sidebar
  .widget_list.widget_filter,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-sidebar
  .widget_list.widget_categories {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-main {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}

body.shop-site.shop-autima-shell .shop-autima-list .page-contents,
body.shop-site.shop-autima-shell section.shop-autima-list {
  background: transparent;
}

body.shop-site.shop-autima-shell .shop-autima-list {
  padding-top: 0;
  padding-bottom: 48px;
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb {
  padding: 18px 0 8px;
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb li {
  display: inline-block;
  font-size: 14px;
  text-transform: capitalize;
  margin-right: 3px;
  padding-right: 13px;
  position: relative;
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb li::before {
  content: "/";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ds-ink-400);
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb li:last-child {
  margin-right: 0;
  padding-right: 0;
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb li:last-child::before {
  display: none;
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb a {
  color: #999;
}

body.shop-site.shop-autima-shell .shop-autima-breadcrumb a:hover {
  color: var(--ds-yellow-dark);
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .widget_inner,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .sidebar_widget
  .widget_inner {
  background: #f4f4f4 !important;
  border: 1px solid #e1e1e1 !important;
  border-radius: 0 !important;
  padding: 25px 20px 20px !important;
  margin-bottom: 0;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .widget_list {
  margin-bottom: 29px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 35px;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .widget_list:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .widget_list h2 {
  font-family: var(--ds-font-heading);
  font-size: 16px;
  margin: 0 0 15px;
  padding: 0 0 5px;
  text-transform: uppercase;
  font-weight: 700;
  line-height: 24px;
  color: #333;
  letter-spacing: 0;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .widget_categories ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .widget_categories li {
  margin-bottom: 8px;
  position: relative;
  min-height: 27px;
}

body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li:last-child {
  margin-bottom: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  input[type="checkbox"] {
  position: absolute;
  left: 3px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  cursor: pointer;
  z-index: 2;
  width: 17px;
  height: 17px;
  margin: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  label,
body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  > a {
  display: block;
  font-size: 14px;
  line-height: 27px;
  margin: 0 0 0 30px;
  font-weight: 400;
  cursor: pointer;
  color: var(--ds-ink-700);
  text-decoration: none;
}

body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  > a:hover,
body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  label:hover {
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  .checkmark {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 17px;
  width: 17px;
  border: 1px solid #dfdfdf;
  border-radius: 3px;
  background: #f4f4f4;
  pointer-events: none;
  transition: 0.3s;
}

body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  input:checked
  ~ .checkmark {
  background: var(--ds-yellow);
  border-color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell
  .shop-autima-sidebar
  .widget_categories
  li
  input:checked
  ~ .checkmark::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

body.shop-site.shop-autima-shell .shop-autima-price-filter {
  padding-top: 10px;
  overflow: hidden;
}

body.shop-site.shop-autima-shell .shop-autima-price-filter::after {
  content: "";
  display: table;
  clear: both;
}

/* Autima dual price slider (native range, no jQuery UI) */

body.shop-site.shop-autima-shell .shop-price-slider {
  position: relative;
  height: 19px;
  width: 92%;
  margin: 0 auto 22px;
  padding-top: 8px;
}

body.shop-site.shop-autima-shell .shop-price-slider__rail {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 3px;
  margin-top: -1.5px;
  background: #dbdbdb;
  border-radius: 0;
  z-index: 1;
  pointer-events: none;
}

body.shop-site.shop-autima-shell .shop-price-slider__range {
  position: absolute;
  top: 50%;
  height: 5px;
  margin-top: -2.5px;
  background: var(--ds-yellow);
  z-index: 2;
  pointer-events: none;
}

body.shop-site.shop-autima-shell .shop-price-slider__input {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 19px;
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
  background: transparent;
  /* Critical for dual-range: only thumbs receive clicks, not the full track layer */
  pointer-events: none;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  outline: none;
  z-index: 3;
}

body.shop-site.shop-autima-shell
  .shop-price-slider__input::-webkit-slider-runnable-track {
  height: 3px;
  background: transparent;
  border: none;
  pointer-events: none;
}

body.shop-site.shop-autima-shell .shop-price-slider__input::-moz-range-track {
  height: 3px;
  background: transparent;
  border: none;
  pointer-events: none;
}

body.shop-site.shop-autima-shell
  .shop-price-slider__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  pointer-events: auto;
  width: 19px;
  height: 19px;
  margin-top: -8px;
  border-radius: 50%;
  background: #fff;
  border: 5px solid var(--ds-yellow);
  cursor: pointer;
  box-shadow: none;
  position: relative;
  z-index: 4;
}

body.shop-site.shop-autima-shell .shop-price-slider__input::-moz-range-thumb {
  pointer-events: auto;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: #fff;
  border: 5px solid var(--ds-yellow);
  cursor: pointer;
  box-shadow: none;
}

body.shop-site.shop-autima-shell .shop-price-slider__max {
  z-index: 4;
}

body.shop-site.shop-autima-shell .shop-price-slider__min {
  z-index: 5;
}

/* Active thumb rises above the other so either end can be grabbed when overlapped */

body.shop-site.shop-autima-shell .shop-price-slider__input.is-active {
  z-index: 6;
}

body.shop-site.shop-autima-shell .shop-autima-price-filter #amount {
  background: none;
  border: none;
  font-size: 12px;
  float: right;
  text-align: right;
  line-height: 31px;
  width: auto;
  max-width: 55%;
  padding: 0;
  margin: 0;
  color: var(--ds-ink-900);
  box-shadow: none;
  height: 30px;
}

body.shop-site.shop-autima-shell .shop-autima-price-filter button,
body.shop-site.shop-autima-shell
  .shop-autima-price-filter
  #shop-price-filter-btn {
  height: 30px;
  line-height: 30px;
  padding: 0 20px;
  text-transform: capitalize;
  color: #fff !important;
  font-weight: 400;
  background: #333 !important;
  border: 0;
  border-radius: 30px;
  float: left;
  cursor: pointer;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell .shop-autima-price-filter button:hover,
body.shop-site.shop-autima-shell
  .shop-autima-price-filter
  #shop-price-filter-btn:hover {
  background: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .list-group-item {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 3px;
  margin-bottom: 8px;
  padding: 8px 28px 8px 12px;
  position: relative;
  font-size: 13px;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .list-group-item .close {
  position: absolute;
  right: 8px;
  top: 6px;
  opacity: 0.6;
  cursor: pointer;
}

body.shop-site.shop-autima-shell .shop_toolbar_wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  border: 1px solid #ddd;
  padding: 8px 10px;
  margin: 0 0 30px;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop_toolbar_btn {
  display: flex;
  align-items: center;
  gap: 10px;
}

body.shop-site.shop-autima-shell .shop_toolbar_btn button {
  width: 22px;
  height: 22px;
  border: 0;
  background: transparent;
  color: #a9a9a9;
  border-radius: 0;
  padding: 0;
  line-height: 22px;
  font-size: 16px;
}

body.shop-site.shop-autima-shell .shop_toolbar_btn button.active,
body.shop-site.shop-autima-shell .shop_toolbar_btn button:hover {
  background: transparent;
  border: 0;
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell .niceselect_option .bootstrap-select > .btn,
body.shop-site.shop-autima-shell .niceselect_option select {
  border: 1px solid #e5e5e5;
  background: #fff;
  color: var(--ds-ink-700);
  border-radius: 3px;
  min-height: 34px;
}

body.shop-site.shop-autima-shell .page_amount p,
body.shop-site.shop-autima-shell .page-info {
  margin: 0;
  font-size: 14px;
  color: var(--ds-ink-600);
}

body.shop-site.shop-autima-shell .shop_toolbar.t_bottom {
  border: 1px solid #e5e5e5;
  padding: 12px;
  margin-top: 24px;
  background: #fff;
}

/* Autima single_product ? list + grid (shop-list.html) */

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product.shop-card,
body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-product {
  position: relative;
  display: block;
  box-shadow: none !important;
  border-radius: 3px !important;
  overflow: visible !important;
  height: auto !important;
  transform: none !important;
  border: 1px solid #f0f0f0 !important;
  background: #fff !important;
  margin: 1px 0 20px;
  padding: 10px 8px 18px 18px;
  transition: border-color 0.3s ease;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-product:hover {
  border-color: #f0f0f0 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.shop-site.shop-autima-shell .shop-autima-product .product_thumb {
  position: relative;
  text-align: center;
  margin-bottom: 0;
  overflow: hidden;
}

body.shop-site.shop-autima-shell .shop-autima-product .product_thumb img {
  max-width: 100%;
  height: auto;
  display: inline-block;
  transition: opacity 0.3s ease;
}

body.shop-site.shop-autima-shell .shop-autima-product .label_product {
  position: absolute;
  left: 0;
  top: auto;
  bottom: 40px;
  z-index: 2;
  height: 22px;
  line-height: 20px;
  background: var(--ds-yellow);
  border-radius: 5px;
  transform: skewX(-20deg);
}

body.shop-site.shop-autima-shell .shop-autima-product .label_sale {
  display: inline-block;
  padding: 0 10px;
  border-radius: 2px;
  text-transform: capitalize;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  background: transparent;
  color: var(--ds-on-primary);
  transform: skewX(20deg);
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links {
  position: absolute;
  right: 0;
  top: 8px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease;
  z-index: 3;
}

body.shop-site.shop-autima-shell .shop-autima-product:hover .action_links {
  opacity: 1;
  visibility: visible;
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links li {
  margin-bottom: 0;
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links a {
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  font-size: 18px;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--ds-ink-700);
  transform: scale(0.7);
  transition: all 0.5s ease;
}

body.shop-site.shop-autima-shell .shop-autima-product:hover .action_links a {
  transform: scale(1);
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links a:hover {
  background: transparent;
  border: 0;
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .price_box
  .current_price {
  color: var(--ds-hot);
  font-weight: 600;
  font-size: 18px;
  margin-right: 5px;
}

body.shop-site.shop-autima-shell .shop-autima-product .price_box .old_price {
  color: #757575;
  text-decoration: line-through;
  font-weight: 400;
  font-size: 16px;
}

body.shop-site.shop-autima-shell .shop-autima-product .manufacture_product {
  line-height: 20px;
  margin: 0;
  opacity: 0;
  transition: 0.3s;
}

body.shop-site.shop-autima-shell
  .shop-autima-product:hover
  .manufacture_product {
  opacity: 1;
  margin-bottom: 9px;
}

body.shop-site.shop-autima-shell .shop-autima-product .manufacture_product a {
  color: var(--ds-ink-500);
  font-size: 12px;
  font-weight: 400;
  text-transform: uppercase;
  display: block;
}

body.shop-site.shop-autima-shell .shop-autima-product .product_name h3 {
  font-size: 14px;
  margin: 15px 0 4px;
  font-family: var(--ds-font-body);
  font-weight: 400;
  line-height: 20px;
  text-transform: capitalize;
  transition: 0.3s;
}

body.shop-site.shop-autima-shell .shop-autima-product:hover .product_name h3 {
  margin-bottom: 10px;
  margin-top: 0;
}

body.shop-site.shop-autima-shell .shop-autima-product .product_name h3 a {
  color: var(--ds-ink-900);
  line-height: 20px;
  display: block;
}

body.shop-site.shop-autima-shell .shop-autima-product .product_name h3 a:hover {
  color: #2777d0;
}

body.shop-site.shop-autima-shell .shop-autima-product .cart_links_btn {
  margin-bottom: 20px;
}

body.shop-site.shop-autima-shell .shop-autima-product .cart_links_btn a {
  display: block;
  width: 100%;
  line-height: 38px;
  background: var(--ds-yellow);
  color: var(--ds-on-primary) !important;
  font-weight: 400;
  text-transform: capitalize;
  font-size: 15px;
  padding: 0 30px;
  border-radius: 5px;
  margin: 0;
  text-align: center;
}

body.shop-site.shop-autima-shell .shop-autima-product .cart_links_btn a:hover {
  background: var(--ds-ink-900);
  color: #fff !important;
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links_btn {
  text-align: center;
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links_btn ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links_btn li {
  display: inline-block;
  margin-right: 0;
}

body.shop-site.shop-autima-shell .shop-autima-product .action_links_btn a {
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  font-size: 18px;
  border: 0;
  border-radius: 0;
  color: var(--ds-ink-700);
  background: transparent;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .action_links_btn
  a:hover {
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell .shop-autima-product .text_available {
  margin-bottom: 13px;
  font-size: 14px;
  color: var(--ds-ink-700);
  text-transform: capitalize;
}

body.shop-site.shop-autima-shell .shop-autima-product .text_available span {
  color: #67c10a;
  font-weight: 400;
}

body.shop-site.shop-autima-shell .shop-autima-product .shop-card__tags {
  position: absolute;
  left: 8px;
  bottom: 8px;
  z-index: 2;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .shop-card__tags
  .shop-stock-badge {
  font-size: 10px;
  padding: 2px 6px;
}

/* Default: list content hidden until list mode is active */

body.shop-site.shop-autima-shell .shop-autima-product .list_content {
  display: none;
}

body.shop-site.shop-autima-shell .shop-autima-product .grid_content {
  margin-top: 15px;
}

/* List mode (Autima grid_list / pic2) ? image | info | price */

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  -moz-column-gap: 0 !important;
       column-gap: 0 !important;
  padding: 18px 20px;
  border: 1px solid #f0f0f0 !important;
  border-radius: 3px !important;
  background: #fff !important;
  margin: 0 0 20px !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .action_links,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .shop-card__tags,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .shop-card__tags {
  display: none !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .product_thumb,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_thumb {
  grid-area: thumb;
  flex: none !important;
  max-width: none !important;
  min-width: 0 !important;
  width: 100%;
  margin: 0 !important;
  align-self: center;
  overflow: hidden;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .product_thumb
  img,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_thumb
  img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  -o-object-fit: contain;
     object-fit: contain;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .list_content {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .left_caption,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .left_caption {
  grid-area: info;
  width: auto !important;
  max-width: none;
  padding-right: 20px;
  border-right: 1px solid #ddd;
  margin-right: 0;
  flex: none;
  min-width: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .left_caption
  .product_name
  h3,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .left_caption
  .product_name
  h3 {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 700;
  font-family: var(--ds-font-heading);
  line-height: 1.35;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .left_caption
  .product_name
  h3
  a:hover,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .left_caption
  .product_name
  h3
  a:hover {
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .product_ratings,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_ratings {
  margin-bottom: 10px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .product_ratings
  ul,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_ratings
  ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 2px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .product_ratings
  li,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_ratings
  li {
  color: #ffcb15;
  font-size: 14px;
  line-height: 18px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .product_desc
  p,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_desc
  p {
  font-size: 14px;
  color: #666;
  line-height: 24px;
  margin: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .right_caption,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption {
  grid-area: action;
  flex: none;
  text-align: left;
  min-width: 0;
  width: 100%;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .text_available,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .text_available {
  margin-bottom: 13px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .text_available
  p,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .text_available
  p {
  margin: 0;
  font-size: 14px;
  text-transform: capitalize;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .text_available
  span,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .text_available
  span {
  color: #67c10a;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .right_caption
  .price_box,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .price_box {
  margin-bottom: 20px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .right_caption
  .price_box
  .current_price,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .price_box
  .current_price {
  font-size: 20px;
  font-weight: 600;
  color: var(--ds-hot);
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .right_caption
  .price_box
  .old_price,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .price_box
  .old_price {
  font-size: 16px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .cart_links_btn,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn {
  margin-bottom: 16px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .cart_links_btn
  a,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn
  a {
  display: block;
  width: 100%;
  max-width: 220px;
  line-height: 38px;
  padding: 0 24px;
  font-size: 15px;
  font-weight: 400;
  text-transform: capitalize;
  text-align: center;
  background: var(--ds-yellow);
  color: #333 !important;
  border-radius: 5px;
  margin: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .cart_links_btn
  a:hover,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn
  a:hover {
  background: #333;
  color: #fff !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .action_links_btn,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn {
  text-align: left;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .action_links_btn
  ul,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  ul {
  display: flex;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .action_links_btn
  a,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  a {
  border: 0;
  background: transparent;
  color: var(--ds-ink-700);
  font-size: 18px;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .action_links_btn
  a:hover,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  a:hover {
  color: var(--ds-yellow);
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .label_product,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .label_product {
  bottom: auto;
  top: 8px;
  left: 8px;
}

/* Grid modes ? Autima card layout */

body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product,
body.shop-site.shop-autima-shell #shop-results-wrap.grid_2 .shop-autima-product,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product {
  display: block;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .list_content {
  display: none !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_content {
  display: block;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product
  .grid_name
  h3,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product
  .grid_name
  h3,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product
  .grid_name
  h3,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_name
  h3 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 400;
  font-family: var(--ds-font-body);
}

body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product:hover
  .grid_name
  h3,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product:hover
  .grid_name
  h3,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product:hover
  .grid_name
  h3,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product:hover
  .grid_name
  h3 {
  margin-bottom: 10px;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .grid_content
  .product_footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .grid_content
  .add_to_cart {
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease;
  flex: 0 0 auto;
}

body.shop-site.shop-autima-shell
  .shop-autima-product:hover
  .grid_content
  .add_to_cart {
  opacity: 1;
  visibility: visible;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .grid_content
  .add_to_cart
  a {
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  font-size: 18px;
  background: transparent;
  color: var(--ds-ink-700) !important;
  border-radius: 0;
  transform: scale(0.7);
  transition: all 0.5s ease;
}

body.shop-site.shop-autima-shell
  .shop-autima-product:hover
  .grid_content
  .add_to_cart
  a {
  transform: scale(1);
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .grid_content
  .add_to_cart
  a:hover {
  color: var(--ds-yellow) !important;
  background: transparent;
}

body.shop-site.shop-autima-shell .shop-autima-list #results .product-container {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell
    .shop-autima-list.is-list-view
    .shop-autima-product,
  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product {
    grid-template-columns: 1fr;
    grid-template-areas:
      "thumb"
      "info"
      "action";
    row-gap: 16px;
    padding: 10px 18px 18px;
  }

  body.shop-site.shop-autima-shell
    .shop-autima-list.is-list-view
    .shop-autima-product
    .product_thumb,
  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .product_thumb {
    margin: 0 0 8px !important;
  }

  body.shop-site.shop-autima-shell
    .shop-autima-list.is-list-view
    .shop-autima-product
    .left_caption,
  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .left_caption {
    width: 100% !important;
    padding-right: 0;
    border-right: 0;
    margin-right: 0;
  }

  body.shop-site.shop-autima-shell
    .shop-autima-list.is-list-view
    .shop-autima-product
    .right_caption,
  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .right_caption {
    width: 100%;
    margin-top: 0;
  }

  body.shop-site.shop-autima-shell .shop_toolbar_wrapper {
    flex-direction: column;
    align-items: stretch;
  }
}

/* =========================================================================
   Phase B ? Autima header (yellow top+middle, white sticky nav)
   Matches template/autima shop-list.html / _header.scss
   ========================================================================= */

body.shop-site.shop-autima-shell {
  font-family: var(--ds-font);
}

body.shop-site.shop-autima-shell .header_area {
  position: relative;
  z-index: 100;
  background: #fff;
}

/* --- header_top: yellow utility bar --- */

body.shop-site.shop-autima-shell .header_top {
  background: var(--ds-yellow) !important;
}

body.shop-site.shop-autima-shell .header_top .top_inner {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding: 0;
}

body.shop-site.shop-autima-shell .header_top .follow_us {
  display: flex;
  align-items: center;
  min-height: 45px;
}

body.shop-site.shop-autima-shell .header_top .follow_us label {
  margin: 0 20px 0 0;
  font-size: 13px;
  font-weight: 400;
  color: var(--ds-ink-900);
  line-height: 45px;
}

body.shop-site.shop-autima-shell .header_top .follow_link {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 16px;
}

body.shop-site.shop-autima-shell .header_top .follow_link a {
  color: var(--ds-ink-900) !important;
  font-size: 18px;
  line-height: 1;
  text-decoration: none !important;
}

body.shop-site.shop-autima-shell .header_top .follow_link a:hover {
  opacity: 0.7;
}

body.shop-site.shop-autima-shell .header_top .top_right > ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.shop-site.shop-autima-shell .header_top .top_right > ul > li {
  position: relative;
  display: inline-block;
  padding-right: 20px;
  margin-right: 20px;
  line-height: 45px;
}

body.shop-site.shop-autima-shell .header_top .top_right > ul > li:last-child {
  padding-right: 0;
  margin-right: 0;
}

body.shop-site.shop-autima-shell .header_top .top_right > ul > li::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 1px;
  height: 12px;
  background: #1b1b1b;
  transform: translateY(-50%);
}

body.shop-site.shop-autima-shell
  .header_top
  .top_right
  > ul
  > li:last-child::before {
  display: none;
}

body.shop-site.shop-autima-shell .header_top .top_right > ul > li > a {
  color: var(--ds-ink-900) !important;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.3px;
  text-transform: capitalize;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  line-height: 45px;
  display: inline-block;
  cursor: pointer;
}

body.shop-site.shop-autima-shell .header_top .top_right > ul > li > a:hover {
  opacity: 0.7;
}

body.shop-site.shop-autima-shell .header_top .top_right > ul > li > a .fa-user {
  margin-right: 4px;
}

body.shop-site.shop-autima-shell
  .header_top
  .top_right
  > ul
  > li
  > a
  .fa-angle-down {
  margin-left: 6px;
  font-size: 11px;
}

body.shop-site.shop-autima-shell .header_top .top_right .dropdown-menu {
  margin-top: 0;
  border-radius: 3px;
  border: 1px solid var(--ds-border);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  min-width: 160px;
  padding: 8px 0;
}

body.shop-site.shop-autima-shell .header_top .top_right .dropdown-menu-login {
  min-width: 300px;
  padding: 16px;
}

body.shop-site.shop-autima-shell .header_top .shop-announcement-bar,
body.shop-site.shop-autima-shell .header_top .top-header {
  display: none !important;
}

/* --- header_middle: yellow band, logo | search | wishlist/cart --- */

body.shop-site.shop-autima-shell .header_middle.main-header {
  background: var(--ds-yellow) !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  padding: 28px 0 !important;
  position: relative;
  z-index: 20;
}

body.shop-site.shop-autima-shell .header_middle .shop-header-bar {
  display: flex;
  align-items: center;
  gap: 28px;
}

body.shop-site.shop-autima-shell .header_middle .logo {
  flex: 0 0 auto;
  max-width: 200px;
}

body.shop-site.shop-autima-shell .header_middle .logo img {
  max-height: 52px;
  width: auto;
}

body.shop-site.shop-autima-shell .header_middle .search-box,
body.shop-site.shop-autima-shell .header_middle .search-box.shop-live-search {
  flex: 1 1 auto;
  max-width: 560px;
  margin: 0 32px 0 auto;
  min-width: 0;
}

body.shop-site.shop-autima-shell .header_middle .search_box.input-group,
body.shop-site.shop-autima-shell .header_middle .search-box .input-group,
body.shop-site.shop-autima-shell
  .header_middle
  .shop-live-search
  .shop-search-field.input-group {
  position: relative;
  width: 100%;
  max-width: 560px;
  background: #fff !important;
  border: 0 !important;
  border-radius: 6px !important;
  overflow: visible !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08) !important;
  display: flex;
}

body.shop-site.shop-autima-shell .header_middle .search-box .form-control,
body.shop-site.shop-autima-shell
  .header_middle
  .shop-live-search
  .form-control {
  border: 0 !important;
  background: transparent !important;
  height: 48px !important;
  box-shadow: none !important;
  border-radius: 6px 0 0 6px !important;
  padding: 0 44px 0 18px !important;
  font-size: 14px;
  color: #333;
  flex: 1 1 auto;
  line-height: 48px;
}

body.shop-site.shop-autima-shell
  .header_middle
  .search-box
  .form-control:focus {
  color: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell .header_middle .search-box .input-group-btn,
body.shop-site.shop-autima-shell .header_middle .shop-search-field__submit {
  position: relative;
  right: auto;
  top: auto;
  height: auto;
  width: 58px;
  flex: 0 0 58px;
  z-index: 2;
  padding: 0;
}

body.shop-site.shop-autima-shell .header_middle .search-box .btn-search,
body.shop-site.shop-autima-shell .header_middle .shop-live-search .btn-search {
  width: 60px !important;
  height: 48px !important;
  min-height: 48px !important;
  min-width: 56px !important;
  border: 0 !important;
  border-radius: 0 6px 6px 0 !important;
  background: #1a1a1a !important;
  color: #fff !important;
  padding: 0 !important;
  font-size: 16px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

body.shop-site.shop-autima-shell .header_middle .search-box .btn-search:hover,
body.shop-site.shop-autima-shell .header_middle .search-box .btn-search:focus,
body.shop-site.shop-autima-shell
  .header_middle
  .shop-live-search
  .btn-search:hover,
body.shop-site.shop-autima-shell
  .header_middle
  .shop-live-search
  .btn-search:focus {
  background: #2d2d2d !important;
  color: #fff !important;
}

body.shop-site.shop-autima-shell .header_middle .shop-search-clear {
  right: 64px;
}

body.shop-site.shop-autima-shell .header_middle .shop-header-actions {
  display: flex;
  align-items: center;
  gap: 28px;
  flex: 0 0 auto;
  margin-left: 0;
  margin-top: 0;
}

body.shop-site.shop-autima-shell .header_middle .header_wishlist,
body.shop-site.shop-autima-shell .header_middle .mini_cart_wrapper {
  position: relative;
  margin: 0;
}

body.shop-site.shop-autima-shell .header_middle .shop-action-link,
body.shop-site.shop-autima-shell .header_middle .header_wishlist > a,
body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .shopping-cart {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #1a1a1a !important;
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
  text-decoration: none !important;
  padding: 4px 2px !important;
  min-height: 0 !important;
  line-height: 1.2;
  white-space: nowrap;
}

body.shop-site.shop-autima-shell .header_middle .shop-action-link:hover,
body.shop-site.shop-autima-shell .header_middle .shop-action-link:focus,
body.shop-site.shop-autima-shell .header_middle .header_wishlist > a:hover,
body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .shopping-cart:hover,
body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .shopping-cart:focus {
  color: #000 !important;
  background: transparent !important;
  opacity: 0.75;
}

body.shop-site.shop-autima-shell .header_middle .shop-action-link__icon .fa,
body.shop-site.shop-autima-shell .header_middle .header_wishlist .fa,
body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .shopping-cart
  .fa {
  font-size: 26px;
  padding: 0;
  vertical-align: middle;
  line-height: 1;
}

body.shop-site.shop-autima-shell .header_middle .shop-action-link__label,
body.shop-site.shop-autima-shell .header_middle .header_wishlist_label,
body.shop-site.shop-autima-shell .header_middle .cart_label {
  display: inline;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.01em;
}

body.shop-site.shop-autima-shell .header_middle .shop-action-badge,
body.shop-site.shop-autima-shell .header_middle .wishlist_quantity,
body.shop-site.shop-autima-shell .header_middle .cart_quantity.cart-total-items,
body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .cart_quantity,
body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .cart-total-items {
  position: absolute;
  top: -6px;
  left: 16px;
  width: 18px;
  height: 18px;
  min-width: 18px;
  line-height: 18px;
  text-align: center;
  border-radius: 50%;
  background: #fff !important;
  color: #1a1a1a !important;
  font-size: 11px;
  font-weight: 600;
  padding: 0 !important;
  z-index: 2;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
}

body.shop-site.shop-autima-shell
  .header_middle
  .header_wishlist
  .wishlist_quantity,
body.shop-site.shop-autima-shell
  .header_middle
  .header_wishlist
  .shop-action-badge {
  left: 16px;
}

body.shop-site.shop-autima-shell
  .header_middle
  .cart_quantity.cart-total-items:empty,
body.shop-site.shop-autima-shell .header_middle .cart-total-items:empty,
body.shop-site.shop-autima-shell .header_middle .shop-action-badge:empty {
  display: none;
}

/* Mini-cart dropdown skin */

body.shop-site.shop-autima-shell .autima-mini-cart {
  min-width: 320px;
  padding: 16px !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18) !important;
  z-index: 1302 !important;
}

/* Bring mini-cart above sticky nav / page content */

body.shop-site.shop-autima-shell .header_middle.main-header.is-cart-open,
body.shop-site.shop-autima-shell.shop-cart-open .header_middle.main-header {
  z-index: 1300 !important;
  overflow: visible !important;
}

body.shop-site.shop-autima-shell .mini_cart_wrapper.open,
body.shop-site.shop-autima-shell .header_middle .mini_cart_wrapper.open,
body.shop-site.shop-autima-shell .mini_cart_wrapper.is-cart-open {
  z-index: 1301 !important;
  position: relative;
}

body.shop-site.shop-autima-shell .mini_cart_wrapper.open > .autima-mini-cart,
body.shop-site.shop-autima-shell
  .mini_cart_wrapper.is-cart-open
  > .autima-mini-cart,
body.shop-site.shop-autima-shell .dropdown-menu.autima-mini-cart {
  z-index: 1302 !important;
  position: absolute !important;
}

body.shop-site.shop-autima-shell.shop-cart-open .header_bottom.sticky-header,
body.shop-site.shop-autima-shell.shop-cart-open nav.navbar.header_bottom {
  z-index: 50 !important;
}

body.shop-site.shop-autima-shell .autima-mini-cart__head h3 {
  margin: 0 0 12px;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--ds-font-heading);
  color: var(--ds-ink-900);
  border-bottom: 1px solid var(--ds-border);
  padding-bottom: 10px;
}

body.shop-site.shop-autima-shell .autima-mini-cart #cart-links .btn-default {
  border-radius: 3px;
  text-transform: capitalize;
}

body.shop-site.shop-autima-shell .autima-mini-cart .btn-checkout-autima {
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
}

/* --- header_bottom: white nav, charcoal uppercase links --- */

body.shop-site.shop-autima-shell nav.navbar.navbar-default.header_bottom {
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
  min-height: 52px;
  box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.1);
  z-index: 90;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li
  > a {
  color: var(--ds-ink-900) !important;
  font-family: var(--ds-font-heading);
  font-weight: 700;
  font-size: 14px;
  line-height: 24px;
  text-transform: uppercase;
  padding: 14px 20px !important;
  background: transparent !important;
  transition: color 0.3s ease;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li:first-child
  > a {
  padding-left: 0 !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li
  > a:hover,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li.open
  > a,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li.active
  > a {
  color: var(--ds-yellow) !important;
  background: transparent !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li
  > a
  .caret {
  border-top-color: currentColor;
  border-bottom-color: currentColor;
  margin-left: 3px;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-toggle {
  border-color: var(--ds-ink-900);
  margin-top: 8px;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-toggle
  .icon-bar {
  background: var(--ds-ink-900);
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-toggle:hover,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-toggle:focus {
  background: var(--ds-yellow);
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .dropdown-menu {
  border-radius: 0;
  border: 1px solid var(--ds-border);
  box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.1);
  padding: 16px 0;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .dropdown-menu
  > li
  > a {
  color: var(--ds-ink-900) !important;
  padding: 6px 20px;
  font-weight: 500;
  font-size: 13px;
  text-transform: uppercase;
  font-family: var(--ds-font-heading);
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .dropdown-menu
  > li
  > a:hover {
  background: transparent;
  color: var(--ds-yellow) !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .btn-cart-xs {
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
}

/* Sticky state ? Autima frosted white */

body.shop-site.shop-autima-shell .header_bottom.sticky-header.is-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
  animation: shopAutimaStickyIn 0.28s ease;
}

@keyframes shopAutimaStickyIn {
  from {
    transform: translateY(-100%);
  }

  to {
    transform: translateY(0);
  }
}

body.shop-site.shop-autima-shell.has-sticky-nav {
  padding-top: 0;
}

@media (max-width: 991px) {
  body.shop-site.shop-autima-shell .header_top {
    display: none;
  }

  body.shop-site.shop-autima-shell .header_middle.main-header {
    padding: 16px 0 !important;
  }

  body.shop-site.shop-autima-shell .header_middle .shop-header-bar {
    flex-wrap: wrap;
  }

  body.shop-site.shop-autima-shell .header_middle .search-box {
    order: 3;
    flex: 1 1 100%;
    max-width: none;
    margin: 12px 0 0;
  }

  body.shop-site.shop-autima-shell .header_middle .search-box .form-control,
  body.shop-site.shop-autima-shell .header_middle .search-box .btn-search {
    min-height: 40px !important;
    height: 40px !important;
  }

  body.shop-site.shop-autima-shell
    nav.navbar.navbar-default.header_bottom
    .navbar-nav
    > li:first-child
    > a {
    padding-left: 20px !important;
  }

  body.shop-site.shop-autima-shell
    nav.navbar.navbar-default.header_bottom
    .navbar-collapse {
    background: #fff;
  }
}

/* Phase A polish ? products page listing */

body.shop-site.shop-autima-shell.shop-products-autima .breadcrumb-container,
body.shop-site.shop-autima-shell:has(.shop-autima-list) .breadcrumb-container {
  display: none !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_wrapper {
  border: 1px solid #ddd;
  padding: 8px 10px;
  margin: 0 0 30px;
  background: #fff;
  border-radius: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  button.active {
  color: var(--ds-yellow) !important;
  background: transparent !important;
}

body.shop-site.shop-autima-shell .shop-autima-sidebar .widget_inner {
  background: #f4f4f4 !important;
  border: 1px solid #e1e1e1 !important;
  border-radius: 0 !important;
  padding: 25px 20px 20px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product {
  /* legacy Autima grid-list — superseded by .view-mode-list .sp-list-row */
  display: block !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .list_content {
  display: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_thumb {
  /* no-op: thumbs live under .sp-grid-block / .sp-list-thumb now */
  grid-area: auto;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .left_caption {
  grid-area: auto;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption {
  grid-area: auto;
}

/* Bulletproof listing view modes */

body.shop-site.shop-autima-shell .shop-autima-list.view-mode-grid .sp-list-row {
  display: none !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.view-mode-list
  .sp-grid-block {
  display: none !important;
}

body.shop-site.shop-autima-shell .shop-autima-list.view-mode-list .sp-list-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 20px;
  width: 100%;
  padding: 18px 20px;
  border: 1px solid #f0f0f0;
  background: #fff;
  box-sizing: border-box;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.view-mode-list
  #results
  .product-container {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.view-mode-list
  .sp-list-thumb {
  flex: 0 0 180px;
  max-width: 28%;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.view-mode-list
  .sp-list-thumb
  img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 160px;
  -o-object-fit: contain;
     object-fit: contain;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.view-mode-list
  .sp-list-info {
  flex: 1 1 auto;
  min-width: 0;
  border-right: 1px solid #ddd;
  padding-right: 20px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list.view-mode-list
  .sp-list-action {
  flex: 0 0 200px;
  max-width: 30%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
  gap: 10px;
}

/* =========================================================================
   Phase C ? Product card parity (hover, secondary img, skew badge, grid)
   Phase D ? Toolbar icons, pagination, mobile filter drawer
   ========================================================================= */

/* Secondary image hover (Autima) */

body.shop-site.shop-autima-shell .shop-autima-product .product_thumb {
  position: relative;
  overflow: hidden;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .product_thumb
  a.secondary_img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.35s ease,
    visibility 0.35s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .product_thumb
  a.secondary_img
  img {
  max-width: 100%;
  height: auto;
}

body.shop-site.shop-autima-shell
  .shop-autima-product:hover
  .product_thumb
  a.secondary_img {
  opacity: 1;
  visibility: visible;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .product_thumb
  a.primary_img
  img {
  transition: opacity 0.35s ease;
}

body.shop-site.shop-autima-shell
  .shop-autima-product:hover
  .product_thumb
  a.primary_img
  img {
  opacity: 0;
}

/* List view: keep primary visible; secondary is decorative only on grid */

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product:hover
  .product_thumb
  a.primary_img
  img,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product:hover
  .product_thumb
  a.primary_img
  img {
  opacity: 1;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_thumb
  a.secondary_img,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product
  .product_thumb
  a.secondary_img {
  display: none !important;
}

/* Skew sale badge ? reinforce Autima look */

body.shop-site.shop-autima-shell .shop-autima-product .label_product {
  background: var(--ds-yellow) !important;
  transform: skewX(-20deg);
  border-radius: 5px;
  height: 22px;
  line-height: 20px;
  padding: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .label_product
  .label_sale {
  transform: skewX(20deg);
  color: red;
  background: transparent !important;
  font-weight: 500;
  font-size: 15px;
  text-transform: capitalize;
  padding: 0 14px;
  font-weight: 600;
}

/* Grid ratings */

body.shop-site.shop-autima-shell
  .shop-autima-product
  .grid_content
  .product_ratings {
  margin-bottom: 6px;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .grid_content
  .product_ratings
  ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 2px;
}

body.shop-site.shop-autima-shell
  .shop-autima-product
  .grid_content
  .product_ratings
  li {
  color: #ffcb15;
  font-size: 14px;
  line-height: 18px;
}

/* Isolate: grid modes must never use list display:contents */

body.shop-site.shop-autima-shell #shop-results-wrap.grid_2 .shop-autima-product,
body.shop-site.shop-autima-shell #shop-results-wrap.grid_3 .shop-autima-product,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  -moz-column-gap: 0 !important;
       column-gap: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-2
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product
  .list_content {
  display: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product
  .left_caption,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .left_caption,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_2
  .shop-autima-product
  .right_caption,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .right_caption {
  grid-area: auto !important;
  border-right: 0 !important;
  width: auto !important;
}

/* Hide stock badge pills on grid cards (Autima uses label_sale only) */

body.shop-site.shop-autima-shell #shop-results-wrap.grid_2 .shop-card__tags,
body.shop-site.shop-autima-shell #shop-results-wrap.grid_3 .shop-card__tags,
body.shop-site.shop-autima-shell .shop-autima-list.is-grid-2 .shop-card__tags,
body.shop-site.shop-autima-shell .shop-autima-list.is-grid-3 .shop-card__tags {
  display: none !important;
}

/* Phase D ? Autima toolbar icon buttons (CSS-drawn grids) */

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_btn {
  display: flex;
  align-items: center;
  gap: 12px;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_btn > button {
  width: 22px;
  height: 22px;
  border: 0;
  padding: 0;
  margin: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.45;
  cursor: pointer;
  position: relative;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.active,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button:hover {
  opacity: 1;
  background-color: transparent !important;
  color: inherit !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-2 {
  background-image:
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700));
  background-size: 8px 8px;
  background-position:
    0 0,
    12px 0,
    0 12px,
    12px 12px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-2.active {
  background-image:
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow));
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-3 {
  background-image:
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700));
  background-size: 5px 5px;
  background-position:
    0 0,
    8px 0,
    16px 0,
    0 8px,
    8px 8px,
    16px 8px,
    0 16px,
    8px 16px,
    16px 16px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-3.active {
  background-image:
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow));
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-list {
  background-image:
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700)),
    linear-gradient(var(--ds-ink-700), var(--ds-ink-700));
  background-size: 20px 3px;
  background-position:
    center 3px,
    center 9px,
    center 15px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-list.active {
  background-image:
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow)),
    linear-gradient(var(--ds-yellow), var(--ds-yellow));
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .niceselect_option
  .bootstrap-select
  > .btn,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .niceselect_option
  .dropdown-toggle {
  border: 1px solid #e5e5e5 !important;
  border-radius: 3px !important;
  background: #fff !important;
  box-shadow: none !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 6px 12px !important;
  font-size: 13px;
  color: var(--ds-ink-700) !important;
}

/* Phase D ? Pagination Autima */

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar.t_bottom {
  border: 1px solid #e5e5e5;
  padding: 12px 14px;
  margin-top: 10px;
  background: #fff;
}

body.shop-site.shop-autima-shell .shop-autima-list #pagination,
body.shop-site.shop-autima-shell .shop-autima-list .pagination-right {
  text-align: right;
}

body.shop-site.shop-autima-shell .shop-autima-list .pagination {
  margin: 0;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
}

body.shop-site.shop-autima-shell .shop-autima-list .pagination > li > a,
body.shop-site.shop-autima-shell .shop-autima-list .pagination > li > span {
  border: 1px solid #e5e5e5 !important;
  border-radius: 3px !important;
  margin: 0 !important;
  min-width: 36px;
  height: 36px;
  line-height: 34px;
  padding: 0 12px;
  color: var(--ds-ink-700) !important;
  background: #fff !important;
  font-size: 14px;
  text-align: center;
}

body.shop-site.shop-autima-shell .shop-autima-list .pagination > li > a:hover {
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  background: var(--ds-yellow) !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .pagination > .active > a,
body.shop-site.shop-autima-shell .shop-autima-list .pagination > .active > span,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .pagination
  > .active
  > a:hover {
  background: var(--ds-yellow) !important;
  border-color: var(--ds-yellow) !important;
  color: var(--ds-on-primary) !important;
  font-weight: 700;
}

/* Phase D ? Mobile filter drawer */

body.shop-site.shop-autima-shell .shop-autima-list .shop-filter-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
  background: var(--ds-brand-900) !important;
  color: var(--ds-yellow) !important;
  border: 0 !important;
  border-radius: 3px !important;
  padding: 10px 16px !important;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.04em;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop-filter-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(51, 51, 51, 0.5);
  z-index: 1040;
  border: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-filter-backdrop[hidden] {
  display: none !important;
}

@media (max-width: 991px) {
  body.shop-site.shop-autima-shell .shop-autima-list .shop-filter-panel {
    position: fixed !important;
    top: 0;
    left: 0;
    width: min(320px, 88vw);
    height: 100vh;
    z-index: 1050;
    background: #fff !important;
    padding: 20px 16px !important;
    overflow-y: auto;
    transform: translateX(-105%);
    transition: transform 0.35s ease;
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15);
  }

  body.shop-site.shop-autima-shell
    .shop-autima-list
    .shop-filter-panel.is-open {
    transform: translateX(0);
  }

  body.shop-site.shop-autima-shell.shop-filter-open {
    overflow: hidden;
  }

  body.shop-site.shop-autima-shell
    .shop-autima-list
    .shop-autima-sidebar
    .widget_inner {
    border: 0 !important;
    background: #f4f4f4 !important;
    margin-bottom: 0 !important;
  }
}

@media (min-width: 992px) {
  body.shop-site.shop-autima-shell .shop-autima-list .shop-filter-toggle,
  body.shop-site.shop-autima-shell .shop-autima-list .shop-filter-backdrop {
    display: none !important;
  }
}

/* =========================================================================
   Header lock ? beat earlier Nest/pill overrides for Autima yellow header
   ========================================================================= */

body.shop-site.shop-autima-shell .header_middle.main-header {
  background: var(--ds-yellow) !important;
  padding: 25px 0 !important;
}

body.shop-site.shop-autima-shell .header_middle .search-box .input-group {
  border-radius: 5px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell
  .header_middle
  .search-box
  .input-group:focus-within {
  box-shadow: none !important;
  border: 0 !important;
  background: #fff !important;
}

body.shop-site.shop-autima-shell .header_middle .search-box .form-control {
  height: 47px !important;
  border-radius: 0 !important;
  font-size: 13px !important;
  padding: 0 80px 0 20px !important;
}

body.shop-site.shop-autima-shell .header_middle .search-box .btn-search {
  height: 48px !important;
  min-height: 48px !important;
  border-radius: 0 5px 5px 0 !important;
  background: #333 !important;
  color: #fff !important;
  box-shadow: none !important;
}

body.shop-site.shop-autima-shell
  .header_middle
  .mini_cart_wrapper
  .shopping-cart {
  height: auto !important;
  min-height: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  color: var(--ds-ink-900) !important;
}

body.shop-site.shop-autima-shell nav.navbar.navbar-default.header_bottom {
  background: #fff !important;
  padding: 0 !important;
  border-top: 0 !important;
  box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.1) !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li
  > a {
  margin: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ds-ink-900) !important;
  text-transform: uppercase !important;
  padding: 14px 20px !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li:first-child
  > a {
  padding-left: 0 !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li
  > a:hover,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li.open
  > a,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li.active
  > a,
body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li.active
  > a:hover {
  background: transparent !important;
  color: var(--ds-yellow) !important;
  border-radius: 0 !important;
}

/* =========================================================================
   Product views — Autima List | Grid (3-col) only
   ========================================================================= */

/* Sale badge: top-left skew (Autima _product.scss + screenshots) */

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product
  .label_product {
  top: 1px !important;
  left: 4px !important;
  bottom: auto !important;
}

/* Toolbar: Grid (3) + List only — 4-col removed */

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_wrapper {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border: 1px solid #ddd !important;
  padding: 8px 10px !important;
  margin: 0 0 30px !important;
  background: #fff !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_btn {
  display: flex;
  align-items: center;
  gap: 12px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-2,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.two-col,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-4,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.four-col {
  display: none !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-3 {
  width: 20px;
  height: 20px;
  opacity: 0.4;
  background-image:
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333);
  background-size: 4px 4px;
  background-position:
    0 0,
    8px 0,
    16px 0,
    0 8px,
    8px 8px,
    16px 8px,
    0 16px,
    8px 16px,
    16px 16px;
  background-repeat: no-repeat;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-grid-3.active {
  opacity: 1;
  background-image:
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333);
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-list {
  width: 20px;
  height: 20px;
  opacity: 0.4;
  background-image:
    linear-gradient(#333, #333), linear-gradient(#333, #333),
    linear-gradient(#333, #333);
  background-size: 20px 3px;
  background-position:
    center 2px,
    center 8px,
    center 14px;
  background-repeat: no-repeat;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.btn-list.active {
  opacity: 1;
}

body.shop-site.shop-autima-shell .shop-autima-list .page_amount,
body.shop-site.shop-autima-shell .shop-autima-list .page-info {
  color: #757575;
  font-size: 14px;
  margin: 0;
}

/* Shared card chrome */

body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-product {
  border: 1px solid #f0f0f0 !important;
  border-radius: 3px !important;
  background: #fff !important;
  padding: 10px 8px 18px 18px !important;
  margin: 1px 0 20px !important;
  text-align: left !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product
  .product_name
  h3,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product
  .product_name
  h3
  a,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product
  .price_box,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product
  .product_ratings,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-product
  .content_inner {
  text-align: left !important;
}

/* ----- LIST VIEW (Autima flex) ----- */

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-list-view
  .shop-autima-product {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  padding-bottom: 20px !important;
  -moz-column-gap: 0 !important;
       column-gap: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .shop-card__tags,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .secondary_img {
  display: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_thumb {
  flex: 0 0 33.333333% !important;
  min-width: 33.333333% !important;
  max-width: 33.333333% !important;
  margin: 0 15px 0 0 !important;
  grid-area: auto !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .list_content {
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  min-width: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .left_caption {
  width: 62% !important;
  flex: 0 0 62% !important;
  padding-right: 20px !important;
  border-right: 1px solid #ddd !important;
  margin-right: 20px !important;
  grid-area: auto !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .left_caption
  .product_name
  h3 {
  margin: 0 0 12px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  font-family: var(--ds-font-heading) !important;
  text-transform: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_ratings {
  margin-bottom: 8px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_ratings
  ul {
  display: flex !important;
  gap: 2px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_ratings
  li,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_ratings
  .fa-star {
  color: #ffcb15 !important;
  font-size: 14px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .product_desc
  p {
  font-size: 14px !important;
  line-height: 22px !important;
  color: #757575 !important;
  margin: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  grid-area: auto !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .text_available {
  margin-bottom: 13px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .text_available
  p {
  font-size: 14px !important;
  text-transform: capitalize !important;
  margin: 0 !important;
  color: #333 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .text_available
  span {
  color: #67c10a !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .price_box {
  margin-bottom: 20px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .current_price {
  font-size: 20px !important;
  color: #fd5018 !important;
  font-weight: 600 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .old_price {
  font-size: 16px !important;
  color: #757575 !important;
  text-decoration: line-through !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn {
  margin-bottom: 20px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn
  a {
  display: block !important;
  width: 100% !important;
  line-height: 38px !important;
  background: #ffd54c !important;
  color: #333 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  text-transform: capitalize !important;
  text-align: center !important;
  border-radius: 5px !important;
  padding: 0 30px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn
  a:hover {
  background: #333 !important;
  color: #fff !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn {
  text-align: center !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  ul {
  display: flex !important;
  justify-content: center !important;
  gap: 0 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  a {
  display: block !important;
  width: 36px !important;
  height: 36px !important;
  line-height: 36px !important;
  font-size: 18px !important;
  color: #505050 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  a:hover {
  color: #ffd54c !important;
}

/* ----- GRID 3 / GRID 4 (same card, different columns) ----- */

body.shop-site.shop-autima-shell #shop-results-wrap.grid_3 .shop-autima-product,
body.shop-site.shop-autima-shell #shop-results-wrap.grid_4 .shop-autima-product,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-4
  .shop-autima-product {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-3
  .shop-autima-product
  .list_content,
body.shop-site.shop-autima-shell
  .shop-autima-list.is-grid-4
  .shop-autima-product
  .list_content {
  display: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .grid_name,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_content,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .grid_content {
  display: block !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .shop-card__tags,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .shop-card__tags {
  display: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_name
  h3,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .grid_name
  h3 {
  margin: 0 0 10px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  min-height: 40px;
  font-family: var(--ds-font-body) !important;
  text-transform: capitalize !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_name
  h3
  a,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .grid_name
  h3
  a {
  color: #333 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .product_thumb,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .product_thumb {
  margin-bottom: 12px !important;
  text-align: center !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_content
  .product_ratings,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .grid_content
  .product_ratings {
  margin: 0 0 8px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_content
  .product_ratings
  ul,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .grid_content
  .product_ratings
  ul {
  display: flex !important;
  gap: 2px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-content: flex-start !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .grid_content
  .product_ratings
  .fa-star,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .grid_content
  .product_ratings
  .fa-star {
  color: #ffcb15 !important;
  font-size: 14px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .product_footer,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .product_footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .current_price,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .current_price {
  color: #fd5018 !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  margin-right: 5px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .current_price {
  font-size: 15px !important;
  margin-right: 3px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_3
  .shop-autima-product
  .old_price,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .old_price {
  color: #757575 !important;
  text-decoration: line-through !important;
  font-size: 16px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_4
  .shop-autima-product
  .old_price {
  font-size: 14px !important;
}

@media (max-width: 1199px) {
  /* 4-col toggle removed — kept empty hook for legacy breakpoints */
}

@media (max-width: 767px) {
  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product {
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 10px 18px 18px !important;
  }

  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .product_thumb {
    flex: 0 0 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 25px !important;
  }

  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .list_content {
    flex-direction: column !important;
  }

  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .left_caption {
    width: 100% !important;
    flex: 0 0 100% !important;
    padding-right: 0 !important;
    border-right: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 16px !important;
  }
}

/* =========================================================================
   Spacing polish — products listing + compact sticky nav
   Fixes: sidebar gutters, toolbar clearance, sticky header density
   ========================================================================= */

/* 1) Layout gutters — listing uses .shop-listing-layout CSS grid (not Bootstrap cols) */

body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-layout {
  margin-left: 0;
  margin-right: 0;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-layout
  > [class*="col-"] {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-filter-panel.shop-autima-sidebar {
  margin-bottom: 24px;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-main {
  min-width: 0;
}

/* Sidebar inner breathing room */

body.shop-site.shop-autima-shell
  .shop-autima-list
  .sidebar_widget
  .widget_inner,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-sidebar
  .widget_inner {
  padding: 24px 22px 22px !important;
  margin-bottom: 0 !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .sidebar_widget {
  margin: 0 0 24px !important;
}

/* 2) Toolbar / sort / results — balanced horizontal clearance */

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_wrapper {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 14px 20px !important;
  padding: 12px 18px !important;
  margin: 0 0 28px !important;
  border: 1px solid #ddd !important;
  background: #fff !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_btn {
  gap: 14px;
  padding: 2px 0;
}

body.shop-site.shop-autima-shell .shop-autima-list .niceselect_option {
  margin: 0 8px;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .niceselect_option
  .bootstrap-select
  > .btn,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .niceselect_option
  .dropdown-toggle {
  padding-left: 14px !important;
  padding-right: 28px !important;
  min-width: 180px;
}

body.shop-site.shop-autima-shell .shop-autima-list .page_amount {
  margin-left: auto;
  padding-left: 8px;
  padding-right: 2px;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar.t_bottom {
  padding: 12px 18px !important;
  margin-top: 16px;
}

/* 3) Sticky header — keep sticky behavior, reduce vertical bulk */

body.shop-site.shop-autima-shell nav.navbar.navbar-default.header_bottom {
  min-height: 44px !important;
  padding: 0 !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li
  > a {
  padding: 11px 16px !important;
  margin: 0 !important;
  line-height: 22px !important;
}

body.shop-site.shop-autima-shell
  nav.navbar.navbar-default.header_bottom
  .navbar-nav
  > li:first-child
  > a {
  padding-left: 0 !important;
}

body.shop-site.shop-autima-shell .header_bottom.sticky-header.is-sticky {
  min-height: 42px !important;
  padding: 0 !important;
}

body.shop-site.shop-autima-shell
  .header_bottom.sticky-header.is-sticky
  .navbar-nav
  > li
  > a {
  padding-top: 9px !important;
  padding-bottom: 9px !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  line-height: 20px !important;
}

body.shop-site.shop-autima-shell
  .header_bottom.sticky-header.is-sticky
  .navbar-nav
  > li:first-child
  > a {
  padding-left: 0 !important;
}

body.shop-site.shop-autima-shell
  .header_bottom.sticky-header.is-sticky
  .container {
  padding-top: 0;
  padding-bottom: 0;
}

/* Mobile: keep filter drawer usable; restore normal column padding stack */

@media (max-width: 991px) {
  body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-layout {
    margin-left: 0;
    margin-right: 0;
  }

  body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_wrapper {
    padding: 12px 14px !important;
    gap: 12px !important;
  }

  body.shop-site.shop-autima-shell .shop-autima-list .niceselect_option {
    margin: 0;
    width: 100%;
  }

  body.shop-site.shop-autima-shell .shop-autima-list .page_amount {
    margin-left: 0;
    width: 100%;
  }

  /* Off-canvas filter: keep inner padding, ignore layout gutter overrides */

  body.shop-site.shop-autima-shell .shop-autima-list .shop-filter-panel {
    padding: 20px 16px !important;
  }

  body.shop-site.shop-autima-shell
    .shop-autima-list
    .shop-filter-panel
    .widget_inner {
    padding: 0 !important;
    border: 0 !important;
    background: #f4f4f4 !important;
  }
}

/* =========================================================================
   Listing balance v2 — annotated screenshot fixes
   Sidebar gutters — toolbar zones — list right column alignment
   ========================================================================= */

/* --- Wider gap: filter ? product grid --- */

@media (min-width: 992px) {
  body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-layout {
    margin-left: 0;
    margin-right: 0;
  }
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .sidebar_widget
  .widget_inner,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-autima-sidebar
  .widget_inner {
  padding: 28px 24px !important;
  background: #f4f4f4 !important;
  border: 1px solid #e1e1e1 !important;
}

/* --- Toolbar: 3 clear zones (views | sort | count) --- */

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 16px 24px !important;
  padding: 14px 20px !important;
  margin: 0 0 28px !important;
  border: 1px solid #ddd !important;
  background: #fff !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_btn > button {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  opacity: 0.38 !important;
  flex: 0 0 auto !important;
  border: 0 !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  vertical-align: middle;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button.active,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop_toolbar_btn
  > button:hover {
  opacity: 1 !important;
  background-color: transparent !important;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop-toolbar-sort,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .niceselect_option.shop-toolbar-sort {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-toolbar-sort
  .bootstrap-select,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-toolbar-sort
  .bootstrap-select
  > .btn {
  width: 220px !important;
  max-width: 100%;
}

body.shop-site.shop-autima-shell .shop-autima-list .shop-toolbar-count,
body.shop-site.shop-autima-shell
  .shop-autima-list
  .page_amount.shop-toolbar-count {
  flex: 1 1 auto !important;
  margin-left: auto !important;
  padding: 0 !important;
  text-align: right !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-toolbar-count
  .page-info {
  color: #757575 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  white-space: nowrap;
}

/* --- List card: right column right-aligned (price / stock / CTA / icons) --- */

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 16px 18px 18px 16px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .list_content {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .left_caption {
  width: 58% !important;
  flex: 1 1 58% !important;
  padding-right: 24px !important;
  margin-right: 24px !important;
  border-right: 1px solid #ddd !important;
  text-align: left !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption {
  flex: 0 0 220px !important;
  width: 220px !important;
  max-width: 38% !important;
  margin-left: auto !important;
  text-align: right !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .text_available,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .text_available
  p,
body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .price_box {
  width: 100% !important;
  text-align: right !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .text_available {
  margin-bottom: 12px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .price_box {
  margin-bottom: 16px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .right_caption
  .current_price {
  font-size: 20px !important;
  color: #fd5018 !important;
  font-weight: 600 !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn {
  width: 100% !important;
  margin-bottom: 14px !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .cart_links_btn
  a {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  line-height: 40px !important;
  border-radius: 5px !important;
  background: #ffd54c !important;
  color: #333 !important;
  font-size: 15px !important;
  text-transform: capitalize !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn {
  width: 100% !important;
  text-align: right !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  ul {
  display: inline-flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 2px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

body.shop-site.shop-autima-shell
  #shop-results-wrap.grid_list
  .shop-autima-product
  .action_links_btn
  a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  color: #505050 !important;
  font-size: 18px !important;
}

@media (max-width: 991px) {
  body.shop-site.shop-autima-shell .shop-autima-list .shop_toolbar_wrapper {
    padding: 12px 14px !important;
  }

  body.shop-site.shop-autima-shell .shop-autima-list .shop-toolbar-count {
    flex: 1 1 100% !important;
    text-align: left !important;
    margin-left: 0 !important;
  }

  body.shop-site.shop-autima-shell .shop-autima-list .shop-toolbar-sort {
    flex: 1 1 auto !important;
  }

  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .right_caption {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch !important;
  }

  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .action_links_btn {
    text-align: center !important;
  }

  body.shop-site.shop-autima-shell
    #shop-results-wrap.grid_list
    .shop-autima-product
    .action_links_btn
    ul {
    justify-content: center !important;
  }
}

/* =========================================================================
   Listing layout safety — do not reuse .shop-products-grid (homepage cards)
   ========================================================================= */

/* Kill Bootstrap-row negative gutters that assumed col-* children */

body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-layout,
body.shop-site.shop-autima-shell .shop-autima-list .shop-listing-layout {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.shop-site.shop-autima-shell
  .shop-autima-list
  .shop-filter-panel.shop-autima-sidebar,
body.shop-site.shop-autima-shell .shop-autima-list .shop-autima-main {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Homepage .shop-card chrome must not collapse listing cards */

body.shop-site.shop-autima-shell
  .shop-autima-list
  #results
  .shop-autima-product.shop-card {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  transform: none !important;
}

/* Results always visible */

body.shop-site.shop-autima-shell .shop-autima-list #shop-results-wrap,
body.shop-site.shop-autima-shell .shop-autima-list #results {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  width: 100% !important;
  min-height: 80px;
}

body.shop-site.shop-autima-shell .shop-autima-list #results .product-container {
  display: block !important;
  float: none !important;
  width: 100% !important;
  clear: both !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Sidebar inner breathing room (safe; does not fight layout grid) */

body.shop-site.shop-autima-shell .shop-autima-list #sticky-con,
body.shop-site.shop-autima-shell .shop-autima-list #sticky-con.widget_inner {
  padding: 32px 28px !important;
  background: #f4f4f4 !important;
  border: 1px solid #e1e1e1 !important;
  box-sizing: border-box !important;
}

@media (min-width: 640px) {
  .sm\:tw-inline {
    display: inline;
  }

  .sm\:tw-inline-flex {
    display: inline-flex;
  }

  .sm\:tw-grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sm\:tw-grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .md\:tw-block {
    display: block;
  }

  .md\:tw-h-72 {
    height: 18rem;
  }

  .md\:tw-grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .md\:tw-p-12 {
    padding: 3rem;
  }

  .md\:tw-text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  .md\:tw-text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

@media (min-width: 1024px) {
  .lg\:tw-inline {
    display: inline;
  }

  .lg\:tw-grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}