/*
 * Mobile Optimized CSS - نتائج الثانوية العامة
 * تحسينات الجوال - متوافق 100% مع جميع الأجهزة
 */

/* ===== تحسينات عامة للجوال ===== */

/* تحسين viewport للجوال */
@media screen and (max-width: 768px) {
    html {
        font-size: 14px; /* تقليل حجم الخط الأساسي */
    }
    
    body {
        font-size: 0.9rem;
        line-height: 1.5;
        overflow-x: hidden; /* منع التمرير الأفقي */
        width: 100%;
    }
    
    .container {
        padding: 0;
        max-width: 100%;
        margin: 0;
        width: 100%;
    }
    
    .main-content {
        width: 100%;
        max-width: 100%;
        padding: 1rem 0;
    }
    
    .search-section,
    .results-section,
    .enhanced-colleges-section,
    .advanced-statistics-section {
        width: 100%;
        border-radius: 0;
        margin-left: 0;
        margin-right: 0;
    }
}

/* ===== تحسين الهيدر للجوال ===== */

@media screen and (max-width: 768px) {
    .site-header {
        min-height: 50vh;
        padding: 2rem 0;
        text-align: center;
    }
    
    .site-title {
        font-size: 1.8rem;
        margin-bottom: 0.5rem;
        line-height: 1.2;
    }
    
    .site-description {
        font-size: 1rem;
        margin-bottom: 1.5rem;
    }
    
    /* تحسين إحصائيات الهيدر */
    .header-stats {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
        margin-top: 1.5rem;
    }
    
    .stat-item {
        padding: 1rem 0.5rem;
        min-height: auto;
    }
    
    .stat-icon {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
    }
    
    .stat-number {
        font-size: 1.2rem;
        font-weight: 700;
    }
    
    .stat-label {
        font-size: 0.8rem;
        margin-top: 0.25rem;
    }
}

