/* Latinas Reviews - Frontend Styles - High Specificity Override */

/* =========================================
   0. CSS Reset & Isolation
   ========================================= */

/* Main containers reset */
.latinas-review-form-wrap,
.latinas-reviews-container,
.latinas-rating-badge {
    box-sizing: border-box !important;
    line-height: 1.5 !important;
    font-family: inherit !important;
    color: #334155 !important;
    text-align: left !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
}

/* Child elements reset */
.latinas-review-form-wrap *,
.latinas-reviews-container *,
.latinas-rating-badge * {
    box-sizing: border-box !important;
}

/* Fix for themes adding margins to everything */
.latinas-review-form-wrap div,
.latinas-reviews-container div,
.latinas-rating-badge span {
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
}

/* =========================================
   1. Review Form
   ========================================= */

.latinas-review-form-wrap {
    max-width: 500px !important;
    margin: 20px 0 !important;
    width: 100% !important;
    position: relative !important;
    z-index: 99 !important; /* High z-index */
}

/* Toggle Button */
button.latinas-toggle-form-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 14px 28px !important;
    background: linear-gradient(135deg, #00bcd4 0%, #0097a7 100%) !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 50px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(0,188,212,0.3) !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    width: auto !important;
    height: auto !important;
    text-transform: none !important;
    margin-bottom: 0 !important;
}

button.latinas-toggle-form-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0,188,212,0.4) !important;
    color: #fff !important;
}

button.latinas-toggle-form-btn.active {
    background: linear-gradient(135deg, #64748b 0%, #475569 100%) !important;
    box-shadow: 0 4px 15px rgba(71,85,105,0.3) !important;
}

.latinas-toggle-icon {
    font-size: 18px !important;
    line-height: 1 !important;
    margin-right: 5px !important;
    display: inline-block !important;
}

/* Form Container */
.latinas-review-form-container {
    margin-top: 20px !important;
    padding: 40px !important;
    background: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important;
    animation: latinasSlideDown 0.3s ease !important;
    border: 1px solid #e2e8f0 !important;
    position: relative !important;
    z-index: 100 !important;
}

@keyframes latinasSlideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

h3.latinas-review-title {
    margin: 0 0 30px !important;
    padding: 0 !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    line-height: 1.3 !important;
    border: none !important;
    text-transform: none !important;
    background: none !important;
}

.latinas-field {
    margin-bottom: 30px !important;
    text-align: left !important;
    display: block !important;
}

.latinas-field label {
    display: block !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    margin-bottom: 12px !important;
    line-height: 1.4 !important;
    float: none !important;
    width: auto !important;
    cursor: default !important;
}

.latinas-field .required {
    color: #e11d48 !important;
    margin-left: 4px !important;
}

input.latinas-input,
textarea.latinas-textarea {
    width: 100% !important;
    padding: 16px 20px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    color: #334155 !important;
    background-color: #fff !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    box-sizing: border-box !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    height: auto !important;
    box-shadow: none !important;
    max-width: 100% !important;
    display: block !important;
}

textarea.latinas-textarea {
    min-height: 120px !important;
    resize: vertical !important;
}

input.latinas-input:focus,
textarea.latinas-textarea:focus {
    outline: none !important;
    border-color: #00bcd4 !important;
    box-shadow: 0 0 0 3px rgba(0,188,212,0.1) !important;
}

input.latinas-captcha-input {
    max-width: 150px !important;
}

/* Star Rating Input */
.latinas-star-rating {
    display: flex !important;
    gap: 4px !important;
    flex-direction: row !important;
    align-items: center !important;
}

.latinas-star-rating .latinas-star {
    font-size: 28px !important;
    color: #cbd5e1 !important; /* Lighter gray for empty */
    cursor: pointer !important;
    transition: color 0.15s, transform 0.15s !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block !important;
    user-select: none !important;
}

.latinas-star-rating .latinas-star:hover,
.latinas-star-rating .latinas-star.active {
    color: #fbbf24 !important;
    transform: scale(1.1) !important;
}

.latinas-star-rating .latinas-star.hovered {
    color: #fcd34d !important;
}

/* Submit Button */
button.latinas-submit-btn {
    width: 100% !important;
    padding: 18px 30px !important;
    margin-top: 30px !important;
    background: linear-gradient(135deg, #00bcd4 0%, #0097a7 100%) !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: transform 0.2s, box-shadow 0.2s !important;
    text-align: center !important;
    line-height: 1.4 !important;
    text-transform: none !important;
    height: auto !important;
    display: block !important;
}

button.latinas-submit-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0,188,212,0.3) !important;
    color: #fff !important;
}

button.latinas-submit-btn:disabled {
    opacity: 0.7 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* Messages */
.latinas-message {
    padding: 12px 16px !important;
    border-radius: 8px !important;
    margin-bottom: 20px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    display: block !important;
    text-align: left !important;
}

.latinas-message.success {
    background: #ecfdf5 !important;
    color: #065f46 !important;
    border: 1px solid #a7f3d0 !important;
}

.latinas-message.error {
    background: #fef2f2 !important;
    color: #991b1b !important;
    border: 1px solid #fecaca !important;
}

/* =========================================
   2. Rating Badge
   ========================================= */

.latinas-rating-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 16px !important;
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%) !important;
    border-radius: 50px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
    width: auto !important;
    height: auto !important;
    text-decoration: none !important;
    border: 1px solid #fcd34d !important;
}

