/* HORIZEN 1.3 — Standalone safe-area + branded settings corrections only.
   Preserves all financial state, API, D1 schema and existing actions.
   The v1.2 fixed topbar only applied <=850px; iPad PWA >850px was uncovered.
*/
:root{--hz-top-clearance:0px}
/* iPadOS standalone may expose safe-area-inset-top as 0 even when the iPad system
   status row still overlays the web content. Leave a practical nonzero margin. */
html.pwa-standalone.hz-ios-ipad{--hz-top-clearance:max(30px,env(safe-area-inset-top,0px));--hz-safe-top:var(--hz-top-clearance)}
html.pwa-standalone.hz-ios-iphone{--hz-top-clearance:max(52px,env(safe-area-inset-top,0px));--hz-safe-top:var(--hz-top-clearance)}
/* For other installed-mode browsers, follow the platform-provided safe area. */
html.pwa-standalone:not(.hz-ios-ipad):not(.hz-ios-iphone){--hz-top-clearance:env(safe-area-inset-top,0px)}
/* Solid surface behind iOS status text, regardless of app light/dark theme. */
html.pwa-standalone.hz-ios-ipad body::before,
html.pwa-standalone.hz-ios-iphone body::before{
 content:'';display:block;position:fixed;inset:0 0 auto 0;height:var(--hz-top-clearance);
 background:#111112;pointer-events:none;z-index:1900;
}
/* Tablet in landscape (desktop-like navigation): the sidebar and header must
   both start UNDER iPadOS status text and stay within the visible viewport. */
@media(min-width:851px){
 html.pwa-standalone.hz-ios-ipad .shell>.sidebar.hz-sidebar{
  top:var(--hz-top-clearance)!important;
  height:calc(100dvh - var(--hz-top-clearance))!important;
  max-height:calc(100dvh - var(--hz-top-clearance))!important;
 }
 html.pwa-standalone.hz-ios-ipad .shell>.workspace{
  padding-top:calc(var(--hz-top-clearance) + 12px)!important;
 }
 html.pwa-standalone.hz-ios-ipad .shell>.workspace>.topbar{
  position:sticky!important;top:var(--hz-top-clearance)!important;
  z-index:900!important;
  background:#111112!important;border:1px solid #50432C!important;
  border-radius:14px!important;min-height:56px!important;
  margin-bottom:24px!important;padding:8px 12px!important;
  box-shadow:0 5px 14px #00000026!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
 }
 html.pwa-standalone.hz-ios-ipad .shell>.workspace>.topbar .vbrandmini{color:#F5E5C0!important}
 html.pwa-standalone.hz-ios-ipad .shell>.workspace>.topbar .vbrandmini strong{color:#F5E5C0!important}
}
/* Tablet portrait and phone: use one consistent offset for the header, content
   and drawer; never mix 0px env() with hard-coded header height. */
@media(max-width:850px){
 html.pwa-standalone.hz-ios-ipad .shell>.workspace>.topbar,
 html.pwa-standalone.hz-ios-iphone .shell>.workspace>.topbar{
  top:var(--hz-top-clearance)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
 }
 html.pwa-standalone.hz-ios-ipad .shell>.workspace,
 html.pwa-standalone.hz-ios-iphone .shell>.workspace{
  padding-top:calc(var(--hz-top-clearance) + 83px)!important;
 }
 html.pwa-standalone.hz-ios-ipad .shell>.workspace:has(.topbar .month-pill),
 html.pwa-standalone.hz-ios-iphone .shell>.workspace:has(.topbar .month-pill){
  padding-top:calc(var(--hz-top-clearance) + 124px)!important;
 }
 html.pwa-standalone.hz-ios-ipad .shell>.sidebar.hz-sidebar,
 html.pwa-standalone.hz-ios-iphone .shell>.sidebar.hz-sidebar{
  padding-top:calc(var(--hz-top-clearance) + 13px)!important;
 }
}
/* Standalone overlay must not hide status bar nor put dialog close button below it. */
html.pwa-standalone.hz-ios-ipad #modal-root .modal-backdrop,
html.pwa-standalone.hz-ios-iphone #modal-root .modal-backdrop{
 padding-top:calc(var(--hz-top-clearance) + 12px)!important;
 padding-bottom:max(16px,env(safe-area-inset-bottom,0px))!important;
}
html.pwa-standalone.hz-ios-ipad #modal-root .modal,
html.pwa-standalone.hz-ios-iphone #modal-root .modal{
 max-height:calc(100dvh - var(--hz-top-clearance) - env(safe-area-inset-bottom,0px) - 26px)!important;
}
/* The old backup/action dialog retained original blue/white buttons. Keep actions
   unchanged, style them like the HORIZEN navigation, even with the light theme. */
