/** Shopify CDN: Minification failed

Line 11:77 Unexpected "*"

**/
/* An Ngọc — base + component classes (nguồn: design/export/tokens/{base,components}.css). Class prefix an-*. */

/* Base — CỐ Ý tối giản (review 2026-09-11):
   - body màu/nền, h1-h3 font-family/weight/size, focus ring, reduced-motion: Horizon đã lo qua settings + color_palette
     (base.css h1 {color: var(--color)} = contrast theo section; *:focus-visible outline currentcolor).
   - Font Itim/Be Vietnam Pro vào qua biến --font-heading--*/--font-body--* trong an-tokens.css.
   - Giá trị design h1 40 / h2 32 / h3 28 / body 18 nằm ở settings_data.json. */
body { -webkit-font-smoothing: antialiased; }
.an-heading {
  font-family: var(--font-heading);
  font-weight: var(--weight-regular); /* Itim ships a single 400 weight */
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  text-wrap: pretty;
}

/* Component classes — copy these into Horizon's assets/an-components.css and use the same class names in Liquid snippets. */

/* Button */
.an-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--control-height); padding: 0 var(--space-6); border-radius: var(--radius-pill); font-family: var(--font-body); font-size: var(--text-md); font-weight: var(--weight-semibold); line-height: 1; cursor: pointer; border: 1.5px solid transparent; transition: background var(--duration) var(--ease), color var(--duration) var(--ease); text-decoration: none; white-space: nowrap; }
.an-btn--primary { background: var(--button-primary-bg); color: var(--button-primary-fg); border-color: var(--button-primary-bg); }
.an-btn--primary:hover { background: var(--button-primary-bg-hover); border-color: var(--button-primary-bg-hover); color: var(--button-primary-fg); }
.an-btn--secondary { background: var(--button-secondary-bg); color: var(--button-secondary-fg); border-color: var(--border-strong); }
.an-btn--secondary:hover { background: var(--button-secondary-bg-hover); color: var(--button-secondary-fg); }
.an-btn--text { background: transparent; color: var(--text-body); border-color: transparent; padding: 0 var(--space-3); text-decoration: underline; text-underline-offset: 4px; }
.an-btn--text:hover { color: var(--text-secondary); }
.an-btn--full { width: 100%; }
.an-btn--sm { min-height: var(--control-height-sm); font-size: var(--text-sm); padding: 0 var(--space-5); }
.an-btn:disabled, .an-btn[aria-disabled="true"] { background: var(--an-gray-50); color: var(--text-secondary); border-color: var(--an-gray-50); cursor: not-allowed; }
.an-btn:active { transform: translateY(1px); }

/* Badge */
.an-badge { display: inline-block; font-size: var(--text-xs); font-weight: var(--weight-semibold); line-height: 1.5; }
.an-badge--new { color: var(--text-new); }
.an-badge--sale { color: var(--text-sale); }
.an-badge--soldout { color: var(--text-secondary); }

/* Price */
.an-price { display: inline-flex; align-items: baseline; gap: var(--space-2); font-size: var(--text-md); font-weight: var(--weight-semibold); line-height: 1.5; color: var(--text-body); }
.an-price__sale { color: var(--text-sale); }
.an-price__compare { color: var(--text-secondary); text-decoration: line-through; font-weight: var(--weight-regular); font-size: var(--text-sm); }
.an-price--lg { font-size: 24px; }

/* Product tile */
.an-tile { display: flex; flex-direction: column; gap: var(--space-2); color: var(--text-body); text-decoration: none; }
.an-tile__media { position: relative; aspect-ratio: var(--tile-ratio); border-radius: var(--radius-tile); overflow: hidden; background: var(--an-gray-50); }
.an-tile__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity var(--duration) var(--ease); }
.an-tile__media img + img { position: absolute; inset: 0; opacity: 0; }
.an-tile:hover .an-tile__media img + img { opacity: 1; }
.an-tile__body { display: flex; flex-direction: column; gap: var(--space-1); padding-top: var(--space-1); }
.an-tile__name { font-size: var(--text-sm); font-weight: var(--weight-regular); line-height: 1.5; margin: 0; }
.an-tile:hover .an-tile__name { text-decoration: underline; text-underline-offset: 3px; }

