/* ========================================
   WP Page Access Code — Course & Quiz CSS
   ======================================== */

:root {
    --wpac-primary: #6C5CE7;
    --wpac-primary-dark: #5A4BD1;
    --wpac-success: #00b894;
    --wpac-danger: #ff6b6b;
    --wpac-warning: #fdcb6e;
    --wpac-bg-dark: #0f0c29;
    --wpac-bg-mid: #1a1545;
    --wpac-card-bg: rgba(255,255,255,0.06);
    --wpac-card-border: rgba(255,255,255,0.1);
    --wpac-text: #ffffff;
    --wpac-text-muted: rgba(255,255,255,0.6);
    --wpac-radius: 16px;
    --wpac-radius-sm: 10px;
}

* { margin:0; padding:0; box-sizing:border-box; }

.wpac-body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    min-height: 100vh;
    background: linear-gradient(135deg, var(--wpac-bg-dark) 0%, #302b63 50%, #24243e 100%);
    color: var(--wpac-text);
    overflow-x: hidden;
}

/* Background effects */
.wpac-bg-effects { position:fixed; inset:0; z-index:0; pointer-events:none; }
.wpac-orb { position:absolute; border-radius:50%; filter:blur(80px); }
.wpac-orb-1 { width:500px; height:500px; background:radial-gradient(circle,var(--wpac-primary),transparent 70%); top:-150px; right:-100px; opacity:.12; animation:wpac-orb-float 10s ease-in-out infinite; }
.wpac-orb-2 { width:400px; height:400px; background:radial-gradient(circle,#00cec9,transparent 70%); bottom:-150px; left:-100px; opacity:.08; animation:wpac-orb-float 12s ease-in-out infinite reverse; }
.wpac-orb-3 { width:300px; height:300px; background:radial-gradient(circle,#fd79a8,transparent 70%); top:50%; left:50%; opacity:.06; animation:wpac-orb-float 8s ease-in-out infinite 2s; }
@keyframes wpac-orb-float { 0%,100%{transform:translateY(0) scale(1);} 50%{transform:translateY(-40px) scale(1.08);} }

/* ---- GATE ---- */
.wpac-gate-body { display:flex; align-items:center; justify-content:center; }
.wpac-gate-container { position:relative; z-index:1; width:100%; max-width:460px; padding:20px; }
.wpac-gate-card {
    background: var(--wpac-card-bg);
    backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
    border: 1px solid var(--wpac-card-border);
    border-radius: 24px; padding: 48px 40px; text-align:center;
    box-shadow: 0 25px 60px rgba(0,0,0,.35);
    animation: wpac-slide-up .6s ease;
}
.wpac-gate-icon { font-size:52px; margin-bottom:20px; }
.wpac-gate-logo { display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:20px; }
.wpac-gate-logo-icon { font-size:42px; }
.wpac-gate-logo-text { font-size:28px; font-weight:800; background:linear-gradient(135deg,var(--wpac-primary),#a29bfe); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.wpac-gate-title { font-size:22px; font-weight:700; margin-bottom:8px; }
.wpac-gate-message { font-size:14px; color:var(--wpac-text-muted); margin-bottom:28px; line-height:1.6; }
.wpac-gate-footer { margin-top:24px; padding-top:16px; border-top:1px solid rgba(255,255,255,.06); }
.wpac-gate-footer p { font-size:11px; color:rgba(255,255,255,.25); letter-spacing:.5px; }
.wpac-gate-form { display:flex; flex-direction:column; gap:14px; }

.wpac-input-code {
    width:100%; padding:16px 20px; font-size:18px; letter-spacing:5px; text-align:center;
    background:rgba(255,255,255,.07); border:2px solid rgba(255,255,255,.12); border-radius:14px;
    color:#fff; outline:none; transition:all .3s; font-weight:700; text-transform:uppercase;
}
.wpac-input-code::placeholder { letter-spacing:2px; font-weight:400; font-size:14px; text-transform:none; color:rgba(255,255,255,.3); }
.wpac-input-code:focus { border-color:var(--wpac-primary); background:rgba(255,255,255,.1); box-shadow:0 0 0 4px rgba(108,92,231,.2); }

/* ---- BUTTONS ---- */
.wpac-btn {
    padding:14px 28px; font-size:15px; font-weight:700; border:none; border-radius:12px;
    cursor:pointer; transition:all .3s ease; letter-spacing:.5px; display:inline-flex;
    align-items:center; justify-content:center; gap:8px;
}
.wpac-btn:disabled { opacity:.5; cursor:not-allowed; transform:none !important; }
.wpac-btn-primary { background:linear-gradient(135deg,var(--wpac-primary),#a29bfe); color:#fff; }
.wpac-btn-primary:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 8px 25px rgba(108,92,231,.4); }
.wpac-btn-secondary { background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.15); }
.wpac-btn-secondary:hover:not(:disabled) { background:rgba(255,255,255,.15); }
.wpac-btn-success { background:linear-gradient(135deg,#00b894,#00cec9); color:#fff; }
.wpac-btn-success:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 8px 25px rgba(0,184,148,.4); }
.wpac-btn-danger { background:linear-gradient(135deg,#e17055,#d63031); color:#fff; }
.wpac-btn-lg { padding:18px 36px; font-size:17px; border-radius:14px; }

.wpac-error { color:#ff6b6b; font-size:13px; min-height:20px; transition:all .3s; text-align:center; }
.wpac-error.shake { animation:wpac-shake .5s; }

@keyframes wpac-slide-up { from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);} }
@keyframes wpac-shake { 0%,100%{transform:translateX(0);} 20%,60%{transform:translateX(-8px);} 40%,80%{transform:translateX(8px);} }

/* ---- HEADER ---- */
.wpac-header {
    position:sticky; top:0; z-index:100;
    background:rgba(15,12,41,.85); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    border-bottom:1px solid rgba(255,255,255,.06);
    padding:16px 24px;
}
.wpac-header-inner { max-width:1200px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.wpac-header-left { display:flex; align-items:center; gap:14px; }
.wpac-header-icon { font-size:32px; }
.wpac-header-title { font-size:18px; font-weight:800; }
.wpac-header-sub { font-size:13px; color:var(--wpac-text-muted); margin-top:2px; }

/* Stepper */
.wpac-stepper { display:flex; align-items:center; gap:8px; font-size:13px; }
.wpac-step { padding:6px 14px; border-radius:20px; background:rgba(255,255,255,.06); color:var(--wpac-text-muted); font-weight:600; white-space:nowrap; }
.wpac-step.active { background:var(--wpac-primary); color:#fff; }
.wpac-step.completed { background:rgba(0,184,148,.2); color:#00b894; }
.wpac-step-divider { color:rgba(255,255,255,.2); }

/* ---- COURSE / PDF ---- */
.wpac-course-main { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:24px; display:flex; flex-direction:column; min-height:calc(100vh - 80px); }
.wpac-pdf-container { flex:1; background:rgba(0,0,0,.3); border-radius:var(--wpac-radius); overflow:hidden; border:1px solid var(--wpac-card-border); min-height:70vh; }
.wpac-pdf-iframe { width:100%; height:100%; min-height:70vh; border:none; }
.wpac-course-footer { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:20px; flex-wrap:wrap; }
.wpac-course-notice { font-size:14px; color:var(--wpac-text-muted); }

/* ---- QUIZ ---- */
.wpac-quiz-main { position:relative; z-index:1; max-width:800px; margin:0 auto; padding:24px; }

.wpac-quiz-info-bar {
    display:flex; gap:16px; margin-bottom:24px; flex-wrap:wrap;
}
.wpac-quiz-stat {
    flex:1; min-width:120px; background:var(--wpac-card-bg); backdrop-filter:blur(12px);
    border:1px solid var(--wpac-card-border); border-radius:var(--wpac-radius-sm);
    padding:16px 20px; text-align:center;
}
.wpac-quiz-stat-label { display:block; font-size:12px; color:var(--wpac-text-muted); text-transform:uppercase; letter-spacing:1px; margin-bottom:4px; }
.wpac-quiz-stat-value { display:block; font-size:22px; font-weight:800; }
.wpac-text-warning { color:var(--wpac-warning); }
.wpac-text-danger { color:var(--wpac-danger) !important; }

/* Question Card */
.wpac-question-card {
    background: var(--wpac-card-bg); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    border:1px solid var(--wpac-card-border); border-radius:var(--wpac-radius);
    padding:36px; animation:wpac-slide-up .4s ease;
}
.wpac-question-number { font-size:12px; text-transform:uppercase; letter-spacing:2px; color:var(--wpac-primary); font-weight:700; margin-bottom:12px; }
.wpac-section-label { font-size:11px; text-transform:uppercase; letter-spacing:2px; color:var(--wpac-text-muted); font-weight:600; margin-bottom:8px; padding:6px 14px; background:rgba(108,92,231,.1); border-radius:8px; display:inline-block; }
.wpac-question-text { font-size:20px; font-weight:700; line-height:1.5; margin-bottom:28px; }

/* Options */
.wpac-options { display:flex; flex-direction:column; gap:10px; margin-bottom:28px; }
.wpac-option {
    display:flex; align-items:center; gap:14px; padding:16px 20px;
    background:rgba(255,255,255,.04); border:2px solid rgba(255,255,255,.08);
    border-radius:var(--wpac-radius-sm); cursor:pointer; transition:all .25s;
}
.wpac-option:hover { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.15); }
.wpac-option input { display:none; }
.wpac-option-marker {
    width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center;
    background:rgba(255,255,255,.08); font-weight:800; font-size:14px; color:var(--wpac-text-muted);
    flex-shrink:0; transition:all .25s;
}
.wpac-option-text { font-size:15px; line-height:1.4; }
.wpac-option.selected { border-color:var(--wpac-primary); background:rgba(108,92,231,.12); }
.wpac-option.selected .wpac-option-marker { background:var(--wpac-primary); color:#fff; }
.wpac-option.correct { border-color:var(--wpac-success) !important; background:rgba(0,184,148,.12) !important; }
.wpac-option.correct .wpac-option-marker { background:var(--wpac-success) !important; color:#fff !important; }
.wpac-option.wrong { border-color:var(--wpac-danger) !important; background:rgba(255,107,107,.12) !important; }
.wpac-option.wrong .wpac-option-marker { background:var(--wpac-danger) !important; color:#fff !important; }

.wpac-question-nav { display:flex; justify-content:space-between; align-items:center; }

/* True/False layout */
.wpac-options-tf { flex-direction:row; gap:12px; }
.wpac-options-tf .wpac-option { flex:1; justify-content:center; text-align:center; padding:20px; }
.wpac-options-tf .wpac-option-marker { width:42px; height:42px; border-radius:50%; font-size:18px; }

/* ---- MODAL ---- */
.wpac-modal-overlay {
    position:fixed; inset:0; z-index:9999;
    background:rgba(0,0,0,.7); backdrop-filter:blur(8px);
    display:flex; align-items:center; justify-content:center; padding:20px;
}
.wpac-modal-card {
    background:linear-gradient(145deg,#1a1545,#24243e);
    border:1px solid var(--wpac-card-border); border-radius:24px;
    padding:48px 40px; text-align:center; max-width:500px; width:100%;
    box-shadow:0 30px 80px rgba(0,0,0,.5); animation:wpac-slide-up .5s ease;
}
.wpac-modal-icon { font-size:64px; margin-bottom:16px; }
.wpac-modal-title { font-size:28px; font-weight:800; margin-bottom:8px; }
.wpac-modal-text { font-size:15px; color:var(--wpac-text-muted); line-height:1.6; margin-bottom:24px; }
.wpac-modal-score { font-size:48px; font-weight:800; margin:16px 0; }
.wpac-modal-score.pass { color:var(--wpac-success); }
.wpac-modal-score.fail { color:var(--wpac-danger); }
.wpac-modal-detail { font-size:14px; color:var(--wpac-text-muted); margin-bottom:28px; }

/* ---- REGISTRATION ---- */
.wpac-register-main { position:relative; z-index:1; max-width:640px; margin:0 auto; padding:24px; }
.wpac-register-card {
    background:var(--wpac-card-bg); backdrop-filter:blur(24px);
    border:1px solid var(--wpac-card-border); border-radius:var(--wpac-radius);
    padding:40px; animation:wpac-slide-up .5s ease;
}
.wpac-congrats-banner { text-align:center; margin-bottom:32px; }
.wpac-congrats-icon { font-size:56px; display:block; margin-bottom:12px; }
.wpac-congrats-banner h2 { font-size:24px; font-weight:800; margin-bottom:8px; }
.wpac-congrats-banner p { color:var(--wpac-text-muted); font-size:15px; }

.wpac-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:24px; }
.wpac-form-group { display:flex; flex-direction:column; gap:6px; }
.wpac-form-group label { font-size:13px; font-weight:700; color:var(--wpac-text-muted); text-transform:uppercase; letter-spacing:.5px; }
.wpac-form-group input {
    padding:14px 18px; font-size:15px; background:rgba(255,255,255,.06);
    border:2px solid rgba(255,255,255,.1); border-radius:var(--wpac-radius-sm);
    color:#fff; outline:none; transition:all .3s; font-family:inherit;
}
.wpac-form-group input::placeholder { color:rgba(255,255,255,.25); }
.wpac-form-group input:focus { border-color:var(--wpac-primary); background:rgba(255,255,255,.1); box-shadow:0 0 0 4px rgba(108,92,231,.15); }
.wpac-form-actions { text-align:center; margin-top:8px; }

/* ---- COMPLETE ---- */
.wpac-complete-body { display:flex; align-items:center; justify-content:center; }
.wpac-complete-main { position:relative; z-index:1; max-width:560px; padding:20px; width:100%; }
.wpac-complete-card {
    background:var(--wpac-card-bg); backdrop-filter:blur(24px);
    border:1px solid var(--wpac-card-border); border-radius:24px;
    padding:48px 40px; text-align:center;
    box-shadow:0 25px 60px rgba(0,0,0,.35); animation:wpac-slide-up .6s ease;
}
.wpac-complete-confetti { font-size:64px; margin-bottom:16px; animation:wpac-bounce 1s ease infinite; }
@keyframes wpac-bounce { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-12px);} }
.wpac-complete-title { font-size:28px; font-weight:800; margin-bottom:8px; background:linear-gradient(135deg,#00b894,#00cec9,#81ecec); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.wpac-complete-subtitle { color:var(--wpac-text-muted); font-size:15px; margin-bottom:28px; line-height:1.5; }

.wpac-cert-badge {
    background:linear-gradient(135deg,rgba(0,184,148,.15),rgba(0,206,201,.15));
    border:1px solid rgba(0,184,148,.3); border-radius:var(--wpac-radius);
    padding:20px 28px; margin-bottom:28px; display:inline-block;
}
.wpac-cert-label { display:block; font-size:11px; text-transform:uppercase; letter-spacing:2px; color:var(--wpac-text-muted); margin-bottom:6px; }
.wpac-cert-number { display:block; font-size:22px; font-weight:800; color:#00b894; letter-spacing:2px; }

.wpac-complete-steps { display:flex; flex-direction:column; gap:10px; margin-bottom:28px; text-align:left; }
.wpac-complete-step { display:flex; align-items:center; gap:12px; padding:12px 16px; background:rgba(0,184,148,.08); border-radius:var(--wpac-radius-sm); font-size:14px; font-weight:600; }
.wpac-complete-step.done { color:#00b894; }
.wpac-cs-icon { width:28px; height:28px; border-radius:50%; background:#00b894; color:#fff; display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0; }
.wpac-complete-note { font-size:13px; color:var(--wpac-text-muted); }

/* ---- RESPONSIVE ---- */
@media(max-width:768px) {
    .wpac-header-inner { flex-direction:column; align-items:flex-start; }
    .wpac-stepper { font-size:11px; }
    .wpac-step { padding:4px 10px; }
    .wpac-form-grid { grid-template-columns:1fr; }
    .wpac-quiz-info-bar { flex-direction:column; }
    .wpac-gate-card { padding:36px 24px; }
    .wpac-question-card { padding:24px; }
    .wpac-register-card { padding:28px 20px; }
    .wpac-complete-card { padding:36px 24px; }
}
@media(max-width:480px) {
    .wpac-question-text { font-size:17px; }
    .wpac-btn-lg { padding:14px 24px; font-size:15px; }
    .wpac-modal-card { padding:32px 24px; }
}
