/* =====================================================================
   RPG Banka — Frontend styly
   Záměrně NEPOUŽÍVÁ hardkódované barvy — dědí vše ze šablony webu.
   Výjimka: barvy pro stav (+/−), které musí být sémanticky jasné.
   ===================================================================== */

/* ── Hlavní kontejner ────────────────────────────────────────────── */
.bank-page {
    width: 100%;
    padding: 0;
}

.bank-breadcrumb {
    margin-bottom: 1em;
    font-size: .9em;
    opacity: .7;
}
.bank-breadcrumb a {
    color: inherit;
    text-decoration: none;
}
.bank-breadcrumb a:hover {
    text-decoration: underline;
    opacity: 1;
}

.bank-title {
    font-size: 1.6em;
    font-weight: bold;
    margin: 0 0 1.25em;
    padding-bottom: .4em;
    border-bottom: 2px solid currentColor;
    opacity: .9;
}

/* ── Přehledové karty ────────────────────────────────────────────── */
.bank-overview {
    display: flex;
    gap: 1.25em;
    margin-bottom: 1.75em;
    flex-wrap: wrap;
}

.bank-card {
    flex: 1;
    min-width: 240px;
    border: 1px solid;
    border-color: inherit;
    border-radius: 4px;
    padding: 1em 1.25em;
}

/* Mírný vizuální akcent pro nadpis karty přes opacity, nikoliv pevnou barvu */
.bank-card-wallet  { border-top-width: 3px; }
.bank-card-account { border-top-width: 3px; }

.bank-card-title {
    font-size: .8em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0 0 .9em;
    opacity: .7;
}

.bank-balance-table {
    width: 100%;
    border-collapse: collapse;
}
.bank-balance-table th {
    text-align: left;
    font-size: .8em;
    opacity: .6;
    padding: .2em 0 .4em;
    border-bottom: 1px solid;
    border-color: inherit;
}
.bank-balance-table td {
    padding: .4em 0;
    vertical-align: middle;
    border-bottom: 1px solid;
    border-color: inherit;
    opacity: .9;
}
.bank-balance-table tr:last-child td { border-bottom: none; }

.bank-cur-name {
    display: flex;
    align-items: center;
    gap: .4em;
    font-size: .9em;
    opacity: .8;
}
.bank-cur-balance {
    font-weight: bold;
    text-align: right;
    font-size: 1em;
}
.bank-month-start {
    font-size: .85em;
    opacity: .6;
    text-align: right;
}
.bank-planned-out {
    font-size: .85em;
    /* červená barva pro výdaje — vždy sémanticky platná */
    color: #c00;
}
.bank-cur-icon {
    height: 1.2em;
    width: 1.2em;
    object-fit: contain;
    vertical-align: middle;
}
.bank-none { opacity: .35; }
.bank-empty {
    font-style: italic;
    opacity: .5;
    font-size: .9em;
}

/* ── Akce ────────────────────────────────────────────────────────── */
.bank-actions {
    margin-bottom: 1.75em;
    display: flex;
    gap: .6em;
    flex-wrap: wrap;
}

/* Tlačítka — stylováno jako nativní <a class="button"> šablony */
.bank-btn {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    padding: .5em 1em;
    border: 1px solid;
    border-color: inherit;
    border-radius: 3px;
    font-size: .95em;
    font-weight: bold;
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    background: transparent;
    opacity: .85;
    transition: opacity .15s;
}
.bank-btn:hover { opacity: 1; }

/* Primární akce — lehce odlišeno, ale stále v duchu šablony */
.bank-btn-primary {
    opacity: 1;
    font-weight: bold;
}

/* ── Sekce (historie transakcí, plánované platby) ────────────────── */
.bank-section {
    margin-bottom: 1.5em;
    padding: 1em 1.25em;
    border: 1px solid;
    border-color: inherit;
    border-radius: 4px;
}
.bank-section h2 {
    font-size: .8em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0 0 1em;
    opacity: .7;
}

/* ── Filtry transakcí ────────────────────────────────────────────── */
.bank-tx-filters {
    display: flex;
    gap: .4em;
    margin-bottom: 1em;
    flex-wrap: wrap;
}
.bank-filter-btn {
    padding: .25em .75em;
    border-radius: 20px;
    border: 1px solid;
    border-color: inherit;
    color: inherit;
    font-size: .82em;
    text-decoration: none;
    opacity: .65;
    transition: opacity .15s;
}
.bank-filter-btn:hover { opacity: 1; }
.bank-filter-active { opacity: 1; font-weight: bold; }

/* ── Tabulka transakcí ───────────────────────────────────────────── */
.bank-tx-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9em;
}
.bank-tx-table th {
    text-align: left;
    font-size: .78em;
    opacity: .6;
    padding: .3em .5em .5em;
    border-bottom: 2px solid;
    border-color: inherit;
    white-space: nowrap;
}
.bank-tx-table td {
    padding: .5em .5em;
    border-bottom: 1px solid;
    border-color: inherit;
    opacity: .9;
    vertical-align: top;
}
.bank-tx-table tr:last-child td { border-bottom: none; }
.bank-tx-cancelled td { opacity: .4; text-decoration: line-through; }

.bank-tx-date { opacity: .6; font-size: .85em; white-space: nowrap; }
.bank-tx-amount { text-align: right; font-weight: bold; white-space: nowrap; }

