/* =====================================================
   Eagle Furniture Ngara
   File: buttons.css
   Purpose: Button Components
   Version: 2.0
===================================================== */

/* ==========================================
   BASE BUTTON
========================================== */

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:14px 30px;
    border:none;
    border-radius:var(--radius-pill);
    font-family:var(--font-family);
    font-size:var(--fs-base);
    font-weight:var(--font-semibold);
    cursor:pointer;
    transition:var(--transition);
    text-decoration:none;
}

/* ==========================================
   PRIMARY BUTTON
========================================== */

.btn-primary{
    background:var(--color-primary);
    color:var(--color-white);
    box-shadow:var(--shadow-md);
}

.btn-primary:hover{
    background:var(--color-primary-dark);
    transform:translateY(-3px);
}

/* ==========================================
   OUTLINE BUTTON
========================================== */

.btn-outline{
    border:2px solid var(--color-primary);
    color:var(--color-primary);
    background:transparent;
}

.btn-outline:hover{
    background:var(--color-primary);
    color:var(--color-white);
}

/* ==========================================
   LIGHT BUTTON
========================================== */

.btn-light{
    background:var(--color-white);
    color:var(--color-primary);
    box-shadow:var(--shadow-sm);
}

.btn-light:hover{
    transform:translateY(-3px);
}

/* ==========================================
   FULL WIDTH
========================================== */

.btn-block{
    width:100%;
}