/**
 * Tarahetam Commerce Design System
 * Single source of truth for tokens and reusable UI primitives.
 */
:root {
  --tc-color-primary: #205c3b;
  --tc-color-primary-hover: #194b30;
  --tc-color-secondary: #7a4e24;
  --tc-color-accent: #d9a404;
  --tc-color-fresh: #5e8c31;
  --tc-color-background: #faf8f2;
  --tc-color-surface: #ffffff;
  --tc-color-border: #e7e2d8;
  --tc-color-text: #1e1e1e;
  --tc-color-text-muted: #666666;
  --tc-color-disabled: #b5b5b5;
  --tc-color-error: #c62828;
  --tc-color-warning: #f4b400;
  --tc-color-success: #2e8b57;

  /* Backward-compatible aliases used by Phase 1 components. */
  --tc-forest: var(--tc-color-primary);
  --tc-walnut: var(--tc-color-secondary);
  --tc-honey: var(--tc-color-accent);
  --tc-fresh: var(--tc-color-fresh);
  --tc-cream: var(--tc-color-background);
  --tc-white: var(--tc-color-surface);
  --tc-border: var(--tc-color-border);
  --tc-text: var(--tc-color-text);
  --tc-muted: var(--tc-color-text-muted);
  --tc-error: var(--tc-color-error);
  --tc-success: var(--tc-color-success);

  --tc-font-family: "Yekan Bakh Fanum", Tahoma, sans-serif;
  --tc-font-size-caption: 0.75rem;
  --tc-font-size-small: 0.875rem;
  --tc-font-size-body: 1rem;
  --tc-font-size-h6: 1.125rem;
  --tc-font-size-h5: 1.375rem;
  --tc-font-size-h4: 1.625rem;
  --tc-font-size-h3: 2rem;
  --tc-font-size-h2: 2.5rem;
  --tc-font-size-h1: 3rem;
  --tc-font-size-display: 3.5rem;
  --tc-line-height-heading: 1.2;
  --tc-line-height-body: 1.7;
  --tc-line-height-caption: 1.5;

  --tc-space-1: 0.25rem;
  --tc-space-2: 0.5rem;
  --tc-space-3: 0.75rem;
  --tc-space-4: 1rem;
  --tc-space-6: 1.5rem;
  --tc-space-8: 2rem;
  --tc-space-10: 2.5rem;
  --tc-space-12: 3rem;
  --tc-space-16: 4rem;
  --tc-space-20: 5rem;
  --tc-space-24: 6rem;
  --tc-space-32: 8rem;

  --tc-radius-sm: 0.5rem;
  --tc-radius-md: 0.75rem;
  --tc-radius-card: 1rem;
  --tc-radius-lg: 1.25rem;
  --tc-radius-xl: 1.75rem;
  --tc-radius-pill: 999px;
  --tc-r-sm: var(--tc-radius-sm);
  --tc-r-md: var(--tc-radius-md);
  --tc-r-lg: var(--tc-radius-lg);
  --tc-r-xl: var(--tc-radius-xl);

  --tc-shadow-xs: 0 2px 8px rgba(32, 92, 59, 0.05);
  --tc-shadow-sm: 0 8px 24px rgba(32, 92, 59, 0.08);
  --tc-shadow-md: 0 18px 50px rgba(32, 92, 59, 0.11);
  --tc-shadow-lg: 0 24px 70px rgba(32, 92, 59, 0.14);
  --tc-shadow-xl: 0 32px 90px rgba(32, 92, 59, 0.18);

  --tc-container: 82.5rem;
  --tc-control-height: 3rem;
  --tc-touch-target: 2.75rem;
  --tc-duration-fast: 150ms;
  --tc-duration-base: 250ms;
  --tc-duration-slow: 350ms;
  --tc-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --tc-transition: var(--tc-duration-base) var(--tc-ease-out);
  --tc-focus-ring: 0 0 0 3px rgba(32, 92, 59, 0.22);
}

/* Typography primitives */
.tc-display,.tc-h1,.tc-h2,.tc-h3,.tc-h4,.tc-h5,.tc-h6 {
  margin-block: 0 var(--tc-space-4);
  color: var(--tc-color-text);
  font-weight: 800;
  line-height: var(--tc-line-height-heading);
}
.tc-display{font-size:clamp(2.5rem,5vw,var(--tc-font-size-display))}
.tc-h1{font-size:clamp(2.25rem,4.5vw,var(--tc-font-size-h1))}
.tc-h2{font-size:clamp(2rem,4vw,var(--tc-font-size-h2))}
.tc-h3{font-size:clamp(1.625rem,3vw,var(--tc-font-size-h3))}
.tc-h4{font-size:var(--tc-font-size-h4)}
.tc-h5{font-size:var(--tc-font-size-h5)}
.tc-h6{font-size:var(--tc-font-size-h6)}
.tc-text-muted{color:var(--tc-color-text-muted)}
.tc-caption{font-size:var(--tc-font-size-caption);line-height:var(--tc-line-height-caption)}

