/* شورت‌کدهای عمومیِ فرانت (فرمِ صف‌انتظار/نظرسنجی/آپلودِ مدرک، نمایشگرِ سالنِ انتظار) — این‌ها روی یک
   صفحه‌ی وردپرسیِ عادی و زیرِ قالبِ فعالِ سایت رندر می‌شوند، نه در محیطِ تمیزِ wp-admin/پورتال. خیلی از
   قالب‌ها روی تگ‌های عمومی مثل button/input/select استایلِ اختصاصیِ خودشان می‌گذارند و چون بارگذاری‌شان
   معمولاً بعد از این فایل است رویِ ظاهرِ اینجا غالب می‌شوند — به همین دلیل (هم‌الگوی
   pilates-booking-core/assets/css/frontend.css) قسمت‌های ظاهریِ کلیدی !important دارند.
   همه‌ی رنگ‌ها/فونت از طریقِ CSS Variable هستند تا از تنظیمات ← ظاهر و فونت قابلِ تغییر باشند (مقادیرِ
   پیش‌فرض همین‌جا هم هست، پس بدونِ هیچ تنظیمی هم دقیقاً همین ظاهرِ فعلی حفظ می‌شود). */
.wsc-waitlist-form, .wsc-queue-display {
    --wsc-fe-primary: #2271b1;
    --wsc-fe-primary-dark: #195a8d;
    --wsc-fe-text: #1d2327;
    --wsc-fe-bg: #ffffff;
    --wsc-fe-border: #d0d5dd;
    --wsc-fe-success: #1e7b1e;
    --wsc-fe-danger: #c0392b;
    --wsc-fe-font-family: inherit;
    --wsc-fe-font-size: 15px;
    --wsc-fe-font-weight: 400;
    --wsc-fe-muted-bg: #f8fafc;
    --wsc-fe-border-soft: #f1f5f9;
    --wsc-fe-shadow-card: 0 10px 30px -10px rgba(16, 24, 40, .12);
}

