/* ==========================================================================
   PORTAL UI COMPONENTS: BUTTONS
   Focus: Blocbuster Design System & UIkit Overrides
   ========================================================================== */

/* 1. Base Overrides (UIkit)
   -------------------------------------------------------------------------- */
.uk-button {
    text-transform: none; /* Suppression du style majuscule par défaut d'UIkit */
    font-weight: 500;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease-in-out;
}

/* 2. Color Variants (Blocbuster Brand)
   -------------------------------------------------------------------------- */

/* Primary */
.uk-button-primary,
.uk-button-primary .button {
    background-color: var(--bb-accent-color);
    color: #fff !important;
}

.uk-button-primary:hover,
.uk-button-primary .button:hover {
    background-color: var(--bb-accent-color-contrasted);
}

/* Danger */
.uk-button-danger {
    background-color: var(--bb-danger-color);
}

.uk-button-danger:hover {
    background-color: var(--bb-danger-color-contrasted);
}

/* Ghost / Bordered style */
.uk-button-primary.uk-border-button:not(:hover) {
    background-color: transparent;
    color: var(--bb-accent-color);
    border: 1px solid var(--bb-accent-color);
}

/* 3. Special Components (Glow & Icons)
   -------------------------------------------------------------------------- */

/* Icon specific adjustment */
.uk-button.uk-button-icon {
    padding: 6px;
    line-height: .7rem;
}

/* Premium Glow Effect (e.g., for Subscriptions/Upsell) */
.uk-button-glow {
    position: relative;
    z-index: 1;
    overflow: hidden;
    background-color: rgba(40, 148, 255, 0.75);
    color: white;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(4px);
    box-shadow: 0 4px 15px rgba(30, 135, 240, 0.3);
}

.uk-button-glow::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: conic-gradient(
            from 0deg,
            #1e87f0, /* UIkit Blue */
            #00ffff, /* Electric Cyan */
            #8a2be2, /* Violet */
            #1e87f0  /* Loop back */
    );
    filter: blur(20px);
    animation: uk-button-glow 4s linear infinite;
    opacity: 0.6;
}

/* 4. States & Interactions
   -------------------------------------------------------------------------- */

/* Disabled state */
.uk-button-primary:disabled,
.uk-button-primary.uk-disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Loading state (Portal Custom Implementation) */
.uk-button.loading {
    position: relative;
    pointer-events: none;
    opacity: 0.85;
    padding-right: 3.1em;
}

.uk-button.loading::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 1.05em;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    border-radius: 50%;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-top-color: transparent;
    animation: uk-btn-spin 0.7s linear infinite;
}

/* 5. Legacy / External UI Compatibility
   -------------------------------------------------------------------------- */
.ui.button { background: var(--bb-gray-light); }
.ui.negative.button { background: var(--bb-danger-color); }

/* 6. Animations
   -------------------------------------------------------------------------- */
@keyframes uk-btn-spin {
    to { transform: rotate(360deg); }
}

@keyframes uk-button-glow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}