/* ===== PAGE LAYOUTS - GENERAL AUTHORITY FOR SUPERVISION & INSPECTION ===== */

/* ===== UNIVERSAL LAYOUT CLASSES ===== */
.page-wrapper {
    max-width: 100%;
    margin: 0 auto;
    overflow-x: hidden;
}

.page-container {
    max-width: 95%;
    margin: 0 auto;
    padding: 0 15px;
}

.page-content {
    max-width: 95%;
    margin: 0 auto;
    padding: 2rem 0;
}

.page-section {
    margin-bottom: 3rem;
    padding: 2rem 0;
}

.page-section:last-child {
    margin-bottom: 0;
}

/* ===== HOME PAGE LAYOUT ===== */
.home-hero {
    width: 100%;
    max-width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.home-content {
    max-width: 95%;
    margin: 0 auto;
    padding: 2rem 0;
}

.home-section {
    margin-bottom: 3rem;
    padding: 2rem 0;
}

/* ===== ABOUT PAGE LAYOUT ===== */
.about-content {
    max-width: 95%;
    margin: 0 auto;
    padding: 2rem 0;
}

.about-section {
    margin-bottom: 3rem;
    padding: 2rem 0;
}

.about-banner {
    width: 100%;
    max-width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

/* ===== CONTACT PAGE LAYOUT ===== */
.contact-content {
    max-width: 95%;
    margin: 0 auto;
}

.contact-hero {
    width: 100%;
    max-width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.contact-form {
    max-width: 80%;
    margin: 0 auto;
}

/* ===== FAQ PAGE LAYOUT ===== */
.faq-content {
    max-width: 95%;
    margin: 0 auto;
    padding: 2rem 0;
}

.faq-header {
    width: 100%;
    max-width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.faq-section {
    margin-bottom: 2rem;
    padding: 1rem 0;
}

/* ===== NEWS & ANNOUNCEMENTS LAYOUT ===== */
.news-content,
.announcements-content {
    max-width: 1000px;
    margin: 0 auto;
}

.news-header,
.announcements-header {
    width: 100%;
    max-width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.news-item,
.announcement-item {
    margin-bottom: 2rem;
    padding: 1rem 0;
}

/* ===== DASHBOARD LAYOUT ===== */
.dashboard-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 0;
}

.dashboard-section {
    margin-bottom: 2rem;
    padding: 1rem 0;
}

/* ===== RESPONSIVE BREAKPOINTS ===== */
@media (max-width: 1200px) {
    .page-container {
        max-width: 960px;
    }

    .page-content {
        max-width: 900px;
    }

    .home-content,
    .news-content,
    .announcements-content,
    .dashboard-content {
        max-width: 900px;
    }
}

@media (max-width: 992px) {
    .page-container {
        max-width: 720px;
    }

    .page-content {
        max-width: 700px;
    }

    .home-content,
    .news-content,
    .announcements-content,
    .dashboard-content {
        max-width: 700px;
    }

    .about-content,
    .faq-content {
        max-width: 700px;
    }

    .contact-content {
        max-width: 600px;
    }
}

@media (max-width: 768px) {
    .page-container {
        max-width: 540px;
        padding: 0 20px;
    }

    .page-content {
        max-width: 100%;
        padding: 1.5rem 0;
    }

    .home-content,
    .about-content,
    .contact-content,
    .faq-content,
    .news-content,
    .announcements-content,
    .dashboard-content {
        max-width: 100%;
        padding: 1.5rem 0;
    }

    .page-section,
    .home-section,
    .about-section,
    .faq-section,
    .news-item,
    .announcement-item,
    .dashboard-section {
        margin-bottom: 1.5rem;
        padding: 1rem 0;
    }
}

@media (max-width: 576px) {
    .page-container {
        max-width: 100%;
        padding: 0 15px;
    }

    .page-content {
        padding: 1rem 0;
    }

    .home-content,
    .about-content,
    .contact-content,
    .faq-content,
    .news-content,
    .announcements-content,
    .dashboard-content {
        padding: 1rem 0;
    }

    .page-section,
    .home-section,
    .about-section,
    .faq-section,
    .news-item,
    .announcement-item,
    .dashboard-section {
        margin-bottom: 1rem;
        padding: 0.5rem 0;
    }
}

/* ===== UTILITY CLASSES ===== */
.text-center-mobile {
    text-align: center;
}

.text-left-mobile {
    text-align: left;
}

.text-right-mobile {
    text-align: right;
}

@media (max-width: 768px) {
    .text-center-mobile {
        text-align: center !important;
    }

    .text-left-mobile {
        text-align: left !important;
    }

    .text-right-mobile {
        text-align: right !important;
    }
}

/* ===== PRINT STYLES ===== */
@media print {

    .page-container,
    .page-content,
    .home-content,
    .about-content,
    .contact-content,
    .faq-content,
    .news-content,
    .announcements-content,
    .dashboard-content {
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .home-hero,
    .about-banner,
    .contact-hero,
    .faq-header,
    .news-header,
    .announcements-header {
        display: none !important;
    }
}