/* Nov 9 V8 — Screenshot-driven Safari correction. The native <select> is
   maintained for accessibility, keyboard and iOS picker interaction, but its
   chrome (which WebKit can paint *despite* appearance:none) is fully invisible.
   Exactly one arrow is an authored SVG. */
html[data-baakee-theme] body #modal-root .v12524-rule .u5-rollover-select-wrap,
#modal-root .v12524-rule .u5-rollover-select-wrap {
  position:relative!important;
  display:block!important;
  height:48px!important;
  min-height:48px!important;
  border:1px solid var(--baakee-glass-border,var(--line))!important;
  border-radius:15px!important;
  background:var(--baakee-card-fill,var(--card))!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
/* Erase every historical pseudo-chevron (V5/V7 and thematic selectors). */
html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .v12524-section .v12524-rule .u5-rollover-select-wrap::before,
html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .v12524-section .v12524-rule .u5-rollover-select-wrap::after,
html[data-baakee-theme] body #modal-root .v12524-section .v12524-rule .u5-rollover-select-wrap::before,
html[data-baakee-theme] body #modal-root .v12524-section .v12524-rule .u5-rollover-select-wrap::after,
#modal-root .v12524-section .v12524-rule .u5-rollover-select-wrap::before,
#modal-root .v12524-section .v12524-rule .u5-rollover-select-wrap::after {
  content:none!important;
  display:none!important;
  border:0!important;
  background:none!important;
}
/* Visible copy and lone chevron are siblings of the still-functional select. */
html[data-baakee-theme] body #modal-root .v12524-rule .u5-rollover-visible,
#modal-root .v12524-rule .u5-rollover-visible {
  position:absolute!important;
  z-index:1!important;
  inset:0 29px 0 13px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  font-size:14px!important;
  font-weight:650!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  color:var(--baakee-ink,var(--text))!important;
  -webkit-text-fill-color:var(--baakee-ink,var(--text))!important;
  pointer-events:none!important;
}
html[data-baakee-theme] body #modal-root .v12524-rule svg.u5-rollover-v8-chevron,
#modal-root .v12524-rule svg.u5-rollover-v8-chevron {
  position:absolute!important;
  display:block!important;
  z-index:1!important;
  top:50%!important;
  right:11px!important;
  width:17px!important;
  height:17px!important;
  transform:translateY(-50%)!important;
  color:var(--baakee-ink,var(--text))!important;
  background:none!important;
  box-shadow:none!important;
  pointer-events:none!important;
}
/* Visually transparent native control remains 100% tappable, unlike a
   display:none select. This also removes iOS's tinted double native arrows. */
html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .v12524-rule .u5-rollover-select-wrap > select.u5-rollover-rule-select,
html[data-baakee-theme] body #modal-root .v12524-rule .u5-rollover-select-wrap > select.u5-rollover-rule-select,
#modal-root .v12524-rule .u5-rollover-select-wrap > select.u5-rollover-rule-select {
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  z-index:3!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  opacity:0!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
#modal-root .v12524-rule .u5-rollover-select-wrap:focus-within {
  outline:2px solid var(--baakee-accent,var(--accent))!important;
  outline-offset:2px!important;
}
@media(max-width:420px){
  #modal-root .v12524-rule .u5-rollover-visible {inset:0 25px 0 11px!important;}
  #modal-root .v12524-rule svg.u5-rollover-v8-chevron {right:9px!important;}
}
/* Reports & Trends: restore the existing dynamic supporting text on iPhone.
   Legacy U4 mobile CSS explicitly hid this element. Match iPad semantics. */
@media(max-width:600px){
  /* The U4 iPhone rule also caps the parent section to 62px. Release that
     ceiling for BOTH tiles, otherwise the subtitle paints outside the card. */
  #app#app main.u4-finance-home.u4q-paired-utilities > .u4fw-utility-pair > .u4-finance-reports,
  #app#app main.u4-finance-home.u4q-paired-utilities > .u4fw-utility-pair > .u4-salary-banner {
    min-height:80px!important;
    height:100%!important;
    max-height:none!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  #app#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports > button > small {
    display:block!important;
    visibility:visible!important;
    opacity:.76!important;
    grid-column:auto!important;
    grid-row:auto!important;
    align-self:stretch!important;
    font-size:10.5px!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow:visible!important;
    overflow-wrap:normal!important;
    text-overflow:clip!important;
    max-height:none!important;
    height:auto!important;
    min-width:0!important;
    width:100%!important;
    margin:0!important;
  }
  #app#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports > button > b {
    display:block!important;
    grid-row:auto!important;
    grid-column:auto!important;
    align-self:stretch!important;
    margin:0!important;
    font-size:12px!important;
    line-height:1.25!important;
  }
  #app#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports > button,
  #app#app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner {
    height:auto!important;
    min-height:78px!important;
    max-height:none!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
}