@media screen and (max-width: 480px) {
    .site-header {
        min-height: 40vh;
        padding: 1.5rem 0;
    }
    
    .site-title {
        font-size: 1.5rem;
    }
    
    .site-description {
        font-size: 0.9rem;
    }
    
    .header-stats {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .stat-item {
        padding: 0.75rem 0.5rem;
    }
    
    .stat-icon {
        font-size: 1.25rem;
    }
    
    .stat-number {
        font-size: 1rem;
    }
    
    .stat-label {
        font-size: 0.75rem;
    }
}

/* ===== تحسين قسم البحث للجوال ===== */

@media screen and (max-width: 768px) {
    .search-section {
        padding: 2rem 0;
        margin: 1rem 0;
    }
    
    .search-section h2 {
        font-size: 1.5rem;
        margin-bottom: 1.5rem;
    }
    
    .search-form {
        flex-direction: column;
        gap: 1rem;
    }
    
    .form-group {
        width: 100%;
        margin-bottom: 0;
    }
    
    .form-group label {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }
    
    .form-group select,
    .form-group input {
        font-size: 1rem;
        padding: 0.75rem;
        height: auto;
        min-height: 3rem;
    }
    
    .search-btn {
        width: 100%;
        padding: 1rem;
        font-size: 1rem;
        margin-top: 0.5rem;
    }
    
    .btn-text {
        font-size: 1rem;
    }
    
    .btn-icon {
        font-size: 1.2rem;
    }
}

@media screen and (max-width: 480px) {
    .search-section {
        padding: 1.5rem 0;
    }
    
    .search-section h2 {
        font-size: 1.25rem;
        margin-bottom: 1rem;
    }
    
    .form-group select,
    .form-group input {
        font-size: 0.9rem;
        padding: 0.6rem;
        min-height: 2.5rem;
    }
    
    .search-btn {
        padding: 0.75rem;
        font-size: 0.9rem;
    }
}

/* ===== تحسين عرض النتائج للجوال ===== */

@media screen and (max-width: 768px) {
    .results-section {
        padding: 1.5rem 0;
    }
    
    .student-info {
        padding: 1.5rem;
        margin: 1rem 0;
    }
    
    .student-name {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }
    
    .info-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .info-item {
        padding: 1rem;
        text-align: center;
    }
    
    .info-label {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }
    
    .info-label i {
        font-size: 1rem;
        margin-left: 0.5rem;
    }
    
    .info-value {
        font-size: 1rem;
        font-weight: 600;
    }
    
    .status-success,
    .status-second,
    .status-failed {
        font-size: 0.9rem;
        padding: 0.5rem 1rem;
    }
    
    .status-success::before,
    .status-second::before,
    .status-failed::before {
        font-size: 0.8rem;
        margin-left: 0.5rem;
    }
}

@media screen and (max-width: 480px) {
    .student-info {
        padding: 1rem;
        margin: 0.5rem 0;
    }
    
    .student-name {
        font-size: 1.25rem;
        margin-bottom: 0.75rem;
    }
    
    .info-item {
        padding: 0.75rem;
    }
    
    .info-label {
        font-size: 0.8rem;
    }
    
    .info-value {
        font-size: 0.9rem;
    }
}

/* ===== تحسين المواد للجوال ===== */

@media screen and (max-width: 768px) {
    .subjects-section h4 {
        font-size: 1.25rem;
        margin-bottom: 1rem;
    }
    
    .subjects-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    
    .subject-card {
        padding: 1rem;
        min-height: auto;
    }
    
    .subject-name {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }
    
    .subject-score {
        font-size: 0.8rem;
    }
    
    .score-value {
        font-size: 1.1rem;
    }
    
    .score-max {
        font-size: 0.8rem;
    }
    
    .score-bar {
        height: 0.5rem;
        margin: 0.5rem 0;
    }
    
    .score-percentage {
        font-size: 0.8rem;
    }
}

@media screen and (max-width: 480px) {
    .subjects-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .subject-card {
        padding: 0.75rem;
    }
    
    .subject-name {
        font-size: 0.85rem;
    }
    
    .score-value {
        font-size: 1rem;
    }
}

/* ===== تحسين الكليات للجوال ===== */

@media screen and (max-width: 768px) {
    .enhanced-colleges-section {
        padding: 1.5rem 0;
    }
    
    .colleges-header h4 {
        font-size: 1.25rem;
        margin-bottom: 1rem;
    }
    
    .colleges-disclaimer {
        margin-bottom: 1rem;
    }
    
    .disclaimer-content {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
    
    .colleges-filter-bar {
        flex-direction: column;
        gap: 1rem;
        margin-bottom: 1rem;
    }
    
    .filter-options {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        justify-content: center;
    }
    
    .filter-btn {
        padding: 0.5rem 1rem;
        font-size: 0.85rem;
        flex: 1;
        min-width: 120px;
    }
    
    .colleges-stats {
        text-align: center;
        font-size: 0.85rem;
    }
    
    .enhanced-colleges-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .college-item {
        padding: 1rem;
        min-height: auto;
    }
    
    .college-name {
        font-size: 1rem;
        margin-bottom: 0.75rem;
    }
    
    .college-details {
        gap: 0.5rem;
    }
    
    .college-detail {
        font-size: 0.85rem;
    }
    
    .detail-label {
        font-size: 0.8rem;
    }
    
    .detail-value {
        font-size: 0.85rem;
    }
    
    .college-status {
        font-size: 0.8rem;
        padding: 0.4rem 0.8rem;
    }
}

@media screen and (max-width: 480px) {
    .filter-options {
        flex-direction: column;
    }
    
    .filter-btn {
        width: 100%;
        min-width: auto;
    }
    
    .college-item {
        padding: 0.75rem;
    }
    
    .college-name {
        font-size: 0.9rem;
    }
    
    .college-detail {
        font-size: 0.8rem;
    }
}

/* ===== تحسين الإحصائيات للجوال ===== */

@media screen and (max-width: 768px) {
    .advanced-statistics-section {
        padding: 1.5rem 0;
    }
    
    .advanced-statistics-section h3 {
        font-size: 1.25rem;
        margin-bottom: 1rem;
    }
    
    .stats-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    
    .stat-card {
        padding: 1rem;
        min-height: auto;
    }
    
    .stat-card .stat-number {
        font-size: 1.5rem;
    }
    
    .stat-card .stat-label {
        font-size: 0.85rem;
    }
    
    .stat-card .stat-subtitle {
        font-size: 0.8rem;
    }
    
    .averages-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .average-card {
        padding: 1rem;
    }
    
    .average-number {
        font-size: 1.25rem;
    }
    
    .average-label {
        font-size: 0.85rem;
    }
    
    .subject-averages-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    
    .subject-average-card {
        padding: 1rem;
    }
    
    .subject-name {
        font-size: 0.85rem;
    }
    
    .subject-avg-score {
        font-size: 1rem;
    }
    
    .subject-max-score {
        font-size: 0.8rem;
    }
}

@media screen and (max-width: 480px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }
    
    .stat-card {
        padding: 0.75rem;
    }
    
    .stat-card .stat-number {
        font-size: 1.25rem;
    }
    
    .subject-averages-grid {
        grid-template-columns: 1fr;
    }
    
    .subject-average-card {
        padding: 0.75rem;
    }
}

/* ===== تحسين التنقل للجوال ===== */

@media screen and (max-width: 768px) {
    .navigation {
        flex-direction: column;
        gap: 1rem;
        margin: 1.5rem 0;
    }
    
    .nav-btn {
        width: 100%;
        padding: 1rem;
        font-size: 1rem;
    }
    
    .nav-btn i {
        font-size: 1.2rem;
    }
}

/* ===== تحسين النوافذ المنبثقة للجوال ===== */

@media screen and (max-width: 768px) {
    .students-modal {
        padding: 1rem;
    }
    
    .modal-content {
        width: 95%;
        max-width: none;
        margin: 1rem auto;
        max-height: 90vh;
    }
    
    .modal-header {
        padding: 1rem;
    }
    
    .modal-header h2 {
        font-size: 1.25rem;
    }
    
    .close-modal {
        font-size: 1.5rem;
        padding: 0.5rem;
    }
    
    .modal-filters {
        padding: 1rem;
    }
    
    .filters-row {
        flex-direction: column;
        gap: 1rem;
    }
    
    .filter-group {
        width: 100%;
    }
    
    .filter-group input,
    .filter-group select {
        width: 100%;
        padding: 0.75rem;
        font-size: 0.9rem;
    }
    
    .modal-stats {
        padding: 1rem;
    }
    
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }
    
    .stat-item {
        padding: 0.75rem;
    }
    
    .stat-label {
        font-size: 0.8rem;
    }
    
    .stat-value {
        font-size: 1rem;
    }
    
    .students-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 1rem;
    }
    
    .student-card {
        padding: 1rem;
    }
    
    .student-name {
        font-size: 1rem;
    }
    
    .student-seat-no {
        font-size: 0.85rem;
    }
    
    .score-main {
        font-size: 1.1rem;
    }
    
    .score-percentage {
        font-size: 0.8rem;
    }
    
    .pagination-container {
        padding: 1rem;
        flex-direction: column;
        gap: 1rem;
    }
    
    .pagination-buttons {
        display: flex;
        gap: 0.5rem;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .pagination-btn {
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
        min-width: 40px;
    }
}

