/* ======================================================================
   03. CONTROLS
   Tlacidla, press-feedback, sipky obdobi

   Poradie suborov v index.html je zavazne -- kaskada od neho zavisi.
   Tento subor obsahuje povodne sekcie 03-08.
   ====================================================================== */

/* ======================================================================
   03. [MIXED]  qwick-moves-surfaces
   Main stylesheet: trip list, trip entry, rate/commission, export,
   logo settings
   ====================================================================== */
/* ---------- Rozostrenie plochy za popredim ----------
   Dashboard ustupi do pozadia rozostrenim 10 px. Deje sa to v DVOCH
   situaciach a obe su tu:

     otvoreny sheet     `body.modal-open`
     QWICK MENU         `body.fab-choice-open` -- typy, tagy aj formular

   Druha z nich je JEDNA trieda pre vsetky tri stavy menu zamerne. Kym mal
   kazdy stav vlastny cielovy stav (`moves-tag-blur-out`,
   `qwick-type-blur-out`, `qwick-amount-blur-out`), boli to tri takmer
   totozne pravidla po piatich selektoroch a rozdiel medzi nimi ziadny --
   menili to iste na to iste. Dnes je odchod jeden: `qwick-blur-release`.

   Casovanie vlastni JEDEN kontrakt: `--qwick-blur-transition`. Komponent
   rozhoduje len o tom, ci je rozostreny, nikdy o tom, ako dlho mu to trva.

   ZATMAVENIE TU NIE JE a nevracia sa. Plocha je rozostrena, nie tmava. */
#screen-index > header,
#screen-index > #periods,
#screen-index > #periodNav,
#screen-index > main,
#screen-index > .footer-note,
#homeFabLayer > #fab{
  transition:var(--qwick-blur-transition), var(--qwick-fade-in);
}
/* Kludovy stav sa pise CISLOM, nie `none`. Safari neinterpoluje
   `none -> blur(10px)` rovnako ako `blur(0px) -> blur(10px)`, takze bez
   tohto riadka bezali dve formy toho isteho nabehu roznou rychlostou,
   hoci obe citali ten isty kontrakt casovania. */
#screen-index > header,
#screen-index > #periods,
#screen-index > #periodNav,
#screen-index > main,
#screen-index > .footer-note{
  filter:blur(0px);
}

/* Kazdy bezny sheet v oboch obrazovkach uz nasadzuje body.modal-open. */
body.modal-open #screen-index > header,
body.modal-open #screen-index > #periods,
body.modal-open #screen-index > #periodNav,
body.modal-open #screen-index > main,
body.modal-open #screen-index > .footer-note,
body.modal-open #homeFabLayer > #fab{
  filter:blur(10px);
  /* Sheet je priesvitny, takze dashboard musi byt na plnom rozostreni uz
     v prvom snimku -- inak by cez sheet presvitali jeho doostrujuce sa
     snimky. Plati to IBA pri otvarani: `filter` tu nie je v zozname
     vlastnosti prechodu, takze zatvaranie nadalej vlastni pravidlo vyssie
     a odchod rozostrenia sa normalne odjazdi. */
  transition:filter 0s,var(--qwick-fade-out);
}
/* Sheet je popredie, nie priesvitna lupa na Qwick tlacidlo. Samotny FAB sa
   pocas otvoreneho sheetu uplne skryje, aby jeho ziara ani obrys nepresvital. */
body.modal-open #homeFabLayer > #fab{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

/* QWICK MENU: rozostri sa to, co je ZA volbami. Jedno pravidlo pre vsetky
   tri stavy menu -- typy, tagy aj formular -- lebo vsetky tri drzi
   `fab-choice-open` a vo vsetkych troch ustupuje ta ista plocha.

   HLBKA JE 10 px, rovnako ako pri sheete -- to je jedno cislo pre celu
   aplikaciu. Menu sa od sheetu odlisuje ZATMAVENIM, nie hlbsim
   rozostrenim: volby su len par pilulek plavajucich nad plochou, takze
   plocha musi hlavne stmavnut, aby s nimi nesuperila.

   ZATMAVENIE JE `brightness()` V TOM ISTOM `filter`, nie zavoj navyse.
   Zavoj uz raz existoval ako `.qwick-fab-layer-scope::before` a bol
   zruseny -- kreslil cez celu vrstvu a zhadzovali ho tri stavy naraz.
   Ako druha funkcia toho isteho filtra nepotrebuje ziadny prvok, ziadny
   stav navyse a odchadza presne s rozostrenim, lebo je to jedna
   vlastnost a jeden prechod. `.30` zodpoveda ciernemu zavoju pri 70 %,
   teda tomu istemu stupnu, aky nesie plocha pod sheetom
   (`--qwick-veil`). */
