/* ============================================================
   AJAX WooCommerce Reviews — Frontend Styles
   Responsive, Elementor-safe (all selectors scoped to .awr-*)
============================================================ */

/* ---- Reset / base ---- */
.awr-widget *,
.awr-widget *::before,
.awr-widget *::after {
    box-sizing: border-box;
}

.awr-widget {
    --awr-accent:      #f0a500;
    --awr-accent-dark: #c88400;
    --awr-star-full:   #f0a500;
    --awr-star-empty:  #d4d4d4;
    --awr-radius:      8px;
    --awr-shadow:      0 2px 12px rgba(0,0,0,.08);
    --awr-text:        #333;
    --awr-muted:       #777;
    --awr-border:      #e5e5e5;
    --awr-success-bg:  #ecfdf5;
    --awr-success-fg:  #065f46;
    --awr-error-bg:    #fef2f2;
    --awr-error-fg:    #991b1b;
    --awr-font:        inherit;

    font-family:   var(--awr-font);
    color:         var(--awr-text);
    margin-top:    2.5rem;
    padding-top:   2rem;
    border-top:    2px solid var(--awr-border);
}

/* ---- Summary bar ---- */
.awr-summary {
    display:         flex;
    align-items:     center;
    gap:             1rem;
    margin-bottom:   1.5rem;
}

.awr-summary-score {
    display:       flex;
    flex-direction: column;
    align-items:   center;
    gap:           .25rem;
}

.awr-big-rating {
    font-size:   3rem;
    font-weight: 800;
    line-height: 1;
    color:       var(--awr-accent-dark);
}

.awr-summary-stars .awr-star {
    font-size: 1.4rem;
}

.awr-star--full  { color: var(--awr-star-full); }
.awr-star--empty { color: var(--awr-star-empty); }

.awr-total-count {
    font-size:  .85rem;
    color:      var(--awr-muted);
    text-align: center;
}

/* ---- Two-column layout ---- */
.awr-columns {
    display:               grid;
    grid-template-columns: 1fr 1.5fr;
    gap:                   2rem;
    align-items:           start;
}

@media (max-width: 768px) {
    .awr-columns {
        grid-template-columns: 1fr;
    }
}

/* ---- Section headings ---- */
.awr-section-title {
    font-size:     1.1rem;
    font-weight:   700;
    margin:        0 0 1rem;
    display:       flex;
    align-items:   center;
    gap:           .5rem;
    flex-wrap:     wrap;
}

/* ---- Live badge ---- */
.awr-live-badge {
    font-size:       .75rem;
    font-weight:     600;
    background:      var(--awr-accent);
    color:           #fff;
    border-radius:   999px;
    padding:         .15rem .65rem;
    opacity:         0;
    transform:       scale(.8);
    transition:      opacity .3s, transform .3s;
}

.awr-live-badge.awr-badge--visible {
    opacity:   1;
    transform: scale(1);
}

/* ============================================================
   Star rating picker
============================================================ */
.awr-rating-picker {
    margin-bottom: 1rem;
}

.awr-rating-label {
    display:       block;
    font-size:     .85rem;
    font-weight:   600;
    margin-bottom: .4rem;
    color:         var(--awr-text);
}

/* Reverse-order CSS star trick */
.awr-stars-input {
    display:         inline-flex;
    flex-direction:  row-reverse;
    gap:             .1rem;
    unicode-bidi:    bidi-override;
}

.awr-stars-input input[type="radio"] {
    display: none;
}

.awr-stars-input label {
    font-size:  2rem;
    color:      var(--awr-star-empty);
    cursor:     pointer;
    transition: color .15s, transform .1s;
    padding:    0 .05rem;
}

/* Hover: colour this star and everything to its right */
.awr-stars-input label:hover,
.awr-stars-input label:hover ~ label,
.awr-stars-input[data-hover] label:hover,
.awr-stars-input[data-hover] label:hover ~ label {
    color:     var(--awr-star-full);
    transform: scale(1.15);
}

/* Selected state */
.awr-stars-input input[type="radio"]:checked ~ label {
    color: var(--awr-star-full);
}

.awr-rating-hint {
    display:     block;
    font-size:   .8rem;
    color:       var(--awr-accent-dark);
    font-weight: 600;
    min-height:  1.2em;
    margin-top:  .25rem;
}

/* ============================================================
   Form fields
============================================================ */
.awr-hp { display: none !important; }