/* Placeholder image (striped) */
.an-ph { display: flex; align-items: flex-end; padding: var(--space-3); background: repeating-linear-gradient(135deg, #F5F5F5 0 12px, #FEF1EB 12px 24px); color: var(--text-secondary); font-family: ui-monospace, Menlo, monospace; font-size: 13px; width: 100%; height: 100%; box-sizing: border-box; }

/* Accordion */
.an-acc { border-top: 1px solid var(--border-default); }
.an-acc__item { border-bottom: 1px solid var(--border-default); }
.an-acc__trigger { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: var(--accordion-row); padding: 0; background: none; border: 0; font-family: var(--font-body); font-size: var(--text-md); font-weight: var(--weight-semibold); color: var(--text-body); cursor: pointer; text-align: left; }
.an-acc__icon { font-size: 24px; font-weight: 400; line-height: 1; width: var(--touch-min); text-align: right; }
.an-acc__panel { padding: 0 0 var(--space-5); font-size: var(--text-sm); color: var(--text-body); }
.an-acc__panel ul { margin: 0; padding-left: 20px; }

/* Section heading */
.an-section-head { display: flex; flex-direction: column; gap: var(--space-2); margin-bottom: var(--space-6); }
.an-section-head--center { align-items: center; text-align: center; }
.an-section-head__sub { font-size: var(--text-md); color: var(--text-secondary); margin: 0; }

/* Header */
.an-header { background: var(--surface-page); border-bottom: 1px solid var(--border-default); }
.an-header__util { background: var(--surface-utility); font-size: var(--text-sm); text-align: center; padding: var(--space-3) var(--gutter); }
.an-header__row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--space-5); max-width: var(--content-width); margin: 0 auto; padding: var(--space-4) var(--gutter); }
.an-header__logo { font-family: var(--font-heading); font-weight: var(--weight-regular); font-size: 28px; color: var(--text-body); text-decoration: none; letter-spacing: -0.01em; }
.an-header__search { display: flex; align-items: center; gap: var(--space-2); min-height: var(--touch-min); border: 1.5px solid var(--border-default); border-radius: var(--radius-pill); padding: 0 var(--space-4); width: min(360px, 100%); background: var(--surface-page); }
.an-header__search input { border: 0; outline: 0; flex: 1; font: inherit; font-size: var(--text-sm); color: var(--text-body); background: transparent; min-width: 0; }
.an-header__search input::placeholder { color: var(--text-secondary); }
.an-header__actions { display: flex; justify-content: flex-end; gap: var(--space-2); }
.an-iconlink { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-width: var(--touch-min); min-height: var(--touch-min); padding: 0 var(--space-2); font-size: var(--text-xs); color: var(--text-body); text-decoration: none; border-radius: 8px; }
.an-iconlink:hover { background: var(--surface-utility); color: var(--text-body); }
.an-iconlink svg { width: 24px; height: 24px; }
.an-nav { display: flex; justify-content: center; gap: var(--space-2); flex-wrap: wrap; padding: 0 var(--gutter) var(--space-2); }
.an-nav a { display: inline-flex; align-items: center; min-height: var(--touch-min); padding: 0 var(--space-4); font-size: var(--text-sm); font-weight: var(--weight-regular); color: var(--text-body); border-radius: 8px; text-decoration: none; }
.an-nav a:hover { text-decoration: underline; text-underline-offset: 6px; color: var(--text-body); }
.an-nav a[aria-current="page"] { font-weight: var(--weight-semibold); text-decoration: underline; text-underline-offset: 6px; }
.an-nav a.an-nav__sale { color: var(--text-sale); }

/* Filter sidebar */
.an-side { display: flex; flex-direction: column; gap: var(--space-6); width: 100%; }
.an-side__title { font-size: var(--text-h3); font-family: var(--font-heading); font-weight: var(--weight-regular); margin: 0 0 var(--space-3); }
.an-side__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.an-side__links a { display: flex; align-items: center; min-height: var(--touch-min); font-size: var(--text-sm); font-weight: var(--weight-semibold); color: var(--text-body); text-decoration: none; }
.an-side__links a:hover { text-decoration: underline; text-underline-offset: 4px; }
.an-side__links a[aria-current="page"] { text-decoration: underline; text-underline-offset: 4px; }
.an-side__filters-title { font-size: var(--text-lg); font-weight: var(--weight-semibold); margin: 0 0 var(--space-3); }
.an-check { display: flex; align-items: center; gap: var(--space-3); min-height: var(--touch-min); font-size: var(--text-sm); cursor: pointer; }
.an-check input { width: 22px; height: 22px; accent-color: var(--an-black); margin: 0; }

/* Size chips (variant picker restyle) */
.an-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.an-chip { display: inline-flex; align-items: center; justify-content: center; min-width: var(--touch-min); min-height: var(--touch-min); padding: 0 var(--space-4); border: 1.5px solid var(--border-default); border-radius: var(--radius-chip); background: var(--surface-page); font: inherit; font-size: var(--text-sm); font-weight: var(--weight-semibold); color: var(--text-body); cursor: pointer; }
.an-chip:hover { border-color: var(--border-strong); }
.an-chip[aria-checked="true"], .an-chip--selected { background: var(--an-black); border-color: var(--an-black); color: var(--an-white); }
.an-chip--soldout { color: var(--text-secondary); text-decoration: line-through; background: var(--surface-utility); cursor: not-allowed; }

/* Quantity stepper */
.an-qty { display: inline-flex; align-items: center; border: 1.5px solid var(--border-strong); border-radius: var(--radius-pill); height: var(--control-height-sm); overflow: hidden; }
.an-qty button { width: var(--control-height-sm); height: 100%; border: 0; background: transparent; font-size: 24px; color: var(--text-body); cursor: pointer; }
.an-qty button:hover { background: var(--surface-utility); }
.an-qty input { width: 56px; text-align: center; border: 0; font: inherit; font-size: var(--text-md); font-weight: var(--weight-semibold); color: var(--text-body); background: transparent; -moz-appearance: textfield; }
.an-qty input::-webkit-inner-spin-button, .an-qty input::-webkit-outer-spin-button { -webkit-appearance: none; }

