/* ==========================================================
   LINKS & BUTTONS — egységes stílus + kék link bug javítás
   ========================================================== */

/* ---- Alap link reset: NINCS kék/lila, örökli a színt ---- */
a,
a:visited {
    color: inherit;
    text-decoration: none;
}

a:hover {
    color: inherit;
    text-decoration: underline;
    text-decoration-color: rgba(0, 0, 0, .25);
    text-underline-offset: 3px;
}

a:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--brand-green, #1F5A22) 55%, transparent);
    outline-offset: 2px;
    border-radius: 6px;
}

/* ---- GOMBOK (anchor és button is) ---- */
.btn,
a.btn,
button.btn,
input[type="submit"].btn {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    height: 36px;
    padding: 0 14px;
    border-radius: 12px;

    font-weight: 600;
    font-size: 14px;
    line-height: 1;

    border: 1px solid transparent;
    background: #f3f5f6;
    /* default “semleges” */
    color: var(--ink, #222831);
    cursor: pointer;
    user-select: none;

    transition: background .18s, border-color .18s, color .18s, box-shadow .18s, transform .18s;
}

.btn:hover {
    background: #e9edef;
}

.btn:active {
    transform: translateY(1px);
}

.btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--brand-green, #1F5A22) 55%, transparent);
    outline-offset: 2px;
}

/* Méretek */
.btn.btn--sm {
    height: 32px;
    padding: 0 12px;
    border-radius: 10px;
    font-size: 13px;
}

.btn.btn--lg {
    height: 42px;
    padding: 0 16px;
    border-radius: 14px;
    font-size: 15px;
}

/* ---- Variánsok ---- */

/* Primary = márkazöld */
.btn.primary {
    background: var(--brand-green, #1F5A22);
    color: #fff;
    border-color: transparent;
}

.btn.primary:hover {
    background: color-mix(in srgb, var(--brand-green, #1F5A22) 86%, #000);
}

.btn.primary:active {
    transform: translateY(1px);
}

/* Outline = airy keretes */
.btn.outline {
    background: transparent;
    color: var(--brand-green, #1F5A22);
    border-color: color-mix(in srgb, var(--brand-green, #1F5A22) 60%, #ffffff);
}

.btn.outline:hover {
    background: color-mix(in srgb, var(--brand-green, #1F5A22) 6%, transparent);
    border-color: var(--brand-green, #1F5A22);
}

/* Ghost = teljesen átlátszó, csak szöveg */
.btn.ghost {
    background: transparent;
    border-color: transparent;
    color: var(--brand-green, #1F5A22);
}

.btn.ghost:hover {
    background: color-mix(in srgb, var(--brand-green, #1F5A22) 7%, transparent);
}

/* Light = fehér háttér, sötét tipó (hero zöldjén jó) */
.btn.light {
    background: #fff;
    color: var(--brand-green, #1F5A22);
    border-color: transparent;
}

.btn.light:hover {
    background: #f5f7f6;
}

/* Disabled */
.btn[disabled],
button:disabled.btn,
a.btn.is-disabled {
    opacity: .55;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
}

/* Ikon a gombban (SVG/IMG) */
.btn>svg,
.btn>img {
    width: 16px;
    height: 16px;
    display: block;
}

/* ---- Cardon belüli linkek: ne legyen “kék”, de látszódjon ---- */
.card a:not(.btn) {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
    text-decoration-color: rgba(0, 0, 0, .25);
}

.card a:not(.btn):hover {
    text-decoration-color: rgba(0, 0, 0, .45);
}

/* ---- Utility: teljes szélességű gomb, ha kell ---- */
.btn.block {
    display: flex;
    width: 100%;
}

/* ---- Sötét háttérre gyors invert (ha egyszer kell) ---- */
.is-on-dark .btn:not(.light) {
    background: rgba(255, 255, 255, .12);
    color: #fff;
    border-color: rgba(255, 255, 255, .35);
}

.is-on-dark .btn:hover {
    background: rgba(255, 255, 255, .18);
}