/**
 * Produk2U Block Styles
 */

/* Rating Badge */
.p2u-rating-badge {
    display: inline-block;
    background: linear-gradient(135deg, #F8FAFC, #E2E8F0);
    border: 2px solid var(--p2u-secondary, #2563EB);
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    min-width: 160px;
    margin: 16px 0;
}

.p2u-rating-badge--excellent { border-color: #10B981; }
.p2u-rating-badge--good { border-color: #F59E0B; }
.p2u-rating-badge--average { border-color: #EF4444; }

.p2u-rating-badge__score {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
    color: var(--p2u-secondary, #2563EB);
}

.p2u-rating-badge--excellent .p2u-rating-badge__score { color: #10B981; }
.p2u-rating-badge--good .p2u-rating-badge__score { color: #F59E0B; }
.p2u-rating-badge--average .p2u-rating-badge__score { color: #EF4444; }

.p2u-rating-badge__max {
    font-size: 14px;
    color: #64748B;
    margin-top: 4px;
}

.p2u-rating-badge__label {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 8px;
}

.p2u-rating-badge__bar {
    height: 6px;
    background: #E2E8F0;
    border-radius: 3px;
    margin-top: 12px;
    overflow: hidden;
}

.p2u-rating-badge__fill {
    height: 100%;
    background: currentColor;
    border-radius: 3px;
    transition: width 0.5s ease;
}

/* Affiliate Button Wrapper */
.p2u-aff-btn-wrapper {
    margin: 16px 0;
}

/* Editor Styles */
.editor-styles-wrapper .p2u-pros-cons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 640px) {
    .editor-styles-wrapper .p2u-pros-cons {
        grid-template-columns: 1fr;
    }
}