/* Shared by public pages and the Angular editor. Fonts are self-hosted; see fonts/sources.json. */

@font-face {
  font-family: 'PXLSahel';
  src: url("./fonts/sahel/Sahel-FD.e3337ef6bb61.woff2") format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'PXLSahel';
  src: url("./fonts/sahel/Sahel-Bold-FD.b70fd129e032.woff2") format('woff2');
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}

@font-face {
  font-family: 'PXLVazirmatn';
  src: url("./fonts/vazirmatn/Vazirmatn[wght].f6d31671339d.woff2") format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: 'PXLShabnam';
  src: url("./fonts/shabnam/Shabnam.7d37a560b55d.woff2") format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'PXLShabnam';
  src: url("./fonts/shabnam/Shabnam-Bold.9aee08780102.woff2") format('woff2');
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}

@font-face {
  font-family: 'PXLSamim';
  src: url("./fonts/samim/Samim.ed286aae82ac.woff2") format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'PXLSamim';
  src: url("./fonts/samim/Samim-Bold.56a9c6bf2d81.woff2") format('woff2');
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}

@font-face {
  font-family: 'PXLEstedad';
  src: url("./fonts/estedad/Estedad[wght].a30f0be474a2.woff2") format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

.page-appearance[data-font][data-font="sahel"] { font-family: PXLSahel, Tahoma, sans-serif; }

.page-appearance[data-font][data-font="vazirmatn"] { font-family: PXLVazirmatn, Tahoma, sans-serif; }

.page-appearance[data-font][data-font="shabnam"] { font-family: PXLShabnam, Tahoma, sans-serif; }

.page-appearance[data-font][data-font="samim"] { font-family: PXLSamim, Tahoma, sans-serif; }

.page-appearance[data-font][data-font="estedad"] { font-family: PXLEstedad, Tahoma, sans-serif; }

/* Repeat the attribute to outrank the editor's emulated component selectors.
   The original palette deliberately leaves all existing theme tokens untouched. */

.page-appearance[data-font][data-palette][data-palette="sand"] {
  --bg: #faf6ee;
  --paper: #faf6ee;
  --surface: #fffcf6;
  --ink: #352c23;
  --soft: #635445;
  --muted: #635445;
  --line: #cbbda8;
  --accent: #8a4b25;
  --accent-ink: #ffffff;
  --accent-hover: #8a4b25;
  --focus: #8a4b25;
  --hero: #ecdfc9;
  --wash: #ecdfc9;
  --danger: #a02525;
  --p-bg: #faf6ee;
  --p-surface: #fffcf6;
  --p-ink: #352c23;
  --p-soft: #635445;
  --p-line: #cbbda8;
  --p-accent: #8a4b25;
  --p-wash: #ecdfc9;
  color-scheme: light;
}

.page-appearance[data-font][data-palette][data-palette="forest"] {
  --bg: #eef5ef;
  --paper: #eef5ef;
  --surface: #fbfef9;
  --ink: #1b3528;
  --soft: #425f4f;
  --muted: #425f4f;
  --line: #b8cbbc;
  --accent: #24593f;
  --accent-ink: #ffffff;
  --accent-hover: #24593f;
  --focus: #24593f;
  --hero: #d6e6d7;
  --wash: #d6e6d7;
  --danger: #a02525;
  --p-bg: #eef5ef;
  --p-surface: #fbfef9;
  --p-ink: #1b3528;
  --p-soft: #425f4f;
  --p-line: #b8cbbc;
  --p-accent: #24593f;
  --p-wash: #d6e6d7;
  color-scheme: light;
}

.page-appearance[data-font][data-palette][data-palette="ocean"] {
  --bg: #eef5fc;
  --paper: #eef5fc;
  --surface: #fbfdff;
  --ink: #19324c;
  --soft: #405e78;
  --muted: #405e78;
  --line: #b7cde0;
  --accent: #215b91;
  --accent-ink: #ffffff;
  --accent-hover: #215b91;
  --focus: #215b91;
  --hero: #d5e7f6;
  --wash: #d5e7f6;
  --danger: #a02525;
  --p-bg: #eef5fc;
  --p-surface: #fbfdff;
  --p-ink: #19324c;
  --p-soft: #405e78;
  --p-line: #b7cde0;
  --p-accent: #215b91;
  --p-wash: #d5e7f6;
  color-scheme: light;
}

.page-appearance[data-font][data-palette][data-palette="rose"] {
  --bg: #fcf1f2;
  --paper: #fcf1f2;
  --surface: #fffafb;
  --ink: #47252e;
  --soft: #75505c;
  --muted: #75505c;
  --line: #dfbac4;
  --accent: #983a54;
  --accent-ink: #ffffff;
  --accent-hover: #983a54;
  --focus: #983a54;
  --hero: #f1dce2;
  --wash: #f1dce2;
  --danger: #a02525;
  --p-bg: #fcf1f2;
  --p-surface: #fffafb;
  --p-ink: #47252e;
  --p-soft: #75505c;
  --p-line: #dfbac4;
  --p-accent: #983a54;
  --p-wash: #f1dce2;
  color-scheme: light;
}

.page-appearance[data-font][data-palette][data-palette="plum"] {
  --bg: #f5f0fa;
  --paper: #f5f0fa;
  --surface: #fdfaff;
  --ink: #362542;
  --soft: #654d77;
  --muted: #654d77;
  --line: #cfbcdc;
  --accent: #71438e;
  --accent-ink: #ffffff;
  --accent-hover: #71438e;
  --focus: #71438e;
  --hero: #e7daef;
  --wash: #e7daef;
  --danger: #a02525;
  --p-bg: #f5f0fa;
  --p-surface: #fdfaff;
  --p-ink: #362542;
  --p-soft: #654d77;
  --p-line: #cfbcdc;
  --p-accent: #71438e;
  --p-wash: #e7daef;
  color-scheme: light;
}

.page-appearance[data-font][data-palette][data-palette="slate"] {
  --bg: #f1f4f6;
  --paper: #f1f4f6;
  --surface: #fcfdfe;
  --ink: #293843;
  --soft: #536570;
  --muted: #536570;
  --line: #c0ccd3;
  --accent: #3a5a70;
  --accent-ink: #ffffff;
  --accent-hover: #3a5a70;
  --focus: #3a5a70;
  --hero: #dce5ea;
  --wash: #dce5ea;
  --danger: #a02525;
  --p-bg: #f1f4f6;
  --p-surface: #fcfdfe;
  --p-ink: #293843;
  --p-soft: #536570;
  --p-line: #c0ccd3;
  --p-accent: #3a5a70;
  --p-wash: #dce5ea;
  color-scheme: light;
}

.page-appearance[data-font][data-palette][data-palette="night"] {
  --bg: #141c28;
  --paper: #141c28;
  --surface: #202c3c;
  --ink: #f1f5fb;
  --soft: #c1ccdc;
  --muted: #c1ccdc;
  --line: #607087;
  --accent: #adcfff;
  --accent-ink: #18283e;
  --accent-hover: #adcfff;
  --focus: #adcfff;
  --hero: #2b3c53;
  --wash: #2b3c53;
  --danger: #ffb4ad;
  --p-bg: #141c28;
  --p-surface: #202c3c;
  --p-ink: #f1f5fb;
  --p-soft: #c1ccdc;
  --p-line: #607087;
  --p-accent: #adcfff;
  --p-wash: #2b3c53;
  color-scheme: dark;
}

/* Controls inherit the chosen font, including the checkout form. */
.page-appearance button, .page-appearance input, .page-appearance select, .page-appearance textarea { font-family: inherit; }
.page-appearance[data-palette]:not([data-palette="original"]) .button.primary,
.page-appearance[data-palette]:not([data-palette="original"]) .menu-categories button[aria-pressed="true"],
.page-appearance[data-palette]:not([data-palette="original"]) .preview-hero aside .primary,
.page-appearance[data-palette]:not([data-palette="original"]) .preview-cta > span.primary,
.page-appearance[data-palette]:not([data-palette="original"]) .preview-brand i {
  color: var(--accent-ink);
}
/* Jewelry uses a photograph under a light overlay. Match both overlay and text
   to the selected palette; keep the other photographic layouts' white text. */
.page-appearance.layout-jewelry[data-palette]:not([data-palette="original"]) .landing-hero::after {
  background: linear-gradient(270deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 90%, transparent) 55%, color-mix(in srgb, var(--bg) 45%, transparent) 100%);
}
.page-appearance.layout-jewelry[data-palette]:not([data-palette="original"]) .hero-copy { color: var(--ink); }
.page-appearance.layout-jewelry[data-palette]:not([data-palette="original"]) .hero-copy p { color: var(--soft); }
.page-appearance.layout-jewelry[data-palette]:not([data-palette="original"]) .hero-copy .eyebrow { color: var(--accent); }
.page-appearance.layout-jewelry[data-palette]:not([data-palette="original"]) .hero-actions .secondary {
  background: var(--surface); color: var(--ink); border-color: var(--line);
}
.page-appearance.layout-outdoors[data-palette]:not([data-palette="original"]) .landing-brand span {
  background: var(--accent); color: var(--accent-ink);
}
/* Body backgrounds remain printable in the shop. */
@media print {
  body.page-appearance[data-palette] { --paper: #fff; --ink: #222; --muted: #444; }
}


/* A white glow weakens the night palette's secondary text contrast. */
.page-appearance[data-palette="night"] .menu-hero { background: var(--hero); }

/* Shared published product controls inherit the chosen page palette. */
.product-filters { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin:24px 0; padding:16px; border:1px solid currentColor; border-radius:12px; }
.product-filters label { display:flex; flex-direction:column; gap:6px; max-width:100%; font-size:14px; }
.product-filters input, .product-filters select, .product-filters button { font:inherit; min-height:44px; max-width:100%; padding:8px 12px; border:1px solid currentColor; border-radius:8px; color:inherit; background:transparent; }
.product-filters input[type=checkbox] { min-height:20px; }
@media(max-width:600px) { .product-filters label { flex:1 1 160px; } .product-filters button { width:100%; } }
