/* Text visibility: size and contrast fixes. Loaded last. Owned by the font visibility work.
   Targets: body 16 px, secondary 14 px, labels 13 px (location labels stay 13 px by owner decision).
   Contrast 4.5:1, or 3:1 at 24 px and up. Devanagari gets about 1 px more and more line height.
   The app sets <html lang> to en, np or hi, so Devanagari rules below are scoped with it. */

/* ---------- Section titles: same glowing white style, tighter amber edge so letters stand off white ---------- */
:root {
  --t-title-glow: 0 1px 1px rgba(92, 52, 0, .9), 0 0 3px rgba(140, 92, 12, 1), 0 0 8px rgba(170, 118, 30, 1), 0 0 16px rgba(184, 132, 47, 1),
    0 0 35px rgba(184, 132, 47, .9), 0 0 65px rgba(184, 132, 47, .75), 0 0 100px rgba(244, 210, 122, .65), 0 2px 6px rgba(80, 40, 0, .45);
  --t-photo-shadow: 0 1px 3px rgba(0, 0, 0, .85), 0 0 10px rgba(0, 0, 0, .5);
}
#root .pg-title-main, #root .sy-h1-main, #root .ts-section-h2-main, #root .dd-title-wrapper h2, #root .ex-title-main, #root .bl-title-main,
#root .glp-title-main, #root .ct-title, #root .ts-title-white, #root .ts-title-gold, #root .sm-title1, #root .sm-title2,
#root .ab-sec-title, #root .ab-values-header-title, #root .ab-guide-why-title, #root .ts-section-h2:not(:has(.ts-section-h2-main)), #root .sec-title, #root .deity-name, #root .glp-reels-title {
  text-shadow: var(--t-title-glow) !important;
}

/* ---------- Text over photos: own shadow, solid colour. Also covers the moment before a photo has loaded ---------- */
#root .sy-title, #root .sy-loc, #root .sy-loc span, #root .pg-sc-name, #root .pg-sc-loc, #root .glp-tile-title, #root .glp-tile-sub,
#root .ab-guide-nameplate-name, #root .ab-guide-nameplate-title, #root .dd-card-name, #root .ts-type-name,
#root .sm-img-label, #root .sm-sub-img-label, #root .ab-guide-photo-sm-label, #root .ab-mantra-translation {
  text-shadow: var(--t-photo-shadow) !important;
}
#root .h1-word, #root .h1-ch, #root .ab-mantra-devanagari, #root .ab-mantra-devanagari.latin {
  text-shadow: 0 1px 3px rgba(0, 0, 0, .75), 0 2px 18px rgba(0, 0, 0, .6) !important;
}
#root .hero-loc { color: #fff !important; -webkit-text-fill-color: #fff !important; opacity: 1 !important; text-shadow: var(--t-photo-shadow) !important; }
#root .glp-tile-sub { color: rgba(255, 255, 255, .95) !important; }
#root .pg-sc-loc, #root .sy-loc, #root .sy-loc span { color: rgba(255, 255, 255, .95) !important; }
#root .ab-guide-nameplate-title { color: #fff !important; font-weight: 400 !important; }
#root .sm-img-label, #root .sm-sub-img-label, #root .ab-guide-photo-sm-label { color: #fff !important; }

/* Home gallery cards shrink in the live build at tablet and up */
#root .pg-sc-name { font-size: 15px !important; }
#root .pg-sc-loc { font-size: 13px !important; }

/* Temple page bar: over the photo, then a solid bar once scrolled */
#root .tn:not(.sc) .tn-back { color: #fff !important; text-shadow: var(--t-photo-shadow); }
#root .tn.sc .tn-back { color: #5d5146 !important; text-shadow: none; }
#root .tn-lang:not(.on) { color: #6b4708 !important; }

/* ---------- Pale gold and pale grey on white ---------- */
#root .nb-lk.nb-on, #root .bl-lang-tab.active, #root .lg-tab.on { color: #7a5608 !important; -webkit-text-fill-color: #7a5608 !important; }
#root .lg-tab:not(.on) { color: #5d5146 !important; }
#root .deity-nodesc-txt { color: #5d5146 !important; opacity: 1 !important; }
#root .ab-tl-desc { font-size: 16px !important; color: #6b4a0a !important; }
#root .bl-empty-sym { color: #b8842f !important; }
#root .footer-txt { font-size: 15px !important; font-weight: 500 !important; color: #5d5146 !important; opacity: 1 !important; }

/* Thin and faded text on the dark About panel */
#root .sm-quote, #root .sm-quote p { font-weight: 400 !important; color: #f0dfb8 !important; }

/* Blog cards, when the live site returns posts */
#root .bl-card-cta { font-size: 13px !important; color: #7a5608 !important; }
#root .bl-card-meta-item, #root .bl-card-author-name { font-size: 13px !important; color: #5d5146 !important; }
#root .bl-card-lang { font-size: 13px !important; }
#root .bl-hgi-cap { font-size: 13px !important; text-shadow: var(--t-photo-shadow) !important; }

