/* نخلي الصفحة نفسها بدون سكرول عرضي غريب */
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

#poweredBy {
display:none !important;
}
/* هنا أهم نقطة: كسر عرض 840px تبع قالب osTicket */
#container {
 	width: 100% !important;        /* بدل 840px */
    max-width: 100% !important;
    margin: 0 auto 20px auto;
    box-sizing: border-box;
    padding: 0 10px; 
}

/* المحتوى الداخلي كمان يخضع للعرض */
#content,
#page,
#header,
#footer {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* شوية تحسين للموبايل الصغير */
@media (max-width: 600px) {
    #header,
    #content,
    #footer {
        padding-left: 10px;
        padding-right: 10px;
    }
	body{
	font-size: 20px !important;
	}
    /* شريط التابز فوق (Home / Open Ticket / Check Status) يخليهم يلفّوا لو ضاق المكان */
	#nav {
		margin: 0 0px !important;
		    height: 10vh;
		background:none;
		border-top:none;
            white-space: normal !important;
    }
	
    #nav ul {
		margin: 0 0px !important;
        display: flex !important;
    }

    #nav li {
        float: none;
        display: inline-block;
        margin-bottom: 5px;
    }
	.flush-right {
		text-align: center !important;
	}
	form#ticketForm input {
    width: 45% !important;
    max-width: 50% !important;
    table-layout: fixed;      /* عشان ما يتمدد زيادة */
    border-collapse: collapse;
		display: flex !important;
	}
}

/* ====== Layout أساسي لصفحة الهبوط ====== */

#landing_page {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 20px;
    padding: 15px;
    box-sizing: border-box;
}

/* السايدبار (اللي فيها المينيو/الكاتيجوريز) */
#landing_page .sidebar {
    flex: 0 0 260px;          /* عرض تقريبي على الديسكتوب */
    max-width: 260px;
}

/* المحتوى الرئيسي */
#landing_page .main-content {
    flex: 1 1 0;
    min-width: 0;
}

/* الـ clear القديمة ما عاد نحتاجها مع flex */
#landing_page .clear {
    display: none !important;
}

/* البلوك اللي بعدهم (Featured Knowledge Base Articles) ياخد عرض كامل */
#landing_page > div:not(.sidebar):not(.main-content):not(.clear) {
    flex: 1 1 100%;
}

/* ====== تنسيق فورم البحث ====== */

.search-form {
    margin-bottom: 15px;
}

.search-form form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.search-form .search {
    flex: 1 1 200px;
    padding: 8px 10px;
    box-sizing: border-box;
}

.search-form .button,
.search-form button {
    padding: 8px 15px;
    cursor: pointer;
}

/* ====== تحسين شكل المقالات المميزة ====== */

.featured-category.front-page {
    border: 1px solid #e0e0e0;
    padding: 15px;
    margin-bottom: 15px;
    border-radius: 4px;
}

/* ====== ريسبونسيف: تابلت وموبايل ====== */

@media (max-width: 992px) {
    #landing_page {
        flex-direction: column;
        padding: 10px;
    }

    #landing_page .sidebar,
    #landing_page .main-content {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

/* موبايل صغير */
@media (max-width: 600px) {
    .search-form form {
        flex-direction: column;
    }

    .search-form .search,
    .search-form .button,
    .search-form button {
        width: 100%;
    }

    .featured-category.front-page {
        padding: 10px;
    }
}
