/**
 * ALIA Universal Buttons – one place to edit all button styles
 * Used by: hero, hero slider, portfolio gallery, CTA section, etc.
 *
 * @package ALIA_Theme
 */

/* ========== BASE ========== */
.alia-btn {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-size: 10px;
    letter-spacing: 4px;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 400;
    transition: all 0.3s ease;
    cursor: pointer;
}

.alia-btn-line {
    width: 48px;
    position: relative;
    transition: width 0.3s ease;
}

.alia-btn-line svg {
    width: 100%;
    height: 12px;
    overflow: visible;
}

/* ========== PRIMARY (text + line – hero, gallery, hero slider) ========== */
.alia-btn--primary {
    color: var(--alia-dark, #120807);
}

.alia-btn--primary .alia-btn-line,
.alia-btn--primary .alia-btn-line svg {
    color: var(--alia-gold, #D8B072);
}

.alia-btn--primary:hover {
    color: var(--alia-olive, #657444);
}

.alia-btn--with-line.alia-btn--primary:hover .alia-btn-line {
    width: 64px;
}

/* ========== SECONDARY (filled – CTA section style) ========== */
.alia-btn--secondary {
    padding: 18px 48px;
    background: var(--alia-white, #FFFDF9);
    color: var(--alia-dark, #120807);
}

.alia-btn--secondary:hover {
    background: var(--alia-dark, #120807);
    color: var(--alia-white, #FFFDF9);
    transform: translateY(-2px);
}

.alia-btn--secondary .alia-btn-line { display: none; }

/* ========== TERTIARY (add your own style below) ========== */
.alia-btn--tertiary {
    /* Placeholder – edit in this macro sheet */
    color: var(--alia-olive, #657444);
    border: 1px solid var(--alia-olive, #657444);
    padding: 14px 36px;
}

.alia-btn--tertiary:hover {
    background: var(--alia-olive, #657444);
    color: var(--alia-white, #FFFDF9);
}

.alia-btn--tertiary .alia-btn-line { display: none; }