@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800;900&family=Tajawal:wght@400;500;700;800&display=swap');

:root { --gov-blue: #0f172a; --gov-blue-light: #1e3a8a; --gov-green: #065f46; --gov-gold: #b45309; --gov-gray: #f8fafc; }
body { font-family: 'Tajawal', sans-serif; background-color: #f1f5f9; color: #334155; overflow-x: hidden; }

.app-card { background: rgba(255, 255, 255, 0.95); border: 1px solid rgba(226, 232, 240, 0.8); border-radius: 20px !important; padding: 1.8rem 1.5rem; position: relative; overflow: hidden; box-shadow: 0 10px 25px -5px rgba(0,0,0,0.05), 0 8px 10px -6px rgba(0,0,0,0.01); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); cursor: pointer; display: flex; flex-direction: column; align-items: center; text-align: center; backdrop-filter: blur(10px); }
.app-card::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 5px; background: var(--card-color, #1e3a8a); }
.app-card:hover { transform: translateY(-8px); box-shadow: 0 25px 30px -10px rgba(var(--card-color-rgb, 30,58,138), 0.15); border-color: var(--card-color, #1e3a8a); }
.app-icon-container { width: 75px; height: 75px; border-radius: 22px; display: flex; align-items: center; justify-content: center; font-size: 2.2rem; margin-bottom: 1.2rem; background: var(--icon-bg, #eff6ff); color: var(--icon-color, #1e3a8a); box-shadow: inset 0 2px 5px rgba(255,255,255,0.7), 0 5px 15px rgba(0,0,0,0.08); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
.app-card:hover .app-icon-container { transform: scale(1.15) translateY(-5px); box-shadow: inset 0 2px 5px rgba(255,255,255,0.9), 0 10px 20px rgba(var(--card-color-rgb, 30,58,138), 0.2); }

.modal { display: none; position: fixed; inset: 0; background: rgba(15, 23, 42, 0.85); z-index: 9999; flex-direction: column; align-items: center; justify-content: center; backdrop-filter: blur(6px); } 
.modal.active { display: flex; animation: fadeIn 0.3s ease-out; } 
@keyframes fadeIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modern-input { border: 1px solid #cbd5e1; padding: 0.8rem 1rem; border-radius: 8px !important; width: 100%; outline: none; transition: all 0.3s; background-color: #f8fafc; color: #0f172a; font-weight: 600; font-family: 'Tajawal', sans-serif;}
.modern-input:focus { border-color: var(--gov-blue-light); background-color: #ffffff; box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.15); }

.input-icon-wrapper { position: relative; width: 100%; } 
.input-icon-wrapper i { position: absolute; right: 1.2rem; top: 50%; transform: translateY(-50%); color: #64748b; font-size: 1.1rem; transition: 0.3s;} 
.input-icon-wrapper input:focus + i, .input-icon-wrapper input:not(:placeholder-shown) + i { color: var(--gov-blue-light); }
.input-icon-wrapper input { padding-right: 3rem !important; }

::-webkit-scrollbar { width: 8px; height: 8px; } 
::-webkit-scrollbar-track { background: #e2e8f0; } 
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 4px; } 
::-webkit-scrollbar-thumb:hover { background: var(--gov-blue-light); }

.saas-tab { padding: 12px 25px; font-weight: bold; border-radius: 10px 10px 0 0; cursor: pointer; transition: 0.3s; border-bottom: 3px solid transparent; font-family: 'Cairo', sans-serif;} 
.saas-tab.active { background: white; color: var(--gov-blue-light); border-bottom: 3px solid var(--gov-blue-light); }
.saas-tab:hover:not(.active) { background: rgba(255,255,255,0.1); }

.report-table { width: 100%; border-collapse: separate; border-spacing: 0; text-align: center; border: 1px solid #cbd5e1; border-radius: 8px; overflow: hidden; }
.report-table th, .report-table td { border-bottom: 1px solid #e2e8f0; padding: 10px 8px; font-weight: bold; color: #334155; vertical-align: middle; }
.report-table th { background-color: #f1f5f9; color: #0f172a; border-bottom: 2px solid #cbd5e1; font-family: 'Cairo'; font-weight: 800;}
.report-table tr:last-child td { border-bottom: none; }
.zebra-table tbody tr:nth-child(even) td { background-color: #f8fafc; } 
.zebra-table tbody tr:hover td { background-color: #f0f9ff; transition: 0.2s;}

/* تنسيق القوائم المتعددة الاحترافي */
select[multiple] { overflow-y: auto; border: 1px solid #cbd5e1; padding: 8px; border-radius: 8px; background: #fff; font-family: 'Tajawal', sans-serif; scrollbar-width: thin; min-height: 110px; }
select[multiple] option { padding: 8px 12px; margin-bottom: 3px; border-radius: 6px; cursor: pointer; transition: 0.2s; font-size: 12px; font-weight: bold; color: #334155;}
select[multiple] option:checked { background-color: #1e3a8a; color: white; }
select[multiple] option:hover:not(:checked) { background-color: #e2e8f0; }

@media print {
    @page { size: A4 landscape; margin: 5mm; }
    body { background-color: white !important; font-family: 'Tajawal', sans-serif;}
    header, .no-print, #apps-container, #users-ui, #timetable-ui, #settings-ui, .saas-tab, #reports-main-menu, footer, #subscription-banner { display: none !important; }
    #app-view, .flex-1, #reports-ui, #saas-view { display: block !important; padding: 0 !important; margin: 0 !important; border: none !important; background: white !important;}
    #print-area { display: block !important; padding: 0 !important; margin: 0 !important; border: none !important; box-shadow: none !important; width: 100% !important; }
    .overflow-x-auto { overflow: visible !important; width: 100% !important; }
    .report-table { width: 100% !important; table-layout: fixed !important; word-wrap: break-word !important; border: 2px solid #000 !important; border-radius: 0;}
    .text-sm.report-table th, .text-sm.report-table td { font-size: 10pt !important; padding: 4px !important; border: 1px solid #000 !important; }
    table.text-xs th, table.text-xs td { font-size: 6.5pt !important; padding: 1px !important; border: 1px solid #000 !important; }
    .zebra-table tbody tr:nth-child(even) td { background-color: #f1f5f9 !important; }
    #report-header { display: block !important; margin-bottom: 15px !important; }
    .page-break { page-break-after: always; }
}

.pdf-mode { width: 297mm !important; max-width: none !important; padding: 5mm !important; background: white; }
.pdf-mode .overflow-x-auto { overflow: visible !important; }
.pdf-mode .report-table { width: 100% !important; table-layout: fixed !important; border-radius: 0;}
.pdf-mode table.text-xs th, .pdf-mode table.text-xs td { font-size: 7pt !important; padding: 1px !important; word-wrap: break-word; }

.lock-card { background: rgba(255,255,255,0.98); padding: 40px; border-radius: 16px; border: 1px solid #e2e8f0; width: 500px; max-width: 90%; text-align:center; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); } 
.gov-footer { background-color: var(--gov-blue); color: #94a3b8; text-align: center; padding: 1.5rem; font-size: 0.85rem; border-top: 4px solid var(--gov-green); margin-top: auto; } 
.gov-btn { border-radius: 8px !important; text-transform: uppercase; font-weight: 700; transition: all 0.3s; font-family: 'Cairo', sans-serif;} 
.gov-bg-pattern { background-image: radial-gradient(#cbd5e1 1px, transparent 1px); background-size: 25px 25px; background-color: #f8fafc; }
.bulk-users-scroll { max-height: 300px; overflow-y: auto; border: 1px solid #e2e8f0; border-radius: 8px; padding: 0.8rem; background: #f8fafc;}

.checkbox-wrapper-46 input[type="checkbox"] { display: none; visibility: hidden; }
.checkbox-wrapper-46 .cbx { margin: auto; -webkit-user-select: none; user-select: none; cursor: pointer; }
.checkbox-wrapper-46 .cbx span { display: inline-block; vertical-align: middle; transform: translate3d(0, 0, 0); }
.checkbox-wrapper-46 .cbx span:first-child { position: relative; width: 20px; height: 20px; border-radius: 4px; transform: scale(1); vertical-align: middle; border: 1px solid #94a3b8; transition: all 0.2s ease; background: white;}
.checkbox-wrapper-46 .cbx span:first-child svg { position: absolute; top: 4px; left: 3px; fill: none; stroke: #FFFFFF; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 16px; stroke-dashoffset: 16px; transition: all 0.3s ease; transition-delay: 0.1s; transform: translate3d(0, 0, 0); }
.checkbox-wrapper-46 .cbx span:last-child { padding-right: 8px; font-weight: 700; color: #334155; }
.checkbox-wrapper-46 .cbx:hover span:first-child { border-color: #1e3a8a; }
.checkbox-wrapper-46 .inp-cbx:checked + .cbx span:first-child { background: #1e3a8a; border-color: #1e3a8a; animation: wave-46 0.4s ease; }
.checkbox-wrapper-46 .inp-cbx:checked + .cbx span:first-child svg { stroke-dashoffset: 0; }

.ed-cell { border: 1px solid #e2e8f0; border-radius: 6px; padding: 10px; cursor: pointer; transition: 0.2s; font-weight: bold; text-align: center; }
.ed-cell:hover { filter: brightness(0.95); }
.ed-cell.empty { background-color: #f8fafc; color: #94a3b8; border: 1px dashed #cbd5e1; }
.ed-cell.filled { background-color: #e0e7ff; color: #1e3a8a; border: 1px solid #bfdbfe; }
.ed-cell.selected { background-color: #3b82f6; color: white; transform: scale(1.05); box-shadow: 0 4px 10px rgba(59, 130, 246, 0.3); z-index: 10; position: relative; }
.ed-cell.can-move { background-color: #dcfce7; color: #065f46; border: 2px dashed #22c55e; animation: pulse-green 1.5s infinite; }
.ed-cell.cant-move { background-color: #fee2e2; color: #991b1b; border: 2px solid #ef4444; opacity: 0.6; cursor: not-allowed; }
@keyframes pulse-green { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4); } 70% { box-shadow: 0 0 0 10px rgba(34, 197, 94, 0); } 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); } }
/* تنسيق القوائم المتعددة الاحترافي (الجديد) */
select[multiple] { 
    overflow-y: auto; 
    border: 2px solid #e2e8f0; 
    padding: 6px; 
    border-radius: 12px; 
    background: #f8fafc; 
    font-family: 'Cairo', sans-serif; 
    outline: none; 
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.02);
    scrollbar-width: thin; 
    min-height: 130px; 
}
select[multiple]:focus { 
    border-color: #4f46e5; 
    background: #ffffff; 
    box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.15); 
}
select[multiple] option { 
    padding: 10px 14px; 
    margin-bottom: 4px; 
    border-radius: 8px; 
    cursor: pointer; 
    transition: 0.2s; 
    font-size: 13px; 
    font-weight: 800; 
    color: #475569; 
    border: 1px solid transparent; 
}
select[multiple] option:checked { 
    background: linear-gradient(135deg, #1e3a8a, #3b82f6); 
    color: white; 
    border-color: #1d4ed8; 
    box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.3); 
    transform: scale(0.98);
}
select[multiple] option:hover:not(:checked) { 
    background-color: #e2e8f0; 
    border-color: #cbd5e1; 
    color: #0f172a;
}

/* تنسيق زر لوحة المفاتيح Ctrl */
kbd { 
    background-color: #0f172a; 
    color: #fff; 
    padding: 3px 8px; 
    border-radius: 6px; 
    font-family: monospace; 
    font-size: 12px; 
    font-weight: bold;
    border-bottom: 3px solid #000; 
    box-shadow: 0 2px 0 rgba(255,255,255,0.2) inset;
    letter-spacing: 1px;
}