:root{--fid-green:#006A4E;--fid-dark:#004030;--fid-gold:#f7c948;--fid-border:#d7dee8;--fid-light:#f5f7fa}body{background:#eef2f5;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}.fid-main-wrapper{max-width:1200px;margin:0 auto;background:#fff;box-shadow:0 0 10px rgba(0,0,0,.1)}.top-util{background:#f4f4f4;border-bottom:1px solid #ddd;padding:7px 18px}.top-util .form-control{height:30px;font-size:13px}.lang-btn a{font-size:13px;text-decoration:none;margin-left:8px}.school-banner{position:relative;height:260px;overflow:hidden}.school-banner>img{width:100%;height:260px;object-fit:cover;display:block}.banner-overlay{position:absolute;left:22px;top:50%;transform:translateY(-50%);display:flex;gap:14px;align-items:center;background:rgba(0,70,50,.65);padding:13px 18px;border-radius:4px}.banner-logo{width:75px;height:75px;object-fit:contain;background:#fff;border-radius:50%;padding:5px}.banner-title{color:#fff}.banner-title h1{margin:0;font-size:30px;font-weight:700}.banner-title p{margin:2px 0 0;font-size:15px}.fid-navbar{background:var(--fid-dark);padding:0 16px;margin:0}.fid-navbar .nav-link{color:#fff!important;font-size:14px;padding:9px 11px}.fid-navbar .nav-link:hover,.fid-navbar .active{background:rgba(255,255,255,.12)}.fid-navbar .dropdown-menu{font-size:14px}.fid-card{border:1px solid var(--fid-border);background:#fff;margin-bottom:14px;border-radius:3px}.fid-card-header{background:#e8f2ee;border-bottom:1px solid var(--fid-border);padding:8px 12px;font-weight:700;color:#004030}.fid-card-body{padding:12px;font-size:14px}.fid-list{list-style:none;margin:0;padding:0}.fid-list li{border-bottom:1px dotted #ccd5dd;padding:6px 0}.fid-list li:last-child{border-bottom:0}.fid-list a{text-decoration:none;color:#064d85}.more-btn{display:inline-block;background:var(--fid-green);color:#fff!important;padding:5px 12px;border-radius:3px;text-decoration:none;font-size:13px;margin-top:8px}.profile-img{width:100%;max-height:210px;object-fit:cover;border:1px solid #ddd;padding:3px;background:#fff}.portal-card .fid-card-body,#portalSlider .carousel-inner{background:#006A4E;border-radius:4px;padding:16px}.portal-slide{display:block;color:#fff!important;text-decoration:none;text-align:center}.portal-slide i{display:block;font-size:38px;margin-bottom:6px}.officer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.officer-card{border:1px solid #ddd;background:#fff;padding:10px;border-radius:4px;display:flex;gap:12px}.officer-card img{width:82px;height:92px;object-fit:cover;border:1px solid #ccc}.admin-wrap{max-width:1100px;margin:25px auto}.admin-nav a{display:inline-block;background:#006A4E;color:#fff;padding:8px 12px;margin:3px;text-decoration:none;border-radius:3px}.table td,.table th{vertical-align:middle}.footer{background:#f1f4f7;border-top:1px solid #ddd;padding:15px;font-size:13px}@media(max-width:768px){.school-banner,.school-banner>img{height:210px}.banner-overlay{left:10px;right:10px}.banner-title h1{font-size:22px}.banner-logo{width:58px;height:58px}}


/* ===== FID-like body redesign with auto scrolling notice ===== */
.auto-notice-bar{display:flex;align-items:center;background:#fff7d6;border-top:1px solid #efd790;border-bottom:1px solid #efd790;margin:0;padding-top:6px;padding-bottom:6px;gap:8px}
.auto-notice-bar .notice-label{background:#006A4E;color:#fff;font-weight:700;padding:5px 12px;border-radius:3px;white-space:nowrap;font-size:14px}
.auto-notice-bar .notice-marquee{flex:1;font-size:14px;color:#222}
.auto-notice-bar a{color:#064d85;text-decoration:none;font-weight:600}
.portal-home{background:#fff}.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.feature-card{min-height:245px;border:1px solid #e3e7ec;border-radius:10px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.12);padding:28px 28px 22px}.feature-head{display:flex;align-items:center;gap:16px;margin-bottom:24px}.feature-icon{width:58px;height:58px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fff;border:1px solid #edf0f2;box-shadow:0 1px 4px rgba(0,0,0,.08);color:#6ab52d;font-size:28px;flex:0 0 58px}.feature-head h3{font-size:25px;line-height:1.2;margin:0;color:#000;font-weight:500}.feature-list{list-style:none;padding:0;margin:0}.feature-list li{position:relative;margin:7px 0;padding-left:24px;font-size:17px;line-height:1.25}.feature-list li:before{content:"";width:13px;height:13px;background:#67717e;border-radius:50%;position:absolute;left:0;top:6px}.feature-list a{color:#000;text-decoration:none}.feature-list a:hover{color:#006A4E;text-decoration:underline}.right-sidebar .fid-card-header{background:#008a35;color:#fff;border-radius:5px;margin:10px 10px 0;border:0}.profile-card .fid-card-body{padding-top:12px}.profile-card .profile-img{max-height:190px;width:auto;max-width:95%;border:1px solid #9b1c1c;background:#fff;padding:3px}.details-link{display:inline-block;color:#0000aa;text-decoration:none;font-size:15px}.portal-card .fid-card-header{background:#008a35;color:#fff}.portal-card .fid-card-body,#portalSlider .carousel-inner{background:#006A4E;border-radius:4px;padding:14px}.portal-slide span{font-weight:700}.more-btn.w-100{display:block}.school-banner{margin-bottom:0}.fid-navbar{margin-bottom:0}
@media(max-width:991px){.feature-grid{grid-template-columns:1fr}.feature-card{min-height:auto}.feature-head h3{font-size:22px}}
@media(max-width:576px){.feature-card{padding:18px}.feature-head{gap:12px}.feature-icon{width:48px;height:48px;font-size:22px;flex-basis:48px}.feature-head h3{font-size:20px}.feature-list li{font-size:15px}.auto-notice-bar{align-items:flex-start;flex-direction:column}.auto-notice-bar .notice-marquee{width:100%}}

/* ===== Restored top design above About section ===== */
.home-top-design .fid-card-header{background:#008a35;color:#fff;border-radius:5px;margin:10px 10px 0;border:0;font-weight:700}
.home-highlight-card{border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.10);min-height:190px}
.home-highlight-card .fid-card-body{padding:12px 16px}
.home-highlight-card .fid-list li{font-size:15px;line-height:1.35}

/*=== Calendar Design ====*/

.calendar-box{
    width:100%;
    max-width:100%;
    overflow:hidden;
}

.calendar-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:#e9e9e9;
    padding:8px 10px;
    margin-bottom:6px;
    font-size:14px;
}

.calendar-top button{
    width:34px;
    height:30px;
    border:1px solid #777;
    background:#fff;
    font-weight:bold;
}

.calendar-week,
.calendar-days{
    display:grid !important;
    grid-template-columns:repeat(7, minmax(0, 1fr)) !important;
    gap:3px;
    width:100%;
    box-sizing:border-box;
}

.calendar-week{
    font-weight:600;
    margin-bottom:5px;
}

.calendar-week span,
.calendar-days span{
    display:flex !important;
    align-items:center;
    justify-content:center;
    text-align:center;
    min-width:0;
    box-sizing:border-box;
}

.calendar-week span{
    font-size:12px;
    line-height:1.2;
}

.calendar-days span{
    height:30px;
    line-height:30px;
    border:1px solid #ccc;
    background:#fff;
    font-size:13px;
    border-radius:3px;
}

.calendar-days span.empty{
    border:none;
    background:transparent;
}

.calendar-days .class-day{
    background:#ffffff;
    border-color:#ccc;
}

.calendar-days .holiday{
    background:#25b050;
    color:#fff;
    border-color:#008a3d;
}

.calendar-days span:not(.empty){
    cursor:pointer;
    transition:all .2s ease;
}

.calendar-days span:not(.empty):hover{
    background:#eaf5ff;
    box-shadow:0 3px 8px rgba(0,0,0,.15);
    transform:translateY(-2px);
}

.calendar-days span.selected{
    background:#0d6efd !important;
    color:#fff !important;
    border-color:#0a58ca !important;
}

.calendar-days .today{
    border:2px solid #ff9800 !important;
    font-weight:bold;
}

@media(max-width:768px){
    .calendar-box{
        overflow-x:hidden;
    }

    .calendar-week,
    .calendar-days{
        gap:2px;
    }

    .calendar-week span{
        font-size:10px;
    }

    .calendar-days span{
        height:26px;
        line-height:26px;
        font-size:11px;
        padding:0;
    }

    .calendar-top{
        font-size:13px;
        padding:7px 8px;
    }

    .calendar-top button{
        width:30px;
        height:28px;
    }
}

/* ===== Footer ===== */

.site-footer{
    background:#0f4c81;
    color:#fff;
    margin-top:20px;
    padding:18px 15px;
}

.footer-container{
    max-width:1200px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.footer-left,
.footer-right{
    flex:1;
    font-size:14px;
    line-height:1.8;
}

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

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

.footer-divider{
    width:1px;
    height:55px;
    background:rgba(255,255,255,.35);
}

@media(max-width:768px){

    .footer-container{
        flex-direction:column;
        text-align:center;
    }

    .footer-left,
    .footer-right{
        text-align:center;
    }

    .footer-divider{
        width:80%;
        height:1px;
    }
}