/*
 * Localsewa v32.9.4 — Typographic Hierarchy + shadcn/typeset refinement
 * Primary UI font: Geist. Devanagari fallback: Noto Sans Devanagari.
 * Rich/plain HTML rhythm follows the shadcn/typeset model: size, leading, flow.
 */

:root,
:host {
  --font-sans: "Geist", "Noto Sans Devanagari", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-heading: var(--font-sans);
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  /* Shared Localsewa hierarchy: intentionally wider separation between levels. */
  --ls-type-display: clamp(2.375rem, 2.05rem + 1.35vw, 3.25rem);
  --ls-type-page-title: clamp(1.875rem, 1.68rem + .72vw, 2.5rem);
  --ls-type-section-title: clamp(1.25rem, 1.17rem + .3vw, 1.5rem);
  --ls-type-subsection-title: clamp(1.0625rem, 1.02rem + .18vw, 1.25rem);
  --ls-type-card-title: clamp(1rem, .97rem + .12vw, 1.125rem);
  --ls-type-body: .9375rem;
  --ls-type-body-sm: .875rem;
  --ls-type-label: .75rem;
  --ls-type-caption: .6875rem;
  --ls-type-micro: .625rem;
  --ls-leading-body: 1.62;
  --ls-leading-compact: 1.42;

  /* Re-point generated Tailwind utilities to a clearer, shadcn-like hierarchy. */
  --text-xs: .75rem;
  --text-xs--line-height: 1.45;
  --text-sm: .875rem;
  --text-sm--line-height: 1.5;
  --text-base: .9375rem;
  --text-base--line-height: 1.62;
  --text-lg: 1.125rem;
  --text-lg--line-height: 1.45;
  --text-xl: 1.25rem;
  --text-xl--line-height: 1.35;
  --text-2xl: 1.5rem;
  --text-2xl--line-height: 1.28;
  --text-3xl: 1.875rem;
  --text-3xl--line-height: 1.18;
  --text-4xl: 2.25rem;
  --text-4xl--line-height: 1.1;
  --text-5xl: 3rem;
  --text-5xl--line-height: 1.04;

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 650;
  --font-weight-extrabold: 700;
}

html,
body,
button,
input,
select,
textarea,
optgroup {
  font-family: var(--font-sans) !important;
  font-synthesis-weight: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-size: var(--ls-type-body);
  line-height: var(--ls-leading-body);
}

code,
kbd,
samp,
pre {
  font-family: var(--font-mono) !important;
  font-variant-ligatures: none;
}

/* Semantic heading rhythm. Existing colors/layout remain component-owned. */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading) !important;
  text-wrap: balance;
  font-synthesis-weight: none;
}

h1 {
  font-size: var(--ls-type-page-title) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  letter-spacing: -.04em !important;
}

h2 {
  font-size: var(--ls-type-section-title) !important;
  line-height: 1.2 !important;
  font-weight: 650 !important;
  letter-spacing: -.026em !important;
}

h3 {
  font-size: var(--ls-type-card-title) !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  letter-spacing: -.016em !important;
}

h4 {
  font-size: var(--ls-type-body) !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
}

