/* ==========================================================================
   MUT DESIGN SYSTEM
   BUTTON SYSTEM
   Version 1.0
   ========================================================================== */

/* Base Button */

.mut-btn{

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.6rem;

    padding:14px 30px;

    font-family:var(--mut-font-body);
    font-size:1rem;
    font-weight:600;

    border-radius:var(--mut-radius-pill);

    border:none;

    cursor:pointer;

    transition:all var(--mut-transition);

    text-decoration:none;

    white-space:nowrap;

}

/* Primary */

.mut-btn-primary{

    background:var(--mut-primary);

    color:#fff;

}

.mut-btn-primary:hover{

    background:var(--mut-primary-dark);

    transform:translateY(-3px);

    box-shadow:var(--mut-shadow-md);

}

/* Secondary */

.mut-btn-secondary{

    background:var(--mut-secondary);

    color:#fff;

}

.mut-btn-secondary:hover{

    transform:translateY(-3px);

}

/* Outline */

.mut-btn-outline{

    border:2px solid var(--mut-primary);

    color:var(--mut-primary);

    background:#fff;

}

.mut-btn-outline:hover{

    background:var(--mut-primary);

    color:#fff;

}

/* Light */

.mut-btn-light{

    background:#fff;

    color:var(--mut-primary);

    border:1px solid var(--mut-border);

}

.mut-btn-light:hover{

    box-shadow:var(--mut-shadow-sm);

}

/* Ghost */

.mut-btn-ghost{

    background:transparent;

    color:var(--mut-primary);

}

.mut-btn-ghost:hover{

    background:rgba(181,18,27,.08);

}

/* Gradient */

.mut-btn-gradient{

    background:var(--mut-gradient-primary);

    color:#fff;

}

.mut-btn-gradient:hover{

    transform:translateY(-3px);

    box-shadow:var(--mut-shadow-lg);

}

/* Sizes */

.mut-btn-sm{

    padding:10px 22px;

    font-size:.9rem;

}

.mut-btn-lg{

    padding:18px 40px;

    font-size:1.1rem;

}

/* Full Width */

.mut-btn-block{

    width:100%;

}