#modal-root .hz-settings-modal,
#modal-root .hz-settings-modal .modal-head,
:root[data-v7-active="dark"] #modal-root .hz-settings-modal,
:root[data-v7-active="dark"] #modal-root .hz-settings-modal .modal-head{
 background:#19191B!important;color:#F8F5EE!important;
 border-color:#4D4332!important;
}
#modal-root .hz-settings-modal{
 width:min(100%,540px);border:1px solid #605135!important;
 box-shadow:0 22px 65px #0009,0 0 0 1px #9D792324;
}
#modal-root .hz-settings-modal h2,
:root[data-v7-active="dark"] #modal-root .hz-settings-modal h2{
 color:#F9F6EE!important;letter-spacing:-.02em!important;
}
#modal-root .hz-settings-modal .modal-desc,
#modal-root .hz-settings-modal .settings-note{color:#C7C0B4!important}
#modal-root .hz-settings-modal .settings-actions{gap:9px!important;margin-top:20px!important}
#modal-root .hz-settings-modal .settings-actions button,
:root[data-v7-active="dark"] #modal-root .hz-settings-modal .settings-actions button{
 background:#28272A!important;color:#F6F2E9!important;
 border:1px solid #504737!important;border-radius:13px!important;
 min-height:60px!important;padding:12px 13px!important;
 display:flex;align-items:center;justify-content:space-between;gap:10px;
 font-size:13px!important;line-height:1.4!important;
 box-shadow:inset 0 1px 0 #ffffff06!important;
}
#modal-root .hz-settings-modal .settings-actions button:hover,
#modal-root .hz-settings-modal .settings-actions button:focus-visible{
 border-color:#D7B15B!important;background:#342E25!important;
}
#modal-root .hz-settings-modal .settings-actions button span:first-child{color:#F6F2E9!important}
#modal-root .hz-settings-modal .settings-actions button small,
:root[data-v7-active="dark"] #modal-root .hz-settings-modal .settings-actions button small{
 color:#BEB9AD!important;font-weight:480!important;line-height:1.6!important;
}
#modal-root .hz-settings-modal .settings-actions button span:last-child{
 flex:0 0 31px;display:grid;place-items:center;
 min-width:31px;min-height:31px;border-radius:9px;
 background:#413621!important;color:#EBD08C!important;
 font-size:17px;font-weight:800;
}
#modal-root .hz-settings-modal .settings-actions button[data-action="clear-month"]{
 border-color:#6D3C41!important;
}
#modal-root .hz-settings-modal .settings-actions button[data-action="clear-month"] span:first-child,
#modal-root .hz-settings-modal .settings-actions button[data-action="clear-month"] span:first-child[style]{
 color:#FF9699!important;
}
#modal-root .hz-settings-modal .settings-actions button[data-action="clear-month"] span:last-child{
 background:#47272B!important;color:#FFABAE!important;
}
#modal-root .hz-settings-modal .close-btn{
 min-width:38px;width:38px;height:38px;background:#302B24!important;
 border:1px solid #5F5036!important;color:#F0D397!important;
}
@media(max-width:640px){
 #modal-root .hz-settings-modal{padding:20px 17px!important;border-radius:22px!important}
}
@media(prefers-reduced-motion:reduce){
 #modal-root .hz-settings-modal *{scroll-behavior:auto!important}
}
/* iOS translucent/light haze regression: make the installed-app header and its
   immediate canvas opaque, without touching Safari browser appearance. */
html.pwa-standalone.hz-ios-ipad .shell>.workspace,
html.pwa-standalone.hz-ios-iphone .shell>.workspace{
 background-image:none!important;
}
html.pwa-standalone.hz-ios-ipad .shell>.workspace>.topbar,
html.pwa-standalone.hz-ios-iphone .shell>.workspace>.topbar{
 box-shadow:none!important;
 background-image:none!important;
}
