/* FinanceHub - design tokeny a základní vzhled (viz docs/UI_Design_System.md). */

:root {
    /* Barvy */
    --fh-primary: #2563eb;
    --fh-primary-dark: #1d4ed8;
    --fh-primary-soft: #dbeafe;
    --fh-secondary: #64748b;
    --fh-secondary-dark: #475569;
    --fh-secondary-soft: #f1f5f9;
    --fh-bg: #f8fafc;
    --fh-surface: #ffffff;
    --fh-text: #0f172a;
    --fh-text-muted: #64748b;
    --fh-border: #e2e8f0;
    --fh-success: #10b981;
    --fh-success-soft: #d1fae5;
    --fh-danger: #ef4444;
    --fh-danger-soft: #fee2e2;
    --fh-warning: #f59e0b;
    --fh-warning-soft: #fef3c7;

    /* Sidebar (tmavý, viz App Shell níže) */
    --fh-sidebar-bg: #0f172a;
    --fh-sidebar-text: #cbd5e1;
    --fh-sidebar-text-muted: #94a3b8;
    --fh-sidebar-active-bg: rgba(37, 99, 235, .18);
    --fh-sidebar-active-text: #60a5fa;
    --fh-sidebar-border: rgba(148, 163, 184, .16);

    /* Spacing škála */
    --fh-space-1: .25rem;
    --fh-space-2: .5rem;
    --fh-space-3: .75rem;
    --fh-space-4: 1rem;
    --fh-space-5: 1.5rem;
    --fh-space-6: 2rem;

    /* Radius a stín */
    --fh-radius-sm: 8px;
    --fh-radius-md: 12px;
    --fh-radius-lg: 16px;
    --fh-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04);
    --fh-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 4px 16px rgba(16, 24, 40, .06);
    --fh-shadow-emphasized: 0 2px 4px rgba(16, 24, 40, .08), 0 12px 28px rgba(16, 24, 40, .14);

    /* Typografie */
    --fh-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --fh-font-size-h1: 1.75rem;
    --fh-font-size-h2: 1.25rem;
    --fh-font-size-h3: 1.125rem;
    --fh-font-size-body: .9375rem;
    --fh-font-size-caption: .75rem;

    /* Přechody */
    --fh-transition: 150ms ease;

    /* Retheme Bootstrapu 5.3 přes jeho vlastní CSS proměnné - nemusíme přepisovat
       každou .btn-primary/.bg-primary/.text-primary/.badge.bg-primary zvlášť. */
    --bs-primary: var(--fh-primary);
    --bs-primary-rgb: 37, 99, 235;
    --bs-secondary: var(--fh-secondary);
    --bs-secondary-rgb: 100, 116, 139;
    --bs-success: var(--fh-success);
    --bs-success-rgb: 16, 185, 129;
    --bs-danger: var(--fh-danger);
    --bs-danger-rgb: 239, 68, 68;
    --bs-warning: var(--fh-warning);
    --bs-warning-rgb: 245, 158, 11;
    --bs-link-color: var(--fh-primary);
    --bs-link-color-rgb: 37, 99, 235;
    --bs-link-hover-color: var(--fh-primary-dark);
    --bs-body-bg: var(--fh-bg);
    --bs-body-color: var(--fh-text);
    --bs-body-font-family: var(--fh-font-family);
    --bs-border-radius: var(--fh-radius-md);
    --bs-border-radius-lg: var(--fh-radius-lg);
    --bs-border-radius-sm: var(--fh-radius-sm);
}

body {
    min-height: 100vh;
    font-family: var(--fh-font-family);
    font-size: var(--fh-font-size-body);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--fh-text);
    font-weight: 600;
}

/* Titulková škála - viz docs/UI_Design_System.md#typography. Cíleno na skutečně používané
   Bootstrap utility třídy (.h3 = titulek stránky přes page_header, .h4 = podtitulek,
   .h5 = titulek karty/sekce), ne na plošné přepsání h1-h6 (ty se používají i mimo nadpisy). */
.h3 { font-size: var(--fh-font-size-h1); }
.h4 { font-size: var(--fh-font-size-h2); }
.h5 { font-size: var(--fh-font-size-h3); }

small, .fh-caption {
    font-size: var(--fh-font-size-caption);
}

.card {
    border: none;
    border-radius: var(--fh-radius-md);
    box-shadow: var(--fh-shadow);
}

/* Dashboard widgety (KPI panel + widget grid, viz dashboard.php) - výraznější obrys a stín než
   běžné karty jinde v appce, aby se widgety vizuálně oddělily od pozadí i od sebe navzájem. */