.wsc-waitlist-form {
    direction: rtl !important; text-align: right !important; max-width: 460px; width: 100%; box-sizing: border-box;
    font-family: var(--wsc-fe-font-family) !important; font-size: var(--wsc-fe-font-size) !important; font-weight: var(--wsc-fe-font-weight) !important;
    color: var(--wsc-fe-text) !important;
    margin: 0 auto; padding: 24px; background: var(--wsc-fe-bg) !important; border: 1px solid var(--wsc-fe-border-soft) !important;
    border-radius: 16px !important; box-shadow: var(--wsc-fe-shadow-card) !important;
}
.wsc-waitlist-form * { box-sizing: border-box; font-family: inherit !important; }
.wsc-waitlist-form .wsc-field { margin-bottom: 16px; }
.wsc-waitlist-form label { display: block !important; margin-bottom: 7px !important; font-weight: 700 !important; font-size: .93em !important; color: var(--wsc-fe-text) !important; }
.wsc-waitlist-form input, .wsc-waitlist-form select, .wsc-waitlist-form textarea {
    width: 100% !important; padding: 11px 13px !important; border: 1px solid var(--wsc-fe-border) !important; border-radius: 10px !important;
    font-size: 1em !important; font-family: inherit !important; color: var(--wsc-fe-text) !important; background: var(--wsc-fe-muted-bg) !important;
    min-height: 44px; transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
.wsc-waitlist-form input:focus, .wsc-waitlist-form select:focus, .wsc-waitlist-form textarea:focus {
    outline: none !important; border-color: var(--wsc-fe-primary) !important; background: var(--wsc-fe-bg) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--wsc-fe-primary) 15%, transparent) !important;
}
.wsc-waitlist-form textarea { min-height: 88px; }
.wsc-waitlist-form .wsc-phone-row { display: flex !important; gap: 8px; flex-wrap: wrap; }
.wsc-waitlist-form .wsc-phone-row input { flex: 1 1 160px; min-width: 0; }
.wsc-waitlist-form .wsc-phone-row button { flex: 0 0 auto; white-space: nowrap; }
.wsc-waitlist-form button {
    padding: 12px 20px !important; border: none !important; border-radius: 10px !important; background: var(--wsc-fe-primary) !important; color: #fff !important;
    cursor: pointer !important; font-size: .93em !important; font-weight: 700 !important; min-height: 44px; font-family: inherit !important;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--wsc-fe-primary) 30%, transparent); transition: background .12s ease, transform .12s ease, box-shadow .12s ease;
}
.wsc-waitlist-form button:hover:not(:disabled) { background: var(--wsc-fe-primary-dark) !important; transform: translateY(-1px); box-shadow: 0 6px 16px color-mix(in srgb, var(--wsc-fe-primary) 35%, transparent); }
.wsc-waitlist-form button:active:not(:disabled) { transform: translateY(0); }
.wsc-waitlist-form button:disabled { background: #a7aaad !important; cursor: not-allowed !important; box-shadow: none; }
.wsc-waitlist-form #wsc-submit-waitlist-btn, .wsc-waitlist-form #wsc-survey-submit-btn, .wsc-waitlist-form #wsc-document-upload-submit-btn { width: 100% !important; margin-top: 8px; padding: 14px !important; font-size: 1em !important; }
.wsc-message { margin-top: 12px; font-size: .93em; line-height: 1.8; }
.wsc-message-success { color: var(--wsc-fe-success) !important; }
.wsc-message-error { color: var(--wsc-fe-danger) !important; }

/* ---------- ستاره‌های نظرسنجی — نقاطِ لمسیِ بزرگ برای موبایل ---------- */

.wsc-survey-stars { display: flex; gap: 4px; direction: ltr; justify-content: flex-start; }
.wsc-survey-stars span {
    font-size: clamp(28px, 8vw, 34px); line-height: 1; cursor: pointer; padding: 6px; user-select: none;
    color: var(--wsc-fe-border); transition: transform .15s ease, color .15s ease;
}
.wsc-survey-stars span:active { transform: scale(1.15); }
.wsc-survey-stars span.wsc-star-filled { color: #f59e0b; }

/* ---------- موبایل/تبلت ---------- */

@media (max-width: 480px) {
    .wsc-waitlist-form { padding: 16px; border-radius: 14px !important; box-shadow: 0 4px 14px rgba(16,24,40,.08) !important; }
    .wsc-waitlist-form .wsc-phone-row { flex-direction: column; }
    .wsc-waitlist-form .wsc-phone-row button { width: 100%; }
    .wsc-survey-stars { justify-content: center; }
    .wsc-survey-stars span { font-size: 30px; padding: 8px; }
}

/* ---------- نمایشگرِ سالنِ انتظار (برای پخش روی تلویزیونِ سالن، از فاصله‌ی زیاد خوانا) ---------- */

.wsc-queue-display {
    direction: rtl; text-align: center; font-family: var(--wsc-fe-font-family); max-width: 900px; margin: 0 auto; padding: 40px 20px;
}
.wsc-queue-display h1 {
    font-size: clamp(28px, 4vw, 44px); margin-bottom: 30px; color: var(--wsc-fe-primary-dark); font-weight: 800;
}
.wsc-queue-empty { font-size: 24px; color: #94a3b8; margin-top: 60px; }
.wsc-queue-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.wsc-queue-list li {
    display: flex; align-items: center; gap: 20px; background: var(--wsc-fe-bg); border: 1px solid var(--wsc-fe-border-soft);
    border-radius: 18px; padding: 20px 28px; font-size: 24px; color: var(--wsc-fe-text);
    box-shadow: var(--wsc-fe-shadow-card); transition: transform .2s ease, box-shadow .2s ease;
}
.wsc-queue-list li.wsc-queue-current {
    background: linear-gradient(135deg, var(--wsc-fe-primary), var(--wsc-fe-primary-dark)); color: #fff; border-color: var(--wsc-fe-primary-dark);
    box-shadow: 0 12px 30px -6px color-mix(in srgb, var(--wsc-fe-primary) 50%, transparent); transform: scale(1.02);
}
.wsc-queue-num {
    display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px;
    border-radius: 50%; background: color-mix(in srgb, var(--wsc-fe-primary) 15%, #fff); color: var(--wsc-fe-primary-dark); font-weight: 800; font-size: 26px; flex-shrink: 0;
}
.wsc-queue-current .wsc-queue-num { background: rgba(255,255,255,.25); color: #fff; }
.wsc-queue-name { flex: 1; font-weight: 700; text-align: right; }
.wsc-queue-time { font-size: 20px; opacity: .85; }
.wsc-queue-badge { background: #fff; color: var(--wsc-fe-primary-dark); padding: 5px 16px; border-radius: 999px; font-size: 15px; font-weight: 800; box-shadow: 0 2px 6px rgba(0,0,0,.08); }

/* ---------- اسپینرِ بارگذاری (برای دکمه‌های در حالِ ارسال) ---------- */

.wsc-spin {
    border: 3px solid rgba(0,0,0,.1); border-top-color: currentColor; border-radius: 50%;
    width: 18px; height: 18px; animation: wsc-fe-spin 1s linear infinite; display: inline-block; vertical-align: middle;
}
@keyframes wsc-fe-spin { to { transform: rotate(360deg); } }