@media screen and (max-width: 480px) {
    .modal-content {
        width: 98%;
        margin: 0.5rem auto;
    }
    
    .stats-grid {
        grid-template-columns: 1fr;
    }
    
    .pagination-buttons {
        gap: 0.25rem;
    }
    
    .pagination-btn {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
        min-width: 35px;
    }
}

/* ===== تحسين البحث المتقدم للجوال ===== */

@media screen and (max-width: 768px) {
    .professional-search {
        padding: 1.5rem 0;
    }
    
    .search-method-group {
        margin-bottom: 1.5rem;
    }
    
    .method-title {
        font-size: 1.1rem;
        margin-bottom: 1rem;
    }
    
    .radio-group {
        flex-direction: column;
        gap: 1rem;
    }
    
    .radio-option {
        width: 100%;
    }
    
    .radio-label {
        padding: 1rem;
        font-size: 0.9rem;
    }
    
    .radio-icon {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
    }
    
    .radio-title {
        font-size: 1rem;
        margin-bottom: 0.25rem;
    }
    
    .radio-desc {
        font-size: 0.8rem;
    }
    
    .search-input-group {
        margin-bottom: 1.5rem;
    }
    
    .input-label {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }
    
    .search-input {
        padding: 0.75rem;
        font-size: 1rem;
    }
    
    .search-btn {
        width: 100%;
        padding: 1rem;
        font-size: 1rem;
    }
}

