/* --- THEME VARIABLES --- */
#ner-master-container.ner-dark {
    --bg: #050505;
    --text: #ffffff;
    --border: #ffffff;
    --dots: rgba(255, 255, 255, 0.2);
    --card-bg: #050505;
    --btn-bg: #ffffff;
    --btn-text: #000000;
    --gray: #a3a3a3;
    --star: #facc15;
}

#ner-master-container.ner-light {
    --bg: #ffffff;
    --text: #000000;
    --border: #000000;
    --dots: rgba(0, 0, 0, 0.2);
    --card-bg: #ffffff;
    --btn-bg: #000000;
    --btn-text: #ffffff;
    --gray: #666666;
    --star: #facc15;
}

/* --- MASTER CONTAINER (Kills the Theme) --- */
#ner-master-container {
    margin: 0 !important;
    padding: 0 !important;
    background-color: var(--bg) !important;
    background-image: radial-gradient(var(--dots) 1px, transparent 1px) !important;
    background-size: 35px 35px !important; 
    background-position: center top !important;
    color: var(--text) !important;
    font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
    min-height: 100vh !important;
    width: 100% !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 99999 !important; /* Forces it over Woodmart */
}

/* --- HEADER --- */
.ner-header { display: flex; padding: 25px 50px !important; position: relative !important; }
.ner-logo { display: flex; align-items: center; }
.ner-logo-text { display: flex; flex-direction: column; align-items: center; line-height: 0.9 !important; }
.ner-logo-top { font-size: 36px !important; font-weight: 900 !important; letter-spacing: -0.5px !important; color: var(--text) !important; text-transform: uppercase !important;}
.ner-logo-bottom { font-size: 13px !important; font-weight: 500 !important; letter-spacing: 6.5px !important; margin-left: 6.5px !important; color: var(--text) !important; text-transform: uppercase !important;}
.ner-logo-star { color: var(--star) !important; font-size: 18px !important; margin-top: 4px !important; }
.ner-logo-star.left { margin-right: 12px !important; }
.ner-logo-star.right { margin-left: 12px !important; }

#ner-theme-toggle {
    position: absolute !important;
    right: 50px !important;
    top: 30px !important;
    background: var(--card-bg) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    padding: 8px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* --- MAIN CONTENT --- */
#ner-app { max-width: 550px !important; margin: 40px auto !important; padding: 0 20px !important; }

.ner-item-header { display: flex !important; align-items: center !important; gap: 20px !important; margin-bottom: 30px !important; }
.ner-item-image {
    width: 120px !important; height: 120px !important; border-radius: 50% !important;
    border: 1px solid var(--border) !important;
    background-size: cover !important; background-position: center !important; flex-shrink: 0 !important;
}
.ner-item-info { display: flex !important; flex-direction: column !important; }
.ner-title { font-size: 44px !important; font-weight: 800 !important; margin: 0 0 5px 0 !important; letter-spacing: -1px !important; color: var(--text) !important; line-height: 1 !important; text-transform: none !important; font-family: 'Inter', sans-serif !important;}
.ner-desc { font-size: 17px !important; font-weight: 500 !important; margin: 0 0 10px 0 !important; color: var(--text) !important; line-height: 1.4 !important; font-family: 'Inter', sans-serif !important;}

.ner-rating-display { display: flex !important; align-items: center !important; }
.ner-star-icon { color: var(--text) !important; display: inline-flex !important; margin-right: 2px !important; }
.ner-star-icon.active { color: var(--star) !important; }
.ner-rating-numbers { font-size: 14px !important; font-weight: 500 !important; margin-left: 10px !important; color: var(--text) !important; }

/* --- ACTION BOX --- */
.ner-action-box { display: flex !important; border: 1px solid var(--border) !important; margin-bottom: 40px !important; background: var(--card-bg) !important; height: 95px !important; box-shadow: none !important; }
.ner-action-left { flex: 1 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; }
.ner-action-label { font-size: 15px !important; margin-bottom: 8px !important; font-weight: 500 !important; color: var(--text) !important; text-transform: none !important;}
.ner-main-stars { display: flex !important; gap: 5px !important; cursor: pointer !important; color: var(--text) !important; }

.ner-action-divider { width: 1px !important; background-color: var(--border) !important; transform: skewX(-18deg) !important; height: 100% !important; }

.ner-action-right { flex: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important; }
#ner-open-review {
    background: var(--btn-bg) !important; color: var(--btn-text) !important;
    border: none !important; padding: 12px 24px !important; font-size: 15px !important; font-weight: 600 !important; cursor: pointer !important; text-transform: none !important; box-shadow: none !important; font-family: 'Inter', sans-serif !important; border-radius: 0 !important;
}

