/* Settings tab and its subpages: flutter_app/lib/screens/settings/ (files cited).
   Every page here paints flat #FCF7F9 (.k-screen.k-flat) under a 56-tall AppBar. */

/* the Settings list (settings_screen.dart): ListView 20,8,20,100; cards keep
   their 4 margin, so the visible gutter is 24 and cards sit 16 apart */
.k-settings { flex: 1; min-height: 0; overflow: hidden; padding: 8px 20px 100px; }
.k-settings > .k-card { margin: 4px; }
.k-settings > .k-card + .k-card { margin-top: 12px; }
.k-settings > .k-card.first-row { margin-top: 24px; }
/* Account header card: "Account" + chevron, then the email */
.k-account-card { padding: 15px; }
.k-account-card > div { display: flex; align-items: center; justify-content: space-between; font: var(--title-medium) var(--k-font); font-weight: 600; letter-spacing: var(--title-medium-tracking); }
.k-account-card > div > k-icon { color: rgba(0, 0, 0, .87); }
.k-account-card > span { display: block; margin-top: 12px; font: var(--body-large) var(--k-font); letter-spacing: var(--body-large-tracking); }
/* a navigation row card: one ListTile in a Card, 72 tall, text at x56 */
.k-row-card { padding: 0; overflow: hidden; }
.k-row-card > .k-tile { min-height: 70px; }
.k-row-card .k-tile > k-icon.accent { color: var(--primary); }
.k-row-card .k-tile > k-icon.danger { color: var(--error); }
.k-settings > .k-outlined-button { margin: 20px 4px 0; }
.k-version { margin-top: 24px; text-align: center; font: var(--body-small) var(--k-font); letter-spacing: var(--body-small-tracking); color: var(--on-surface-variant); }