@media screen and (max-width: 480px) {
    .professional-search {
        padding: 1rem 0;
    }
    
    .method-title {
        font-size: 1rem;
    }
    
    .radio-label {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
    
    .radio-icon {
        font-size: 1.25rem;
    }
    
    .radio-title {
        font-size: 0.9rem;
    }
    
    .radio-desc {
        font-size: 0.75rem;
    }
    
    .search-input {
        padding: 0.6rem;
        font-size: 0.9rem;
    }
    
    .search-btn {
        padding: 0.75rem;
        font-size: 0.9rem;
    }
}

/* ===== تحسين الفوتر للجوال ===== */

@media screen and (max-width: 768px) {
    .site-footer {
        padding: 2rem 0 1rem;
    }
    
    .footer-main {
        display: grid;
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }
    
    .footer-section {
        margin-bottom: 1.5rem;
    }
    
    .footer-section h4 {
        font-size: 1.1rem;
        margin-bottom: 1rem;
    }
    
    .footer-section h4::after {
        width: 50px;
        margin: 0.5rem auto 0;
    }
    
    .footer-stats {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
        margin: 1rem 0;
    }
    
    .footer-stat {
        padding: 1rem 0.5rem;
        text-align: center;
    }
    
    .footer-stat strong {
        font-size: 1.1rem;
    }
    
    .footer-stat span {
        font-size: 0.8rem;
    }
    
    .contact-items {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .contact-item {
        text-align: center;
        padding: 0.75rem;
    }
    
    .contact-icon {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
    }
    
    .contact-details strong {
        font-size: 0.9rem;
    }
    
    .contact-details span,
    .contact-details a {
        font-size: 0.8rem;
    }
    
    .footer-bottom {
        padding: 1rem 0;
        margin-top: 1.5rem;
    }
    
    .footer-bottom-content {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }
    
    .copyright p {
        font-size: 0.8rem;
    }
    
    .footer-social {
        display: flex;
        justify-content: center;
        gap: 1rem;
    }
    
    .social-link {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }
}

@media screen and (max-width: 480px) {
    .footer-stats {
        grid-template-columns: 1fr;
    }
    
    .footer-stat {
        padding: 0.75rem 0.25rem;
    }
    
    .footer-stat strong {
        font-size: 1rem;
    }
    
    .footer-stat span {
        font-size: 0.75rem;
    }
    
    .social-link {
        width: 35px;
        height: 35px;
        font-size: 1rem;
    }
}

/* ===== تحسين زر العودة للأعلى للجوال ===== */

@media screen and (max-width: 768px) {
    .back-to-top {
        right: 15px;
        bottom: 15px;
        width: 45px;
        height: 45px;
    }
    
    .back-to-top i {
        font-size: 1.2rem;
    }
}

@media screen and (max-width: 480px) {
    .back-to-top {
        right: 10px;
        bottom: 10px;
        width: 40px;
        height: 40px;
    }
    
    .back-to-top i {
        font-size: 1rem;
    }
}

/* ===== تحسينات إضافية للجوال ===== */

/* تحسين التمرير */
@media screen and (max-width: 768px) {
    html {
        scroll-behavior: smooth;
    }
    
    /* تحسين أداء التمرير */
    * {
        -webkit-overflow-scrolling: touch;
    }
}

/* تحسين النصوص الطويلة */
@media screen and (max-width: 768px) {
    .student-name,
    .college-name,
    .subject-name {
        word-break: break-word;
        hyphens: auto;
    }
}

/* تحسين الأزرار لللمس */
@media screen and (max-width: 768px) {
    .search-btn,
    .nav-btn,
    .filter-btn,
    .pagination-btn,
    .action-btn {
        min-height: 44px; /* الحد الأدنى لحجم اللمس */
        touch-action: manipulation;
    }
}

/* تحسين النماذج للجوال */
@media screen and (max-width: 768px) {
    input[type="text"],
    input[type="number"],
    input[type="email"],
    select,
    textarea {
        font-size: 16px; /* منع التكبير التلقائي في iOS */
        -webkit-appearance: none;
        border-radius: 8px;
    }
    
    select {
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");
        background-repeat: no-repeat;
        background-position: right 10px center;
        background-size: 16px;
        padding-right: 40px;
    }
}

/* تحسين الأداء */
@media screen and (max-width: 768px) {
    /* تقليل الرسوم المتحركة للجوال */
    .stat-item,
    .info-item,
    .subject-card,
    .college-item,
    .stat-card {
        animation-duration: 0.3s;
    }
    
    /* تحسين التحميل */
    .loading-spinner {
        width: 30px;
        height: 30px;
    }
}

/* تحسين إمكانية الوصول */
@media screen and (max-width: 768px) {
    /* تحسين التركيز */
    .search-btn:focus,
    .nav-btn:focus,
    .filter-btn:focus,
    .pagination-btn:focus {
        outline: 2px solid var(--primary-color);
        outline-offset: 2px;
    }
    
    /* تحسين التباين */
    .info-value,
    .stat-number,
    .score-value {
        font-weight: 600;
    }
}

/* تحسين الطباعة */
@media print {
    .site-header,
    .search-section,
    .navigation,
    .back-to-top,
    .header-advertisement,
    .content-advertisement,
    .footer-advertisement {
        display: none !important;
    }
    
    .results-section,
    .subjects-section,
    .enhanced-colleges-section {
        page-break-inside: avoid;
    }
}

/* ===== تحسينات خاصة للأجهزة الصغيرة جداً ===== */

@media screen and (max-width: 360px) {
    .container {
        padding: 0 10px;
    }
    
    .site-title {
        font-size: 1.3rem;
    }
    
    .site-description {
        font-size: 0.8rem;
    }
    
    .search-section h2 {
        font-size: 1.1rem;
    }
    
    .student-name {
        font-size: 1.1rem;
    }
    
    .info-item {
        padding: 0.5rem;
    }
    
    .subject-card,
    .college-item,
    .stat-card {
        padding: 0.5rem;
    }
    
    .filter-btn {
        padding: 0.4rem 0.8rem;
        font-size: 0.8rem;
    }
}

/* ===== تحسينات للوضع الأفقي ===== */

@media screen and (max-width: 768px) and (orientation: landscape) {
    .site-header {
        min-height: 30vh;
        padding: 1rem 0;
    }
    
    .header-stats {
        grid-template-columns: repeat(4, 1fr);
        gap: 0.5rem;
    }
    
    .stat-item {
        padding: 0.5rem 0.25rem;
    }
    
    .search-section {
        padding: 1rem 0;
    }
    
    .results-section {
        padding: 1rem 0;
    }
}

/* ===== تحسينات للشاشات عالية الدقة ===== */

@media screen and (-webkit-min-device-pixel-ratio: 2),
       screen and (min-resolution: 192dpi) {
    .stat-icon,
    .info-label i,
    .btn-icon,
    .radio-icon {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* ===== تحسينات للأداء ===== */

/* تحسين التمرير */
@media screen and (max-width: 768px) {
    .site-header,
    .search-section,
    .results-section,
    .subjects-section,
    .enhanced-colleges-section {
        will-change: transform;
        transform: translateZ(0);
    }
}

/* تحسين الذاكرة */
@media screen and (max-width: 768px) {
    .header-stats,
    .info-grid,
    .subjects-grid,
    .enhanced-colleges-grid,
    .stats-grid {
        contain: layout style paint;
    }
}

/* ===== تحسينات العرض الكامل للجوال ===== */

@media screen and (max-width: 768px) {
    /* ضمان العرض الكامل */
    html, body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }
    
    .container {
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin: 0;
    }
    
    .main-content {
        width: 100%;
        max-width: 100%;
        padding: 1rem 0;
    }
    
    .search-section,
    .results-section,
    .enhanced-colleges-section,
    .advanced-statistics-section,
    .site-footer {
        width: 100%;
        border-radius: 0;
        margin-left: 0;
        margin-right: 0;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    .site-header {
        width: 100%;
        border-radius: 0;
    }
}

@media screen and (max-width: 480px) {
    .search-section,
    .results-section,
    .enhanced-colleges-section,
    .advanced-statistics-section {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    .container {
        padding: 0;
    }
} 