body.fab-choice-open:not(.modal-open) #screen-index > header,
body.fab-choice-open:not(.modal-open) #screen-index > #periods,
body.fab-choice-open:not(.modal-open) #screen-index > #periodNav,
body.fab-choice-open:not(.modal-open) #screen-index > main,
body.fab-choice-open:not(.modal-open) #screen-index > .footer-note{
  filter:blur(10px) brightness(.30);
}
/* Samotne QWICK tlacidlo sa nerozostruje -- je SUCASTOU popredia. Ma vlastne
   casovanie prichodu a odchodu volieb. */
body.fab-choice-open:not(.modal-open) #homeFabLayer > #fab{
  transition:transform .34s cubic-bezier(.32,.72,.35,1),
             var(--qwick-fade-out),
             box-shadow .2s ease-out;
}
/* ODCHOD ROZOSTRENIA MA VLASTNU ZNACKU, lebo zamok plochy odchadza neskor
   nez obraz. `fab-choice-open` drzi plochu zamknutu az do resetFabChoice()
   -- teda cely cas zatvaracej animacie -- ale rozostrenie sa ma zacat
   uvolnovat hned v prvom jej snimku. Bez toho sa dashboard vracal az po
   dobehnuti animacie a odchod posobil ako dva prechody za sebou.

   Specificita je o triedu vyssia nez u pravidla vyssie, takze `!important`
   netreba. Cas vlastni nadalej `--qwick-blur-transition` zo zakladneho
   pravidla -- tato trieda meni IBA ciel. */
body.fab-choice-open.qwick-blur-release:not(.modal-open) #screen-index > header,
body.fab-choice-open.qwick-blur-release:not(.modal-open) #screen-index > #periods,
body.fab-choice-open.qwick-blur-release:not(.modal-open) #screen-index > #periodNav,
body.fab-choice-open.qwick-blur-release:not(.modal-open) #screen-index > main,
body.fab-choice-open.qwick-blur-release:not(.modal-open) #screen-index > .footer-note{
  filter:blur(0px) brightness(1);
}
/* While qwick-add owns the foreground, the dashboard is visual backdrop only. */
body.fab-choice-open:not(.modal-open) #screen-index > header,
body.fab-choice-open:not(.modal-open) #screen-index > #periods,
body.fab-choice-open:not(.modal-open) #screen-index > #periodNav,
body.fab-choice-open:not(.modal-open) #screen-index > main,
body.fab-choice-open:not(.modal-open) #screen-index > .footer-note,
body.fab-choice-open:not(.modal-open) #homeFabLayer > #fab,
body.fab-choice-open:not(.modal-open) #screen-index *{
  pointer-events:none;
}

/* Qwick-add owns Home as a modal interaction, not only as a blur effect.
   Freeze the actual dashboard scroll container and page-swipe surface until
   resetFabChoice() removes fab-choice-open after the closing animation. */
body.fab-choice-open:not(.modal-open) #screen-index{
  overflow:hidden;
  overscroll-behavior:none;
  touch-action:none;
  -webkit-overflow-scrolling:auto;
}
body.fab-choice-open:not(.modal-open) #app-track{
  touch-action:none;
}
@media (prefers-reduced-motion:reduce){
.press-up,
.press-up-lg,
#fab{ transition-duration:.01ms; }
}

/* Fill the complete standalone iOS window, including the home-indicator area.
   The app screens still keep their own safe-area padding, so content stays usable. */
html.ios-standalone-fullscreen,
html.ios-standalone-fullscreen body,
html.ios-standalone-fullscreen #app-viewport{
  height: var(--app-viewport-height, 100dvh);
  min-height: var(--app-viewport-height, 100dvh);
}
html.ios-standalone-fullscreen #app-viewport{
  bottom: auto;
}

/* ======================================================================
   04. [HOME/QWICK]  qwick-button-cosmetics-a
   FAB expense/income choice button colors
   ====================================================================== */
.qwick-surface .fab-choice-exp{color:var(--danger);transform:translate3d(-148px,0,0);}.qwick-surface .fab-choice-inc{color:var(--mint);transform:translate3d(148px,0,0);}

/* Pill shape for dashboard/history actions without changing their dimensions. */
.qwick-surface #moreBtn{
  border-radius: 999px !important;
}.qwick-surface .tag-settings-btn{width:94px;height:36px;border-radius:999px;background:var(--surface3);border:1px solid rgba(201,138,75,.72);color:#c98a4b;display:flex;align-items:center;justify-content:center;position:absolute;top:16px;right:16px;padding:0;line-height:1;overflow:hidden;font-size:12.5px;font-weight:850;letter-spacing:.01em;z-index:5;transition:width .28s cubic-bezier(.32,.72,.35,1),
              border-radius .28s cubic-bezier(.32,.72,.35,1),
              color .2s ease, background .2s ease, transform .08s ease;transform-origin:right center;}