/* search profiles list (search_profiles_list_screen.dart): 16,12,16,32 */
.k-profiles { flex: 1; min-height: 0; overflow: hidden; padding: 12px 16px 32px; }
.k-profiles-summary { margin-bottom: 12px; font: var(--body-small) var(--k-font); font-weight: 600; letter-spacing: var(--body-small-tracking); color: var(--on-surface-variant); }
.k-profile-row { padding: 13px 11px 13px 15px; box-shadow: 0 1px 3px rgba(0, 0, 0, .05); }
.k-profile-row + .k-profile-row { margin-top: 10px; }
.k-profile-row-head { display: flex; align-items: center; min-height: 48px; margin: -8px 0 -6px; }
.k-profile-row-head > b { flex: 1; min-width: 0; font: var(--title-medium) var(--k-font); font-weight: 700; letter-spacing: var(--title-medium-tracking); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.k-profile-row-head > .k-icon-button { color: var(--on-surface-variant); }
.k-chip-wrap { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.k-profile-summary { margin-top: 12px; font: var(--body-medium) var(--k-font); line-height: 1.25; letter-spacing: var(--body-medium-tracking); color: var(--on-surface-variant); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.k-profile-row > .k-chip-wrap:last-child { margin-top: 12px; }
/* status chip (22 tall) and metric chip (26 tall), radius 8 */
.k-status-tag { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 8px; font: var(--label-small) var(--k-font); font-weight: 700; letter-spacing: var(--label-small-tracking); color: var(--on-surface-variant); }
.k-status-tag.brand { background: rgba(255, 218, 218, .55); color: var(--primary); }
.k-status-tag.success { background: #E7F3EC; color: #2E7D50; }
.k-metric { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 8px; font: var(--label-small) var(--k-font); font-weight: 600; letter-spacing: var(--label-small-tracking); color: var(--on-surface-variant); font-variant-numeric: tabular-nums; }
.k-metric.brand { background: rgba(255, 218, 218, .55); font-weight: 800; color: var(--primary); }
.k-metric.success { background: #E7F3EC; color: #2E9E4B; }

/* search profile edit (search_profile_edit_screen.dart): form cards */
.k-form { flex: 1; min-height: 0; overflow: hidden; padding: 12px 16px; }
.k-form > .k-card { margin: 4px 4px 16px; }
.k-form-card-title { margin-bottom: 16px; font: var(--title-medium) var(--k-font); font-weight: 700; letter-spacing: var(--title-medium-tracking); }
.k-form-label { margin: 16px 0 10px; font: var(--title-small) var(--k-font); font-weight: 600; letter-spacing: var(--title-small-tracking); color: rgba(26, 29, 46, .7); }
/* ExpansionTile header: 56 tall, expand_more in primary when open */
.k-expansion-head { display: flex; align-items: center; min-height: 56px; padding: 0 16px; font: var(--title-medium) var(--k-font); font-weight: 600; letter-spacing: var(--title-medium-tracking); }
.k-expansion-head > span { flex: 1; }
.k-expansion-head > k-icon { color: var(--on-surface-variant); }
.k-expansion-head.open > k-icon { color: var(--primary); transform: rotate(180deg); }
.k-expansion-body { padding: 8px 16px 16px; }
/* picker field (MultiSelectField): 54 tall, outline 80 %, radius 12 */
.k-picker { display: flex; align-items: center; gap: 12px; min-height: 54px; padding: 14px 16px; border: 1px solid rgba(133, 115, 115, .8); border-radius: 12px; font: var(--body-large) var(--k-font); letter-spacing: var(--body-large-tracking); }
.k-picker > span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.k-picker.empty > span { color: rgba(26, 29, 46, .6); }
.k-picker > k-icon:first-child { color: rgba(26, 29, 46, .6); }
.k-picker > k-icon:last-child { color: rgba(26, 29, 46, .5); }
/* optional limit (ToggleableSlider): off = "No limit" row; on = value chip + slider */
.k-limit { display: flex; align-items: center; justify-content: space-between; min-height: 44px; font: var(--body-medium) var(--k-font); letter-spacing: var(--body-medium-tracking); }
.k-limit.off > span:first-child { color: rgba(26, 29, 46, .6); }
.k-limit.off > span:last-child { color: var(--on-surface-variant); }
.k-limit-value { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 8px; background: rgba(255, 218, 218, .5); font: var(--title-medium) var(--k-font); font-weight: 600; letter-spacing: var(--title-medium-tracking); color: var(--primary); }
.k-slider { position: relative; height: 48px; }
.k-slider::before { content: ""; position: absolute; left: 10px; right: 10px; top: 22px; height: 4px; border-radius: 2px; background: var(--surface-container-highest); }
.k-slider > i { position: absolute; left: 10px; top: 22px; height: 4px; border-radius: 2px; background: var(--primary); }
.k-slider > b { position: absolute; top: 14px; width: 20px; height: 20px; margin-left: -10px; border-radius: 50%; background: var(--primary); }
/* the match counter bar pinned under the form (FilterCountBar) */
.k-count-bar { flex: none; display: flex; align-items: center; gap: 12px; padding: 10px 16px calc(16px + var(--k-safe-bottom)); background: #FFFFFF; box-shadow: 0 -2px 8px rgba(0, 0, 0, .1); }
.k-count-bar > div { flex: 1; min-width: 0; }
.k-count-bar-track { width: 60%; height: 4px; overflow: hidden; border-radius: 2px; background: rgba(110, 119, 135, .15); }
.k-count-bar-track > i { display: block; height: 100%; background: rgba(110, 119, 135, .5); }
.k-count-bar b { display: block; margin-top: 4px; font-weight: 600; font-variant-numeric: tabular-nums; }
.k-count-bar small { display: block; font: var(--body-small) var(--k-font); letter-spacing: var(--body-small-tracking); color: var(--on-surface-variant); }
.k-count-bar > .k-filled-button { margin: 0; }

/* the notification sheet (home/notification_settings_sheet.dart): 20,12,20,24 */
.k-sheet-body { padding: 12px 20px 24px; }
.k-sheet-body > h3 { font: var(--title-large) var(--k-font); font-weight: 700; letter-spacing: var(--title-large-tracking); }
.k-sheet-body > h3 + span { display: block; margin-top: 2px; color: var(--on-surface-variant); }
.k-switch-row { display: flex; align-items: center; gap: 16px; min-height: 72px; }
.k-switch-row > div { flex: 1; min-width: 0; }
.k-switch-row > div > b { display: block; font: var(--body-large) var(--k-font); letter-spacing: var(--body-large-tracking); }
.k-switch-row > div > span { display: block; color: var(--on-surface-variant); }
.k-choice-row { display: flex; align-items: center; gap: 16px; min-height: 72px; }
.k-choice-row > .k-radio { margin-right: 0; }
.k-choice-row > div { flex: 1; }
.k-choice-row > div > b { display: block; font: var(--body-large) var(--k-font); letter-spacing: var(--body-large-tracking); }
.k-choice-row > div > span { display: block; color: var(--on-surface-variant); }
.k-choice-row.disabled { opacity: .38; }
.k-sub-row { display: flex; align-items: center; gap: 10px; padding: 6px 0 8px 56px; color: var(--on-surface-variant); }
.k-sub-row > .k-select-pill { color: var(--on-surface); }
.k-sub-row > .k-select-pill > k-icon { color: var(--on-surface-variant); }