* {
    box-sizing: border-box;
}

body {
    font-family: 'Tajawal', Inter, sans-serif;
    background-color: #f8fafc;
}

/* لتنعيم عملية فتح وقفل السيكشن (SlideToggle Animation) */
.slide-content {
    max-height: 1000px;
    transition: max-height 0.4s ease-in-out, padding 0.4s ease-in-out, opacity 0.3s ease-in-out;
    opacity: 1;
}

.slide-content.collapsed {
    max-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
}

/* لف السهم بنعومة */
.rotate-icon {
    transition: transform 0.3s ease;
}

.rotate-icon.rotated {
    transform: rotate(180deg);
}

/* ستايل مخصص للـ Checkboxes والمهام المنتهية */
.task-checkbox:checked + .task-text {
    text-decoration: line-through;
    color: #94a3b8;
}

.task-checkbox:checked ~ .fa-circle-check {
    display: inline-block !important;
}

/* إخفاء السهم الافتراضي للمتصفحات في القوائم المنسدلة المخصصة */
.dropdown-menu {
    display: none;
}

.dropdown-menu.show {
    display: block;
}

/* Define a custom scrollbar for the iframe matching image_5.png */
.pdf-scrollbar::-webkit-scrollbar {
    width: 16px;
}

.pdf-scrollbar::-webkit-scrollbar-track {
    background: #2a2a2a;
    border-radius: 10px;
}

.pdf-scrollbar::-webkit-scrollbar-thumb {
    background: #505050;
    border-radius: 10px;
    border: 4px solid #2a2a2a;
}

.pdf-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #606060;
}


/***************************************** Flashcards Page Style **********************************/

/* خلفية خشبية ناعمة جداً ومطابقة لشكل الكروت الأصلي */
.wood-texture-bg {
    background-color: #f3e5ca;
    background-image: radial-gradient(rgba(255,255,255,0.15) 1px, transparent 0),
                      linear-gradient(to right, rgba(139,94,60,0.03) 1px, transparent 0);
    background-size: 8px 8px, 20px 100%;
}


/*********************************** Treatments Page Style *******************************************/

.custom-scrollbar::-webkit-scrollbar { width: 5px; }
.custom-scrollbar::-webkit-scrollbar-track { background: #f1f1f1; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/*=====================================================================================*/
/*================================ Feedback Tap Style =================================*/

/* خلفية داكنة نصف شفافة (Overlay) */
.modal-overlay {
    background-color: rgba(0, 0, 0, 0.5);
    transition: opacity 0.3s ease-out;
}

/* أنيميشن دخول المودال من الجنب (Slide-In) */
@keyframes slideInFromRight {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

/* أنيميشن خروج المودال من الجنب (Slide-Out) */
@keyframes slideOutToRight {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(100%); opacity: 0; }
}

/* الكلاس اللي هيشغل أنيميشن الدخول */
.modal-open-animation {
    animation: slideInFromRight 0.3s ease-out forwards;
}

/* الكلاس اللي هيشغل أنيميشن الخروج (بنضيفه قبل الحذف) */
.modal-close-animation {
    animation: slideOutToRight 0.3s ease-out forwards;
}

/*===========================================================================*/
/*=========================== Help Page Style ===============================*/
/* لقلب كلمة FEEDBACK الجانبية */
.vertical-text {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

/*==========================================================================================*/
/*=========================== Second Step Profile Page Style ===============================*/
select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 10,0 5,7' style='fill:%239ca3af'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 10px;
}