/* SENTI typography policy: Jost Light for display copy and textual controls. */
:root {
  --senti-title-font: "Jost", system-ui, sans-serif;
  --senti-title-weight: 300;
}

body :is(h1, h2, h3, h4, h5, h6),
body :is(.senti-title, .senti-h1, .senti-h2, [class*="__title"], [class*="-title"]),
body .sf-op__title,
body .sf-op-result-hero .sf-op__title {
  font-family: var(--senti-title-font) !important;
  font-weight: var(--senti-title-weight) !important;
}

body :is(button, input[type="button"], input[type="submit"], input[type="reset"]),
body :is(a, span)[class*="btn"],
body :is(a, span)[class*="button"],
body [role="button"] {
  font-family: var(--senti-title-font) !important;
  font-weight: var(--senti-title-weight) !important;
}

/* Display labels that are semantically <strong>, not headings. */
body .sf-community-map-accordion__trigger strong,
body .sf-community-member-card__name-row :is(strong, h2, h3),
body .sf-community-member-card__name,
body .sf-collection-stat :is(strong, b),
body .sf-collection-stat__family-copy :is(strong, b),
body .sf-family-analysis__heading h2,
body .stx-thread__heading h2,
body .scm-discovery-card :is(h2, h3, strong) {
  font-family: var(--senti-title-font) !important;
  font-weight: var(--senti-title-weight) !important;
}

/* Collection summary eyebrows share one metric across static tiles and the family-match button. */
body #sentiCollectionPage .sf-collection-stat > div > span:first-child,
body #sentiCollectionPage .sf-collection-stat__family-copy > span:first-child {
  color: #81786f;
  font-family: var(--sf-font-sans, "Inter", system-ui, sans-serif);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .14em;
  line-height: 1.15;
  text-transform: uppercase;
}

/* Recommendation mode section headings. */
body #cer-root .sf-reco-mode-copy strong {
  font-family: var(--senti-title-font) !important;
  font-weight: 300 !important;
}

/* Perfume names need a little more body than page titles, without looking bold. */
body .sf-collection-card .sf-collection-card__name,
body .senti-collection-name.sf-collection-card__name {
  font-family: var(--senti-title-font) !important;
  font-weight: 400 !important;
}

/* Brand chips are controls, not display typography. */
body #sentiCatalogPage .senti-brandchips .senti-chip {
  font-family: var(--sf-font-sans, "Inter", system-ui, sans-serif) !important;
  font-weight: 400 !important;
}

/* Community compatibility: quiet footer score, clearer light header score. */
body .sf-community-member-card .sf-scentmate-card__bottom strong {
  font-family: var(--senti-title-font) !important;
  font-weight: 300 !important;
}

body .sf-community-member-card .sf-scentmate-card__score.sf-score-ring--mate {
  width: 44px !important;
  height: 44px !important;
  top: 19px !important;
  right: 19px !important;
}

body .sf-community-member-card .sf-scentmate-card__score.sf-score-ring--mate::before {
  inset: 2.5px !important;
}

body .sf-community-member-card .sf-scentmate-card__score.sf-score-ring--mate span {
  font-family: var(--senti-title-font) !important;
  font-size: 14px !important;
  font-weight: 300 !important;
}

/* Shared user/admin dashboard display typography. Repeated page class raises
   specificity above legacy dashboard rules that hard-code Georgia. */
body .sf-dashboard-page.sf-dashboard-page :is(h1, h2, h3, h4, h5, h6),
body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-identity__copy > strong,
body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-profile-module__head h2,
body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-fragrance-context__head h2,
body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-recommendations__intro h2,
body .sf-dashboard-page.sf-dashboard-page .sf-personality-portrait h2,
body .sf-dashboard-page.sf-dashboard-page .sf-admin-kpi strong,
body .sf-dashboard-page.sf-dashboard-page .sf-admin-ai-grid strong {
  font-family: var(--senti-title-font) !important;
  font-weight: 300 !important;
}

body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-recommendation-card__copy strong {
  font-family: var(--senti-title-font) !important;
  font-weight: 400 !important;
}

body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-recommendation-card__reason {
  font-family: var(--sf-font-sans, "Inter", system-ui, sans-serif) !important;
  font-weight: 400 !important;
}

body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-card-eyebrow {
  display: block;
  width: 100%;
  margin: 0 0 8px;
  color: #a16f45 !important;
  font-family: var(--sf-font-sans, "Inter", system-ui, sans-serif) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .14em;
  line-height: 1.35;
  text-align: center;
  text-transform: uppercase;
}

body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-profile-module__head h2,
body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-profile-module--collection .sf-family-analysis__heading h2 {
  margin: 0 !important;
  font-family: var(--senti-title-font) !important;
  font-weight: 300 !important;
}

body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-profile-module__head,
body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-profile-module--collection .sf-family-analysis__heading {
  min-height: 78px !important;
}

body .sf-dashboard-page.sf-dashboard-page .sf-family-wheel__score strong {
  font-family: var(--senti-title-font) !important;
  font-weight: 300 !important;
}

/* Navigation stays light and readable; active state is expressed by its
   underline/card treatment instead of a heavier font weight. */
body .sf-nav-root :is(.sf-nav-link, .sf-nav-more-btn, .sf-nav-more-link),
body .sf-nav-root :is(.sf-nav-link, .sf-nav-more-btn, .sf-nav-more-link).is-active,
body .sf-nav-root :is(.sf-nav-drawer__link, .sf-nav-drawer__recommendation),
body .sf-nav-root :is(.sf-nav-logout-btn, .sf-nav-drawer__logout) {
  font-family: var(--senti-title-font) !important;
  font-weight: 400 !important;
}

