/* ==========================================
   Smart Reviews — Display / Shortcode Styles
   ========================================== */

:root {
    --sr-primary:    #6C63FF;
    --sr-gold:       #f59e0b;
    --sr-gold-lt:    #fef3c7;
    --sr-text:       #1e1b4b;
    --sr-muted:      #6b7280;
    --sr-border:     #e5e7eb;
    --sr-bg:         #f9fafb;
    --sr-white:      #ffffff;
    --sr-radius:     16px;
    --sr-shadow:     0 2px 16px rgba(0,0,0,.07);
    --sr-shadow-h:   0 8px 32px rgba(108,99,255,.14);
}

/* ---- Widget wrapper ---- */
.sr-widget {
    font-family: inherit;
    margin: 2.5rem 0;
}

/* ---- Summary block ---- */
.sr-summary {
    display: flex;
    gap: 2.5rem;
    align-items: center;
    background: linear-gradient(135deg, #f0f0ff 0%, #fff 100%);
    border: 2px solid #ede9fe;
    border-radius: 20px;
    padding: 2rem 2.5rem;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
}

.sr-summary-score {
    text-align: center;
    min-width: 120px;
}

.sr-big-rating {
    font-size: 4rem;
    font-weight: 800;
    color: var(--sr-text);
    line-height: 1;
    letter-spacing: -2px;
}

.sr-summary-stars {
    margin: .4rem 0 .3rem;
}

.sr-summary-count {
    font-size: .85rem;
    color: var(--sr-muted);
}

.sr-summary-bars {
    flex: 1;
    min-width: 200px;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.sr-bar-row {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .82rem;
    color: var(--sr-muted);
}

.sr-bar-row > span:first-child {
    min-width: 28px;
    text-align: right;
    font-weight: 600;
    color: var(--sr-text);
}

.sr-bar-track {
    flex: 1;
    height: 8px;
    background: #e5e7eb;
    border-radius: 99px;
    overflow: hidden;
}

.sr-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--sr-primary), #a78bfa);
    border-radius: 99px;
    transition: width .6s ease;
}

.sr-bar-row > span:last-child {
    min-width: 20px;
    font-size: .78rem;
}

/* ---- Stars ---- */
.sr-stars { display: inline-flex; gap: 1px; }
.sr-star  { font-size: 1.1rem; }
.sr-star-full  { color: var(--sr-gold); }
.sr-star-half  { color: var(--sr-gold); opacity: .6; }
.sr-star-empty { color: #d1d5db; }

/* ---- Grid ---- */
.sr-grid {
    display: grid;
    gap: 1.25rem;
}

.sr-cols-1 { grid-template-columns: 1fr; }
.sr-cols-2 { grid-template-columns: repeat(2, 1fr); }
.sr-cols-3 { grid-template-columns: repeat(3, 1fr); }
.sr-cols-4 { grid-template-columns: repeat(4, 1fr); }

/* ---- Card ---- */
.sr-card {
    background: var(--sr-white);
    border: 1px solid var(--sr-border);
    border-radius: var(--sr-radius);
    padding: 1.4rem 1.4rem 1.2rem;
    box-shadow: var(--sr-shadow);
    transition: transform .2s, box-shadow .2s;
    display: flex;
    flex-direction: column;
    gap: .7rem;
    position: relative;
    overflow: hidden;
}

.sr-card::before {
    content: '"';
    position: absolute;
    top: -10px;
    right: 12px;
    font-size: 5.5rem;
    color: #ede9fe;
    font-family: Georgia, serif;
    line-height: 1;
    pointer-events: none;
}

.sr-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--sr-shadow-h);
    border-color: #c4b5fd;
}

/* Header row */
.sr-card-header {
    display: flex;
    align-items: center;
    gap: .8rem;
}

.sr-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: hsl(var(--hue, 250deg), 65%, 60%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    font-weight: 700;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
}

.sr-card-meta {
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.sr-reviewer-name {
    font-size: .95rem;
    font-weight: 700;
    color: var(--sr-text);
}

.sr-review-date {
    font-size: .77rem;
    color: var(--sr-muted);
}

/* Stars row */
.sr-card-stars .sr-star {
    font-size: 1.05rem;
}

/* Text */
.sr-card-text {
    font-size: .9rem;
    line-height: 1.65;
    color: #374151;
    flex: 1;
}

/* Verified badge */
.sr-verified {
    font-size: .73rem;
    color: #10b981;
    font-weight: 600;
}

/* No reviews */
.sr-no-reviews {
    text-align: center;
    padding: 3rem;
    color: var(--sr-muted);
    font-style: italic;
    border: 2px dashed var(--sr-border);
    border-radius: var(--sr-radius);
}

/* Responsive */
@media (max-width: 860px) {
    .sr-cols-4 { grid-template-columns: repeat(2, 1fr); }
    .sr-cols-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
    .sr-summary { flex-direction: column; gap: 1.25rem; padding: 1.5rem; }
    .sr-cols-4,
    .sr-cols-3,
    .sr-cols-2 { grid-template-columns: 1fr; }
    .sr-big-rating { font-size: 3rem; }
}