.qwick-surface .tag-settings-btn.settings-back-mode{
  width: 36px;
  min-width: 36px;
  border-radius: 50%;
  padding: 0;
  font-size: 20px;
  letter-spacing: 0;
  color: #d79a5a;
  background: rgba(201,138,75,.14);
  border-color: rgba(201,138,75,.82);
}

/* ======================================================================
   05. [GLOBAL]  press-animation-restoration
   PROTECTED -- restores press-feedback transitions after cosmetic
   overrides; do not remove, see its own comment
   ====================================================================== */
/* Generic controls grow slightly. Shared action controls have their own
   scale-down feedback in 10-materials.css and are not tagged with this class. */
.press-up,
.press-up-lg{
  /* Jeden vlastnik transformu pre kazde tlacidlo: stavy don vstupuju
     PREMENNYMI, nie druhym pravidlom. `--tap-scale` nesie stlacenie aj
     objavenie sa (Spat), `--press-shift` a `--press-lift` presun dlazdice na
     nove miesto v poradi. Presun ma OBE osi: mriezka upravy ma styri stlpce
     a citanie jeden riadok, takze dlazdica pri Ulozit casto meni aj riadok --
     s jednou osou by vodorovne klzala a zvisle skakala. */
  transform: translate3d(var(--press-shift, 0px),var(--press-lift, 0px),0) scale(var(--tap-scale, 1));
  transition: transform .24s cubic-bezier(.34,1.56,.64,1);
  will-change: transform;
}.press-up.is-pressed{--tap-scale:var(--tap-scale-press);transition:transform .07s cubic-bezier(.4,0,1,1);}
#fab{transition:transform .24s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease-out, var(--qwick-fade-in);will-change:transform, box-shadow, opacity;}
#fab.is-pressed{transform:translateX(-50%) scale(.96);box-shadow:none;}
/* Preserve the tag-settings pill-to-circle morph while allowing its press scale. */
.qwick-surface .tag-settings-btn.press-up{
  transform:scale(var(--tap-scale,1));
  transition:width .28s cubic-bezier(.32,.72,.35,1),border-radius .28s cubic-bezier(.32,.72,.35,1),color .2s ease,background .2s ease,transform .24s cubic-bezier(.34,1.56,.64,1);
}
.qwick-surface .tag-settings-btn.press-up.is-pressed{
  transition:width .28s cubic-bezier(.32,.72,.35,1),border-radius .28s cubic-bezier(.32,.72,.35,1),color .2s ease,background .2s ease,transform .07s cubic-bezier(.4,0,1,1);
}

/* ======================================================================
   06. [HOME/QWICK]  qwick-button-cosmetics-b
   Tag settings back-button styling
   ====================================================================== */
.qwick-surface .tag-settings-back{width:36px;height:36px;border-radius:50%;display:none;align-items:center;justify-content:center;position:absolute;top:16px;right:16px;padding:0;font-size:20px;line-height:1;z-index:5;min-width:36px;font-weight:850;}

/* Period navigation arrows are styled in full by
   period-arrows-match-period-buttons below, which supersedes this
   block's .period-nav-btn rule (same selector, later in source order,
   same !important weight) and explicitly disables the ::before this
   block drew. Removed here to avoid the two versions drifting apart;
   verified via computed-style snapshot that nothing rendered changes. */

/* ======================================================================
   07. [GLOBAL]  period-arrows-match-period-buttons
   Period nav arrow buttons (←/→) — period-button surface language.
   Moves keeps the blue accent; Trips uses green. No coloured
   border/tint.
   ====================================================================== */
.qwick-surface .period-nav-btn{
  flex:0 0 36px;
  width:36px;
  height:36px;
  min-width:36px;
  border-radius:50%;
  font-size:19px;
  line-height:1;
  font-weight:800;
  display:flex;
  place-items:center;
  padding:0;
  position:relative;
  align-items:center;
  justify-content:center;
  transition:transform .24s cubic-bezier(.34,1.56,.64,1),opacity .18s ease,background .18s ease;
}
.qwick-surface .period-nav-btn{color:var(--accent);}
.qwick-surface .period-nav-btn::before{
  content:none;
  display:none;
}

/* ======================================================================
   08. [GLOBAL]  qwick-button-cosmetics-c
   Large-press-target tap-scale tuning
   ====================================================================== */
.press-up-lg.is-pressed{--tap-scale:var(--tap-scale-press-lg)!important;transition:transform .07s cubic-bezier(.4,0,1,1);}
/* Preskladanie poradia: dlazdica najprv skoci na svoje STARE miesto bez
   prechodu a az v dalsom snimku sa pusti na nove. Ten jediny snimok bez
   prechodu patri sem, k pravidlu, ktore prechod vlastni. */
.press-up.is-reflowing,.press-up-lg.is-reflowing{transition:none;}

.qwick-surface .fab-choice-row.show .fab-choice.is-pressed{transform:translate3d(0,0,0) scale(1.075);filter:none;}