/* --- بنەڕەتی و فۆنت --- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@400;700&display=swap');
:root{--background-color:#121212;--text-color:#e0e0e0;--primary-color:#ffffff;--card-bg-color:#1e1e1e;--border-color:#333;--button-bg-color:#f0f0f0;--button-text-color:#121212;--button-hover-bg:#ccc;--error-color:#ff4d4d;}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Noto Kufi Arabic',sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.7;display:flex;justify-content:center;align-items:flex-start;min-height:100vh;padding:40px 20px;direction:rtl;}
.container{max-width:700px;width:100%;background-color:var(--card-bg-color);padding:30px 40px;border-radius:12px;border:1px solid var(--border-color);box-shadow:0 10px 30px rgba(0,0,0,0.2);text-align:center;}
header h1{color:var(--primary-color);font-size:2.5rem;font-weight:700;margin-bottom:10px;}
.subtitle{font-size:1.1rem;color:#a0a0a0;margin-bottom:30px;}
.language-switcher{margin-bottom:25px;padding-bottom:15px;border-bottom:1px solid var(--border-color);}
.language-switcher a{color:#a0a0a0;text-decoration:none;margin:0 10px;font-size:0.9rem;transition:color 0.3s ease;}
.language-switcher a:hover{color:var(--primary-color);}
.language-switcher a.active{color:var(--primary-color);font-weight:700;}
.quiz-form { text-align: right; }
.question-block {margin-bottom: 25px;padding-bottom: 25px;border-bottom: 1px solid var(--border-color);}
.question-block:last-of-type { border-bottom: none; }
.question-text {font-size: 1.2rem;font-weight: 700;margin-bottom: 15px;color: var(--primary-color);}
.answers { display: flex; flex-direction: column; gap: 10px; }
.answers label {display: block;background-color: var(--background-color);padding: 12px 15px;border-radius: 8px;border: 1px solid var(--border-color);cursor: pointer;transition: background-color 0.3s, border-color 0.3s;}
.answers label:hover { background-color: #2a2a2a; }
.answers input[type="radio"] { display: none; }
.answers input[type="radio"]:checked + span { color: var(--primary-color); font-weight: bold; }
.answers input[type="radio"]:checked + span::before {content: '✔';margin-left: 10px;color: var(--primary-color);}
button, .try-again-button {width: 100%;margin-top: 20px;padding: 12px 20px;background-color: var(--button-bg-color);color: var(--button-text-color);border: none;border-radius: 8px;font-family: 'Noto Kufi Arabic', sans-serif;font-size: 1.1rem;font-weight: 700;cursor: pointer;transition: background-color 0.3s ease;text-decoration: none;display: inline-block;}
button:hover, .try-again-button:hover { background-color: var(--button-hover-bg); }
.result-card{margin-top:20px;background-color:var(--background-color);padding:25px;border-radius:10px;border:1px solid var(--border-color);animation:fadeIn 0.5s ease-in-out;}
.result-card h2{color:var(--primary-color);margin-bottom:15px;}
.result-card .personality-type{font-size:1.5rem;font-weight:700;color:#a0a0a0;margin-bottom:10px;letter-spacing:2px;}
.result-card .description{font-size:1rem;color:var(--text-color);}
@keyframes fadeIn{from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);}}
.error-message {color: var(--error-color); background-color: rgba(255, 77, 77, 0.1); border: 1px solid var(--error-color); padding: 10px; border-radius: 8px; margin-bottom: 20px;}
footer{margin-top:30px;padding-top:20px;border-top:1px solid var(--border-color);font-size:0.9rem;color:#777;}
@media (max-width: 600px){.container{padding:20px;}header h1{font-size:2rem;}.subtitle{font-size:1rem;}}