h5,
h6 {
  font-size: var(--ls-type-body-sm) !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

input,
select,
textarea {
  font-size: .875rem;
  line-height: 1.5;
}

::placeholder {
  font-weight: 400;
}

/* Reusable source-level roles for the editable React/Vite project. */
.ls-type-display { font: 700 var(--ls-type-display)/1.04 var(--font-heading); letter-spacing: -.045em; }
.ls-type-page-title { font: 700 var(--ls-type-page-title)/1.08 var(--font-heading); letter-spacing: -.04em; }
.ls-type-section-title { font: 650 var(--ls-type-section-title)/1.2 var(--font-heading); letter-spacing: -.026em; }
.ls-type-subsection-title { font: 600 var(--ls-type-subsection-title)/1.28 var(--font-heading); letter-spacing: -.018em; }
.ls-type-card-title { font: 600 var(--ls-type-card-title)/1.3 var(--font-heading); letter-spacing: -.016em; }
.ls-type-body { font: 400 var(--ls-type-body)/var(--ls-leading-body) var(--font-sans); }
.ls-type-body-sm { font: 400 var(--ls-type-body-sm)/1.55 var(--font-sans); }
.ls-type-label { font: 600 var(--ls-type-label)/1.4 var(--font-sans); letter-spacing: .01em; }
.ls-type-caption { font: 500 var(--ls-type-caption)/1.4 var(--font-sans); }
.ls-type-overline { font: 650 var(--ls-type-micro)/1.35 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; }
.ls-type-secondary { color: #526158; }
.ls-type-muted { color: #789487; }

/* Compatibility aliases: old source roles resolve to the v32.9.4 hierarchy. */
.type-display { font: 700 var(--ls-type-display)/1.04 var(--font-heading); letter-spacing: -.045em; }
.type-page-title { font: 700 var(--ls-type-page-title)/1.08 var(--font-heading); letter-spacing: -.04em; }
.type-section-title { font: 650 var(--ls-type-section-title)/1.2 var(--font-heading); letter-spacing: -.026em; }
.type-card-title { font: 600 var(--ls-type-card-title)/1.3 var(--font-heading); letter-spacing: -.016em; }
.type-caption { font: 500 var(--ls-type-caption)/1.4 var(--font-sans); }

/*
 * shadcn/typeset-compatible rhythm.
 * A typeset is driven by size, leading and flow. The app may create multiple presets.
 */
.typeset,
article.max-w-4xl > .space-y-8 > section {
  --typeset-font-body: var(--font-sans);
  --typeset-font-heading: var(--font-heading);
  --typeset-font-mono: var(--font-mono);
  --typeset-size: 1rem;
  --typeset-leading: 1.75;
  --typeset-flow: 1.45em;
  font-family: var(--typeset-font-body);
  font-size: var(--typeset-size);
  line-height: var(--typeset-leading);
  color: #526158;
}

.typeset-docs {
  --typeset-size: 1rem;
  --typeset-leading: 1.75;
  --typeset-flow: 1.55em;
}

.typeset-compact {
  --typeset-size: .875rem;
  --typeset-leading: 1.6;
  --typeset-flow: 1em;
}

.typeset-chat {
  --typeset-size: .875rem;
  --typeset-leading: 1.6;
  --typeset-flow: 1em;
}

.typeset :where(h1,h2,h3,h4,h5,h6),
article.max-w-4xl > .space-y-8 > section :where(h1,h2,h3,h4,h5,h6) {
  font-family: var(--typeset-font-heading) !important;
  color: #10231A;
  font-weight: 650 !important;
  text-wrap: balance;
}

.typeset :where(h1),
article.max-w-4xl > .space-y-8 > section :where(h1) { font-size: 2.25em !important; line-height: 1.08 !important; letter-spacing: -.04em !important; }
.typeset :where(h2),
article.max-w-4xl > .space-y-8 > section :where(h2) { font-size: 1.55em !important; line-height: 1.18 !important; letter-spacing: -.028em !important; }
.typeset :where(h3),
article.max-w-4xl > .space-y-8 > section :where(h3) { font-size: 1.22em !important; line-height: 1.28 !important; letter-spacing: -.016em !important; }

.typeset :where(p,ul,ol,blockquote,pre,table),
article.max-w-4xl > .space-y-8 > section :where(p,ul,ol,blockquote,pre,table) {
  margin: 0;
}

.typeset > :where(* + *),
article.max-w-4xl > .space-y-8 > section > :where(* + *) {
  margin-block-start: var(--typeset-flow);
}

.typeset > :where(h2,h3,h4),
article.max-w-4xl > .space-y-8 > section > :where(h2,h3,h4) {
  margin-block-start: calc(var(--typeset-flow) * 1.45);
}

.typeset > :where(h2,h3,h4) + :where(p,ul,ol,blockquote,pre,table),
article.max-w-4xl > .space-y-8 > section > :where(h2,h3,h4) + :where(p,ul,ol,blockquote,pre,table) {
  margin-block-start: .65em;
}

.typeset :where(p),
article.max-w-4xl > .space-y-8 > section :where(p) {
  font-size: var(--typeset-size) !important;
  line-height: var(--typeset-leading) !important;
  color: #526158;
}

.typeset :where(ul,ol),
article.max-w-4xl > .space-y-8 > section :where(ul,ol) {
  padding-inline-start: 1.45em;
  font-size: var(--typeset-size) !important;
  line-height: var(--typeset-leading) !important;
  color: #64748B;
}
.typeset :where(li + li),
article.max-w-4xl > .space-y-8 > section :where(li + li) { margin-block-start: .45em; }
.typeset :where(ul) { list-style: disc; }
.typeset :where(ol) { list-style: decimal; }

.typeset :where(a),
article.max-w-4xl > .space-y-8 > section :where(a) {
  color: #15803D;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #BBF7D0;
  text-underline-offset: .18em;
}

.typeset :where(strong),
article.max-w-4xl > .space-y-8 > section :where(strong) { color: #1F382B; font-weight: 650; }

.typeset :where(blockquote),
article.max-w-4xl > .space-y-8 > section :where(blockquote) {
  border-inline-start: 3px solid #86EFAC;
  padding-inline-start: 1em;
  color: #526158;
}

.typeset :where(code),
article.max-w-4xl > .space-y-8 > section :where(code) {
  font-family: var(--typeset-font-mono) !important;
  font-size: .9em;
  border-radius: .375rem;
  background: #F1F5F9;
  padding: .12em .35em;
  color: #1E293B;
}

.typeset :where(pre),
article.max-w-4xl > .space-y-8 > section :where(pre) {
  overflow-x: auto;
  border: 1px solid #E2E8F0;
  border-radius: .875rem;
  background: #0F172A;
  padding: 1em 1.1em;
  color: #E2E8F0;
}
.typeset :where(pre code),
article.max-w-4xl > .space-y-8 > section :where(pre code) { background: transparent; padding: 0; color: inherit; }

.typeset :where(hr),
article.max-w-4xl > .space-y-8 > section :where(hr) { border: 0; border-top: 1px solid #E5EDE8; }

.typeset :where(table),
article.max-w-4xl > .space-y-8 > section :where(table) {
  width: 100%;
  border-collapse: collapse;
  font-size: .9em;
}
.typeset :where(th,td),
article.max-w-4xl > .space-y-8 > section :where(th,td) { border-bottom: 1px solid #E5EDE8; padding: .7em .8em; text-align: start; vertical-align: top; }
.typeset :where(th),
article.max-w-4xl > .space-y-8 > section :where(th) { color: #1F382B; font-weight: 650; }
.typeset-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.not-typeset,
[data-not-typeset] { font: inherit; color: inherit; }

/* Call UI and other legacy isolated surfaces must inherit the same family. */
.ls-voice-backdrop,
.ls-booking-chat-overlay,
.ls-booking-chat-panel,
.ls-customer-sidebar,
.ls-provider-sidebar {
  font-family: var(--font-sans) !important;
}

@media (max-width: 639.98px) {
  .typeset,
  article.max-w-4xl > .space-y-8 > section {
    --typeset-size: .9375rem;
    --typeset-leading: 1.72;
  }
}
