/*
 * Tolin global foundation
 *
 * Direction-neutral design primitives and focused RTL corrections for Dawn 15.5.0.
 * Component redesigns remain out of scope for Phase 1.
 */

html {
  scroll-behavior: smooth;
}

body {
  font-size: var(--tolin-type-body);
  line-height: var(--tolin-leading-body);
  text-align: start;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

:where(h1, h2, h3, .h0, .h1, .h2, .h3) {
  line-height: var(--tolin-leading-tight);
  text-wrap: balance;
}

h1,
.h0,
.h1 {
  font-size: var(--tolin-type-h1);
}

h2,
.h2 {
  font-size: var(--tolin-type-h2);
}

h3,
.h3 {
  font-size: var(--tolin-type-h3);
}

:where(p, li, dd, dt, label, input, select, textarea, button) {
  overflow-wrap: anywhere;
}

.rte {
  max-inline-size: var(--tolin-container-reading);
}

.page-width {
  padding-inline: var(--tolin-gutter);
}

.button,
.shopify-challenge__button,
.customer button,
button.shopify-payment-button__button--unbranded {
  min-block-size: 4.4rem;
  padding-inline: max(2.4rem, var(--tolin-space-lg));
  font-weight: 650;
  letter-spacing: 0.04rem;
}

:where(.field__input, .select__select, .customer .field input, .customer select) {
  min-block-size: 4.8rem;
  text-align: start;
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 0.2rem solid var(--tolin-color-brand-primary);
  outline-offset: 0.3rem;
  box-shadow: 0 0 0 0.2rem rgb(var(--color-background));
}

.form__message,
.errors {
  color: var(--tolin-color-error);
}

.visually-hidden[role='status']:focus {
  clip: auto;
}

/* Logical spacing for shared commerce components. */
.card__information,
.card-information,
.product__info-container,
.facets-container,
.footer-block,
.predictive-search__results-groups-wrapper {
  text-align: start;
}

.pagination__list > li:not(:last-child) {
  margin-inline-end: 1rem;
  margin-right: 0;
}

.pagination__item--next .icon {
  margin-inline-start: -0.2rem;
  margin-left: 0;
}

.pagination__item--prev .icon {
  margin-inline-end: -0.2rem;
  margin-right: 0;
}

.menu-drawer__menu-item > .svg-wrapper {
  inset-inline-end: 3rem;
  right: auto;
}

.menu-drawer summary.menu-drawer__menu-item {
  padding-inline-end: 5.2rem;
  padding-right: 3rem;
}

.menu-drawer__close-button {
  padding-inline: 3rem 2.6rem;
  text-align: start;
}

.menu-drawer__close-button .svg-wrapper,
.menu-drawer__account account-icon > .svg-wrapper {
  margin-inline-end: 1rem;
  margin-right: 0;
}

.drawer__close {
  inset-inline-end: -1rem;
  right: auto;
}

.cart-drawer__warnings .drawer__close {
  inset-inline-end: 0.5rem;
  right: auto;
}

.drawer__footer summary {
  padding-inline: 0 2.8rem;
}

.predictive-search__item-content,
.predictive-search__heading,
.mobile-facets__label,
.mobile-facets__summary,
.facet-filters__label {
  text-align: start;
}

.mobile-facets__close-button .icon-arrow,
.pagination__item-arrow .icon,
.slider-button .icon,
.menu-drawer__menu-item .icon-arrow,
.menu-drawer__close-button .icon-arrow,
.breadcrumb .icon-caret {
  transform-origin: center;
}

/* RTL layout corrections. The dir attribute handles normal text and flow. */
[dir='rtl'] body {
  letter-spacing: 0;
}

[dir='rtl'] .menu-drawer {
  inset-inline: 0 auto;
  border-width: 0 0 0 var(--drawer-border-width);
  transform: translateX(100%);
}

[dir='rtl'] .menu-drawer__submenu {
  inset-inline: 0 auto;
  transform: translateX(-100%);
}

[dir='rtl'] .drawer {
  justify-content: flex-start;
}

[dir='rtl'] .drawer__inner {
  border-inline: 0 var(--drawer-border-width) solid rgba(var(--color-foreground), var(--drawer-border-opacity));
  transform: translateX(-100%);
}

[dir='rtl'] .drawer.active .drawer__inner {
  transform: translateX(0);
}

[dir='rtl'] :where(
    .pagination__item-arrow .icon,
    .slider-button .icon,
    .menu-drawer__menu-item .icon-arrow,
    .breadcrumb .icon-caret
  ) {
  scale: -1 1;
}

[dir='rtl'] .menu-drawer__close-button .icon-arrow {
  transform: rotate(0deg);
}

[dir='rtl'] .pagination__item--next .icon {
  transform: rotate(-90deg);
}

[dir='rtl'] .pagination__item--next:hover .icon {
  transform: rotate(-90deg) scale(1.07);
}

[dir='rtl'] .pagination__item--prev .icon {
  transform: rotate(90deg);
}

[dir='rtl'] .pagination__item--prev:hover .icon {
  transform: rotate(90deg) scale(1.07);
}

[dir='rtl'] .slider {
  scroll-padding-inline-start: var(--tolin-gutter);
}

[dir='rtl'] :where(.price, .product__sku, .cart-item__details, .predictive-search__item-content) {
  unicode-bidi: plaintext;
}

@media screen and (max-width: 749px) {
  .page-width {
    padding-inline: 1.6rem;
    padding-left: max(1.6rem, env(safe-area-inset-left));
    padding-right: max(1.6rem, env(safe-area-inset-right));
  }
}

@media screen and (min-width: 750px) {
  .page-width {
    padding-inline: var(--tolin-gutter);
  }
}

@media screen and (min-width: 1440px) {
  :root {
    --tolin-gutter: 5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
