/* =========================================
   Buttons — Golriz Theme
========================================= */

/* ---------- Base ---------- */
.g-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    height: 44px;
    padding: 0 20px;

    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -.2px;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;

    border: 1.5px solid transparent;
    border-radius: 12px;
    outline: none;
    user-select: none;

    transition:
        background-color .25s cubic-bezier(.22, 1, .36, 1),
        color .25s cubic-bezier(.22, 1, .36, 1),
        border-color .25s cubic-bezier(.22, 1, .36, 1),
        box-shadow .25s cubic-bezier(.22, 1, .36, 1),
        transform .15s cubic-bezier(.22, 1, .36, 1),
        filter .25s cubic-bezier(.22, 1, .36, 1);
}

.g-btn i{
    font-size: 13px;
    line-height: 1;
}

.g-btn:focus-visible{
    outline: 2px solid #D4AF37;
    outline-offset: 3px;
}

.g-btn:active{
    transform: translateY(0) scale(.97);
}

.g-btn:disabled,
.g-btn[disabled],
.g-btn.is-disabled{
    opacity: .5;
    cursor: not-allowed;
    pointer-events: none;
    filter: none !important;
    transform: none !important;
    box-shadow: none !important;
}


/* =========================================
   Color Variants
========================================= */

/* ---------- Primary (بنفش سلطنتی) ---------- */
.g-btn--primary{
    color: #FFF;
    background: linear-gradient(135deg, #5B3E8F, #2A1B4D);
    box-shadow: 0 6px 16px rgba(91, 62, 143, .35);
}
.g-btn--primary:hover{
    filter: brightness(1.12);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(91, 62, 143, .45);
}

/* ---------- Gold (طلایی) ---------- */
.g-btn--gold{
    color: #1A1130;
    background: linear-gradient(135deg, #F5D67B, #B8860B);
    box-shadow: 0 6px 16px rgba(212, 175, 55, .35);
}
.g-btn--gold:hover{
    filter: brightness(1.06);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(212, 175, 55, .5);
}

/* ---------- Danger (قرمز) ---------- */
.g-btn--danger{
    color: #FFF;
    background: linear-gradient(135deg, #C41E3A, #7A2B6B);
    box-shadow: 0 6px 16px rgba(196, 30, 58, .35);
}
.g-btn--danger:hover{
    filter: brightness(1.12);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(196, 30, 58, .5);
}

/* ---------- Magenta (ماگنتا) ---------- */
.g-btn--magenta{
    color: #FFF;
    background: linear-gradient(135deg, #7A2B6B, #5B3E8F);
    box-shadow: 0 6px 16px rgba(122, 43, 107, .35);
}
.g-btn--magenta:hover{
    filter: brightness(1.12);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(122, 43, 107, .5);
}

/* ---------- Blue (آبی برند) ---------- */
.g-btn--blue{
    color: #FFF;
    background: linear-gradient(135deg, #3E6DB5, #2A4A80);
    box-shadow: 0 6px 16px rgba(62, 109, 181, .35);
}
.g-btn--blue:hover{
    filter: brightness(1.12);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(62, 109, 181, .5);
}

/* ---------- Green (موفق) ---------- */
.g-btn--green{
    color: #FFF;
    background: linear-gradient(135deg, #2E9E6B, #1A6E48);
    box-shadow: 0 6px 16px rgba(46, 158, 107, .35);
}
.g-btn--green:hover{
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(46, 158, 107, .5);
}


/* =========================================
   Outline Variants
========================================= */

.g-btn--outline{
    color: #5B3E8F;
    background: transparent;
    border-color: rgba(91, 62, 143, .35);
}
.g-btn--outline:hover{
    background: rgba(91, 62, 143, .08);
    border-color: #5B3E8F;
    transform: translateY(-2px);
}

.g-btn--outline-gold{
    color: #B8860B;
    background: transparent;
    border-color: rgba(212, 175, 55, .5);
}
.g-btn--outline-gold:hover{
    background: rgba(212, 175, 55, .1);
    border-color: #D4AF37;
    transform: translateY(-2px);
}

.g-btn--outline-danger{
    color: #C41E3A;
    background: transparent;
    border-color: rgba(196, 30, 58, .4);
}
.g-btn--outline-danger:hover{
    background: rgba(196, 30, 58, .08);
    border-color: #C41E3A;
    transform: translateY(-2px);
}


/* =========================================
   Soft / Ghost Variants
========================================= */

/* Soft (پس‌زمینه ملایم) */
.g-btn--soft{
    color: #5B3E8F;
    background: rgba(91, 62, 143, .1);
}
.g-btn--soft:hover{
    background: rgba(91, 62, 143, .18);
    transform: translateY(-2px);
}

.g-btn--soft-gold{
    color: #B8860B;
    background: rgba(212, 175, 55, .15);
}
.g-btn--soft-gold:hover{
    background: rgba(212, 175, 55, .25);
    transform: translateY(-2px);
}

.g-btn--soft-danger{
    color: #C41E3A;
    background: rgba(196, 30, 58, .1);
}
.g-btn--soft-danger:hover{
    background: rgba(196, 30, 58, .18);
    transform: translateY(-2px);
}

/* Ghost (بدون پس‌زمینه) */
.g-btn--ghost{
    color: #6B5F88;
    background: transparent;
}
.g-btn--ghost:hover{
    color: #5B3E8F;
    background: rgba(91, 62, 143, .08);
}


/* =========================================
   Size Modifiers
========================================= */

.g-btn--xs{
    height: 30px;
    padding: 0 12px;
    font-size: 11px;
    border-radius: 9px;
    gap: 5px;
}
.g-btn--xs i{ font-size: 10px; }

.g-btn--sm{
    height: 36px;
    padding: 0 14px;
    font-size: 12px;
    border-radius: 10px;
    gap: 6px;
}
.g-btn--sm i{ font-size: 11px; }

.g-btn--lg{
    height: 52px;
    padding: 0 26px;
    font-size: 14px;
    border-radius: 14px;
    gap: 10px;
}
.g-btn--lg i{ font-size: 14px; }

.g-btn--xl{
    height: 60px;
    padding: 0 32px;
    font-size: 15px;
    border-radius: 16px;
    gap: 10px;
}


/* =========================================
   Shape Modifiers
========================================= */

.g-btn--block{
    display: flex;
    width: 100%;
}

.g-btn--pill{
    border-radius: 999px;
}

.g-btn--square{
    width: 44px;
    padding: 0;
    border-radius: 12px;
}
.g-btn--square.g-btn--sm{ width: 36px; }
.g-btn--square.g-btn--lg{ width: 52px; }
.g-btn--square.g-btn--xs{ width: 30px; }


/* =========================================
   Icon-only / Icon position
========================================= */

.g-btn--icon-start{ flex-direction: row; }
.g-btn--icon-end{ flex-direction: row-reverse; }

.g-btn--icon{
    width: 44px;
    padding: 0;
    border-radius: 12px;
}
.g-btn--icon.g-btn--sm{ width: 36px; }
.g-btn--icon.g-btn--lg{ width: 52px; }


/* =========================================
   States
========================================= */

/* لودینگ */
.g-btn--loading{
    color: transparent !important;
    pointer-events: none;
    position: relative;
}
.g-btn--loading::after{
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -8px;
    border: 2px solid rgba(255, 255, 255, .35);
    border-top-color: #FFF;
    border-radius: 50%;
    animation: g-btn-spin .7s linear infinite;
}
.g-btn--loading.g-btn--outline::after,
.g-btn--loading.g-btn--soft::after,
.g-btn--loading.g-btn--ghost::after{
    border-color: rgba(91, 62, 143, .25);
    border-top-color: #5B3E8F;
}

@keyframes g-btn-spin{
    to{ transform: rotate(360deg); }
}


/* =========================================
   Button Group
========================================= */
.g-btn-group{
    display: inline-flex;
    align-items: center;
    gap: 0;
}
.g-btn-group .g-btn{
    border-radius: 0;
    box-shadow: none;
}
.g-btn-group .g-btn:first-child{
    border-start-start-radius: 12px;
    border-end-start-radius: 12px;
}
.g-btn-group .g-btn:last-child{
    border-start-end-radius: 12px;
    border-end-end-radius: 12px;
}
.g-btn-group .g-btn + .g-btn{
    margin-inline-start: -1.5px;
}


/* =========================================
   Accessibility
========================================= */
@media (prefers-reduced-motion: reduce){
    .g-btn{
        transition-duration: .01ms !important;
    }
    .g-btn:hover{ transform: none !important; }
    .g-btn--loading::after{
        animation-duration: 2s;
    }
}