/*
==========================================================
GLOBAL BUTTON SYSTEM
File: assets/css/buttons.css
Theme: Pine Green
==========================================================
*/


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

.btn{

    font-family:'Poppins',sans-serif;

    font-size:12px;

    font-weight:500;

    border-radius:8px;

    padding:8px 16px;

    transition:.3s ease;

    border-width:1px;

}


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

.btn-primary,
.btn-theme{

    background:var(--primary)!important;

    border-color:var(--primary)!important;

    color:#fff!important;

}


.btn-primary:hover,
.btn-theme:hover{

    background:var(--primary-dark)!important;

    border-color:var(--primary-dark)!important;

}



/* ==========================
   OUTLINE PRIMARY
========================== */

.btn-outline-primary{

    color:var(--primary)!important;

    border-color:var(--primary)!important;

}


.btn-outline-primary:hover{

    background:var(--primary)!important;

    color:#fff!important;

}



/* ==========================
   SUCCESS
========================== */

.btn-success{

    background:var(--success)!important;

    border-color:var(--success)!important;

    color:#fff!important;

}



/* ==========================
   DANGER
========================== */

.btn-danger{

    background:var(--danger)!important;

    border-color:var(--danger)!important;

    color:#fff!important;

}



/* ==========================
   WARNING
========================== */

.btn-warning{

    background:var(--warning)!important;

    border-color:var(--warning)!important;

    color:#212529!important;

}



/* ==========================
   SECONDARY
========================== */

.btn-secondary{

    background:var(--secondary)!important;

    border-color:var(--secondary)!important;

    color:#fff!important;

}



/* ==========================
   DARK
========================== */

.btn-dark{

    background:#343a40!important;

    border-color:#343a40!important;

    color:#fff!important;

}



/* ==========================
   BUTTON HOVER
========================== */

.btn:hover{

    transform:translateY(-2px);

    box-shadow:0 4px 10px rgba(0,0,0,.15);

}



/* ==========================
   SMALL BUTTON
========================== */

.btn-sm{

    padding:6px 12px;

    font-size:12px;

}



/* ==========================
   LARGE BUTTON
========================== */

.btn-lg{

    padding:12px 25px;

    font-size:14px;

}



/* ==========================
   ICON BUTTON
========================== */

.btn i{

    margin-right:5px;

}



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

.btn-block{

    width:100%;

}