/* Sémantické barvy — příjem zelená, výdaj červená */
.bank-in  { color: #1a7a3c; }
.bank-out { color: #b91c1c; }
.bank-cancelled { color: #b91c1c; font-size: .8em; }

/* ── Stránkování ─────────────────────────────────────────────────── */
.bank-pagination {
    display: flex;
    gap: .35em;
    margin-top: .75em;
    flex-wrap: wrap;
}
.bank-page-btn {
    padding: .25em .65em;
    border: 1px solid;
    border-color: inherit;
    color: inherit;
    text-decoration: none;
    font-size: .85em;
    opacity: .65;
}
.bank-page-active { opacity: 1; font-weight: bold; }

/* ── Notifikace ──────────────────────────────────────────────────── */
.bank-notice {
    padding: .75em 1em;
    margin-bottom: 1.25em;
    font-size: .95em;
    border-left: 4px solid;
}
.bank-notice-ok   { border-left-color: #1a7a3c; }
.bank-notice-err  { border-left-color: #b91c1c; }
.bank-notice-warn { border-left-color: #c9a227; }

/* Alert box pro upozornění na platby */
.bank-alert-box {
    padding: .85em 1.1em;
    margin-bottom: 1.5em;
    font-size: .9em;
    border-left: 4px solid #c9a227;
    opacity: .9;
}

/* ── Formulář převodu ────────────────────────────────────────────── */
.bank-form {
    border: 1px solid;
    border-color: inherit;
    border-radius: 4px;
    padding: 1.25em;
    max-width: 680px;
}
.bank-form-tabs {
    display: flex;
    margin-bottom: 1.25em;
    border: 1px solid;
    border-color: inherit;
    border-radius: 3px;
    overflow: hidden;
}
.bank-tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4em;
    padding: .55em .8em;
    cursor: pointer;
    font-size: .88em;
    border-right: 1px solid;
    border-color: inherit;
    opacity: .65;
    transition: opacity .15s;
}
.bank-tab:last-child { border-right: none; }
.bank-tab-active { opacity: 1; font-weight: bold; }
.bank-tab input[type=radio] { display: none; }

.bank-form-table { width: 100%; border-collapse: collapse; }
.bank-form-table th {
    width: 150px;
    text-align: left;
    vertical-align: top;
    padding: .55em .9em .55em 0;
    font-size: .88em;
    opacity: .7;
}
.bank-form-table td { padding: .45em 0; }

/* ── Tier ikonky ─────────────────────────────────────────────────── */
.bank-tier-icon {
    height: 1.1em;
    width: 1.1em;
    object-fit: contain;
    vertical-align: middle;
}

/* ── Inject widget do rpg-userpanelu ─────────────────────────────── */
.rpg-bank-panel-inject {
    padding: .5em 0;
    border-top: 1px solid;
    border-color: inherit;
    margin-top: .4em;
    font-size: .88em;
}

.rpg-bank-inject-label {
    font-weight: bold;
    font-size: .78em;
    text-transform: uppercase;
    letter-spacing: .04em;
    opacity: .6;
    margin: .4em 0 .2em;
}
.rpg-bank-inject-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .12em 0;
    gap: .5em;
}
.rpg-bank-inject-alert {
    border-left: 3px solid #c9a227;
    padding: .25em .5em;
    font-size: .82em;
    margin-bottom: .4em;
}
.rpg-bank-inject-link {
    margin-top: .5em;
    padding-top: .4em;
    border-top: 1px solid;
    border-color: inherit;
}
.rpg-bank-inject-link a {
    display: block;
    text-align: center;
    padding: .3em .5em;
    font-size: .85em;
    font-weight: bold;
    text-decoration: none;
    color: inherit;
    opacity: .8;
    transition: opacity .15s;
}
.rpg-bank-inject-link a:hover { opacity: 1; }

.rpg-bank-inject-cur { opacity: .75; font-size: .88em; }
.rpg-bank-inject-bal { font-weight: bold; font-size: .9em; }

/* ── Breadcrumb ──────────────────────────────────────────────────── */
/* (viz .bank-breadcrumb výše) */

/* ── Responzivita ────────────────────────────────────────────────── */
@media (max-width: 600px) {
    .bank-overview      { flex-direction: column; }
    .bank-form-table th { display: none; }
    .bank-form-table td { display: block; padding: .3em 0; }
}

/* ── Plánované platby v účtu ─────────────────────────────────────── */
.bank-planned-col { vertical-align: top; font-size: .88em; }

.bank-scheduled-list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.bank-scheduled-list li {
    padding: .2em 0;
    border-bottom: 1px dotted;
    border-color: inherit;
    opacity: .85;
    line-height: 1.4;
}
.bank-scheduled-list li:last-child { border-bottom: none; }
.bank-scheduled-reason {
    font-style: italic;
    opacity: .8;
}

/* ── Finance sekce na profilech ──────────────────────────────────── */
.bank-profile-section { margin-top: 1.25em; }
.bank-profile-section h3 {
    font-size: 1em;
    margin: 0 0 .6em;
    padding-bottom: .3em;
    border-bottom: 1px solid;
    border-color: inherit;
    opacity: .85;
}

.bank-profile-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .88em;
}
.bank-profile-table th {
    text-align: right;
    font-size: .8em;
    opacity: .6;
    padding: .2em .5em .35em;
    border-bottom: 1px solid;
    border-color: inherit;
}
.bank-profile-table th:first-child { text-align: left; }
.bank-profile-table td {
    padding: .35em .5em;
    border-bottom: 1px solid;
    border-color: inherit;
    opacity: .9;
    text-align: right;
}
.bank-profile-table td:first-child { text-align: left; }
.bank-profile-table tr:last-child td { border-bottom: none; }