.dashboard-widgets .card {
    border: 1px solid var(--fh-border);
    box-shadow: var(--fh-shadow-emphasized);
}

.btn {
    border-radius: var(--fh-radius-sm);
    font-weight: 500;
    transition: background-color var(--fh-transition), border-color var(--fh-transition), color var(--fh-transition);
}

.btn-primary {
    --bs-btn-hover-bg: var(--fh-primary-dark);
    --bs-btn-hover-border-color: var(--fh-primary-dark);
    --bs-btn-active-bg: var(--fh-primary-dark);
    --bs-btn-active-border-color: var(--fh-primary-dark);
}

/* Ghost tlačítko - viz docs/034_Frontend_Standards.md#buttons. Používat místo samostatné
   PHP komponenty pro jediný <button> tag. */
.btn-fh-ghost {
    background: transparent;
    border-color: transparent;
    color: var(--fh-text-muted);
}

.btn-fh-ghost:hover, .btn-fh-ghost:focus {
    background: var(--fh-secondary-soft);
    color: var(--fh-text);
}

.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
}

.form-control, .form-select {
    border-radius: var(--fh-radius-sm);
    border-color: var(--fh-border);
    transition: border-color var(--fh-transition), box-shadow var(--fh-transition);
}

.form-control:focus, .form-select:focus {
    border-color: var(--fh-primary);
    box-shadow: 0 0 0 0.2rem var(--fh-primary-soft);
}

.fh-input-narrow {
    width: 6.5rem;
}

.fh-card-narrow {
    max-width: 40rem;
}

.fh-progress-sm {
    height: 0.6rem;
}

.fh-toast-container {
    z-index: 1080;
}

.text-muted {
    color: var(--fh-text-muted) !important;
}

/* ---------- App Shell (sidebar + topbar) ---------- */

.app-shell {
    display: flex;
    min-height: 100vh;
}

/* Bootstrap 5.3 offcanvas komponenta má na .offcanvas-md (a .offcanvas-md.offcanvas-start pro width)
   vlastní pravidla s vyšší specificitou a od 768px i background-color:transparent!important ("expanded"
   chování - nad breakpointem se má offcanvas vizuálně "vypnout" a chovat jako běžný statický blok).
   Šířku/border proto přebíjíme přes Bootstrapem už čtené CSS proměnné (--bs-offcanvas-*, stejný princip
   jako retheme barev výše), skutečné pozadí/padding/layout musí nést vnitřní .app-sidebar__inner - to
   !important pravidlo na .offcanvas-md cílí jen na samotný <aside>, ne na jeho potomky. */
.app-sidebar {
    --bs-offcanvas-width: 260px;
    --bs-offcanvas-border-color: var(--fh-sidebar-border);
    flex-shrink: 0;
}

.app-sidebar__inner {
    height: 100%;
    background: var(--fh-sidebar-bg);
    padding: 1.25rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.app-sidebar__brand {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.app-sidebar__brand a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
}

.app-sidebar__brand a img {
    border-radius: 6px;
    flex-shrink: 0;
}

.app-sidebar__nav {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.app-nav-group-label {
    margin: 1rem 0 0.35rem;
    padding: 0 0.75rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--fh-sidebar-text-muted);
}

.app-nav-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.75rem;
    border-radius: var(--fh-radius-sm);
    color: var(--fh-sidebar-text);
    font-weight: 500;
    text-decoration: none;
    font-size: 0.92rem;
    transition: background-color var(--fh-transition), color var(--fh-transition);
}

.app-nav-item i {
    font-size: 1.05rem;
    width: 1.1rem;
    text-align: center;
}

.app-nav-item:hover {
    background: rgba(148, 163, 184, .1);
    color: #fff;
}

.app-nav-item.is-active {
    background: var(--fh-sidebar-active-bg);
    color: var(--fh-sidebar-active-text);
    font-weight: 600;
}

/* Tablet - sbalený sidebar (jen ikony, bez textových labelů). Mobil (< 768px) používá
   Bootstrap offcanvas (viz layout.php, .offcanvas-md - skrytý výsuvný panel), tablet i desktop
   (>= 768px) mají sidebar staticky viditelný (Bootstrapovo "expanded" chování při .offcanvas-md). */
@media (min-width: 768px) and (max-width: 991.98px) {
    .app-sidebar {
        --bs-offcanvas-width: 72px;
    }

    .app-sidebar__inner {
        padding-left: .5rem;
        padding-right: .5rem;
    }

    .app-sidebar__brand span,
    .app-nav-group-label,
    .app-nav-item span {
        display: none;
    }

    .app-nav-item {
        justify-content: center;
        padding: 0.6rem;
    }

    .app-nav-item i {
        font-size: 1.2rem;
    }
}