body .sf-nav-root .sf-nav-drawer__recommendation strong,
body .sf-nav-root .sf-nav-user__name {
  font-family: var(--senti-title-font) !important;
  font-weight: 400 !important;
}

/* One perfume identity hierarchy across collection, catalog and dashboards. */
body :is(
  .sf-collection-card__titlecopy .senti-collection-brand,
  .senti-catalog-titleblock .senti-collection-brand,
  .sf-dashboard-recommendation-card__copy .senti-collection-brand,
  .sf-perfume-card--collection .sf-perfume-card__brand
) {
  color: #786f65 !important;
  font-family: var(--sf-font-sans, "Inter", system-ui, sans-serif) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

body :is(
  .sf-collection-card__titlecopy .senti-collection-name,
  .senti-catalog-titleblock .senti-collection-name,
  .sf-dashboard-recommendation-card__copy .senti-collection-name,
  .sf-perfume-card--collection h3
) {
  color: #0b0b0b !important;
  font-family: var(--senti-title-font) !important;
  font-size: clamp(22px, 1.7vw, 27px) !important;
  font-weight: 400 !important;
  letter-spacing: -.025em !important;
  line-height: 1.08 !important;
}

body #sentiCatalogPage .senti-catalog-titleblock {
  text-align: center !important;
}

body .sf-dashboard-recommendation-card__copy,
body .sf-dashboard-page .sf-perfume-card--collection .sf-perfume-card__body {
  text-align: left !important;
}

body .sf-dashboard-page .sf-perfume-card--collection .sf-perfume-card__footer {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  margin-top: auto;
}

body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-recommendation-card__copy .senti-collection-brand,
body .sf-dashboard-page.sf-dashboard-page .sf-perfume-card--collection .sf-perfume-card__brand {
  color: #786f65 !important;
  font-family: var(--sf-font-sans, "Inter", system-ui, sans-serif) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

body .sf-dashboard-page.sf-dashboard-page .sf-dashboard-recommendation-card__copy .senti-collection-name,
body .sf-dashboard-page.sf-dashboard-page .sf-perfume-card--collection h3 {
  color: #0b0b0b !important;
  font-family: var(--senti-title-font) !important;
  font-size: clamp(22px, 1.7vw, 27px) !important;
  font-weight: 400 !important;
  letter-spacing: -.025em !important;
  line-height: 1.08 !important;
}
/* Personal collection matching: distinguish the generated personal reading
   from the generic catalogue description without changing the card layout. */
.sf-collection-card__reason.is-personal-fit {
  color: #3f3a34 !important;
}

.sf-collection-card__reason-eyebrow {
  display: block;
  margin-bottom: 7px;
  color: var(--sf-gold, #aa762d);
  font-family: var(--sf-font-sans, "Inter", system-ui, sans-serif);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .18em;
  line-height: 1.2;
  text-transform: uppercase;
}

/* A personal AI interpretation is editorial content, not a card teaser. */
#sentiCollectionPage .sf-collection-list.is-card-view .sf-collection-card .sf-collection-card__reason.is-personal-fit {
  display: block !important;
  overflow: visible !important;
  -webkit-box-orient: initial !important;
  -webkit-line-clamp: unset !important;
}

body.sf-collection-is-evaluating {
  overflow: hidden;
}

.sf-collection-evaluation-overlay[hidden] {
  display: none !important;
}

.sf-collection-evaluation-overlay {
  position: fixed;
  z-index: 10050;
  inset: 0;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  min-height: 100dvh;
  padding:
    max(20px, env(safe-area-inset-top))
    max(18px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(18px, env(safe-area-inset-left));
  overflow-y: auto;
}

.sf-collection-evaluation-overlay__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(255, 253, 249, .78);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.sf-collection-evaluation-overlay__panel {
  position: relative;
  width: min(440px, 100%);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: center;
  box-shadow: none;
}

.sf-collection-evaluation-overlay__panel .senti-loader__orb {
  display: block;
  margin: 0 auto 24px;
}

.sf-collection-evaluation-overlay__panel h2 {
  margin: 0;
  color: #111827;
  font-family: "Jost", Georgia, serif;
  font-size: clamp(27px, 5vw, 38px);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -.035em;
}

.sf-collection-evaluation-overlay__panel p {
  max-width: 340px;
  margin: 14px auto 0;
  color: rgba(17, 24, 39, .66);
  font-size: 14px;
  line-height: 1.65;
}

.sf-collection-evaluation-overlay__progress {
  display: block;
  overflow: hidden;
  width: min(260px, 72vw);
  height: 2px;
  margin: 26px auto 0;
  border-radius: 999px;
  background: rgba(17, 24, 39, .08);
}

.sf-collection-evaluation-overlay__progress i {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent 0 30%, #b7d8ee 46%, #efbdd6 54%, transparent 70%);
  animation: sfCollectionEvaluationProgress 1.55s ease-in-out infinite;
}

@keyframes sfCollectionEvaluationProgress {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

@media (max-width: 680px) {
  .sf-collection-evaluation-overlay__panel .senti-loader__orb {
    width: 72px;
    height: 72px;
    margin-bottom: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sf-collection-evaluation-overlay__progress i {
    transform: none;
    animation: none;
  }
}
