/* =========================================================
   BUTTONS.CSS — wspólne przyciski serwisu
========================================================= */

:root {
    --tm-green: #39ff14;
    --tm-green-hover: #63ff46;
    --tm-button-dark: #222;
    --tm-button-border: #414141;
}

.tm-button,
.btn-submit,
.btn-anuluj,
.btn-reset-map {
    min-height: 42px;
    padding: 10px 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 8px;
    font: inherit;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition:
        background 0.2s,
        border-color 0.2s,
        color 0.2s,
        transform 0.2s;
}

.tm-button > i,
.btn-submit > i,
.btn-anuluj > i,
.btn-reset-map > i {
    margin: 0 !important;
    color: currentColor !important;
    line-height: 1 !important;
}

.tm-button-primary,
.btn-submit {
    border: 1px solid var(--tm-green);
    background: var(--tm-green);
    color: #050505;
}

.tm-button-primary:hover,
.btn-submit:hover {
    background: var(--tm-green-hover);
    color: #050505;
}

.tm-button-secondary,
.btn-anuluj,
.btn-reset-map {
    border: 1px solid var(--tm-button-border);
    background: var(--tm-button-dark);
    color: #fff;
}

.tm-button-secondary:hover,
.btn-anuluj:hover,
.btn-reset-map:hover {
    border-color: var(--tm-green);
    background: #191919;
    color: var(--tm-green);
}

.tm-button:focus-visible,
.btn-submit:focus-visible,
.btn-anuluj:focus-visible,
.btn-reset-map:focus-visible {
    outline: 3px solid rgba(57, 255, 20, 0.25);
    outline-offset: 2px;
}

.tm-button:disabled,
.btn-submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
}

@media (max-width: 560px) {
    .tm-button,
    .btn-submit,
    .btn-anuluj,
    .btn-reset-map {
        width: 100%;
    }
}


/* V20 — reset mapy w jednym wierszu */
.dashboard-page .btn-reset-map {
    width: 100%;
    min-width: 0;
    padding: 10px 12px;
    gap: 7px;
    white-space: nowrap;
    font-size: 12px;
    line-height: 1;
}

.dashboard-page .btn-reset-map > i {
    flex: 0 0 auto;
    margin: 0 !important;
}

.dashboard-page .btn-reset-map > span {
    min-width: 0;
    white-space: nowrap;
}


/* =========================================================
   V24 — zgodność ze starszymi formularzami
========================================================= */
.container button,
.btn-submit {
    width: 100%;
    min-height: 44px;
    margin-top: 25px;
    padding: 11px 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #39ff14;
    border-radius: 8px;
    background: #39ff14;
    color: #050505;
    font: inherit;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.2;
    cursor: pointer;
    transition:
        background 0.2s,
        border-color 0.2s,
        color 0.2s;
}

.container button:hover,
.btn-submit:hover {
    background: #63ff46;
    border-color: #63ff46;
    color: #050505;
}

.container button > i,
.btn-submit > i {
    margin: 0 !important;
    color: currentColor !important;
}

.btn-anuluj {
    width: fit-content;
    max-width: 100%;
    min-height: 42px;
    margin: 20px auto 0;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #414141;
    border-radius: 8px;
    background: #222;
    color: #fff;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    transition:
        background 0.2s,
        border-color 0.2s,
        color 0.2s;
}

.btn-anuluj:hover {
    border-color: #39ff14;
    background: #191919;
    color: #39ff14;
}

.btn-anuluj > i {
    margin: 0 !important;
    color: currentColor !important;
}