/* HORIZEN / Visual Identity v1 — presentation only.
   Source: Mi Presupuesto 3.1.1. No data, API, budget, or Wallet logic changes.
   Gold represents brand actions; savings blue, debts red, and status colors remain semantic. */
:root {
  --hz-gold:#A37925;--hz-gold-soft:#FBF1D5;--hz-paper:#F8F7F3;
  --accent:#966B19;--accent-light:#FBF1D5;
  --ink:#242424;--muted:#656973;--line:#E5DFD2;--bg:#F8F7F3;
  --tile:#F0ECE3;--side:#F3F0E9;--v7-card:#FFFFFF;
  --shadow:0 12px 36px #2F210812;
}
:root[data-v7-active="dark"] {
  color-scheme:dark;
  --hz-gold:#E8C978;--hz-gold-soft:#332A1B;--hz-paper:#0C0C0D;
  --bg:#0C0C0D;--ink:#F6F4EF;--muted:#BFC0C6;
  --line:#3B3936;--side:#141416;--tile:#242326;
  --accent:#E8C978;--accent-light:#322A1D;--v7-card:#1B1B1E;
  --shadow:0 13px 38px #0008;
}
html{accent-color:var(--accent)}
body,.workspace{background:var(--bg)!important;color:var(--ink)}
.workspace{background-image:radial-gradient(ellipse 70% 430px at 70% -150px,rgba(189,145,47,.045),transparent)!important}
:root[data-v7-active="dark"] body,
:root[data-v7-active="dark"] .workspace{background:#0C0C0D!important;color:var(--ink)}
:root[data-v7-active="dark"] .workspace{background-image:radial-gradient(ellipse 80% 400px at 80% -140px,rgba(213,157,52,.095),transparent)!important}
.shell>.sidebar{background:#F0EDE5!important;border-color:var(--line)!important;color:var(--ink)}
:root[data-v7-active="dark"] .shell>.sidebar{background:#131314!important;border-color:#393631!important;color:var(--ink)}
/* Brand lockup. SVG also ships at PNG sizes for OS-installed shortcuts. */
.side-brand{gap:12px!important;padding:7px 8px 14px!important;border-bottom:1px solid var(--line)}
.brand-icon{flex:none;width:44px;height:44px;border-radius:13px;background:#0B0B0C!important;box-shadow:0 4px 18px #9B6A1840!important;border:1px solid #D1A857;overflow:hidden;display:grid;place-items:center}
.brand-icon img{width:100%;height:100%;object-fit:cover;display:block}
.brand-name{font-size:17px!important;font-weight:810!important;letter-spacing:.17em!important;color:var(--ink)!important}
.brand-sub{color:var(--muted)!important;font-size:10px;letter-spacing:.02em}
.vbrandmini{gap:9px!important;color:var(--ink)!important;font-weight:800;letter-spacing:.13em}
.vbrandmini img{width:29px;height:29px;border-radius:8px;border:1px solid #A77D32}
.vbrandmini strong{font-size:13px;letter-spacing:.14em}
.v3pagehead .eyebrow{color:var(--accent)!important;letter-spacing:.19em;font-weight:810}
.page-heading h1{color:var(--ink)!important;letter-spacing:-.9px}
:root[data-v7-active="dark"] .page-heading h1{color:#F8F6EF!important}
.v3pagehead .intro,.v7dashhead p,.vtopline p{color:var(--muted)!important}
/* Navigation, buttons, brand emphasis. */
.nav-item{color:var(--ink)!important}
.nav-item:hover:not(.active){background:#E6DDCB!important;color:#302713!important}
.nav-item.active{background:linear-gradient(110deg,#F6DC98,#D5AD56)!important;color:#1C170D!important;box-shadow:0 4px 14px #A1772440!important}
.nav-item.active .nav-icon,.nav-item.active .nav-text{color:#1C170D!important}
.nav-icon{color:var(--accent);background:transparent!important}
.nav-item.active .nav-icon{background:#1E1B1530!important}
:root[data-v7-active="dark"] .nav-item{color:#D5D3CF!important}
:root[data-v7-active="dark"] .nav-item:hover:not(.active){background:#292621!important;color:#F7E7C4!important}
:root[data-v7-active="dark"] .nav-item.active{background:linear-gradient(112deg,#F1D589,#B98B33)!important;color:#17120A!important}
:root[data-v7-active="dark"] .nav-item.active .nav-text,
:root[data-v7-active="dark"] .nav-item.active .nav-icon{color:#15110A!important}
.vbutton,.vsmall,.v7quick,.small-add,.rc-edit,
.icon-btn,.month-step,.month-pill,.v7control{border-color:var(--line)!important;background:var(--accent-light)!important;color:var(--accent)!important}
.vbutton:hover,.vsmall:hover,.v7quick:hover,.icon-btn:hover{filter:brightness(.95)}
.btn-primary{background:linear-gradient(115deg,#F5DC91,#D4A84B)!important;color:#15120D!important;box-shadow:0 6px 19px #BD8C3244!important}
.btn-primary:hover{background:linear-gradient(115deg,#FCE6A9,#DFB85D)!important}
:root[data-v7-active="dark"] .vlineicon,
:root[data-v7-active="dark"] .vbutton,
:root[data-v7-active="dark"] .vsmall,
:root[data-v7-active="dark"] .v7quick{
  background:#30281B!important;color:#ECD08B!important;border-color:#5F4E30!important
}
:root[data-v7-active="dark"] .v7control,
:root[data-v7-active="dark"] .icon-btn,
:root[data-v7-active="dark"] .month-step,
:root[data-v7-active="dark"] .month-pill{background:#262421!important;color:#E8D2A2!important;border-color:#4D422F!important}
:root[data-v7-active="dark"] .v7control select{background:transparent!important;color:#F1EAE0!important}
/* Content surfaces, module cards and dashboard. */
.metric,.week-col,.vcard,.v3main .vcard,.vwidget,.vmetrics>div,.v7module,
.r8-kpi,.rc-column,.rc-card,.r8-table-scroll{
  background:#FFF!important;border-color:#E5DFD2!important;color:var(--ink)!important
}
.metric.highlight{background:#FFF8E8!important;border-color:#E6D4AD!important}
.v7module,.vcard,.vwidget,.metric{box-shadow:0 3px 17px #2720130B}
.v7modicon,.vlineicon{background:var(--accent-light)!important;color:var(--accent)!important}
.v7moduletools{background:#F9F7F1!important;border-color:var(--line)!important}
.v7moduletools button{background:var(--tile)!important;color:var(--accent)!important;border-color:var(--line)!important}
.v7big,.vmetrics b,.vwidget b,.metric-value,.vcardhead h2,.vcard h2,.week-title,
.vlinebody strong,.v7module h3{color:var(--ink)!important}
.vprogress,.r8-chart-row .r8-track{background:#E5DFD3!important}
.vprogress span,.r8-chart-row .r8-track span{background:linear-gradient(90deg,#C79943,#F5D986)!important}
.r8-bar:not(.cost){background:linear-gradient(0deg,#AE7C28,#E8C978)!important}
.r8-bar.cost{background:#7F858C!important}
.r8-check input{accent-color:#A27622}
.r8-table th{background:#F4EFE5!important;color:#4C4436!important}
.r8-table td{color:var(--ink)}
.r8-table th,.r8-table td{border-color:var(--line)!important}
.r8-kpi strong{color:var(--ink)!important}
.r8-kpi span,.r8-kpi small,.vmuted,.v7dashhead p,.metric-label,.metric-foot{color:var(--muted)!important}
/* Weekly board retains visual separation, matching the gold action language. */
.week-col{background:#FBFAF7!important}
.week-head{background:#F7F4EC!important;border-color:var(--line)!important}
.income-box{background:#FFF!important;border-color:var(--line)!important}
.week-footer{background:#F6F3EB!important;border-color:var(--line)!important}
.week-number{background:#F1E0B7!important;color:#785317!important}
.week-dates{color:var(--accent)!important}
.week-cross-month{border-color:#C49A4F!important;box-shadow:inset 0 3px 0 #C69D4F!important}
.week-cross-month .week-head{background:#FFF3D5!important}
.expense-item{background:#FFF!important;border-color:var(--line)!important}
.expense-name,.expense-amount,.foot-row strong,.income-input{color:var(--ink)!important}
.foot-row.big strong{color:var(--accent)!important}
.expense-item.paid .expense-name{color:var(--muted)!important}
/* Savings and debts MUST remain blue and red in both themes. */
.expense-item.expense-savings,.list-line.expense-savings,.rc-card.expense-savings{border-left-color:#3A8DFF!important}
.expense-item.expense-debts,.list-line.expense-debts,.rc-card.expense-debts{border-left-color:#F06C71!important}
.expense-savings .expense-amount,.expense-savings .line-price{color:#2E78D3!important}
.expense-debts .expense-amount,.expense-debts .line-price{color:#C83E4D!important}
/* Legacy / form components, without changing any behavior. */
input:not([type=checkbox]):not([type=radio]),textarea,select,.search,.r8-label input,.r8-label select,
.v7control{border-color:var(--line)!important;color:var(--ink)!important}
input[type=checkbox],input[type=radio]{accent-color:var(--accent)}
input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible{outline-color:#E7BD61!important}
.modal,.vmodal,.modal-head,.v3-icon-dialog,.category-dialog{background:#FFFFFF!important;color:var(--ink)!important;border-color:var(--line)!important}
.modal-actions{background:inherit;color:var(--ink)}
.modal h2,.category-dialog h2,.v3-icon-dialog h2{color:var(--ink)!important}
.category-dialog button,.viconoption{background:var(--tile)!important;border-color:var(--line)!important;color:var(--accent)!important}
.cloud-banner{background:#F8F1E1!important;color:#7D5B1B!important;border-color:#E6D8B8!important}
.cloud-banner.ready{background:#E7F4EC!important;color:#246B4A!important;border-color:#C7E2D3!important}
/* Night mode: gold over charcoal, with high-contrast data labels. */
:root[data-v7-active="dark"] .vcard,
:root[data-v7-active="dark"] .v3main .vcard,
:root[data-v7-active="dark"] .vwidget,
:root[data-v7-active="dark"] .vmetrics>div,
:root[data-v7-active="dark"] .metric,
:root[data-v7-active="dark"] .week-col,
:root[data-v7-active="dark"] .rc-column,
:root[data-v7-active="dark"] .rc-card,
:root[data-v7-active="dark"] .v7module,
:root[data-v7-active="dark"] .r8-kpi{
  background:#1C1C1F!important;border-color:#393839!important;color:#F6F4EE!important
}
:root[data-v7-active="dark"] .week-col{background:#171719!important}
:root[data-v7-active="dark"] .week-head,
:root[data-v7-active="dark"] .week-footer,
:root[data-v7-active="dark"] .income-box,
:root[data-v7-active="dark"] .expense-item,
:root[data-v7-active="dark"] .rc-column-body,
:root[data-v7-active="dark"] .rc-column-stats,
:root[data-v7-active="dark"] .rc-card-foot{
  background:#222225!important;border-color:#414045!important;color:#F4F2EC!important
}
:root[data-v7-active="dark"] .v7moduletools{background:#1B1B1D!important;border-color:#393839!important}
:root[data-v7-active="dark"] .v7moduletools button{background:#292725!important;border-color:#555044!important;color:#E8C978!important}
:root[data-v7-active="dark"] .v7modicon{background:#332B1D!important;color:#E8C978!important}
:root[data-v7-active="dark"] .vcardhead h2,
:root[data-v7-active="dark"] .v7module h3,
:root[data-v7-active="dark"] .vmetrics b,
:root[data-v7-active="dark"] .vwidget b,
:root[data-v7-active="dark"] .v7big,
:root[data-v7-active="dark"] .metric-value,
:root[data-v7-active="dark"] .week-title,
:root[data-v7-active="dark"] .vlinebody strong,
:root[data-v7-active="dark"] .rc-card-title,
:root[data-v7-active="dark"] .expense-name,
:root[data-v7-active="dark"] .expense-amount,
:root[data-v7-active="dark"] .foot-row strong,
:root[data-v7-active="dark"] .income-input,
:root[data-v7-active="dark"] .r8-kpi strong{color:#F6F3ED!important}
:root[data-v7-active="dark"] .week-number{background:#42351F!important;color:#F1CF78!important}
:root[data-v7-active="dark"] .week-dates{color:#E5C673!important}
:root[data-v7-active="dark"] .week-cross-month .week-head{background:#2D261B!important}
:root[data-v7-active="dark"] .foot-row.big strong{color:#E8C978!important}
:root[data-v7-active="dark"] .expense-item.paid .expense-name{color:#ADB0B8!important}
:root[data-v7-active="dark"] .expense-savings .expense-amount,
:root[data-v7-active="dark"] .expense-savings .line-price{color:#89BDFF!important}
:root[data-v7-active="dark"] .expense-debts .expense-amount,
:root[data-v7-active="dark"] .expense-debts .line-price{color:#FF9297!important}
:root[data-v7-active="dark"] .vline,:root[data-v7-active="dark"] .expense-item,
:root[data-v7-active="dark"] .vlimit{border-color:#414045!important}
:root[data-v7-active="dark"] .vprogress,
:root[data-v7-active="dark"] .r8-chart-row .r8-track{background:#3B3730!important}
:root[data-v7-active="dark"] .r8-kpi span,
:root[data-v7-active="dark"] .r8-kpi small,
:root[data-v7-active="dark"] .r8-chart-row,
:root[data-v7-active="dark"] .vmuted,
:root[data-v7-active="dark"] .metric-label,
:root[data-v7-active="dark"] .v7dashhead p{color:#C0C0C4!important}
:root[data-v7-active="dark"] .modal,
:root[data-v7-active="dark"] .vmodal,
:root[data-v7-active="dark"] .modal-head,
:root[data-v7-active="dark"] .v3-icon-dialog,
:root[data-v7-active="dark"] .category-dialog{background:#1C1C1F!important;color:#F6F4EE!important;border-color:#414045!important}
:root[data-v7-active="dark"] .modal h2,
:root[data-v7-active="dark"] .category-dialog h2,
:root[data-v7-active="dark"] .v3-icon-dialog h2{color:#F6F4EE!important}
:root[data-v7-active="dark"] input:not([type=checkbox]):not([type=radio]),
:root[data-v7-active="dark"] textarea,
:root[data-v7-active="dark"] select{background:#29292D!important;color:#F7F5EE!important;border-color:#57534A!important}
:root[data-v7-active="dark"] input::placeholder{color:#ABA9A5!important}
:root[data-v7-active="dark"] .r8-table th{background:#2D2A24!important;color:#F5DFAC!important}
:root[data-v7-active="dark"] .r8-table td{color:#F2F1EE!important;border-color:#414045!important}
:root[data-v7-active="dark"] .r8-table-scroll{background:#1C1C1F!important;border-color:#414045!important}
:root[data-v7-active="dark"] .r8-table th:first-child,
:root[data-v7-active="dark"] .r8-table td:first-child{background:#242426!important}
:root[data-v7-active="dark"] .v3main .vchecklabel,
:root[data-v7-active="dark"] .v7widgetpicker .vchecklabel,
:root[data-v7-active="dark"] .r8-check{background:#28272A!important;color:#ECE5D7!important;border-color:#565048!important}
:root[data-v7-active="dark"] .category-dialog button,
:root[data-v7-active="dark"] .viconoption{background:#302A21!important;color:#F3D68E!important;border-color:#5F5037!important}
:root[data-v7-active="dark"] .cloud-banner{background:#29251B!important;color:#F0D391!important;border-color:#685531!important}
:root[data-v7-active="dark"] .cloud-banner.ready{background:#1A342B!important;color:#B2ECD5!important;border-color:#326349!important}
/* Keep system utilities and semantic states recognizable. */
:root[data-v7-active="dark"] .positive{color:#78D8A7!important}
:root[data-v7-active="dark"] .negative{color:#FF898E!important}
@media(prefers-reduced-motion:reduce){.nav-item,.v7module,.btn-primary{transition:none!important}}
@media print{.workspace,.week-col,.vcard,.v7module,.r8-kpi{background:#fff!important;color:#111!important}.brand-icon{box-shadow:none!important}}
/* A subtle horizon beneath the page heading; visible without occupying workspace space. */
.v3pagehead{position:relative;padding-bottom:16px;border-bottom:1px solid var(--line)}
.v3pagehead:after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:clamp(90px,20%,235px);border-radius:10px;background:linear-gradient(90deg,#AF7C27,#F4DC95,transparent)}
.v3pagehead .intro strong{color:var(--accent);font-weight:730}
@media(max-width:850px){
  .vbrandmini{display:inline-flex!important;gap:6px!important;min-width:0;letter-spacing:.12em}
  .vbrandmini img{width:26px;height:26px;flex:0 0 26px}
  .vbrandmini strong{font-size:11px;white-space:nowrap}
  .topbar .topbar-left{gap:7px;min-width:0}
  .topbar .top-actions{gap:5px}
  .topbar .icon-btn{width:37px;height:37px;border-radius:12px}
}
@media(max-width:355px){.vbrandmini strong{display:none}}
/* Focused financial forms: same brand as the dashboard, with readable contrast. */
.week-picker{background:#FBF8F0!important;border-color:#DDCEB2!important}
.week-picker-heading{color:#74551E!important}
.week-picker-help{color:#756E63!important}
.week-chip span{background:#FFFFFF!important;border-color:#E4D8C2!important;color:#514531!important}
.week-chip input:checked+span{background:linear-gradient(110deg,#F8D98A,#D2A447)!important;border-color:#C59A45!important;color:#1F1708!important;box-shadow:0 4px 12px #8B692435!important}
.week-chip input:focus-visible+span{outline-color:#E5BD66!important}
.week-choice-total,.linked-weeks{background:#F7ECD2!important;color:#705019!important}
.week-choice-total b{color:#73511A!important}
.category-manage{color:var(--accent)!important}
.btn-secondary{background:var(--tile)!important;color:var(--ink)!important}
.modal-actions .btn-primary{color:#17120B!important}
:root[data-v7-active="dark"] .week-picker{background:#27241E!important;border-color:#5A4B30!important}
:root[data-v7-active="dark"] .week-picker-heading{color:#ECD28F!important}
:root[data-v7-active="dark"] .week-picker-help{color:#C8C1B3!important}
:root[data-v7-active="dark"] .week-chip span{background:#34312D!important;border-color:#605A4F!important;color:#F0E7DA!important}
:root[data-v7-active="dark"] .week-chip input:checked+span{background:linear-gradient(110deg,#F8D98A,#D2A447)!important;border-color:#DFBF71!important;color:#15120B!important}
:root[data-v7-active="dark"] .week-choice-total,
:root[data-v7-active="dark"] .linked-weeks{background:#3C3121!important;color:#F2D38B!important}
:root[data-v7-active="dark"] .week-choice-total b{color:#FFF0BD!important}
:root[data-v7-active="dark"] .category-manage{color:#F0CE7B!important}
:root[data-v7-active="dark"] .btn-secondary{background:#333338!important;color:#E8E6E2!important}
:root[data-v7-active="dark"] .modal-actions{background:#1C1C1F!important}
/* Calculator: screen remains dark and visible on both themes; keys show actions in gold. */
.calc-display{background:#F7F1E4!important}
.calc-current{color:#27211B!important}
.calc-expression{color:#716650!important}
.calc-key{background:#EEE8DB!important;color:#352B1F!important}
.calc-key.operator{background:#F7E5B8!important;color:#765116!important}
.calc-key.equals{background:linear-gradient(115deg,#F5D888,#D1A349)!important;color:#1B1408!important}
:root[data-v7-active="dark"] .calc-display{background:#2E291F!important;border:1px solid #655130}
:root[data-v7-active="dark"] .calc-current{color:#FFF0C5!important}
:root[data-v7-active="dark"] .calc-expression{color:#CDC1A9!important}
:root[data-v7-active="dark"] .calc-key{background:#333134!important;color:#EFE7D5!important}
:root[data-v7-active="dark"] .calc-key.operator{background:#4C3A22!important;color:#F5D591!important}
:root[data-v7-active="dark"] .calc-key.equals{background:linear-gradient(115deg,#F5D888,#D1A349)!important;color:#1B1408!important}
.btn-save{background:linear-gradient(115deg,#F5DC91,#D4A84B)!important;color:#17120A!important;box-shadow:0 5px 14px #B3872F33}
.btn-save:hover{background:linear-gradient(115deg,#FFE8A9,#DFB85D)!important}
.week-chip small{color:#706451!important}
.week-chip input:checked+span small{color:#4F3D1E!important}
:root[data-v7-active="dark"] .week-chip small{color:#BAB2A4!important}
:root[data-v7-active="dark"] .week-chip input:checked+span small{color:#59401E!important}

/* HORIZEN PWA v1.1: recover iPhone top controls, hide non-actionable status banners.
   Reverts iOS translucent status bar to the working 3.1.1 behavior.
   Never hide offline, auth, conflict or sync-failure notices. */
@media (max-width: 850px) {
  html.pwa-standalone .workspace .topbar {
    position: sticky;
    top: 0;
    z-index: 25;
    margin-bottom: 20px;
    padding: 7px 0 9px;
    background: var(--bg) !important;
    border-bottom: 1px solid var(--line);
  }
  html.pwa-standalone .workspace { padding-top: 15px !important; }
  html.pwa-standalone .cloud-banner.ready,
  html.pwa-standalone .cloud-banner.saving,
  html.pwa-standalone .cloud-banner.checking { display: none !important; }
}