.app-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.app-topbar {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: var(--fh-surface);
    border-bottom: 1px solid var(--fh-border);
}

.app-sidebar-toggle {
    border: none;
    background: none;
    font-size: 1.4rem;
    color: var(--fh-text);
    line-height: 1;
}

.app-topbar__search {
    flex: 1;
    max-width: 360px;
}

.app-user-menu {
    margin-left: auto;
}

.app-user-menu__toggle {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    border: none;
    background: none;
    padding: 0.25rem 0.5rem;
}

.app-user-menu__avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: var(--fh-primary-soft);
    color: var(--fh-primary-dark);
    font-weight: 600;
    font-size: 0.85rem;
    overflow: hidden;
    flex-shrink: 0;
}

/* Profilová fotka z Google Sign-In (User::$avatarUrl, hotlink na Google CDN) - vyplní celý
   kruhový avatar stejné velikosti, jaký jinak zabírají iniciály. "border-radius: 50%" tady NENÍ
   duplicitní s rodičem (.app-user-menu__avatar má vlastní border-radius + overflow: hidden) -
   na mobilních WebKit prohlížečích (typicky iOS Safari) je známý bug, kdy "overflow: hidden" +
   "border-radius" na "display: flex" kontejneru spolehlivě neořízne vnořený obrázek do kulata
   (nahlášeno jako "hranatý" avatar na mobilu) - přímé zaoblení na <img> samotném na tenhle bug
   nezávisí. */
.app-user-menu__avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}

.app-user-menu__info {
    display: flex;
    flex-direction: column;
    text-align: left;
    line-height: 1.2;
}

.app-user-menu__name {
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--fh-text);
}

.app-user-menu__email {
    font-size: 0.78rem;
    color: var(--fh-text-muted);
}

.app-content {
    flex: 1;
    padding: 1.5rem;
}

.app-guest-header {
    padding: 1.5rem;
}

.app-guest-header__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--fh-text);
    text-decoration: none;
}

.app-guest-header__brand img {
    border-radius: 6px;
    flex-shrink: 0;
}

.app-content--guest {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.5rem 3rem;
}

.app-footer {
    padding: 1.5rem;
    font-size: 0.85rem;
}

.app-footer__version-btn {
    appearance: none;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    color: var(--fh-primary);
    text-decoration: underline;
    cursor: pointer;
}

.app-footer__version-btn:hover {
    color: var(--fh-primary-dark);
}

.app-footer__version-btn:focus-visible {
    outline: 1px dotted currentColor;
    outline-offset: 2px;
}

@media (max-width: 991.98px) {
    .app-topbar__search {
        max-width: none;
    }

    .app-user-menu__info {
        display: none;
    }
}

/* Boční panel (1/4 šířky, viz docs/Dashboard_Layout_System.md §13) - hlavní mřížka (3/4, uvnitř
   .dashboard-widget-grid níž) a panel jsou dvě NEZÁVISLÉ oblasti, "align-items: start" je
   mechanismus, kterým appka zajistí, že vysoký widget v jedné oblasti nenatáhne (a naopak
   nezkrátí) výšku té druhé - bez něj by CSS Grid řádek obě buňky standardně natáhl na stejnou
   výšku. */
.dashboard-widgets-row {
    display: grid;
    grid-template-columns: 3fr 1fr;
    align-items: start;
    gap: var(--fh-space-4);
    margin-top: var(--fh-space-1);
}

.dashboard-sidebar-stack {
    display: flex;
    flex-direction: column;
    gap: var(--fh-space-4);
}

/* Dashboard Layout Engine (viz docs/Dashboard_Layout_System.md) - CSS Grid nahrazuje Bootstrap
   .row/.col-* jen pro tenhle kontejner (gutter systém .row je založený na negativních marginech,
   ne "gap" - obojí na stejném elementu by se rvalo o mezery, proto samostatná třída bez .row/.g-3).
   Server vyrenderuje initial grid-column/grid-row inline (funguje i bez JS), dashboard-layout.js
   při tažení/resize živě přepisuje TYTO SAMÉ inline styly. */
.dashboard-widget-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: var(--dashboard-row-height, 40px);
    gap: var(--fh-space-4);
}

