/**
 * eq-quiz.css — EduQuiz Pro Frontend Quiz Styles
 * FILE: eduquiz-pro/assets/css/frontend/eq-quiz.css
 */

/* ── Base ─────────────────────────────────────────────────────────────────── */
* { box-sizing: border-box; }
.eq-frontend-body { margin:0; padding:0; background:#f9fafb; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; }
.eq-quiz-selector-page { min-height:100vh; }

/* ── Header ──────────────────────────────────────────────────────────────── */
.eq-qs-header { display:flex; align-items:center; justify-content:space-between; padding:14px 20px; background:#fff; border-bottom:1px solid #e5e7eb; position:sticky; top:0; z-index:100; }
.eq-qs-logo { font-weight:700; font-size:16px; color:#111827; text-decoration:none; }
.eq-qs-user { font-size:13px; color:#6b7280; }

/* ── Wrap ─────────────────────────────────────────────────────────────────── */
.pqs-wrap{max-width:640px;margin:0 auto;padding:16px 14px 100px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:#111827;box-sizing:border-box;}
.pqs-wrap *{box-sizing:border-box;}
.pqs-header{text-align:center;margin-bottom:22px;}
.pqs-title{font-size:22px;font-weight:700;color:#111827;margin:0 0 6px;}
.pqs-desc{font-size:14px;color:#4b5563;margin:0;}

/* ── Cards ────────────────────────────────────────────────────────────────── */
.pqs-card{background:#fff;border:1.5px solid #d1d5db;border-radius:14px;margin-bottom:12px;overflow:hidden;}
.pqs-card-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;cursor:pointer;-webkit-tap-highlight-color:transparent;gap:10px;user-select:none;}
.pqs-card-head:active{background:#f9fafb;}
.pqs-card-head-left{display:flex;align-items:center;gap:12px;min-width:0;flex:1;}
.pqs-card-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pqs-icon-blue  {background:#DBEAFE;color:#1D4ED8;}
.pqs-icon-green {background:#D1FAE5;color:#065F46;}
.pqs-icon-amber {background:#FEF3C7;color:#92400E;}
.pqs-icon-purple{background:#EDE9FE;color:#5B21B6;}
.pqs-icon-rose  {background:#FFE4E6;color:#BE123C;}
.pqs-card-title{font-size:15px;font-weight:700;color:#111827;line-height:1.3;}
.pqs-card-sub{font-size:12px;color:#6b7280;margin-top:2px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;}

/* ── Chevron ──────────────────────────────────────────────────────────────── */
.pqs-chevron-wrap{width:32px;height:32px;border-radius:8px;border:1.5px solid #d1d5db;background:#f3f4f6;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pqs-chevron{width:16px;height:16px;color:#374151;transition:transform .2s;}
.pqs-chevron.pqs-open{transform:rotate(180deg);}
.pqs-card-body{display:none;padding:16px;border-top:1.5px solid #e5e7eb;background:#fafafa;}
.pqs-card-body.pqs-body-open{display:block;}

/* ── Selects ──────────────────────────────────────────────────────────────── */
.pqs-field-row{display:flex;gap:12px;flex-wrap:wrap;}
.pqs-field-group{flex:1;min-width:140px;}
.pqs-field-label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#374151;margin-bottom:7px;}
.pqs-select-wrap{position:relative;}
.pqs-select{width:100%;padding:11px 38px 11px 12px;border:1.5px solid #d1d5db;border-radius:10px;font-family:inherit;font-size:14px;font-weight:500;color:#111827;background:#fff;-webkit-appearance:none;appearance:none;cursor:pointer;transition:border-color .15s;}
.pqs-select:focus{outline:none;border-color:#4338CA;box-shadow:0 0 0 3px rgba(67,56,202,.12);}
.pqs-select:disabled{background:#f3f4f6;color:#9ca3af;cursor:not-allowed;border-color:#e5e7eb;}
.pqs-select-arrow{position:absolute;right:11px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:#374151;pointer-events:none;}
.pqs-empty-msg{padding:20px 0;text-align:center;font-size:13px;color:#9ca3af;}

/* ── Chapter/Topic Tree ───────────────────────────────────────────────────── */
.pg-quiz-checklist-loading{padding:20px;text-align:center;color:#6b7280;font-size:13px;font-style:italic;}
.pg-quiz-checklist-empty{padding:8px 0;font-size:12px;color:#9ca3af;}
.pg-quiz-checklist-topics{display:block;padding-left:26px;border-left:2px solid #d1d5db;margin-left:8px;margin-bottom:6px;}
.pqs-ch-toggle{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:#f1f5f9;border:1px solid #e5e7eb;cursor:pointer;flex-shrink:0;}
.pqs-ch-toggle svg{width:14px;height:14px;transition:transform .2s;}
.pqs-ch-toggle.pqs-open svg{transform:rotate(180deg);}

/* ── Source Chips ─────────────────────────────────────────────────────────── */
.pqs-chips{display:flex;flex-wrap:wrap;gap:8px;}
.pqs-chip{display:inline-flex;align-items:center;border:1.5px solid #d1d5db;border-radius:999px;font-size:13px;font-weight:600;color:#374151;background:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:all .15s;user-select:none;overflow:hidden;}
.pqs-chip input{display:none;}
.pqs-chip span{display:block;padding:9px 16px;}
.pqs-chip:hover{border-color:#4338CA;color:#4338CA;}
.pqs-chip.pqs-on{background:#4338CA;border-color:#4338CA;color:#fff;}
.pqs-chip-count{font-size:11px;font-weight:600;opacity:.8;margin-left:2px;}

/* ── Time Buttons ─────────────────────────────────────────────────────────── */
.pqs-time-section-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#374151;margin-bottom:10px;}
.pqs-time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:4px;}
.pqs-time-btn{padding:12px 4px;border:1.5px solid #d1d5db;border-radius:10px;font-family:inherit;font-size:13px;font-weight:600;color:#374151;background:#fff;cursor:pointer;text-align:center;-webkit-tap-highlight-color:transparent;transition:all .15s;}
.pqs-time-btn:hover{border-color:#4338CA;color:#4338CA;}
.pqs-time-btn.pqs-on{background:#4338CA;border-color:#4338CA;color:#fff;}

/* ── Qty Stepper ──────────────────────────────────────────────────────────── */
.pqs-qty-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.pqs-qty-stepper{display:flex;align-items:center;border:1.5px solid #d1d5db;border-radius:10px;overflow:hidden;background:#fff;}
.pqs-qty-minus,.pqs-qty-plus{width:46px;height:46px;border:none;background:#f1f5f9;font-size:22px;font-weight:400;color:#111827;cursor:pointer;-webkit-tap-highlight-color:transparent;flex-shrink:0;transition:background .15s;}
.pqs-qty-minus:active,.pqs-qty-plus:active{background:#e2e8f0;}
.pqs-qty-input{width:72px;height:46px;border:none;border-left:1.5px solid #e5e7eb;border-right:1.5px solid #e5e7eb;text-align:center;font-family:inherit;font-size:16px;font-weight:700;color:#111827;background:#fff;}
.pqs-qty-input:focus{outline:none;}
.pqs-total-time-wrap{display:flex;align-items:center;gap:6px;}
.pqs-total-time-label{font-size:13px;font-weight:500;color:#6b7280;}
.pqs-total-time-val{font-size:17px;font-weight:700;color:#111827;}
.pqs-qty-hint{margin:10px 0 0;font-size:12px;color:#92400E;background:#FFFBEB;border:1px solid #FDE68A;border-radius:8px;padding:8px 12px;display:none;}
.pqs-qty-hint.pqs-visible{display:block;}

/* ── Bottom Bar ───────────────────────────────────────────────────────────── */
.pqs-bottom-bar{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1.5px solid #d1d5db;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:9999;box-shadow:0 -4px 20px rgba(0,0,0,.08);}
.pqs-bottom-stats{display:flex;gap:14px;flex-wrap:wrap;}
.pqs-bottom-stat{display:flex;flex-direction:column;gap:1px;}
.pqs-bottom-stat-label{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:#6b7280;font-weight:700;}
.pqs-bottom-stat-val{font-size:14px;font-weight:800;color:#111827;}
.pqs-bottom-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.pqs-clear-btn{padding:10px 14px;border:1.5px solid #d1d5db;border-radius:10px;font-family:inherit;font-size:13px;font-weight:600;color:#374151;background:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s;}
.pqs-clear-btn:hover{background:#f3f4f6;}
.pqs-start-btn{display:flex;align-items:center;gap:7px;padding:11px 20px;background:#111827;color:#fff;border:none;border-radius:10px;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s;white-space:nowrap;}
.pqs-start-btn:disabled{opacity:.35;cursor:not-allowed;}
.pqs-start-btn:not(:disabled):active{opacity:.82;}
.pqs-message{padding:10px 14px;border-radius:10px;font-size:13px;margin-top:10px;display:none;}
.pqs-message.is-error{display:block;background:#FEF2F2;color:#991B1B;border:1px solid #FECACA;}

/* ── Mobile ───────────────────────────────────────────────────────────────── */
@media(max-width:480px){
	.pqs-time-grid{grid-template-columns:repeat(2,1fr);}
	.pqs-bottom-stats{gap:8px;}
	.pqs-bottom-stat-val{font-size:13px;}
	.pqs-start-btn{padding:11px 14px;font-size:13px;}
	.pg-quiz-checklist-topics{padding-left:20px;margin-left:8px;}
}

/* ── RTL / Urdu support ────────────────────────────────────────────────── */
.pg-quiz-rtl-text {
	direction: rtl;
	text-align: right;
	font-family: 'Noto Nastaliq Urdu', serif;
	font-size: 16px;
	line-height: 2.2;
}