/* Placeholders */
#root input::placeholder, #root textarea::placeholder { color: #7a6c5e !important; opacity: 1 !important; }
#root [class^="ft-"] input::placeholder { color: rgba(255, 255, 255, .78) !important; }


/* ---------- Footer: exact live design, only the text that was too small or too pale ---------- */
/* The tagline was a pale gold gradient on white; same gold, deeper */
#root .ft-tagline { background: none !important; color: #7a5608 !important; -webkit-text-fill-color: #7a5608 !important; filter: none !important; }
#root .ft-col-hd, #root .ft-nl-eyebrow { font-size: 13px !important; }
#root .ft-nl-eyebrow { color: #f4d27a !important; }
#root .ft-nl-btn { font-size: 13px !important; }
#root .ft-nl-sub { color: rgba(255, 255, 255, .86) !important; }
#root .ft-follow-lbl { font-size: 13px !important; color: #7a5608 !important; }
#root .ft-copy { font-size: 14px !important; color: #4a3a22 !important; }
#root .ft-copy strong { color: #7a5608 !important; }
#root .ft-powered-text { font-size: 13px !important; color: #7a5608 !important; opacity: 1 !important; }

/* ---------- Devanagari: room for the marks above the line ---------- */
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root :is(h1, h2, h3, h4, h5, h6, .sy-h1-main, .pg-title-main, .ts-section-h2-main, .ex-title-main, .bl-title-main, .glp-title-main,
  .ts-title-white, .ts-title-gold, .sm-title1, .sm-title2, .ct-title, .h1-word, .h1-ch, .hero-title, .glp-hero-h1, .ab-mantra-devanagari, .ab-sec-title, .ab-values-header-title,
  .ab-guide-why-title, .sec-title, .deity-name, .glp-reels-title, .ts-section-h2, .ts-intro-h2, .ts-pkg-title, .ts-title-main) {
  line-height: 1.45 !important;
}
/* Boxes that clip their text: ellipsis, line clamp, or a tab and chip with tight height */
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root :is(.dd-card-name, .sy-title, .sy-sc-name, .pg-sc-name, .pg-sc-loc, .sy-loc, .sy-sc-loc, .lc-name, .lc-loc, .lc-deity, .gc-name, .gc-loc, .gc-deity,
  .rel-name, .rel-loc, .glp-tile-title, .glp-tile-sub, .ts-type-name, .sm-img-label, .sm-sub-img-label, .ab-guide-photo-sm-label, .ab-guide-nameplate-name, .ab-guide-nameplate-title,
  .sy-chip, .ts-tab, .ts-tag, .bl-lang-tab, .lg-tab, .nb-lk, .nb-dr-lk, .ab-guide-tag, .meta-lbl, .meta-val, .tn-back, .tn-back-inner, .tn-lang, .hero-loc, .ft-col-hd, .ft-nl-eyebrow, .ft-follow-lbl) {
  line-height: 1.5 !important;
}
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root :is(.dd-card-name, .sy-title, .sy-sc-name, .pg-sc-name, .pg-sc-loc, .sy-loc, .sy-sc-loc, .lc-name, .lc-loc, .gc-name, .gc-loc,
  .rel-name, .rel-loc, .glp-tile-title, .glp-tile-sub, .ts-type-name) {
  padding-top: .12em !important;
}
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root .bl-lang-tab { overflow: visible !important; }
/* Buttons: text sits in the middle of a fixed height, so only the line height changes */
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root :is(button, a[class*="btn"], a[class*="-cta"], .hero-btn-primary, .ts-btn-primary, .ts-btn-secondary, .ts-btn-link, .pg-cta, .ts-cta-btn, .ts-hero-cta, .ct-form-submit, .lg-submit) {
  line-height: 1.5 !important;
}

/* ---------- Devanagari: a size step up on body, secondary text and labels ---------- */
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root p:not(.ft-wrap p), html:is([lang="np"], [lang="hi"], [lang="ne"]) #root .ab-vp-desc,
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root .ab-tl-desc, html:is([lang="np"], [lang="hi"], [lang="ne"]) #root .ft-nl-sub { font-size: 17px !important; line-height: 1.65 !important; }
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root :is(.sy-chip, .ts-tag, .ab-guide-tag, .footer-txt, .ft-copy) { font-size: 15px !important; }
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root :is(.sy-loc, .sy-loc span, .sy-sc-loc, .lc-loc, .gc-loc, .rel-loc, .pg-sc-loc, .meta-lbl, .lc-deity, .gc-deity, .ft-col-hd, .ft-nl-eyebrow, .ft-powered-text, .ft-follow-lbl) { font-size: 14px !important; }
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root :is(.ft-nl-btn, .bl-card-cta, .bl-card-meta-item, .bl-card-author-name, .bl-card-lang, .bl-hgi-cap) { font-size: 14px !important; }
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root .deity-alts-lbl { font-size: 15px !important; opacity: 1 !important; line-height: 1.5 !important; }
/* The language switch in the nav */
html:is([lang="np"], [lang="hi"], [lang="ne"]) #root button.relative span { line-height: 1.5 !important; }