.dashboard-widget-grid__item {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.dashboard-widget-grid__item > [data-component="widget-refresh"] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

/* Karta vizuálně vyplní CELOU aktuální výšku buňky (min-height, ne height - když obsah potřebuje
   VÍC, karta smí být i vyšší, viz dál) - typicky nastane u widgetu vedle vyššího souseda ve
   stejném řádku po equalizeRowHeights()/equalizeShelfHeight() (viz docs/Dashboard_Layout_System.md#10.1),
   kde je buňka úmyslně vyšší, než kolik potřebuje VLASTNÍ obsah tohoto widgetu - bez tohoto
   pravidla by pod kartou zůstala prázdná mezera k okraji widgetu.
   .card-body musí mít "flex-grow: 0" (přepisuje Bootstrapovo výchozí "flex: 1 1 auto") - JINAK by
   se vrátil starý kruhový bug: .card-body by growem sledoval TUHLE (možná řádkem vyrovnanou,
   ne obsahem podloženou) výšku karty, takže by dashboard-layout.js:fitHeight() měření
   ([data-component="widget-refresh"] .scrollHeight) bylo sebe-naplňující (box by se vždy "hlásil"
   jako přesně tak velký, jak zrovna je, ne jak velký by POTŘEBOVAL být pro VLASTNÍ obsah) - auto-fit
   by se u vyššího obsahu nikdy nesrovnal na skutečnou potřebu (viditelný vnitřní posuvník i po
   doběhnutí JS). S "flex-grow: 0" zůstává .card-body na své PŘIROZENÉ velikosti bez ohledu na to,
   jak vysoká je karta kolem něj - fitHeight() tak měří skutečnou potřebu VLASTNÍHO obsahu, karta
   sama se přesto vizuálně natáhne (přebytek se projeví jako prázdné místo POD obsahem, ale UVNITŘ
   karty - ne jako mezera MIMO ni). */
.dashboard-widget-grid__item .card {
    min-height: 100%;
}

.dashboard-widget-grid__item .card-body {
    flex-grow: 0;
}

/* Patička widgetu (např. poznámka o použitém kurzu ČNB, viz InstrumentAllocationWidget) se VŽDY
   "přilepí" k dolnímu okraji widgetu, ne hned pod obsah - "margin-top: auto" ve flex-column .card
   pohltí VEŠKERÝ přebytečný prostor (viz "karta vyplní buňku" výš) mezi .card-body a patičkou, což
   patičku odsune až na dno karty. Bez pozadí (přepisuje Bootstrapovo výchozí tónované
   --bs-card-cap-bg) - patička má být tichá poznámka, ne vizuálně zvýrazněný blok; ohraničující
   linka nahoře zůstává jako jediné oddělení od obsahu nad ní. */
.dashboard-widget-grid__item .card-footer {
    margin-top: auto;
    background-color: transparent;
}

/* Oddělovník sekce (viz SectionDividerWidget) - vědomě BEZ .card obrysu/stínu (jinak by vypadal
   jako datový widget), vždy plná šířka mřížky. Nižší min-height než běžný widget - je to jen
   nadpis, ne datová karta. */
.dashboard-widget-grid__item--divider {
    min-height: 2.5rem;
}

.dashboard-widget-grid__item--divider > [data-component="widget-refresh"] {
    overflow: visible;
}

.dashboard-section-divider {
    display: flex;
    align-items: center;
    height: 100%;
    padding-top: var(--fh-space-2);
    border-bottom: 2px solid var(--fh-border);
}

.dashboard-section-divider__title {
    margin: 0;
    font-size: var(--fh-font-size-h3);
    font-weight: 600;
    color: var(--fh-text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* Tažený/klávesnicí přesouvaný widget musí kreslit NAD sousedy - CSS Grid prvky se jinak
   vykreslují v pořadí DOM, ne podle z-indexu, takže by tažená karta mohla zajet pod následující
   řádek. */
.dashboard-widget-grid__item.is-dragging,
.dashboard-widget-grid__item.is-move-mode {
    z-index: 5;
    box-shadow: var(--fh-shadow-emphasized);
}

.dashboard-widget-grid__item.is-dragging .card,
.dashboard-widget-grid__item.is-move-mode .card {
    border-color: var(--fh-primary);
}

.dashboard-widget-grid__chrome {
    position: absolute;
    top: .5rem;
    right: .5rem;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: .25rem;
    opacity: 0;
    transition: opacity var(--fh-transition);
}

.dashboard-widget-grid__item:hover .dashboard-widget-grid__chrome,
.dashboard-widget-grid__item:focus-within .dashboard-widget-grid__chrome {
    opacity: 1;
}

.dashboard-widget-grid__drag-handle,
.dashboard-widget-grid__move-handle,
.dashboard-widget-grid__kebab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border: 1px solid var(--fh-border);
    border-radius: var(--fh-radius-sm);
    background: var(--fh-surface);
    color: var(--fh-text-muted);
    cursor: grab;
}

/* Nahoru/dolů úchyty bočního panelu (viz docs/Dashboard_Layout_System.md §13) - obyčejná tlačítka
   (žádná pointer/drag fyzika jako .dashboard-widget-grid__drag-handle), "cursor: grab" po nich
   proto nedědí. */
.dashboard-widget-grid__move-handle,
.dashboard-widget-grid__kebab {
    cursor: pointer;
}

.dashboard-widget-grid__drag-handle:hover,
.dashboard-widget-grid__move-handle:hover,
.dashboard-widget-grid__kebab:hover {
    color: var(--fh-primary);
    border-color: var(--fh-primary);
}

.dashboard-widget-grid__drag-handle:focus-visible,
.dashboard-widget-grid__move-handle:focus-visible,
.dashboard-widget-grid__kebab:focus-visible,
.dashboard-widget-grid__resize-handle:focus-visible {
    outline: 2px solid var(--fh-primary);
    outline-offset: 2px;
}

.dashboard-widget-grid__drag-handle.is-move-mode {
    color: #fff;
    background: var(--fh-primary);
    border-color: var(--fh-primary);
    cursor: grabbing;
}

.dashboard-widget-grid__resize-handle {
    position: absolute;
    right: 2px;
    bottom: 2px;
    z-index: 2;
    width: 1rem;
    height: 1rem;
    border: none;
    background: transparent;
    cursor: nwse-resize;
    opacity: 0;
    transition: opacity var(--fh-transition);
}

.dashboard-widget-grid__item:hover .dashboard-widget-grid__resize-handle,
.dashboard-widget-grid__item:focus-within .dashboard-widget-grid__resize-handle,
.dashboard-widget-grid__resize-handle.is-resize-mode {
    opacity: 1;
}

.dashboard-widget-grid__resize-handle::after {
    content: '';
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--fh-text-muted);
    border-bottom: 2px solid var(--fh-text-muted);
}

.dashboard-widget-grid__resize-handle.is-resize-mode::after {
    border-color: var(--fh-primary);
}

/* Tablet a mobil (< 992px): jen čtení, žádný drag/resize - dashboard-layout.js
   (DashboardLayout.applyResponsiveLayout()) vizuálně přeskupí widgety do jednoho plnou-šířku
   sloupce (v pořadí y, pak x) a přepíše grid-column/grid-row inline. "grid-column: 1/-1 !important"
   tady je záchranná síť pro chvíli PŘED proběhnutím JS (appka jinak vykresluje initial
   grid-column/grid-row jako inline styl už ze serveru, viz widget_grid_item.php - bez !important
   by ho tahle pravidla vůbec nepřebila, inline styl má vyšší specificitu). "grid-row: auto"
   záměrně BEZ !important - běžící JS ho vzápětí přepíše na přesnou výšku widgetu; kdyby "auto"
   vyhrálo i po doběhnutí JS, každý widget by se zploštil na jedinou (40px) mřížkovou buňku bez
   ohledu na skutečný obsah. */
@media (max-width: 991.98px) {
    /* Boční panel se pod touhle hranicí přeskupí POD hlavní mřížku (jeden sloupec, panel druhý -
       stejná konvence jako mobilní jednosloupcový stack hlavní mřížky výš), ne vedle ní - vlastní
       obsah panelu (widgety) zůstává funkční (nahoru/dolů tlačítka fungují i na dotyk), jen bez
       postranního 1/4 sloupce, na který by se při úzké obrazovce nic nevešlo. */
    .dashboard-widgets-row {
        grid-template-columns: 1fr;
    }

    .dashboard-widget-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-widget-grid__item {
        grid-column: 1 / -1 !important;
        grid-row: auto;
    }

    .dashboard-widget-grid__drag-handle,
    .dashboard-widget-grid__resize-handle {
        display: none;
    }
}

.dashboard-manage-widgets__row {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .5rem 0;
    border-bottom: 1px solid var(--fh-border);
}

.dashboard-manage-widgets__row:last-child {
    border-bottom: none;
}

.dashboard-manage-widgets__icon {
    color: var(--fh-text-muted);
}

.dashboard-manage-widgets__label {
    flex: 1;
}

.bank-notifications-modal__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .5rem 0;
    border-bottom: 1px solid var(--fh-border);
}

.bank-notifications-modal__row:last-child {
    border-bottom: none;
}