/* C01-C25: the approved token catalogue applied to the member flows. */
html{--md-ref-typeface-plain:Noto,NotoHindi,sans-serif;--md-ref-typeface-brand:Noto,NotoHindi,sans-serif}
html[lang=hi]{--md-ref-typeface-plain:NotoHindi,Noto,sans-serif;--md-ref-typeface-brand:NotoHindi,Noto,sans-serif}
.phone,dialog{--md-sys-color-primary:var(--primary);--md-sys-color-on-primary:var(--onPrimary);--md-sys-color-primary-container:var(--primaryContainer);--md-sys-color-on-primary-container:var(--onPrimaryContainer);--md-sys-color-surface:var(--surface);--md-sys-color-on-surface:var(--onSurface);--md-sys-color-on-surface-variant:var(--onSurfaceVariant);--md-sys-color-outline:var(--outline);--md-sys-color-outline-variant:var(--outlineVariant);--md-sys-color-error:var(--error);--md-sys-color-on-error:#fff;--md-sys-color-secondary-container:var(--primaryContainer);--md-sys-color-on-secondary-container:var(--onPrimaryContainer);--md-sys-color-surface-container-high:var(--surfaceVariant);--md-sys-typescale-body-large-font:Noto,NotoHindi,sans-serif;--md-sys-typescale-label-large-font:Noto,NotoHindi,sans-serif;--md-sys-typescale-body-large-size:1rem;--md-sys-typescale-body-large-line-height:1.625rem;--md-sys-typescale-label-large-size:1rem;--md-sys-typescale-label-large-line-height:1.5rem}
.material-source{display:none!important}
md-filled-button,md-filled-tonal-button,md-outlined-button,md-text-button{max-width:100%;min-width:0;min-height:56px;--md-filled-button-container-shape:12px;--md-filled-tonal-button-container-shape:12px;--md-outlined-button-container-shape:12px;--md-text-button-container-shape:12px;--md-filled-button-container-height:auto;--md-filled-tonal-button-container-height:auto;--md-outlined-button-container-height:auto;--md-text-button-container-height:auto;--md-filled-button-label-text-size:1rem;--md-filled-tonal-button-label-text-size:1rem;--md-outlined-button-label-text-size:1rem;--md-text-button-label-text-size:1rem}
md-filled-button.btn,md-filled-tonal-button.btn,md-outlined-button.btn,md-text-button.btn{padding:0;border:0;box-shadow:none;background:transparent;display:inline-flex;align-items:stretch;justify-content:center}
.material-action-label{display:block;white-space:normal;overflow-wrap:normal;line-height:1.5;padding-block:16px}
md-icon-button.btn{display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;box-shadow:none;min-width:48px;width:48px;min-height:48px;height:48px;background:transparent;--md-icon-button-icon-color:currentColor}
md-icon-button .badge{position:absolute;right:0;top:0;pointer-events:none}
md-icon-button.sheet-close{position:absolute;top:8px;right:8px}
.topbar{min-height:64px}.topbar .who{max-width:none}.topbar .avatar{width:40px;height:40px;flex-basis:40px}
nav .btn{font-size:.75rem;line-height:1.5;min-height:64px;color:var(--onSurfaceVariant)}
nav .btn[aria-current=page]{color:var(--primary)}
.material-tabs{display:flex;width:100%;max-width:100%;overflow-x:auto;margin:0 0 16px;--md-primary-tab-container-height:64px;--md-primary-tab-label-text-size:.875rem;--md-primary-tab-active-indicator-color:var(--primary)}
.material-tabs md-primary-tab{flex:1 0 auto;min-width:80px;--md-primary-tab-label-text-font:Noto,NotoHindi,sans-serif}
.material-tabs .count{margin-inline-start:6px;font-size:.85em;font-variant-numeric:tabular-nums}
.segmented{display:flex;flex-wrap:wrap;margin:16px 0;border-radius:24px}
.segmented button{flex:1 1 7rem;min-height:48px;padding:12px;font-size:.875rem;font-weight:500;white-space:normal;overflow-wrap:normal}
md-filter-chip{min-height:48px;--md-filter-chip-container-height:48px;--md-filter-chip-container-shape:8px;--md-filter-chip-label-text-size:.875rem}
.material-field{margin-bottom:24px}.material-field md-outlined-text-field,.material-field md-outlined-select{display:block;width:100%}
md-outlined-text-field,md-outlined-select{width:100%;--md-outlined-text-field-container-shape:8px;--md-outlined-select-text-field-container-shape:8px;--md-outlined-text-field-input-text-size:1rem;--md-outlined-text-field-label-text-size:1rem;--md-outlined-select-text-field-input-text-size:1rem;--md-outlined-select-text-field-label-text-size:1rem}
.material-choice{display:flex;align-items:center;gap:12px;min-height:56px;margin-left:0;padding:8px 0;font-size:1rem;font-weight:400;color:var(--onSurface)}
.material-choice md-switch,.material-choice md-checkbox,.material-choice md-radio{flex-shrink:0}
.material-choice.switch md-switch{margin-left:auto}.plan-card.material-choice{padding:16px;margin:0;min-height:72px}.plan-card md-radio{margin-left:auto}
.stepper{display:flex;gap:8px;margin:0 0 16px}.stepper button{flex:1;min-height:48px;border-bottom:4px solid var(--outlineVariant)}
.stepper button::before{display:none}.stepper button[aria-current=step],.stepper button.done{border-color:var(--primary);color:var(--primary)}
.stack.group{gap:0}.stack.group md-list-item.btn{display:block;min-height:64px;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;--md-list-item-label-text-size:1rem;--md-list-item-supporting-text-size:.875rem}
.stack.group md-list-item+md-list-item{border-top:1px solid var(--outlineVariant)}
md-list-item .material-action-label{padding-block:8px}md-list-item [slot=start]{color:var(--primary)}md-list-item [slot=end]{color:var(--onSurfaceVariant)}
dl{overflow-wrap:anywhere}dt{font-size:.875rem;line-height:1.5}dd{font-size:1rem;line-height:1.625}
.usage-compact{display:grid;gap:12px;padding:16px 0 24px}.usage-compact p{margin:0}md-linear-progress{display:block;width:100%;--md-linear-progress-track-height:4px}
.state{display:flex;flex-wrap:wrap;padding:24px 16px;gap:12px}.state>div{min-width:0}.state md-linear-progress,.material-skeleton{flex:1 0 100%}
.material-skeleton{height:120px;border-radius:8px;background:var(--surfaceVariant)}
.snackbar{border-radius:8px;background:var(--inverseSurface);color:#fff;font-size:.875rem;line-height:1.5;overflow-wrap:anywhere}
.snackbar md-text-button{--md-text-button-label-text-color:var(--inversePrimary);min-height:48px}
.material-status,.request-status{display:inline-flex;align-items:center;gap:6px;width:fit-content;max-width:100%;border-radius:24px;padding:4px 10px;background:var(--primaryContainer);color:var(--onPrimaryContainer);font-size:.875rem}
.material-status{background:var(--successContainer);color:var(--success)}.material-status.review-pending{background:var(--warningContainer);color:var(--warning)}
.phone md-filled-button[disabled],dialog md-filled-button[disabled]{background:transparent;color:var(--disabledContent)}
.usage-summary md-linear-progress{flex:1 0 100%}
html[lang=hi] .phone,html[lang=hi] dialog{--md-sys-typescale-body-large-font:NotoHindi,Noto,sans-serif;--md-sys-typescale-label-large-font:NotoHindi,Noto,sans-serif}
md-select-option{--md-menu-item-label-text-size:1rem;--md-menu-item-container-color:var(--surface)}
dialog{border-radius:24px 24px 0 0;padding:24px;box-shadow:var(--e-modal)}dialog::backdrop{background:rgb(0 0 0 / .32)}
.photo-slot{border:1px dashed var(--outline);background:var(--surfaceVariant);border-radius:8px}.photo-slot input[type=file]{max-width:100%;min-height:48px}
md-slider{display:block;width:100%;min-height:48px}
.compact-candidate md-outlined-button{--md-outlined-button-label-text-color:#fff;--md-outlined-button-outline-color:rgba(255,255,255,.8);--md-outlined-button-hover-state-layer-color:#fff;--md-outlined-button-focus-state-layer-color:#fff;--md-outlined-button-pressed-state-layer-color:#fff}
.compact-candidate .card-overlay-actions>.btn{padding:0;background:transparent!important;border:0;min-height:48px;--md-outlined-button-label-text-size:.875rem;--md-filled-button-label-text-size:.875rem;--md-outlined-button-leading-space:12px;--md-outlined-button-trailing-space:12px;--md-filled-button-leading-space:12px;--md-filled-button-trailing-space:12px}
.compact-candidate .interest-decisions md-icon-button{background:var(--surface)}
.compact-candidate md-icon-button.save-heart{background:var(--surface);position:absolute;top:8px;right:8px}
.row>md-icon-button{flex:0 0 48px}.row>md-filled-button,.row>md-outlined-button,.row>md-text-button{flex:1 1 8rem}
main>md-icon-button.btn{width:48px;margin-left:auto}
[hidden]{display:none!important}
.profile-toolbar{display:flex;align-items:center;gap:4px;margin-left:auto}
.profile-overflow{position:relative;flex-shrink:0}
.profile-overflow summary{display:grid;place-items:center;width:48px;height:48px;cursor:pointer;list-style:none;border-radius:50%;color:var(--onSurfaceVariant)}
.profile-overflow summary::-webkit-details-marker{display:none}
.profile-overflow summary:hover{background:var(--surfaceVariant)}
.profile-overflow-options{position:absolute;right:0;top:52px;z-index:8;width:min(260px,calc(100vw - 48px));box-shadow:var(--e-modal);background:var(--surface)}
.profile-overflow-options md-list-item{--md-list-item-label-text-size:.875rem}
.profile-overflow-options md-list-item[data-action^="block:"]{color:var(--error)}
.profile-overflow-options [slot=end]{display:none}
.profile-contact{padding:16px;border:1px solid var(--outlineVariant);border-radius:12px;background:var(--surface);margin-top:24px}
.profile-contact h2{font-size:1.125rem;line-height:1.5;margin:0 0 12px}
.profile-contact>.btn{width:100%;margin-top:12px;display:flex;justify-content:center;gap:8px}
.profile-contact .muted .ic{vertical-align:middle}
.trial-contact-offer{margin-top:16px;background:var(--primaryContainer);border-color:var(--primaryContainer)}
.trial-contact-offer h3{font-size:1.125rem;line-height:1.5;margin:0 0 8px}
.trial-contact-offer p{font-size:.875rem;line-height:1.6;margin:0}
.profile-primary-actions{margin-top:16px}

/* Reviewer fixes 2026-11-07 (owner asked reviewer to fix UX found in review). */
/* Material list/menu slots turn stroke icons into filled blobs; keep Lucide outlines. */
md-list-item .ic,md-list-item svg,md-icon-button svg,.profile-overflow-options svg{fill:none}
/* The old 48px native box had a -12px margin; the Material box is 18px, so restore the 16px gutter. */
label.check.material-choice{margin-left:0}
/* Gender chips and sheet buttons must never shrink to "A / M… / F…". */
md-filter-chip{flex:0 0 auto;max-width:100%}
[role=group].row md-filter-chip{flex:1 1 auto;min-width:max-content}
/* Paywall / sheet actions stack with a gap instead of touching. */
dialog .sheet-content>.stack{margin-top:16px}
/* Filter fields: one column when two would truncate their labels. */
@media (max-width:480px){#filters{grid-template-columns:1fr}}
/* Bottom navigation: never split a word, grow the column to the word. */
nav .btn{overflow-wrap:normal;word-break:keep-all;hyphens:none;padding-inline:2px}
/* owner 2026-11-07: at <=360px nav shows icons only; labels stay for screen readers. Planner must update doc 07 section 13. */
@media (max-width:360px){nav .navlabel{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}
/* View profile / Send interest stack when two would clip their words (320px or large text). */
.compact-candidate .profile-actions{grid-template-columns:repeat(auto-fit,minmax(min(100%,7.5rem),1fr))}
.material-action-label{text-overflow:clip}
/* Biodata rows: label and value on one line (label start, value after it); long values wrap in their own column. */
dl.kv{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);column-gap:16px}
dl.kv dt,dl.kv dd{padding:12px 0;margin:0;border-bottom:1px solid var(--outlineVariant)}
dl.kv{column-gap:0}dl.kv dt{padding-right:16px}
/* Narrow screens or enlarged text: stack label above value so no value splits mid-word. */
@media (max-width:360px),(max-width:24rem){dl.kv{grid-template-columns:1fr}dl.kv dt{border-bottom:0;padding:12px 0 0}dl.kv dd{padding:4px 0 12px}}
/* Locked contact: blurred neutral bars only; no restricted text is in the DOM (doc 02/05). */
.contact-preview{display:grid;gap:16px;margin:12px 0;cursor:pointer;user-select:none}
.contact-preview span{display:block;font-size:.875rem;color:var(--onSurfaceVariant)}
.contact-preview i{display:block;height:20px;margin-top:6px;border-radius:6px;background:var(--onSurfaceVariant);opacity:.4;filter:blur(5px)}
.paywall-plans{list-style:none;margin:16px 0;padding:0}
.paywall-plans li{display:flex;flex-direction:column;gap:2px;padding:12px 0;border-bottom:1px solid var(--outlineVariant)}
.paywall-plans span{font-size:.875rem;color:var(--onSurfaceVariant)}
dialog .sheet-content>.btn,dialog .sheet-content>md-filled-button{display:flex;width:100%}
main[data-route="my-profiles"] .usage-summary{margin:16px 0}
/* Filter chips grow with large text instead of clipping their label. */
md-filter-chip{--md-filter-chip-container-height:auto;--md-filter-chip-label-text-line-height:1.5;height:auto;min-height:48px}
md-filter-chip::part(container){height:auto}

/* Button content is centred by label padding (56px = 24px line + 2x16px); compact card buttons stay 48px. */
.compact-candidate .material-action-label{padding-block:12px}

/* Navigation rows outside a grouped list (Gotra, Home without a profile): same list item, as a bordered row. The old ::after chevron is replaced by the end slot. */
.stack:not(.group)>md-list-item.btn{display:block;min-height:64px;padding:0;border:0;border-radius:12px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--outlineVariant);--md-list-item-label-text-size:1rem;--md-list-item-container-shape:12px}
md-list-item.btn::after{display:none}
md-filled-button .material-action-label,md-filled-tonal-button .material-action-label,md-outlined-button .material-action-label,md-text-button .material-action-label{padding-inline:24px}
.compact-candidate .material-action-label{padding-inline:12px}
aside .muted{color:var(--onSurface)}
aside .btn{box-shadow:inset 0 0 0 1px var(--onSurface)}

.material-field{display:grid;gap:8px;font-weight:500;color:var(--onSurface);overflow-wrap:anywhere}