/* Buttons */
.tc-button,.tc-btn {
  appearance:none;
  min-height:var(--tc-control-height);
  min-width:var(--tc-touch-target);
  padding:0 var(--tc-space-6);
  border:1px solid transparent;
  border-radius:var(--tc-radius-md);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--tc-space-2);
  font-weight:800;
  line-height:1;
  cursor:pointer;
  transition:background-color var(--tc-transition),border-color var(--tc-transition),color var(--tc-transition),box-shadow var(--tc-transition),transform var(--tc-transition);
}
.tc-button:hover,.tc-btn:hover{transform:translateY(-1px)}
.tc-button:active,.tc-btn:active{transform:translateY(1px)}
.tc-button:focus-visible,.tc-btn:focus-visible{outline:0;box-shadow:var(--tc-focus-ring)}
.tc-button--primary,.tc-btn--primary{background:var(--tc-color-primary);color:#fff;box-shadow:var(--tc-shadow-sm)}
.tc-button--primary:hover,.tc-btn--primary:hover{background:var(--tc-color-primary-hover)}
.tc-button--secondary,.tc-btn--secondary{background:var(--tc-color-surface);color:var(--tc-color-primary);border-color:var(--tc-color-primary)}
.tc-button--ghost{background:transparent;color:var(--tc-color-primary)}
.tc-button--danger{background:var(--tc-color-error);color:#fff}
.tc-button--success{background:var(--tc-color-success);color:#fff}
.tc-button--sm{min-height:2.5rem;padding-inline:var(--tc-space-4);font-size:var(--tc-font-size-small)}
.tc-button--lg{min-height:3.5rem;padding-inline:var(--tc-space-8)}
.tc-button[disabled],.tc-button.is-disabled,.tc-btn[disabled]{background:var(--tc-color-disabled);border-color:var(--tc-color-disabled);color:#fff;cursor:not-allowed;box-shadow:none;transform:none;opacity:.75}
.tc-button.is-loading{position:relative;color:transparent;pointer-events:none}
.tc-button.is-loading:after{content:"";position:absolute;width:1.1rem;height:1.1rem;border:2px solid currentColor;border-inline-start-color:transparent;border-radius:50%;color:#fff;animation:tc-spin .8s linear infinite}
@keyframes tc-spin{to{transform:rotate(1turn)}}

/* Forms */
.tc-field{display:grid;gap:var(--tc-space-2)}
.tc-field__label{font-size:var(--tc-font-size-small);font-weight:800;color:var(--tc-color-text)}
.tc-field__required{color:var(--tc-color-error)}
.tc-field__description,.tc-field__message{font-size:var(--tc-font-size-caption);line-height:var(--tc-line-height-caption);color:var(--tc-color-text-muted)}
.tc-input,.tc-select,.tc-textarea,
.tc-field input:not([type="checkbox"]):not([type="radio"]),.tc-field select,.tc-field textarea {
  width:100%;min-height:var(--tc-control-height);padding:var(--tc-space-3) var(--tc-space-4);border:1px solid var(--tc-color-border);border-radius:var(--tc-radius-md);background:var(--tc-color-surface);color:var(--tc-color-text);transition:border-color var(--tc-transition),box-shadow var(--tc-transition),background-color var(--tc-transition)
}
.tc-textarea,.tc-field textarea{min-height:8rem;resize:vertical}
.tc-input:focus,.tc-select:focus,.tc-textarea:focus,.tc-field input:focus,.tc-field select:focus,.tc-field textarea:focus{outline:0;border-color:var(--tc-color-primary);box-shadow:var(--tc-focus-ring)}
.tc-field.is-error .tc-input,.tc-field.is-error .tc-select,.tc-field.is-error .tc-textarea{border-color:var(--tc-color-error)}
.tc-field.is-error .tc-field__message{color:var(--tc-color-error)}
.tc-field.is-success .tc-input,.tc-field.is-success .tc-select,.tc-field.is-success .tc-textarea{border-color:var(--tc-color-success)}
.tc-field.is-success .tc-field__message{color:var(--tc-color-success)}
.tc-check{display:flex;align-items:flex-start;gap:var(--tc-space-2);min-height:var(--tc-touch-target)}
.tc-check input{width:1.25rem;height:1.25rem;margin-top:.2rem;accent-color:var(--tc-color-primary)}

/* Badges and statuses */
.tc-badge{display:inline-flex;align-items:center;gap:.35rem;min-height:1.75rem;padding:.25rem .65rem;border-radius:var(--tc-radius-pill);font-size:var(--tc-font-size-caption);font-weight:800;line-height:1.2;background:#f1eee8;color:var(--tc-color-text)}
.tc-badge--organic,.tc-badge--success{background:#e7f3e9;color:#24663b}
.tc-badge--sale,.tc-badge--premium{background:#fff3ca;color:#725700}
.tc-badge--new{background:#e8f0ff;color:#244f91}
.tc-badge--limited,.tc-badge--error{background:#fde9e9;color:#8f2020}
.tc-badge--neutral{background:#efefef;color:#595959}

/* Reusable surfaces and states */
.tc-card{background:var(--tc-color-surface);border:1px solid var(--tc-color-border);border-radius:var(--tc-radius-card);box-shadow:var(--tc-shadow-xs);overflow:hidden}
.tc-card__body{padding:var(--tc-space-6)}
.tc-card--interactive{transition:transform var(--tc-transition),box-shadow var(--tc-transition),border-color var(--tc-transition)}
.tc-card--interactive:hover{transform:translateY(-2px);box-shadow:var(--tc-shadow-sm);border-color:rgba(32,92,59,.25)}
.tc-state{padding:var(--tc-space-8);border:1px dashed var(--tc-color-border);border-radius:var(--tc-radius-card);text-align:center;background:var(--tc-color-surface)}
.tc-state__title{margin:0 0 var(--tc-space-2);font-size:var(--tc-font-size-h5)}
.tc-state__text{margin:0;color:var(--tc-color-text-muted)}
.tc-alert{padding:var(--tc-space-4);border-radius:var(--tc-radius-md);border:1px solid transparent}
.tc-alert--success{background:#eaf6ee;border-color:#b8dec5;color:#205f36}
.tc-alert--warning{background:#fff7da;border-color:#ead187;color:#745b00}
.tc-alert--error{background:#fdecec;border-color:#edbaba;color:#872020}

@media (max-width: 768px) {
  :root {
    --tc-font-size-display: 2.75rem;
    --tc-font-size-h1: 2.5rem;
    --tc-font-size-h2: 2rem;
    --tc-font-size-h3: 1.625rem;
  }
  .tc-button,.tc-btn{min-height:var(--tc-touch-target)}
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Product card */
.tc-product-card{position:relative;display:flex;min-width:0;flex-direction:column;height:100%}
.tc-product-card__media{position:relative;overflow:hidden;background:#f4f0e8}
.tc-product-card__image{display:block;aspect-ratio:1/1;overflow:hidden}
.tc-product-card__image img{width:100%;height:100%;object-fit:cover;transition:transform var(--tc-transition)}
.tc-product-card:hover .tc-product-card__image img{transform:scale(1.02)}
.tc-product-card__badge{position:absolute;z-index:2;inset-block-start:var(--tc-space-3);inset-inline-start:var(--tc-space-3)}
.tc-product-card__body{display:flex;flex:1;flex-direction:column;gap:var(--tc-space-3)}
.tc-product-card__meta{display:flex;align-items:center;justify-content:space-between;gap:var(--tc-space-2);font-size:var(--tc-font-size-caption);color:var(--tc-color-text-muted)}
.tc-product-card__category{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tc-product-card__stock{display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap}
.tc-product-card__stock::before{content:"";width:.42rem;height:.42rem;border-radius:50%;background:currentColor}
.tc-product-card__stock.is-in-stock{color:var(--tc-color-success)}
.tc-product-card__stock.is-out-of-stock{color:var(--tc-color-error)}
.tc-product-card__title{min-height:2.9em;margin:0;font-size:var(--tc-font-size-body);font-weight:800;line-height:1.45}
.tc-product-card__title a{color:var(--tc-color-text)}
.tc-product-card__rating{min-height:1.25rem}
.tc-product-card__rating .star-rating{float:none;margin:0}
.tc-product-card__footer{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--tc-space-3);margin-top:auto}
.tc-product-card__price{display:flex;min-width:0;flex-wrap:wrap;align-items:baseline;gap:.35rem;color:var(--tc-color-primary);font-weight:900}
.tc-product-card__price del{color:var(--tc-color-text-muted);font-size:var(--tc-font-size-caption);font-weight:500}
.tc-product-card__price ins{text-decoration:none}
.tc-product-card__cta{flex:0 0 auto;white-space:nowrap}

/* Article card */
.tc-article-card{display:flex;min-width:0;flex-direction:column;height:100%}
.tc-article-card__image{display:block;aspect-ratio:1.53/1;overflow:hidden;background:#f2eee6}
.tc-article-card__image img{width:100%;height:100%;object-fit:cover;transition:transform var(--tc-transition)}
.tc-article-card:hover .tc-article-card__image img{transform:scale(1.02)}
.tc-article-card__body{display:flex;flex:1;flex-direction:column;gap:var(--tc-space-3)}
.tc-article-card__meta{display:flex;align-items:center;justify-content:space-between;gap:var(--tc-space-3);font-size:var(--tc-font-size-caption);color:var(--tc-color-text-muted)}
.tc-article-card__title{margin:0;font-size:var(--tc-font-size-h6);font-weight:800;line-height:1.5}
.tc-article-card__title a{color:var(--tc-color-text)}
.tc-article-card__excerpt{margin:0;color:var(--tc-color-text-muted);line-height:var(--tc-line-height-body)}
.tc-article-card__link{display:inline-flex;align-items:center;gap:.4rem;margin-top:auto;color:var(--tc-color-primary);font-weight:800}
.tc-article-card__link::after{content:"←";transition:transform var(--tc-transition)}
.tc-article-card__link:hover::after{transform:translateX(-2px)}
.tc-blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--tc-space-6)}

/* Phase 1 compatibility while components migrate to shared names. */
.tc-home-product-grid .tc-product-card{scroll-snap-align:start}
.tc-magazine__grid .tc-article-card{scroll-snap-align:start}

@media(max-width:992px){.tc-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:768px){
  .tc-product-card__footer{align-items:stretch;flex-direction:column}
  .tc-product-card__cta{width:100%}
  .tc-blog-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.tc-product-card__image img,.tc-article-card__image img{transform:none!important}}

/* Breadcrumb */
.tc-breadcrumb{margin-block:var(--tc-space-4) var(--tc-space-8);font-size:var(--tc-font-size-small);color:var(--tc-color-text-muted)}
.tc-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;gap:var(--tc-space-2);margin:0;padding:0;list-style:none}
.tc-breadcrumb__item{display:inline-flex;align-items:center;min-height:var(--tc-touch-target)}
.tc-breadcrumb__item:not(:last-child)::after{content:"/";margin-inline:var(--tc-space-2);color:var(--tc-color-disabled)}
.tc-breadcrumb a{color:var(--tc-color-primary);text-decoration-thickness:1px;text-underline-offset:.2em}
.tc-breadcrumb a:hover{text-decoration:underline}
.tc-breadcrumb [aria-current="page"]{max-width:32rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tc-color-text)}

/* Pagination */
.tc-pagination{margin-block:var(--tc-space-10);display:flex;justify-content:center}
.tc-pagination__list{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--tc-space-2);margin:0;padding:0;list-style:none}
.tc-pagination .page-numbers{display:inline-flex;min-width:var(--tc-touch-target);min-height:var(--tc-touch-target);align-items:center;justify-content:center;gap:.35rem;padding-inline:var(--tc-space-3);border:1px solid var(--tc-color-border);border-radius:var(--tc-radius-md);background:var(--tc-color-surface);color:var(--tc-color-text);font-weight:800}
.tc-pagination .page-numbers:hover{border-color:var(--tc-color-primary);color:var(--tc-color-primary)}
.tc-pagination .page-numbers.current{border-color:var(--tc-color-primary);background:var(--tc-color-primary);color:#fff}
.tc-pagination .page-numbers.dots{border-color:transparent;background:transparent}

/* Accordion */
.tc-accordion{border-top:1px solid var(--tc-color-border)}
.tc-accordion__item{border-bottom:1px solid var(--tc-color-border)}
.tc-accordion__heading{margin:0}
.tc-accordion__trigger{display:flex;width:100%;min-height:var(--tc-touch-target);align-items:center;justify-content:space-between;gap:var(--tc-space-4);padding:var(--tc-space-4) 0;border:0;background:transparent;color:var(--tc-color-text);text-align:start;font-weight:800;cursor:pointer}
.tc-accordion__trigger i{position:relative;width:1.25rem;height:1.25rem;flex:0 0 1.25rem}
.tc-accordion__trigger i::before,.tc-accordion__trigger i::after{content:"";position:absolute;inset-block-start:50%;inset-inline-start:50%;width:.8rem;height:2px;background:currentColor;transform:translate(-50%,-50%);transition:transform var(--tc-transition)}
.tc-accordion__trigger i::after{transform:translate(-50%,-50%) rotate(90deg)}
.tc-accordion__trigger[aria-expanded="true"] i::after{transform:translate(-50%,-50%) rotate(0)}
.tc-accordion__panel{padding:0 0 var(--tc-space-4);color:var(--tc-color-text-muted)}
.tc-accordion__panel[hidden]{display:none}

/* Modal */
.tc-modal{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:var(--tc-space-4)}
.tc-modal[hidden]{display:none}
.tc-modal__backdrop{position:absolute;inset:0;background:rgba(15,25,18,.62);backdrop-filter:blur(3px)}
.tc-modal__dialog{position:relative;width:min(100%,42rem);max-height:min(86vh,52rem);overflow:auto;border:1px solid var(--tc-color-border);border-radius:var(--tc-radius-xl);background:var(--tc-color-surface);box-shadow:var(--tc-shadow-xl)}
.tc-modal__header{position:sticky;z-index:1;top:0;display:flex;align-items:center;justify-content:space-between;gap:var(--tc-space-4);padding:var(--tc-space-5,1.25rem) var(--tc-space-6);border-bottom:1px solid var(--tc-color-border);background:var(--tc-color-surface)}
.tc-modal__header h2{margin:0;font-size:var(--tc-font-size-h5)}
.tc-modal__close{display:inline-grid;width:var(--tc-touch-target);height:var(--tc-touch-target);place-items:center;border:0;border-radius:var(--tc-radius-pill);background:#f2efe9;color:var(--tc-color-text);font-size:1.6rem;cursor:pointer}
.tc-modal__body{padding:var(--tc-space-6)}
.tc-modal-open{overflow:hidden}

/* Toast */
.tc-toast-region{position:fixed;z-index:11000;inset-inline-start:var(--tc-space-4);inset-block-end:var(--tc-space-4);display:grid;width:min(calc(100% - 2rem),24rem);gap:var(--tc-space-3);pointer-events:none}
.tc-toast{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--tc-space-3);padding:var(--tc-space-4);border:1px solid var(--tc-color-border);border-radius:var(--tc-radius-md);background:var(--tc-color-surface);box-shadow:var(--tc-shadow-lg);color:var(--tc-color-text);pointer-events:auto}
.tc-toast--success{border-inline-start:4px solid var(--tc-color-success)}
.tc-toast--error{border-inline-start:4px solid var(--tc-color-error)}
.tc-toast--warning{border-inline-start:4px solid var(--tc-color-warning)}
.tc-toast__message{margin:0;line-height:1.6}
.tc-toast__close{display:inline-grid;width:2rem;height:2rem;flex:0 0 2rem;place-items:center;border:0;border-radius:var(--tc-radius-pill);background:transparent;cursor:pointer}

@media(max-width:480px){
  .tc-breadcrumb [aria-current="page"]{max-width:15rem}
  .tc-pagination .prev,.tc-pagination .next{font-size:0}
  .tc-pagination .prev span[aria-hidden],.tc-pagination .next span[aria-hidden]{font-size:1rem}
  .tc-modal{padding:0;align-items:end}
  .tc-modal__dialog{width:100%;max-height:90vh;border-radius:var(--tc-radius-xl) var(--tc-radius-xl) 0 0}
}

/* Phase 2 final accessibility and visual-regression hardening */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--tc-color-primary);
  outline-offset:3px;
}
.tc-search:focus-within{
  border-color:var(--tc-color-primary);
  box-shadow:var(--tc-focus-ring);
}
.tc-card,.tc-product-card,.tc-article-card{
  min-width:0;
}
.tc-product-card__title,.tc-article-card__title{
  overflow-wrap:anywhere;
}
[hidden]{display:none!important}
@media (forced-colors:active){
  :where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid CanvasText}
  .tc-button,.tc-btn,.tc-badge,.tc-card,.tc-modal__dialog,.tc-toast{border:1px solid CanvasText}
}
@media (prefers-contrast:more){
  :root{--tc-color-border:#8b857d;--tc-color-text-secondary:#3f3f3f}
}
