/* SKEELLS Quiz — Frontend v2.3.1 */
.sq-front-wrap{font-family:'Red Hat Display','Segoe UI',Arial,sans-serif;max-width:640px;margin:0 auto;padding-bottom:48px;color:#1a2332;}
.sq-loader{text-align:center;padding:60px;}
.sq-spinner{width:38px;height:38px;border:3px solid rgba(49,201,112,.2);border-top-color:#31C970;border-radius:50%;animation:sq-spin .8s linear infinite;display:inline-block;}
@keyframes sq-spin{to{transform:rotate(360deg);}}
.sq-screen{animation:sq-in .3s ease;}
@keyframes sq-in{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}

/* INTRO */
.sq-intro{text-align:center;padding:40px 20px 0;}
.sq-intro-badge{display:inline-block;background:rgba(49,201,112,.1);border:1px solid rgba(49,201,112,.3);color:var(--sq-accent,#31C970);padding:5px 18px;border-radius:20px;font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:22px;}
.sq-intro h1{font-size:clamp(22px,5vw,34px);font-weight:800;color:#1a2332;line-height:1.2;margin:0 0 14px;letter-spacing:-.5px;}
.sq-intro h1 em{font-style:normal;color:var(--sq-accent,#31C970);}
.sq-intro-sub{color:#6b7a8d;font-size:15px;line-height:1.7;margin:0 auto 28px;max-width:500px;}
.sq-intro-pills{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:32px;}
.sq-intro-pill{background:#f4f8f7;border:1px solid #dde8e2;border-radius:20px;padding:8px 16px;font-size:13px;font-weight:600;color:#1a2332;}

/* BUTTONS
   background/color/border folosesc !important ca sa nu fie suprascrise de stilurile de buton ale temei
   (altfel butonul apare alb cu text alb invizibil). Culoarea vine din variabila --sq-accent (setata din
   pagina de Setari); hover-ul intuneca prin filter:brightness ca sa functioneze cu orice culoare accent. */
.sq-front-wrap .sq-btn-primary{display:inline-block;background:var(--sq-accent,#31C970)!important;color:#fff!important;border:none!important;padding:14px 44px;border-radius:50px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;transition:filter .2s,transform .15s,box-shadow .2s;box-shadow:0 2px 8px rgba(26,35,50,.12);text-decoration:none!important;line-height:1.3;text-shadow:none;}
.sq-front-wrap .sq-btn-primary:hover,.sq-front-wrap .sq-btn-primary:focus{background:var(--sq-accent,#31C970)!important;filter:brightness(.93);transform:translateY(-1px);color:#fff!important;box-shadow:0 4px 14px rgba(26,35,50,.18);}
.sq-front-wrap .sq-btn-primary:active{transform:translateY(0);filter:brightness(.88);}
.sq-btn-full{width:100%;text-align:center;padding:15px;border-radius:13px;box-sizing:border-box;}
.sq-front-wrap .sq-btn-ghost{background:transparent!important;border:1px solid #dde2e9!important;color:#8899aa!important;padding:10px 24px;border-radius:20px;cursor:pointer;font-size:13px;font-family:inherit;font-weight:500;transition:all .2s;margin-top:14px;width:100%;box-shadow:none!important;}
.sq-front-wrap .sq-btn-ghost:hover{border-color:var(--sq-accent,#31C970)!important;color:var(--sq-accent,#31C970)!important;}

/* PROGRESS */
.sq-progress-wrap{margin-bottom:20px;}
.sq-progress-labels{display:flex;justify-content:space-between;margin-bottom:8px;font-size:13px;font-weight:600;color:#8899aa;}
.sq-pct{color:var(--sq-accent,#31C970);}
.sq-progress-track{height:5px;background:#eef0f4;border-radius:3px;overflow:hidden;}
.sq-progress-fill{height:100%;background:var(--sq-accent,#31C970);border-radius:3px;transition:width .45s ease;}

/* QUESTION CARD */
.sq-q-card{background:#fff;border-radius:16px;border:1px solid #eef0f4;box-shadow:0 3px 12px rgba(0,0,0,.06);padding:28px;margin-bottom:14px;}
.sq-q-label{font-size:11px;font-weight:700;color:var(--sq-accent,#31C970);text-transform:uppercase;letter-spacing:2px;margin-bottom:12px;}
.sq-q-text{font-size:17px;font-weight:700;color:#1a2332;line-height:1.45;margin-bottom:20px;}

/* TEST OPTIONS */
.sq-options{display:flex;flex-direction:column;gap:9px;}
.sq-option{background:#f8fafc;border:1.5px solid #eef0f4;border-radius:11px;padding:12px 16px;cursor:pointer;display:flex;align-items:center;gap:12px;transition:all .18s;text-align:left;color:#3d4a5c;font-size:14px;font-family:inherit;font-weight:500;width:100%;}
.sq-option:hover{background:#f0fdf7;border-color:#b0e8cc;}
.sq-option.sq-correct{background:#e8faf2;border-color:#31C970;color:#1a7a48;}
.sq-option.sq-wrong{background:#fff0f0;border-color:#F45B5B;color:#a53030;}
.sq-opt-letter{width:30px;height:30px;min-width:30px;border-radius:8px;background:#eef0f4;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#8899aa;flex-shrink:0;transition:all .18s;}
.sq-option.sq-correct .sq-opt-letter{background:#31C970;color:#fff;}
.sq-option.sq-wrong   .sq-opt-letter{background:#F45B5B;color:#fff;}

/* EXPLANATION */
.sq-explanation{margin-top:14px;padding:13px 16px;background:#f0fdf7;border-left:3px solid #31C970;border-radius:0 9px 9px 0;display:none;}
.sq-explanation.sq-show{display:block;animation:sq-in .25s ease;}
.sq-explanation strong{display:block;font-size:11px;color:#31C970;font-weight:700;margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px;}
.sq-explanation p{color:#3d5a48;font-size:14px;line-height:1.6;margin:0;}
#sq-btn-next{display:none;}
#sq-btn-next.sq-show{display:block;}

/* SURVEY CHECKBOXES */
.sq-chk-opts{display:flex;flex-direction:column;gap:9px;}
.sq-chk-opt{display:flex;align-items:center;gap:12px;background:#f8fafc;border:1.5px solid #eef0f4;border-radius:11px;padding:13px 16px;cursor:pointer;transition:all .18s;}
.sq-chk-opt:hover{background:#f0fdf7;border-color:#b0e8cc;}
.sq-chk-opt input[type="checkbox"]{display:none;}
.sq-chk-box{width:20px;height:20px;min-width:20px;border:2px solid #dde2e9;border-radius:5px;background:#fff;display:flex;align-items:center;justify-content:center;transition:all .18s;flex-shrink:0;}
.sq-chk-opt input:checked ~ .sq-chk-box{background:#31C970;border-color:#31C970;}
.sq-chk-opt input:checked ~ .sq-chk-box::after{content:'✓';color:#fff;font-size:12px;font-weight:900;}
.sq-chk-opt input:checked ~ .sq-chk-text{color:#1a7a48;font-weight:600;}
.sq-chk-text{font-size:14px;color:#3d4a5c;line-height:1.4;}
.sq-chk-hint{font-size:12px;color:#aab0b8;text-align:center;margin:10px 0 0;}

/* RESULT */
.sq-result-hero{background:#fff;border-radius:16px;border:1px solid #eef0f4;box-shadow:0 3px 12px rgba(0,0,0,.06);padding:36px 28px;text-align:center;margin-bottom:16px;}
.sq-result-emoji{font-size:48px;margin-bottom:12px;display:block;}
.sq-result-score{font-size:76px;font-weight:900;color:#31C970;line-height:1;margin-bottom:6px;letter-spacing:-3px;}
.sq-result-score.red{color:#F45B5B;}
.sq-result-score.orange{color:#f5a623;}
.sq-result-score span{font-size:30px;color:#aab0b8;font-weight:400;letter-spacing:0;}
.sq-result-level{font-size:20px;font-weight:800;color:#1a2332;margin-bottom:5px;}
.sq-result-sub{color:#8899aa;font-size:14px;margin-bottom:24px;}
.sq-ans-breakdown{display:flex;justify-content:center;gap:5px;flex-wrap:wrap;}
.sq-ans-chip{width:30px;height:30px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;}
.sq-ans-chip.ok{background:#e8faf2;color:#31C970;border:1px solid #b0e8cc;}
.sq-ans-chip.ko{background:#fff0f0;color:#F45B5B;border:1px solid #f5b5b5;}

/* FORM */
.sq-form-card{background:#fff;border-radius:16px;border:1px solid #eef0f4;box-shadow:0 3px 12px rgba(0,0,0,.06);padding:28px;margin-bottom:12px;}
.sq-form-card h3{font-size:18px;font-weight:800;color:#1a2332;margin:0 0 8px;}
.sq-form-card p{color:#8899aa;font-size:14px;line-height:1.6;margin:0 0 20px;}
.sq-name-row{display:flex;gap:10px;margin-bottom:11px;}
.sq-name-row input{flex:1;min-width:0;margin-bottom:0!important;}
.sq-form-card input[type="text"],.sq-form-card input[type="email"]{width:100%;background:#f8fafc;border:1.5px solid #eef0f4;border-radius:11px;padding:12px 16px;color:#1a2332;font-size:14px;font-family:inherit;outline:none;margin-bottom:11px;transition:border-color .2s;box-sizing:border-box;}
.sq-form-card input[type="text"]:focus,.sq-form-card input[type="email"]:focus{border-color:#31C970;background:#f0fdf7;}
.sq-form-card input::placeholder{color:#b0bac6;}

/* GDPR */
.sq-gdpr-label{display:flex;align-items:flex-start;gap:10px;cursor:pointer;margin-bottom:16px;padding:12px 14px;background:#f8fafc;border:1.5px solid #eef0f4;border-radius:11px;transition:border-color .2s;}
.sq-gdpr-label:hover{border-color:#b0e8cc;}
.sq-gdpr-label input[type="checkbox"]{flex-shrink:0;width:16px;height:16px;accent-color:#31C970;margin-top:2px;cursor:pointer;}
.sq-gdpr-label span{font-size:13px;color:#6b7a8d;line-height:1.5;}
.sq-gdpr-label a{color:var(--sq-accent,#31C970);text-decoration:none;}
.sq-form-note{color:#aab0b8;font-size:12px;text-align:center;margin-top:10px;display:block;}

/* SUCCESS */
.sq-success{text-align:center;padding:20px 16px;}
.sq-success .sq-icon{font-size:60px;display:block;margin-bottom:20px;}
.sq-success h2{font-size:26px;font-weight:800;color:#1a2332;margin-bottom:10px;}
.sq-success p{color:#6b7a8d;font-size:15px;line-height:1.7;margin-bottom:24px;}
.sq-success .hl{color:var(--sq-accent,#31C970);font-weight:700;}
.sq-success-box{background:#e8faf2;border:1px solid #b0e8cc;border-radius:12px;padding:16px 22px;margin-bottom:24px;color:#2d6a46;font-size:14px;line-height:1.65;}

@media(max-width:600px){
    .sq-q-card,.sq-result-hero,.sq-form-card{padding:20px 16px;}
    .sq-result-score{font-size:60px;}
    .sq-q-text{font-size:15px;}
    .sq-option,.sq-chk-opt{font-size:13px;padding:11px 13px;}
    .sq-name-row{flex-direction:column;gap:0;}
    .sq-name-row input{margin-bottom:11px!important;}
}