/* ==========================================================
   Teamlead — Balance create/edit forms
   File: resources/css/teamlead/balance-form.css
   Стиль під загальний дашборд (світло, акуратно)
   ========================================================== */

:root{
    --bf-primary:#3b82f6;
    --bf-primary-soft:#e5edff;

    --bf-border:#e5e7eb;
    --bf-text:#0f172a;
    --bf-muted:#6b7280;

    --bf-radius-lg:18px;
    --bf-radius-pill:999px;

    --bf-shadow-soft:0 6px 16px rgba(15,23,42,.10);
    --bf-shadow-hover:0 12px 26px rgba(15,23,42,.16);
}

/* ----------------------------------------------------------
   PAGE WRAPPER + ANIMATION
---------------------------------------------------------- */

.balance-form-page{
    animation: bf-fade .22s ease-out;
}

@keyframes bf-fade{
    from { opacity:0; transform:translateY(6px); }
    to   { opacity:1; transform:translateY(0); }
}

/* ----------------------------------------------------------
   HEADER (page-head)
---------------------------------------------------------- */

.page-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
}

.page-head h3{
    margin:0;
    font-weight:600;
    color:var(--bf-text);
}

.page-head a.btn-link{
    font-size:.86rem;
    color:#64748b;
    padding:0;
}

.page-head a.btn-link:hover{
    color:#111827;
    text-decoration:underline;
}

/* ----------------------------------------------------------
   CARD FORM WRAPPER
---------------------------------------------------------- */

.card-slim{
    border-radius:var(--bf-radius-lg);
    border:1px solid var(--bf-border);
    box-shadow:var(--bf-shadow-soft);
    background:#ffffff;
}

.card-slim .card-body{
    padding:1.4rem 1.5rem;
}

/* ----------------------------------------------------------
   FORM SECTIONS / LABELS
---------------------------------------------------------- */

.form-section-title{
    font-weight:600;
    font-size:.95rem;
    margin-bottom:.65rem;
    color:#111827;
    letter-spacing:.02em;
    text-transform:uppercase;
}

.form-group label{
    font-size:.82rem;
    font-weight:500;
    color:#374151;
}

.form-note{
    font-size:.78rem;
    color:var(--bf-muted);
    margin-top:.15rem;
}

/* ----------------------------------------------------------
   INPUTS / SELECTS
---------------------------------------------------------- */

.card-slim .form-control{
    border-radius:10px;
    border:1px solid var(--bf-border);
    font-size:.85rem;
    padding:.4rem .6rem;
}

.card-slim .form-control:focus{
    border-color:var(--bf-primary);
    box-shadow:0 0 0 2px rgba(59,130,246,.18);
}

/* сума з табличними цифрами */
.input-amount{
    font-variant-numeric:tabular-nums;
}

/* ----------------------------------------------------------
   BUTTON ROW
---------------------------------------------------------- */

.btn-row{
    display:flex;
    gap:.5rem;
}

/* PRIMARY BUTTON — синьо-фіолетовий без зеленого */

.balance-form-page .btn-primary{
    border-radius:var(--bf-radius-pill);
    padding:.48rem 1.45rem;
    font-size:.85rem;
    font-weight:500;
    border-width:1px;
    border-color:transparent;

    /* холодний синьо-фіолетовий градієнт */
    background:linear-gradient(135deg,#3b82f6,#6366f1);
    color:#ffffff;

    box-shadow:
        0 6px 16px rgba(59,130,246,.28),
        inset 0 -1px 0 rgba(255,255,255,.15);

    display:inline-flex;
    align-items:center;
    justify-content:center;

    transition:
        transform .15s ease,
        box-shadow .15s ease,
        filter .15s ease;
}

.balance-form-page .btn-primary:hover{
    transform:translateY(-1px);
    box-shadow:
        0 14px 32px rgba(59,130,246,.45),
        inset 0 -1px 0 rgba(255,255,255,.18);
    filter:brightness(1.05);
}

.balance-form-page .btn-primary:active{
    transform:translateY(0);
    box-shadow:
        0 6px 16px rgba(59,130,246,.25) inset,
        inset 0 1px 0 rgba(0,0,0,.10);
}

/* secondary / light */

.balance-form-page .btn-light,
.balance-form-page .btn-outline-secondary{
    border-radius:var(--bf-radius-pill);
    padding:.45rem 1.3rem;
    font-size:.85rem;
    border:1px solid #cbd5e1;
    background:#ffffff;
    color:#374151;
    box-shadow:var(--bf-shadow-soft);
    transition:
        transform .15s ease,
        box-shadow .15s ease,
        background .15s ease;
}

.balance-form-page .btn-light:hover,
.balance-form-page .btn-outline-secondary:hover{
    background:var(--bf-primary-soft);
    transform:translateY(-1px);
    box-shadow:var(--bf-shadow-hover);
}

/* ----------------------------------------------------------
   RESPONSIVE
---------------------------------------------------------- */

@media(max-width:768px){
    .page-head{
        flex-direction:column;
        align-items:flex-start;
    }

    .btn-row{
        flex-direction:column;
    }

    .btn-row .btn{
        width:100%;
        justify-content:center;
    }

    .card-slim .card-body{
        padding:1.1rem 1.1rem;
    }
}