/* --- REVIEWS HEADER --- */
.ner-reviews-header { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 15px !important; }
.ner-total-reviews { font-size: 24px !important; font-weight: 500 !important; margin: 0 !important; color: var(--text) !important; text-transform: none !important; font-family: 'Inter', sans-serif !important;}
.ner-filters { display: flex !important; border: 1px solid var(--border) !important; }
.ner-filter-btn {
    background: var(--card-bg) !important; color: var(--text) !important;
    border: none !important; padding: 8px 16px !important; cursor: pointer !important; font-size: 14px !important; font-weight: 500 !important; text-transform: none !important; border-radius: 0 !important; font-family: 'Inter', sans-serif !important; box-shadow: none !important;
}
.ner-filter-btn.active { background: var(--text) !important; color: var(--card-bg) !important; }

/* --- REVIEW CARDS --- */
.ner-review-card { border: 1px solid var(--border) !important; padding: 25px !important; margin-bottom: 15px !important; background: var(--card-bg) !important; box-shadow: none !important; border-radius: 0 !important; }
.ner-card-author { color: var(--gray) !important; font-size: 14px !important; font-weight: 600 !important; margin-bottom: 12px !important; text-transform: none !important; font-family: 'Inter', sans-serif !important;}
.ner-card-text { font-size: 16px !important; line-height: 1.5 !important; margin-bottom: 25px !important; font-weight: 500 !important; color: var(--text) !important; text-transform: none !important; font-family: 'Inter', sans-serif !important;}
.ner-card-footer { display: flex !important; justify-content: space-between !important; align-items: center !important; }
.ner-card-stars { display: flex !important; gap: 3px !important; }
.ner-like-btn {
    background: transparent !important; border: none !important; box-shadow: none !important; color: var(--gray) !important; cursor: pointer !important; font-size: 14px !important; display: flex !important; align-items: center !important; gap: 6px !important; padding: 0 !important; border-radius: 0 !important; font-family: 'Inter', sans-serif !important;
}
.ner-like-btn svg { transition: 0.2s !important; }
.ner-like-btn:hover { color: var(--text) !important; }
.ner-like-btn.liked, .ner-like-btn.liked svg { color: var(--star) !important; fill: var(--star) !important; stroke: var(--star) !important; }

/* --- MODAL POPUP --- */
#ner-modal-overlay {
    position: fixed !important; top: 0 !important; left: 0 !important; width: 100vw !important; height: 100vh !important;
    background: rgba(0,0,0,0.85) !important; z-index: 999999 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
}
#ner-modal {
    background: #000 !important; border: 1px solid #fff !important; padding: 30px !important;
    width: 90% !important; max-width: 450px !important; position: relative !important;
}
#ner-modal-close {
    position: absolute !important; top: -15px !important; right: -15px !important;
    background: #000 !important; color: #fff !important; border: 1px solid #fff !important; border-radius: 50% !important;
    width: 32px !important; height: 32px !important; cursor: pointer !important;
    display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; box-shadow: none !important;
}
.ner-modal-title { font-size: 26px !important; font-weight: 600 !important; text-align: center !important; margin: 0 0 25px 0 !important; color: #fff !important; text-transform: none !important; font-family: 'Inter', sans-serif !important;}
#ner-author, #ner-text {
    width: 100% !important; background: transparent !important; color: #fff !important;
    border: 1px solid #555 !important; padding: 15px !important; font-size: 16px !important; margin-bottom: 20px !important; box-sizing: border-box !important; font-family: 'Inter', sans-serif !important; border-radius: 0 !important; box-shadow: none !important;
}
#ner-text { height: 120px !important; resize: vertical !important; }
.ner-modal-stars { display: flex !important; justify-content: center !important; gap: 8px !important; cursor: pointer !important; margin-bottom: 25px !important; color: #fff !important; }
.ner-star-input.active { color: var(--star) !important; }
#ner-submit { width: 100% !important; background: #9ca3af !important; color: #000 !important; border: none !important; padding: 14px !important; font-size: 16px !important; font-weight: 600 !important; cursor: pointer !important; text-transform: none !important; border-radius: 0 !important; box-shadow: none !important; font-family: 'Inter', sans-serif !important;}
#ner-submit:hover { background: #d1d5db !important; }

@media (max-width: 600px) {
    .ner-header { padding: 20px !important; }
    #ner-theme-toggle { right: 20px !important; top: 25px !important; }
    .ner-item-header { flex-direction: column !important; text-align: center !important; }
    .ner-action-box { flex-direction: column !important; height: auto !important; }
    .ner-action-divider { display: none !important; }
    .ner-action-left { border-bottom: 1px solid var(--border) !important; padding: 20px !important; }
    .ner-action-right { padding: 20px !important; }
}