.awr-required { color: #e33; }

.awr-field-row {
    display:               grid;
    grid-template-columns: 1fr 1fr;
    gap:                   .75rem;
    margin-bottom:         1rem;
}

@media (max-width: 480px) {
    .awr-field-row { grid-template-columns: 1fr; }
}

.awr-field {
    display:       flex;
    flex-direction: column;
    gap:           .3rem;
    margin-bottom: .85rem;
}

.awr-field label {
    font-size:   .85rem;
    font-weight: 600;
    color:       var(--awr-text);
}

.awr-field input,
.awr-field textarea {
    width:         100%;
    padding:       .55rem .75rem;
    border:        1.5px solid var(--awr-border);
    border-radius: var(--awr-radius);
    font-size:     .95rem;
    font-family:   var(--awr-font);
    color:         var(--awr-text);
    background:    #fff;
    transition:    border-color .2s, box-shadow .2s;
    resize:        vertical;
}

.awr-field input:focus,
.awr-field textarea:focus {
    outline:      none;
    border-color: var(--awr-accent);
    box-shadow:   0 0 0 3px rgba(240,165,0,.15);
}

.awr-logged-in-note {
    font-size:     .85rem;
    color:         var(--awr-muted);
    margin-bottom: .75rem;
}

/* ---- Submit button ---- */
.awr-form-footer { margin-top: .5rem; }

.awr-submit-btn {
    display:          inline-flex;
    align-items:      center;
    justify-content:  center;
    padding:          .65rem 1.5rem;
    background:       var(--awr-accent);
    color:            #fff;
    border:           none;
    border-radius:    var(--awr-radius);
    font-size:        .95rem;
    font-weight:      700;
    cursor:           pointer;
    transition:       background .2s, transform .1s, opacity .2s;
    width:            100%;
}

.awr-submit-btn:hover  { background: var(--awr-accent-dark); }
.awr-submit-btn:active { transform: scale(.98); }
.awr-submit-btn:disabled {
    opacity: .6;
    cursor:  not-allowed;
}

/* ---- Messages ---- */
.awr-message {
    margin-top:    .75rem;
    padding:       .65rem 1rem;
    border-radius: var(--awr-radius);
    font-size:     .9rem;
    font-weight:   500;
    display:       none;
}

.awr-message:not(:empty) { display: block; }

.awr-msg--success {
    background: var(--awr-success-bg);
    color:      var(--awr-success-fg);
    border:     1px solid #a7f3d0;
}

.awr-msg--error {
    background: var(--awr-error-bg);
    color:      var(--awr-error-fg);
    border:     1px solid #fca5a5;
}

.awr-login-notice {
    font-size:     .9rem;
    color:         var(--awr-muted);
    padding:       1rem;
    border:        1.5px dashed var(--awr-border);
    border-radius: var(--awr-radius);
    text-align:    center;
}

/* ============================================================
   Review cards
============================================================ */
.awr-reviews-list {
    display:       flex;
    flex-direction: column;
    gap:           1rem;
}

.awr-no-reviews,
.awr-no-more {
    font-size:  .9rem;
    color:      var(--awr-muted);
    text-align: center;
    padding:    1.5rem 0;
}

.awr-review-card {
    background:    #fff;
    border:        1px solid var(--awr-border);
    border-radius: var(--awr-radius);
    padding:       1rem 1.2rem;
    box-shadow:    var(--awr-shadow);
    transition:    box-shadow .2s;
}

.awr-review-card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,.12);
}

.awr-review-header {
    display:       flex;
    align-items:   flex-start;
    gap:           .75rem;
    margin-bottom: .6rem;
}

.awr-avatar {
    border-radius: 50%;
    flex-shrink:   0;
    border:        2px solid var(--awr-border);
}

.awr-review-meta {
    display:       flex;
    flex-direction: column;
    gap:           .15rem;
}

.awr-author {
    font-size:   .95rem;
    font-weight: 700;
    color:       var(--awr-text);
}

.awr-stars {
    font-size:   1.1rem;
    line-height: 1;
}

.awr-stars-full { color: var(--awr-star-full); }
.awr-stars-empty{ color: var(--awr-star-empty); }

.awr-date {
    font-size: .78rem;
    color:     var(--awr-muted);
}

.awr-review-title {
    font-size:     1rem;
    font-weight:   700;
    margin:        0 0 .4rem;
    color:         var(--awr-text);
}

.awr-review-text {
    font-size:   .9rem;
    line-height: 1.6;
    color:       var(--awr-text);
    margin:      0;
}

/* ---- Load more ---- */
.awr-load-more-wrap {
    margin-top: 1.25rem;
    text-align: center;
}

.awr-load-more-btn {
    display:       inline-block;
    padding:       .55rem 1.5rem;
    border:        1.5px solid var(--awr-accent);
    background:    transparent;
    color:         var(--awr-accent-dark);
    border-radius: var(--awr-radius);
    font-size:     .9rem;
    font-weight:   600;
    cursor:        pointer;
    transition:    background .2s, color .2s;
}

.awr-load-more-btn:hover {
    background: var(--awr-accent);
    color:      #fff;
}

.awr-load-more-btn:disabled {
    opacity: .5;
    cursor:  not-allowed;
}