/* Baakee Update 5 — approved full-chrome themes, legible entry screens, exact header search.
   QA only. Keep wallet payment-card skins and month/year Rewind art unchanged. */
html[data-baakee-theme]{
  --baakee-body-ink:#21392f;
  --baakee-secondary:#526e62;
  --baakee-action-fill:var(--baakee-ink);
  --baakee-action-text:#fff;
  --baakee-progress:var(--baakee-ink);
  --baakee-card-fill:color-mix(in srgb,var(--baakee-surface) 82%,var(--baakee-soft));
  --baakee-panel-fill:color-mix(in srgb,var(--baakee-surface) 75%,var(--baakee-soft));
  --baakee-active-fill:color-mix(in srgb,var(--baakee-soft) 72%,var(--baakee-surface));
  --baakee-page-glow:radial-gradient(ellipse at 15% 12%,color-mix(in srgb,var(--baakee-soft) 80%,transparent),transparent 56%),radial-gradient(ellipse at 83% 80%,color-mix(in srgb,var(--baakee-ambient) 80%,transparent),transparent 61%);
}
html[data-baakee-theme][data-theme="dark"]{
  --baakee-body-ink:#f1f6f1;
  --baakee-secondary:#b1c5b9;
  --baakee-action-fill:var(--baakee-ink);
  --baakee-action-text:#121915;
  --baakee-card-fill:color-mix(in srgb,var(--baakee-surface) 90%,var(--baakee-soft));
  --baakee-panel-fill:color-mix(in srgb,var(--baakee-surface) 70%,var(--baakee-soft));
  --baakee-active-fill:color-mix(in srgb,var(--baakee-soft) 75%,var(--baakee-surface));
}
/* Old styles forced blue/purple and fixed dark navy. Supply working definitions
   for the missing text tokens as well as ALL shared legacy chrome variables. */
