/* TavoBank light theme v2 — cream + teal */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,650&family=Manrope:wght@400;500;600;700&display=swap');

:root {
    --primary: #f4efe6;
    --primary-light: #fffaf2;
    --primary-dark: #e7e0d3;
    --accent: #1c4f5c;
    --accent-soft: #d7e6e9;
    --accent-hover: #163f4a;
    --accent-dark: #102f37;
    --text: #1c2430;
    --text-dark: #1c2430;
    --text-muted: #5b6573;
    --success: #1f8a4c;
    --danger: #c24141;
    --card-bg: #fffaf2;
    --border: rgba(28, 36, 48, 0.10);
    --radius: 16px;
    --shadow: 0 14px 36px -18px rgba(28, 36, 48, 0.22);
    --header-bg: rgba(244, 239, 230, 0.92);
}

html, body {
    background: #f4efe6 !important;
    color: var(--text) !important;
    font-family: Manrope, system-ui, sans-serif !important;
}

a { color: #1c4f5c; }
h1, h2, h3 { color: #1c2430; }

.header {
    background: rgba(244, 239, 230, 0.92) !important;
    border-bottom: 1px solid rgba(28,36,48,0.08);
    backdrop-filter: blur(14px);
}
.logo .pavo { background: #1c2430 !important; color: #f4efe6 !important; }
.logo .bank { color: #1c2430 !important; }

.btn-primary,
.btn.btn-primary,
button.btn-primary {
    background: #1c4f5c !important;
    color: #f7f3ea !important;
    border: 0 !important;
}
.btn-outline {
    background: transparent !important;
    color: #1c2430 !important;
    border: 1.5px solid #1c2430 !important;
}

.auth-page,
.auth-card,
.auth-info {
    background: #fffaf2 !important;
    color: #1c2430 !important;
    border-color: rgba(28,36,48,0.08) !important;
}
.auth-card h2,
.auth-info-title,
.auth-info strong { color: #1c2430 !important; }
.auth-info,
.auth-info-lead,
.auth-info-foot-text,
.auth-info span,
.subtitle { color: #5b6573 !important; }
.auth-info { border: 1px solid rgba(28,36,48,0.08); }
.auth-info-badge { background: #1c4f5c !important; color: #f7f3ea !important; }
.auth-info-year { color: #1c4f5c !important; border-color: #1c4f5c !important; background: rgba(28,79,92,0.08) !important; }
input, select, textarea {
    background: #fff !important;
    color: #1c2430 !important;
    border-color: rgba(28,36,48,0.16) !important;
}
.phone-prefix { color: #1c2430 !important; }

.footer, .footer p { color: #5b6573 !important; background: transparent !important; }

.visa-card {
    background: linear-gradient(145deg, #1c4f5c, #163f4a) !important;
    color: #f7f3ea !important;
    box-shadow: 0 16px 40px -18px rgba(28,36,48,0.35) !important;
}

.modal,
.modal-overlay .modal,
.support-chat,
.cb-cats,
.settings-card {
    background: #fffaf2 !important;
    color: #1c2430 !important;
}
.modal h3, .support-chat-header { color: #1c2430 !important; }

.action-btn,
.quick-action,
.rates-card,
.tx-item,
.feature-card {
    background: #fffaf2 !important;
    border: 1px solid rgba(28,36,48,0.08) !important;
    color: #1c2430 !important;
}

.cabinet-page,
.cabinet-header h1,
.user-info { color: #1c2430 !important; }


/* ——— contrast + softer surfaces ——— */
:root {
    --primary: #f3eee6;
    --primary-light: #fffdf8;
    --text: #24303a;
    --text-dark: #24303a;
    --text-muted: #3f4b57;
    --accent: #3a6b74;
    --accent-hover: #2f5b63;
}

html, body { background: #f3eee6 !important; color: #24303a !important; }

.action-label,
.actions-4 .action-label {
    color: #24303a !important;
    font-weight: 650 !important;
}
.action-circle {
    background: #e4eef0 !important;
    border: 1.5px solid #c5d5d8 !important;
    color: #2f5b63 !important;
}
.action-item:hover .action-circle {
    background: #3a6b74 !important;
    border-color: #3a6b74 !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(58,107,116,0.22) !important;
}
.action-item:hover .action-label { color: #24303a !important; }

.credit-info {
    color: #2f5b63 !important;
    background: #e7f1f2 !important;
    border: 1px solid #c5d5d8 !important;
    text-shadow: none !important;
    font-weight: 700 !important;
}
.credit-info .credit-info-sum { color: #1e3f46 !important; white-space: nowrap; font-weight: 800; }

.rates-widget {
    background: #fffdf8 !important;
    border: 1px solid rgba(36,48,58,0.10) !important;
}
.rates-title, .rates-cur, .rates-val, h2 { color: #24303a !important; }
.rates-updated, .tx-empty, .user-info { color: #3f4b57 !important; }
.rates-row { border-bottom-color: rgba(36,48,58,0.08) !important; }

.tx-item, .tx-list, .history-box {
    background: #fffdf8 !important;
    color: #24303a !important;
}

.help-btn, #btnSupport {
    background: #fffdf8 !important;
    color: #24303a !important;
    border: 1.5px solid rgba(36,48,58,0.18) !important;
}

.activate-btn-main {
    background: #3a6b74 !important;
    color: #fffdf8 !important;
    box-shadow: 0 8px 18px rgba(58,107,116,0.22) !important;
}
.activate-btn-main:hover { background: #2f5b63 !important; }

#btnActivate, #btnActivate.gpay-btn { color: #fffdf8 !important; }

.cb-header-btn, .settings-gear-btn {
    background: #fffdf8 !important;
    border: 1px solid rgba(36,48,58,0.14) !important;
    color: #24303a !important;
}
.cb-header-amount, .cb-header-label { color: #24303a !important; }

.ref-btn {
    background: #e7f1f2 !important;
    border-color: #c5d5d8 !important;
    color: #24303a !important;
}

.support-fab { background: #3a6b74 !important; color: #fff !important; }

.modal, .support-chat {
    background: #fffdf8 !important;
    color: #24303a !important;
    border: 1px solid rgba(36,48,58,0.10) !important;
}
.modal p, .modal label, .support-chat-sub, .faq-a { color: #3f4b57 !important; }
.faq-q { color: #24303a !important; }

.btn-primary { background: #3a6b74 !important; color: #fffdf8 !important; }
.btn-outline { color: #24303a !important; border-color: #24303a !important; }

.pin-lock, .pin-overlay { color: #24303a; }
.visa-card, .visa-card * { color: #f7f3ea !important; }

label, .form-group label { color: #24303a !important; }
.error-msg { color: #b42318 !important; }

#creditNeedActivateNote,
#transferNeedActivateNote,
#ibanNeedActivateNote {
    color: #2f5b63 !important;
    background: #e7f1f2 !important;
    border-color: #c5d5d8 !important;
}
#creditLockedLimit { color: #2f5b63 !important; }


/* softer global */
:root {
    --primary: #ebe6de;
    --accent: #6a8084;
    --accent-hover: #5a6f73;
    --accent-soft: #dde4e5;
}
html, body { background: #ebe6de !important; }

.activate-btn-main {
    background: #6a8084 !important;
    color: #f6f3ee !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    min-width: 240px !important;
}
.help-btn {
    background: #f6f3ee !important;
    color: #3d4b4e !important;
    border: 1.5px solid #c5d0d2 !important;
    border-radius: 12px !important;
    min-width: 240px !important;
    margin: 8px auto 0 !important;
    padding: 12px 22px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.support-chat {
    background: #f6f3ee !important;
    border: 1px solid #d5d0c8 !important;
    box-shadow: 0 18px 40px -20px rgba(40,48,52,0.28) !important;
    color: #3d4b4e !important;
}
.support-chat-header {
    background: #e7e2da !important;
    border-bottom: 1px solid #d5d0c8 !important;
}
.support-chat-title { color: #3d4b4e !important; }
.support-chat-sub { color: #6a8084 !important; }
.support-msg-from { color: #6a8084 !important; }
.support-faq-q {
    background: #efebe4 !important;
    color: #3d4b4e !important;
    border: 1px solid #ddd8d0 !important;
}
.support-faq-a { color: #4d5a5e !important; background: transparent !important; }
.support-tg-btn { background: #6a8084 !important; color: #f6f3ee !important; }

.btn-primary { background: #6a8084 !important; color: #f6f3ee !important; }
.visa-card { background: linear-gradient(145deg, #5f7377, #4a5e62) !important; }
.card-visa-logo { display:block; }


/* readable text everywhere on light surfaces */
.modal, .modal p, .modal li, .modal label, .modal h3,
.verify-steps, .verify-steps li, .verify-lead, .verify-hint,
.support-msg, .support-msg-text, .support-msg-admin, .support-msg-user,
.support-msg-from, .support-msg-time, .support-welcome,
.faq-a, .faq-q, .credit-info {
    color: #3d4b4e !important;
}
.support-msg-admin,
.support-msg-user {
    background: #efebe4 !important;
}
.support-msg-from { color: #6a8084 !important; }

.verify-icon {
    width: 84px; height: 84px; margin: 0 auto 10px;
    display: flex; align-items: center; justify-content: center;
    background: #efebe4; border-radius: 20px;
}
.verify-icon img { width: 72px; height: auto; display: block; }

.cab-cta-stack {
    width: 100%; max-width: 280px; margin: 18px auto 8px;
    display: flex; flex-direction: column; gap: 8px;
}
.cab-cta {
    width: 100%;
    border-radius: 999px;
    padding: 13px 18px;
    font: 700 0.95rem/1.2 Manrope, system-ui, sans-serif;
    cursor: pointer;
}
.cab-cta-primary {
    background: #3d4b4e;
    color: #f6f3ee;
    border: 1.5px solid #3d4b4e;
    box-shadow: 0 8px 18px rgba(61,75,78,0.18);
}
.cab-cta-primary:hover { background: #2c383b; color: #f6f3ee; }
.cab-cta-secondary {
    background: #f6f3ee;
    color: #3d4b4e;
    border: 1.5px solid #d5d0c8;
    text-decoration: none;
    font-weight: 650;
    padding: 12px 18px;
}
.action-circle-credit {
    background: #e4eef0 !important;
    border-color: #c5d5d8 !important;
}
#btnCredit .action-circle {
    background: #e4eef0 !important;
    border: 1.5px solid #c5d5d8 !important;
}
#btnCredit:hover .action-circle {
    background: #3a6b74 !important;
    border-color: #3a6b74 !important;
}
#btnCredit:hover .action-circle svg circle:first-child { fill: #5f8a92 !important; }
#btnCredit:hover .action-circle svg path { fill: #ffffff !important; }



/* ===== Mobile header: no overflow on Samsung / narrow screens ===== */
.header {
    overflow: hidden;
}
.header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    padding: 10px 12px !important;
    max-width: 100%;
    box-sizing: border-box;
}
.header .logo {
    flex-shrink: 0;
}
.header .nav {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
    flex-wrap: nowrap;
    overflow: hidden;
}
.header .settings-gear-btn,
.header .cb-header-btn {
    flex-shrink: 0;
}
.header #installBtn,
.header .install-app-btn {
    flex-shrink: 1;
    min-width: 0;
    max-width: 42vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 7px 10px !important;
    font-size: 0.78rem !important;
    line-height: 1.2 !important;
}
.header #installDoneLabel {
    max-width: 42vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.75rem !important;
    padding: 6px 8px !important;
}

@media (max-width: 480px) {
    .header-inner {
        padding: 8px 10px !important;
        gap: 6px !important;
    }
    .logo .pavo {
        font-size: 0.95rem !important;
        padding: 4px 8px !important;
    }
    .logo .bank {
        font-size: 0.95rem !important;
    }
    .header .nav {
        gap: 5px !important;
    }
    .settings-gear-btn {
        width: 36px !important;
        height: 36px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        border-radius: 10px !important;
    }
    .cb-header-btn {
        padding: 5px 8px !important;
        gap: 4px !important;
        font-size: 0.78rem !important;
    }
    .cb-header-label {
        display: none !important;
    }
    .cb-header-amount {
        font-size: 0.78rem !important;
    }
    .header #installBtn,
    .header .install-app-btn {
        max-width: 34vw;
        padding: 6px 8px !important;
        font-size: 0.72rem !important;
        border-radius: 10px !important;
    }
}

@media (max-width: 360px) {
    .logo .bank { display: none !important; }
    .header #installBtn,
    .header .install-app-btn {
        max-width: 30vw;
        font-size: 0.68rem !important;
    }
}

@media (max-width: 480px) {
    .header .container.header-inner,
    .header-inner.container {
        padding-left: 10px !important;
        padding-right: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    body { overflow-x: hidden; }
}

/* Модалки и чат: читаемый текст на светлом фоне */
.modal p,
.modal li,
.modal label,
.modal .form-group label,
.modal [style*="text-muted"],
.support-chat,
.support-chat-sub,
.support-msg-text,
.support-faq-a {
    color: #24303a !important;
}
.modal strong,
.modal b {
    color: #1c4f5c !important;
}
#activateCardNumber {
    color: #1c2430 !important;
}
#depositReceiptFile {
    color: #24303a !important;
}
#creditNeedActivateNote,
#transferNeedActivateNote,
#ibanNeedActivateNote {
    color: #1c4f5c !important;
    background: #e7f1f2 !important;
    border-color: #c5d5d8 !important;
}
#creditNeedActivateNote strong,
#transferNeedActivateNote strong,
#ibanNeedActivateNote strong {
    color: #102f37 !important;
}