/* Text field */
.an-field { display: flex; flex-direction: column; gap: var(--space-2); }
.an-field__label { font-size: var(--text-sm); font-weight: var(--weight-semibold); }
.an-field__input { min-height: var(--control-height-sm); padding: 0 var(--space-4); border: 1.5px solid var(--border-default); border-radius: var(--radius-input); font: inherit; font-size: var(--text-md); color: var(--text-body); background: var(--surface-page); }
.an-field__input:hover { border-color: var(--border-strong); }
.an-field__input:focus { border-color: var(--border-strong); }
.an-field__hint { font-size: var(--text-xs); color: var(--text-secondary); }
.an-field__hint--error { color: var(--text-sale); }
.an-field--error .an-field__input { border-color: var(--text-sale); }

/* Promise line (under Add to cart) */
.an-promise { display: flex; align-items: center; gap: var(--space-2); font-size: var(--text-sm); color: var(--text-body); }
.an-promise a { text-decoration: underline; text-underline-offset: 3px; }

/* Promo block (peach) */
.an-promo { background: var(--surface-promo); border-radius: var(--radius-tile); padding: var(--space-7); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.an-promo p { margin: 0; font-size: var(--text-md); max-width: 44ch; }

/* Load more */
.an-loadmore { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); padding: var(--space-6) 0; }
.an-loadmore__count { font-size: var(--text-sm); color: var(--text-secondary); }

/* Breadcrumb */
.an-crumb { display: flex; gap: var(--space-2); font-size: var(--text-sm); color: var(--text-secondary); padding: var(--space-4) 0; flex-wrap: wrap; }
.an-crumb a { color: var(--text-secondary); min-height: 24px; display: inline-flex; align-items: center; }
.an-crumb a:hover { color: var(--text-body); text-decoration: underline; }

/* Floating chat */
.an-chat { position: fixed; right: 24px; bottom: 24px; display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--control-height); padding: 0 var(--space-5); border-radius: var(--radius-pill); background: var(--an-black); color: var(--an-white); font-size: var(--text-sm); font-weight: var(--weight-semibold); text-decoration: none; box-shadow: var(--shadow-float); border: 0; cursor: pointer; }
.an-chat:hover { background: var(--button-primary-bg-hover); color: var(--an-white); }
.an-chat svg { width: 22px; height: 22px; }

/* Footer */
.an-footer { background: var(--surface-footer); padding: var(--space-8) var(--gutter) var(--space-6); }
.an-footer__inner { max-width: var(--content-width); margin: 0 auto; display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: var(--space-7); }
.an-footer__brand { font-family: var(--font-heading); font-weight: var(--weight-regular); font-size: 28px; }
.an-footer__tag { font-size: var(--text-sm); margin: var(--space-2) 0 0; max-width: 32ch; }
.an-footer h3, .an-footer__col-title { font-family: var(--font-body); font-size: var(--text-sm); font-weight: var(--weight-semibold); margin: 0 0 var(--space-2); }
.an-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.an-footer li a { display: inline-flex; align-items: center; min-height: 40px; font-size: var(--text-sm); color: var(--text-body); }
.an-footer li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.an-footer__legal { max-width: var(--content-width); margin: var(--space-7) auto 0; padding-top: var(--space-5); border-top: 1px solid rgba(36,39,42,0.12); display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3); font-size: var(--text-xs); color: var(--text-secondary); }

/* Layout helpers */
.an-container { max-width: var(--content-width); margin: 0 auto; padding: 0 var(--gutter); box-sizing: border-box; }
.an-section { padding: var(--section-gap) 0 0; }
.an-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gap) var(--grid-gap); }
.an-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.an-collection { display: grid; grid-template-columns: var(--an-sidebar-width) minmax(0, 1fr); gap: var(--space-7); }
.an-pdp { display: grid; grid-template-columns: minmax(0, 1fr) var(--buy-panel-width); gap: var(--space-7); align-items: start; }
.an-pdp__gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.an-pdp__gallery img, .an-pdp__gallery .an-ph { aspect-ratio: var(--tile-ratio); width: 100%; object-fit: cover; border-radius: var(--radius-tile); }
.an-pdp__panel { position: sticky; top: var(--space-5); display: flex; flex-direction: column; gap: var(--space-5); }
@media (max-width: 900px) {
  .an-grid, .an-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-4); }
  .an-collection, .an-pdp { grid-template-columns: minmax(0, 1fr); }
  .an-pdp__panel { position: static; }
  .an-footer__inner { grid-template-columns: 1fr 1fr; gap: var(--space-6); }
  .an-header__row { grid-template-columns: auto 1fr auto; }
  :root { --section-gap: 56px; --text-h1: 32px; --text-h2: 28px; }
}