html[data-baakee-theme] body{
  --bg:var(--baakee-page)!important;
  --card:var(--baakee-card-fill)!important;
  --surface:var(--baakee-panel-fill)!important;
  --card-bg:var(--baakee-card-fill)!important;
  --text:var(--baakee-body-ink)!important;
  --muted:var(--baakee-secondary)!important;
  --border:var(--baakee-glass-border)!important;
  --accent:var(--baakee-ink)!important;
  --blue:var(--baakee-ink)!important;
  --purple:var(--baakee-ink)!important;
  --bm-bg:var(--baakee-page)!important;
  --bm-card:var(--baakee-card-fill)!important;
  --bm-text:var(--baakee-body-ink)!important;
  --bm-muted:var(--baakee-secondary)!important;
  --bm-border:var(--baakee-glass-border)!important;
  --bm-input:var(--baakee-card-fill)!important;
  background-color:var(--baakee-page)!important;
  background-image:var(--baakee-page-glow)!important;
  color:var(--baakee-body-ink)!important;
}
html[data-baakee-theme] body.rufiyaa-liquid-glass::before,
html[data-baakee-theme] body.rufiyaa-liquid-glass::after,
html[data-baakee-theme] #app .shell::before,
html[data-baakee-theme] #app .shell::after{background-image:none!important}
html[data-baakee-theme] #app .shell,
html[data-baakee-theme] #app main.shell{background:transparent!important;color:var(--baakee-body-ink)!important}
html[data-baakee-theme] #app :is(.card,.list,.finance-tile,.home-widget,.u4-finance-utility,.v12432-health.u4-health-dashboard,.u4lo-overview,.u4sb-card,.settings-group-card-v13021):not(.u3-rewind-home):not([class*="wallet-card"]):not([class*="credit-card"]):not([class*="card-art"]):not([style*="--u3-bg"]){
  border-color:var(--baakee-glass-border)!important;
}
html[data-baakee-theme] #app :is(.home-widgets > .home-widget.card,.home-widgets .home-widget:not(.u3-rewind-home),.finance-tile,.list,.u4-finance-utility,.v12432-health.u4-health-dashboard,.budget-v14-card,.budget-plan-card,.u2-budget-entry):not(.u3-rewind-home):not(.u3-aavi-host):not([class*="wallet-card"]):not([class*="credit-card"]):not([style*="--u3-bg"]){
  background:var(--baakee-card-fill)!important;
  border-color:var(--baakee-glass-border)!important;
}
/* Preserve alerts and monthly Rewind background by excluding those components. */
html[data-baakee-theme] #app :is(.u3-rewind-home,.u3-story-card,[class*="wallet-card"],[class*="credit-card-design"],[class*="card-artwork"]){--baakee-keep-custom-art:1}
/* Shared buttons across Finance, Home, Accounts, Savings and Budget. */
html[data-baakee-theme] #app :is(button.primary,.primary):not(.danger):not(.danger-solid):not(.negative),
html[data-baakee-theme] #modal-root button.primary:not(.danger):not(.danger-solid),
html[data-baakee-theme] #app :is(.fab,.u2-plus-trigger){
  background:var(--baakee-action-fill)!important;
  color:var(--baakee-action-text)!important;
  border-color:color-mix(in srgb,var(--baakee-ink) 65%,transparent)!important;
}
html[data-baakee-theme] #app :is(.secondary,.row-btn,.chip,.seg button,.u2-tool,.u2-quick-grid button,.v12432-health-tools button):not(.danger):not(.negative),
html[data-baakee-theme] #modal-root :is(.secondary,.seg button,.baakee-theme-choice,.baakee-mode-row button):not(.danger){
  border-color:var(--baakee-glass-border)!important;
  color:var(--baakee-body-ink)!important;
}
html[data-baakee-theme] #app :is(.tab.active,.nav-tab-v13023.active,.chip.active,.seg button.active),
html[data-baakee-theme] #modal-root :is(.baakee-theme-choice.selected,.baakee-mode-row button.selected){
  background:var(--baakee-active-fill)!important;
  color:var(--baakee-ink)!important;
  border-color:var(--baakee-glass-border)!important;
}
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) .bottom.bottom-v13019,
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) .nav-main-pill-v13019,
html[data-baakee-theme] #app .u2-quick-panel{
  background:var(--baakee-panel-fill)!important;
  border-color:var(--baakee-glass-border)!important;
  color:var(--baakee-body-ink)!important;
  backdrop-filter:blur(25px) saturate(135%);
  -webkit-backdrop-filter:blur(25px) saturate(135%);
}
html[data-baakee-theme] #app .u2-plus-trigger{box-shadow:0 12px 26px color-mix(in srgb,var(--baakee-ink) 24%,transparent)!important}
html[data-baakee-theme] :is(#app,#modal-root) .progress{background:var(--baakee-soft)!important}
html[data-baakee-theme] :is(#app,#modal-root) .progress :is(i,span):not(.danger):not(.negative),
html[data-baakee-theme] #app :is(.budget-cycle-track i,.u4-health-progress i,.budget-allocation-progress i){background:var(--baakee-progress)!important}
/* Do not recolor explicit risk indicators or chart data-series semantics. */
html[data-baakee-theme] #app :is(.u3-budget-risk,.u3-budget-over) .progress i{background:revert-layer!important}
html[data-baakee-theme] :is(#app,#modal-root) :is(input,select,textarea){color:var(--baakee-body-ink)!important;border-color:var(--baakee-glass-border)!important}
html[data-baakee-theme] :is(#app,#modal-root) :is(input,select,textarea)::placeholder{color:var(--baakee-secondary)!important;opacity:.85}
/* High-contrast signed-out screen, not ivory text on ivory background. */
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"]{
  background:#073f32!important;background-image:radial-gradient(ellipse at 72% 12%,#206d537a,transparent 56%)!important;
}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-hero :is(.baakee-u5-entry-brand,.baakee-u5-entry-copy h1){color:#f7f0d8!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-copy h1 em{color:#b8e6d1!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] :is(.baakee-u5-entry-overline,.baakee-u5-entry-link){color:#b8e6d1!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-secondary{color:#f7f0d8!important;border-color:#91b8a6!important;background:#144e3f!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-foot{color:#d1e7da!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-copy>p:last-child{color:#cce8d8!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-showcase{background:#f7f0d8!important;color:#064e3b!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-primary{background:#b8e6d1!important;color:#064e3b!important}
html[data-baakee-theme] .baakee-u5-entry-gate[data-baakee-entry-stage="login"] .v1298-auth-card{color:var(--baakee-body-ink)!important}
/* Exactly three compact header buttons at all viewport widths. */
html[data-baakee-theme] #app .header .header-actions>.baakee-u5-header-privacy{display:none!important}
html[data-baakee-theme] #app .header .header-actions>.u2-h-action{background:var(--baakee-panel-fill)!important;border-color:var(--baakee-glass-border)!important;color:var(--baakee-ink)!important}
html[data-baakee-theme] #app .header .header-actions>.u2-h-action:focus-visible{outline:2px solid var(--baakee-ink);outline-offset:3px}
/* The search field itself expands leftwards IN the header, not a floating sheet. */
#app .header{position:relative;overflow:visible!important;isolation:isolate}
#app .header .header-actions{position:relative;z-index:7;flex:0 0 auto}
#app .header .header-actions>.u2-h-action:not(.u2-h-more),
#app .header>div:first-child{transition:opacity .25s ease,transform .27s cubic-bezier(.2,.7,.2,1)}
#app .header.baakee-u5-header-searching .header-actions>.u2-h-action:not(.u2-h-more),
#app .header.baakee-u5-header-searching>div:first-child{opacity:0!important;pointer-events:none!important;transform:translateX(-7px)}
#app .header .header-actions>.u2-h-more{z-index:9;transition:background .2s ease,color .2s ease,transform .3s cubic-bezier(.2,.7,.2,1)}
#app .header.baakee-u5-header-searching .header-actions>.u2-h-more{font-size:26px}
#app .header .baakee-u5-header-search-shell{
  display:flex;align-items:center;gap:9px;position:absolute;box-sizing:border-box;top:var(--baakee-u5-search-top,50%);transform:translateY(-50%);right:var(--baakee-u5-search-right,52px);height:43px;width:0;max-width:calc(100% - var(--baakee-u5-search-right,52px) - 8px);
  padding:0;overflow:hidden;z-index:8;opacity:0;pointer-events:none;
  background:var(--baakee-panel-fill,var(--card,#fff));color:var(--baakee-body-ink,#1b2b23);
  border:0 solid var(--baakee-glass-border,#cbded1);border-radius:23px;
  box-shadow:0 13px 33px #0c32201c;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  transition:width .4s cubic-bezier(.16,1,.3,1),opacity .18s ease,padding .3s ease,border-width .2s ease;
}
#app .header.baakee-u5-header-searching .baakee-u5-header-search-shell{width:calc(100% - var(--baakee-u5-search-right,52px) - 8px);padding:0 14px;border-width:1px;opacity:1;pointer-events:auto}
#app .header .baakee-u5-header-magnifier{font-size:23px;color:var(--baakee-ink,#064e3b);flex:0 0 auto}
#app .header .baakee-u5-header-search-shell input{min-width:0;flex:1;background:transparent!important;border:0!important;box-shadow:none!important;outline:0!important;height:40px;font:inherit;font-size:15px!important;padding:5px 2px!important}
#app .header .baakee-u5-header-results{
  position:absolute;right:0;top:calc(100% + 8px);width:min(100%,620px);max-height:min(54dvh,380px);overflow-y:auto;z-index:10;
  padding:7px;background:var(--baakee-panel-fill,var(--card,#fff));color:var(--baakee-body-ink,#203329);
  border:1px solid var(--baakee-glass-border,#cbded1);border-radius:19px;
  box-shadow:0 17px 36px #071a1324;backdrop-filter:blur(23px);-webkit-backdrop-filter:blur(23px)
}
#app .header .baakee-u5-header-results:empty{display:none}
#app .header .baakee-u5-header-results .baakee-u5-search-empty{padding:12px;margin:0;color:var(--baakee-secondary,#58786a);font-size:13px}
#app .header .baakee-u5-header-result{display:flex;flex-direction:column;gap:3px;width:100%;padding:10px 12px;border:0;border-bottom:1px solid var(--baakee-glass-border,#ddd);border-radius:9px;background:transparent;color:inherit;text-align:left}
#app .header .baakee-u5-header-result:last-child{border-bottom:0}
#app .header .baakee-u5-header-result small{font-size:10px;color:var(--baakee-secondary,#68847a);text-transform:uppercase;letter-spacing:.06em}
#app .header .baakee-u5-header-result strong{font-size:13px}
#app .header .baakee-u5-header-result>span{font-size:11px;color:var(--baakee-secondary,#68847a)}
#app .header .baakee-u5-header-result:focus-visible{outline:2px solid var(--baakee-ink)}
@media (max-width:520px){#app .header .baakee-u5-header-search-shell{right:var(--baakee-u5-search-right,46px);max-width:calc(100% - var(--baakee-u5-search-right,46px) - 8px)}#app .header.baakee-u5-header-searching .baakee-u5-header-search-shell{width:calc(100% - var(--baakee-u5-search-right,46px) - 8px)}}
@media (prefers-reduced-motion:reduce){#app .header :is(.baakee-u5-header-search-shell,.u2-h-action){transition:none!important}}
/* Legacy Liquid Glass styles carry a more specific old blue background. */
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode),
html[data-baakee-theme][data-theme="dark"] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode){
  background:var(--baakee-page-glow),var(--baakee-page)!important;
  background-attachment:fixed!important;
  color:var(--baakee-body-ink)!important;
}
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .bottom.bottom-v13019 .u2-plus-trigger{
  background:var(--baakee-action-fill)!important;
  color:var(--baakee-action-text)!important;
  border:1px solid var(--baakee-glass-border)!important;
}
html[data-baakee-theme][data-theme="light"]{
  --baakee-action-text:#fff;
}
html[data-baakee-theme][data-theme="dark"]{
  --baakee-action-text:#141b16;
}

@media(max-width:690px){
 .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry{display:flex!important;flex-direction:column!important;gap:20px;max-width:430px}
 .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-hero{align-items:stretch;width:100%}
 .baakee-u5-entry-gate[data-baakee-entry-stage="welcome"] .baakee-u5-entry-showcase{width:100%;transform:none}
}
/* Older Smart/Custom Home cards are hard-coded light even under dark themes.
   Keep semantic alert colors but restore real dark surfaces and readable copy. */
html[data-baakee-theme][data-theme="dark"] body.rufiyaa-liquid-glass #app .home-widgets :is(.home-widget,.card):not(.u3-rewind-home):not(.u3-aavi-host):not([style*="--u3-bg"]),
html[data-baakee-theme][data-theme="dark"] body.rufiyaa-liquid-glass #app :is(.finance-tile,.u4-health-dashboard,.u4-finance-utility,.budget-v14-card,.budget-plan-card):not([style*="--u3-bg"]),
html[data-baakee-theme][data-theme="dark"] body.rufiyaa-liquid-glass #app .home-widgets>.smart-home-item-v1295c .card:not(.u3-rewind-home){
 background:var(--baakee-card-fill)!important;
 color:var(--baakee-body-ink)!important;
 border-color:var(--baakee-glass-border)!important;
}
html[data-baakee-theme][data-theme="dark"] #app :is(.home-widget,.finance-tile,.u4-health-dashboard,.budget-v14-card):not(.u3-rewind-home) :is(h1,h2,h3,h4,.big,.metric,.row-title,.amount,strong,b):not(.positive):not(.negative):not(.danger):not(.success){
 color:var(--baakee-body-ink)!important;
}
html[data-baakee-theme][data-theme="dark"] #app :is(.home-widget,.finance-tile,.u4-health-dashboard,.budget-v14-card):not(.u3-rewind-home) :is(small,.label,.row-sub,.eyebrow):not(.positive):not(.negative){
 color:var(--baakee-secondary)!important;
}
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 .nav-tab-v13023.active,
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 .tab.active{
 background:var(--baakee-active-fill)!important;
 color:var(--baakee-ink)!important;
 border-color:var(--baakee-glass-border)!important;
}
html[data-baakee-theme][data-theme="dark"] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 .tab.active{
 color:var(--baakee-body-ink)!important;
}
/* The approved selected dock item follows the chosen appearance, including icons. */
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 :is(.nav-tab-v13023.active,.tab.active) :is(.nav-icon-v13022,.nav-label-v13022),
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .bottom.bottom-v13019 .u2-plus-trigger>span{color:var(--baakee-action-text)!important}
html[data-baakee-theme][data-theme="light"] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 :is(.nav-tab-v13023.active,.tab.active) :is(.nav-icon-v13022,.nav-label-v13022){color:var(--baakee-ink)!important}
html[data-baakee-theme][data-theme="dark"] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 :is(.nav-tab-v13023.active,.tab.active) :is(.nav-icon-v13022,.nav-label-v13022){color:var(--baakee-body-ink)!important}
/* Smart Budgeter: preserve slider precision and calculations; replace only old fixed-green chrome. */
html[data-baakee-theme] #modal-root :is(.u2g-shell,.u2g-top){color:var(--baakee-body-ink)!important}
html[data-baakee-theme] #modal-root :is(.u2g-card-option,.u2g-advice-group,.u2g-category-card,.u2g-capacity,.u2g-mini,.u2g-review,.u2p2-rec-group,.u2p2-scenario-entry,.u2p2-entry){
 background:var(--baakee-panel-fill)!important;
 color:var(--baakee-body-ink)!important;
 border-color:var(--baakee-glass-border)!important;
}
html[data-baakee-theme] #modal-root :is(.u2g-progress .active,.u2-precision-steps [aria-pressed="true"]){background:var(--baakee-ink)!important;color:var(--baakee-action-text)!important}
html[data-baakee-theme] #modal-root :is(.u2g-category-card input[type="range"],.u2g-mode input,.u2g-fund-toggle input,.u2p2-scenario-entry input[type="range"]){accent-color:var(--baakee-ink)!important}
html[data-baakee-theme] #modal-root :is(.u2-precision-track){background:linear-gradient(90deg,var(--baakee-soft),var(--baakee-card-fill),var(--baakee-soft))!important;color:var(--baakee-ink)!important}
html[data-baakee-theme] #modal-root :is(.u2g-mini,.u2g-hint,.u2g-content>p,.u2g-category-card>small,.u2g-count,.u2p2-muted){color:var(--baakee-secondary)!important}
/* Finance buttons and non-semantic inset tiles use the themed glass, not original teal. */
html[data-baakee-theme] #app :is(.v12432-health-tools button,.u4-finance-reports button,.u4-finance-utility button,.u4-finance-tools button,.u4-finance-tiles button):not(.danger):not(.negative),
html[data-baakee-theme] #modal-root :is(.u2g-adjust button,.u2g-category-actions button,.u2p2-choice):not(.danger):not(.negative){
 background:var(--baakee-active-fill)!important;
 color:var(--baakee-body-ink)!important;
 border-color:var(--baakee-glass-border)!important;
}
html[data-baakee-theme] #app :is(.home-quick-add,.home-add-transaction,.u3-add-transaction,.u3-home-quick-add){background:var(--baakee-active-fill)!important;color:var(--baakee-ink)!important}
/* The old dock SVG artwork sets its own hard-coded green stroke. Reconnect it
   to the selected theme without changing the approved dock geometry. */
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 .nav-tab-v13023.active svg.u2nav-outline,
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 .tab.active svg.u2nav-outline{
  color:var(--baakee-body-ink)!important;
  stroke:currentColor!important;
}
html[data-baakee-theme][data-theme="light"] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .nav-main-pill-v13019 .nav-tab-v13023.active svg.u2nav-outline{color:var(--baakee-ink)!important}
/* Finance preview sections were inherited from an older unthemed list. */
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .fin12-list>.fin12-section{
  background:var(--baakee-card-fill)!important;
  border:1px solid var(--baakee-glass-border)!important;
  border-radius:19px!important;
  padding:16px!important;
  margin:0 0 11px!important;
  color:var(--baakee-body-ink)!important;
}
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .fin12-head b{color:var(--baakee-ink)!important}
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .fin12-head small{color:var(--baakee-secondary)!important}
html[data-baakee-theme] body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app :is(.fin12-list,.finance-v141-list) > .fin12-section{
 background:var(--baakee-card-fill)!important;
 border:1px solid var(--baakee-glass-border)!important;
 border-radius:19px!important;
 padding:16px!important;
 margin:0 0 11px!important;
 color:var(--baakee-body-ink)!important;
}

/* Straight-line Aavi trajectory: vertically match the real header button. */
#app .header .u2-aavi-dock{
  top:var(--baakee-u5-aavi-top,50%)!important;
  bottom:auto!important;
  height:var(--baakee-u5-aavi-height,42px)!important;
  transform:translateY(-50%)!important;
}