.latinas-rating-badge.latinas-no-reviews {
    background: #f1f5f9 !important;
    color: #64748b !important;
    border-color: #e2e8f0 !important;
}

.latinas-rating-stars {
    display: inline-flex !important;
    gap: 1px !important;
    align-items: center !important;
}

.latinas-rating-badge .latinas-star {
    font-size: 16px !important;
    line-height: 1 !important;
    display: inline-block !important;
    padding: 0 !important;
    margin: 0 !important;
}

.latinas-rating-badge .latinas-star.filled,
.latinas-rating-badge .latinas-star.half {
    color: #f59e0b !important;
}

.latinas-rating-badge .latinas-star.empty {
    color: #d1d5db !important;
}

.latinas-rating-number {
    font-weight: 700 !important;
    color: #b45309 !important;
    margin: 0 4px !important;
    font-size: 15px !important;
}

.latinas-rating-count {
    color: #78716c !important;
    font-size: 13px !important;
    margin-left: 0 !important;
}

/* =========================================
   3. Reviews List (Slider)
   ========================================= */

.latinas-reviews-container {
    margin: 24px 0 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: block !important;
}

.latinas-reviews-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.latinas-review-card {
    background: #fff !important;
    border-radius: 12px !important;
    padding: 24px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
    border: 1px solid #e2e8f0 !important;
    box-sizing: border-box !important;
    margin-bottom: 0 !important;
    text-align: left !important;
    position: relative !important;
    display: block !important;
}

.latinas-review-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 16px !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding-bottom: 16px !important;
}

.latinas-reviewer-name {
    font-weight: 700 !important;
    color: #0f172a !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.latinas-review-date {
    font-size: 13px !important;
    color: #94a3b8 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 500 !important;
}

.latinas-review-stars {
    display: flex !important;
    gap: 2px !important;
    margin-bottom: 12px !important;
    align-items: center !important;
}

.latinas-review-stars .latinas-star {
    font-size: 18px !important;
    line-height: 1 !important;
    display: inline-block !important;
    padding: 0 !important;
    margin: 0 !important;
}

.latinas-review-stars .latinas-star.filled {
    color: #f59e0b !important;
}

.latinas-review-stars .latinas-star.empty {
    color: #e2e8f0 !important;
}

.latinas-review-text {
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #334155 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: pre-wrap !important;
}

.latinas-no-reviews-msg {
    padding: 30px !important;
    background: #f8fafc !important;
    border-radius: 12px !important;
    text-align: center !important;
    color: #64748b !important;
    border: 1px solid #e2e8f0 !important;
    margin: 0 !important;
    font-style: italic !important;
}

/* Load More Button */
.latinas-load-more-container {
    text-align: center !important;
    margin-top: 32px !important;
    padding: 0 !important;
}

button.latinas-load-more-btn {
    padding: 14px 32px !important;
    background: linear-gradient(135deg, #00bcd4 0%, #0097a7 100%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 10px rgba(0,188,212,0.2) !important;
    display: inline-block !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
}

button.latinas-load-more-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 15px rgba(0,188,212,0.3) !important;
    color: #fff !important;
}

button.latinas-load-more-btn:disabled {
    opacity: 0.7 !important;
    cursor: wait !important;
    transform: none !important;
}

/* Responsive */
@media (max-width: 600px) {
    .latinas-review-form-wrap {
        
        margin: 10px 0 !important;
    }
    
    .latinas-review-card {
        padding: 16px !important;
    }
    
    button.latinas-toggle-form-btn {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* =========================================
   4. Owner Reply Styles
   ========================================= */

/* Reply Button */
.latinas-reply-action {
    display: block !important;
    visibility: visible !important;
    margin-top: 15px !important;
}

.latinas-reply-btn {
    display: inline-block !important;
    margin-top: 0 !important;
    font-size: 13px !important;
    color: #00bcd4 !important;
    background: none !important;
    border: 1px solid #00bcd4 !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    transition: all 0.2s !important;
}

.latinas-reply-btn:hover {
    background: #00bcd4 !important;
    color: #fff !important;
}

/* Reply Form */
.latinas-reply-form {
    margin-top: 15px !important;
    padding: 15px !important;
    background: #f8fafc !important;
    border-radius: 8px !important;
    border: 1px solid #e2e8f0 !important;
}

.latinas-reply-form textarea {
    width: 100% !important;
    min-height: 80px !important;
    padding: 10px !important;
    margin-bottom: 10px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    display: block !important;
}

.latinas-reply-submit {
    background: #00bcd4 !important;
    color: #fff !important;
    border: none !important;
    padding: 8px 16px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}

.latinas-reply-submit:hover {
    background: #0097a7 !important;
}

/* Owner Reply Display */
.latinas-owner-reply {
    margin-top: 20px !important;
    padding: 15px !important;
    background: #f0f9ff !important;
    border-left: 4px solid #00bcd4 !important;
    border-radius: 4px !important;
}

.latinas-reply-header {
    display: flex !important;
    justify-content: space-between !important;
    margin-bottom: 8px !important;
    font-size: 13px !important;
}

.latinas-reply-author {
    font-weight: 700 !important;
    color: #0e7490 !important;
}

.latinas-reply-date {
    color: #64748b !important;
}

.latinas-reply-text {
    font-size: 14px !important;
    color: #334155 !important;
    line-height: 1.5 !important;
    white-space: pre-wrap !important;
}