/*====================================================*
 * MADIBENG CONNECT
 * BUTTONS & CALL TO ACTIONS
 *====================================================*/


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

.mc-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    min-height:46px;

    padding:0 20px;

    border:1px solid transparent;

    border-radius:12px;

    background:var(--mc-primary,#0D6EFD);

    color:#fff;

    font-size:14px;

    font-weight:700;

    line-height:1;

    text-align:center;

    text-decoration:none;

    cursor:pointer;

    white-space:nowrap;

    transition:

        background .2s ease,

        color .2s ease,

        border-color .2s ease,

        transform .2s ease,

        box-shadow .2s ease;

}


.mc-btn:hover{

    background:var(--mc-primary-dark,#0958c7);

    color:#fff;

    transform:translateY(-1px);

    box-shadow:0 6px 18px rgba(13,110,253,.20);

}


.mc-btn:active{

    transform:translateY(0);

    box-shadow:none;

}


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

.mc-btn-primary{

    background:var(--mc-primary,#0D6EFD);

    color:#fff;

}


.mc-btn-primary:hover{

    background:var(--mc-primary-dark,#0958c7);

    color:#fff;

}


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

.mc-btn-secondary{

    background:#fff;

    color:var(--mc-primary,#0D6EFD);

    border-color:rgba(13,110,253,.20);

}


.mc-btn-secondary:hover{

    background:#f8fbff;

    color:var(--mc-primary-dark,#0958c7);

    border-color:var(--mc-primary,#0D6EFD);

}


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

.mc-btn-outline{

    background:transparent;

    color:var(--mc-primary,#0D6EFD);

    border-color:var(--mc-primary,#0D6EFD);

}


.mc-btn-outline:hover{

    background:var(--mc-primary,#0D6EFD);

    color:#fff;

}


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

.mc-btn-dark{

    background:#0f172a;

    color:#fff;

}


.mc-btn-dark:hover{

    background:#1e293b;

    color:#fff;

}


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

.mc-btn-light{

    background:#fff;

    color:#0f172a;

    border-color:#fff;

}


.mc-btn-light:hover{

    background:#f8fafc;

    color:#0f172a;

}


/*====================================================*
 * GHOST
 *====================================================*/

.mc-btn-ghost{

    background:transparent;

    color:var(--mc-dark,#0f172a);

    border-color:transparent;

}


.mc-btn-ghost:hover{

    background:#f1f5f9;

    color:var(--mc-primary,#0D6EFD);

    box-shadow:none;

}


/*====================================================*
 * HERO BUTTONS
 *====================================================*/

.mc-hero .mc-btn-primary{

    background:#fff;

    color:var(--mc-primary,#0D6EFD);

    box-shadow:0 8px 25px rgba(0,0,0,.12);

}


.mc-hero .mc-btn-primary:hover{

    background:#f8fafc;

    color:var(--mc-primary-dark,#0958c7);

}


.mc-hero .mc-btn-secondary{

    background:rgba(255,255,255,.10);

    color:#fff;

    border-color:rgba(255,255,255,.35);

    backdrop-filter:blur(10px);

}


.mc-hero .mc-btn-secondary:hover{

    background:rgba(255,255,255,.18);

    color:#fff;

    border-color:rgba(255,255,255,.55);

}


/*====================================================*
 * BUTTON SIZES
 *====================================================*/

.mc-btn-sm{

    min-height:38px;

    padding:0 15px;

    border-radius:10px;

    font-size:13px;

}


.mc-btn-lg{

    min-height:54px;

    padding:0 26px;

    border-radius:14px;

    font-size:15px;

}


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

.mc-btn-full{

    width:100%;

}


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

.mc-btn-icon{

    width:46px;

    height:46px;

    min-height:46px;

    padding:0;

    border-radius:12px;

}


.mc-btn-icon.mc-btn-sm{

    width:38px;

    height:38px;

    min-height:38px;

}


.mc-btn-icon.mc-btn-lg{

    width:54px;

    height:54px;

    min-height:54px;

}


/*====================================================*
 * ARROW
 *====================================================*/

.mc-btn .fa-arrow-right{

    transition:transform .2s ease;

}


.mc-btn:hover .fa-arrow-right{

    transform:translateX(3px);

}


/*====================================================*
 * TEXT LINKS
 *====================================================*/

.mc-card-link,
.mc-section-link{

    display:inline-flex;

    align-items:center;

    gap:7px;

    color:var(--mc-primary,#0D6EFD);

    font-weight:700;

    text-decoration:none;

}


.mc-card-link:hover,
.mc-section-link:hover{

    color:var(--mc-primary-dark,#0958c7);

}


/*====================================================*
 * HEADER SUBMIT BUTTON
 *====================================================*/

.mc-header-submit{

    min-height:42px;

    padding:0 17px;

    border-radius:10px;

    font-size:13px;

}


/*====================================================*
 * MOBILE SUBMIT
 *====================================================*/

.mc-mobile-submit{

    display:flex;

    align-items:center;

    justify-content:space-between;

    width:100%;

    min-height:50px;

    padding:0 17px;

    border-radius:12px;

    background:var(--mc-primary,#0D6EFD);

    color:#fff;

    font-size:14px;

    font-weight:700;

}


.mc-mobile-submit:hover{

    background:var(--mc-primary-dark,#0958c7);

    color:#fff;

}


/*====================================================*
 * SEARCH BUTTON
 *====================================================*/

.mc-search-btn{

    width:42px;

    height:42px;

    border-radius:10px;

    color:var(--mc-dark,#0f172a);

    transition:

        background .2s ease,

        color .2s ease;

}


.mc-search-btn:hover{

    background:#f1f5f9;

    color:var(--mc-primary,#0D6EFD);

}


/*====================================================*
 * DISABLED
 *====================================================*/

.mc-btn:disabled,
.mc-btn.disabled{

    opacity:.55;

    pointer-events:none;

    cursor:not-allowed;

}


/*====================================================*
 * MOBILE
 *====================================================*/

@media(max-width:768px){

    .mc-btn{

        min-height:44px;

        padding:0 17px;

    }


    .mc-btn-lg{

        min-height:50px;

        padding:0 21px;

    }


    /*
     * Hero CTAs become easier to tap
     * without forcing every button site-wide
     * to become full width.
     */

    .mc-hero .mc-btn{

        min-height:50px;

    }

}


/*====================================================*
 * SMALL PHONES
 *====================================================*/

@media(max-width:480px){

    .mc-hero .mc-btn{

        width:100%;

    }

}