/**
 * Button Stack Block - Académie des Étoiles
 */

.ade-button-stack { margin: var(--ade-space-2xl) 0; }

.ade-button-stack__container {
    /* Removed bulky white wrapper - clean minimal style */

    margin: var(--ade-space-xl) 0;
}

.ade-button-stack__heading {
    font-size: var(--ade-font-size-xl);
    font-weight: 700;
    color: var(--ade-primary-dark);
    margin: 0 0 var(--ade-space-xl) 0;
    text-align: center;
}

/* Button layout */
.ade-button-stack__buttons {
    display: flex;
    gap: var(--ade-space-lg);
}

.ade-button-stack__buttons--vertical {
    flex-direction: column;
}

.ade-button-stack__buttons--horizontal {
    flex-direction: row;
    flex-wrap: wrap;
}

/* Individual buttons */
.ade-button-stack__button {
    display: flex;
    flex-direction: column;
    gap: var(--ade-space-xs);
    padding: var(--ade-space-lg);
    border-radius: 12px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 2px solid transparent;
    position: relative;
}

.ade-button-stack__button:hover {
    transform: translateX(8px);
    box-shadow: var(--ade-shadow-lg);
}

.ade-button-stack__button:focus {
    outline: 3px solid rgba(155, 81, 224, 0.3);
    outline-offset: 4px;
}

.ade-button-stack__button-main {
    display: flex;
    align-items: center;
    gap: var(--ade-space-md);
}

.ade-button-stack__icon {
    font-size: 28px;
    flex-shrink: 0;
}

.ade-button-stack__text {
    font-size: var(--ade-font-size-large);
    font-weight: 600;
    flex: 1;
}

.ade-button-stack__arrow {
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.ade-button-stack__button:hover .ade-button-stack__arrow {
    transform: translateX(4px);
}

.ade-button-stack__description {
    font-size: var(--ade-font-size-small);
    margin: 0;
    padding-left: calc(28px + var(--ade-space-md));
    line-height: 1.5;
    opacity: 0.9;
}

/* Style variants */

/* Primary */
.ade-button-stack__button--primary {
    background: linear-gradient(135deg, rgba(155, 81, 224, 0.1) 0%, rgba(202, 179, 255, 0.1) 100%);
    border-color: rgba(155, 81, 224, 0.2);
    color: var(--ade-primary-dark);
}

.ade-button-stack__button--primary:hover {
    background: linear-gradient(135deg, rgba(155, 81, 224, 0.15) 0%, rgba(202, 179, 255, 0.15) 100%);
    border-color: var(--ade-primary);
}

/* Secondary */
.ade-button-stack__button--secondary {
    background: rgba(108, 117, 125, 0.08);
    border-color: rgba(108, 117, 125, 0.2);
    color: var(--ade-text);
}

.ade-button-stack__button--secondary:hover {
    background: rgba(108, 117, 125, 0.12);
    border-color: var(--ade-gray);
}

/* Success */
.ade-button-stack__button--success {
    background: rgba(46, 213, 115, 0.1);
    border-color: rgba(46, 213, 115, 0.2);
    color: #1a7c4f;
}

.ade-button-stack__button--success:hover {
    background: rgba(46, 213, 115, 0.15);
    border-color: #2ec573;
}

/* Warning */
.ade-button-stack__button--warning {
    background: rgba(255, 159, 67, 0.1);
    border-color: rgba(255, 159, 67, 0.2);
    color: #c56d0f;
}

.ade-button-stack__button--warning:hover {
    background: rgba(255, 159, 67, 0.15);
    border-color: #ff9f43;
}

/* Horizontal layout adjustments */
.ade-button-stack__buttons--horizontal .ade-button-stack__button {
    flex: 1;
    min-width: 250px;
}

.ade-button-stack__buttons--horizontal .ade-button-stack__button:hover {
    transform: translateY(-4px);
}

/* Responsive */
@media screen and (max-width: 768px) {
    .ade-button-stack__container {
        padding: var(--ade-space-lg);
    }

    .ade-button-stack__buttons--horizontal {
        flex-direction: column;
    }

    .ade-button-stack__button {
        padding: var(--ade-space-md);
    }

    .ade-button-stack__icon {
        font-size: 24px;
    }

    .ade-button-stack__text {
        font-size: var(--ade-font-size-base);
    }

    .ade-button-stack__description {
        padding-left: calc(24px + var(--ade-space-sm));
        font-size: 0.875rem;
    }
}
