/*
Theme Name: Bornomala
Theme URI: https://fulbariaiti.com/
Author: RJ Tanjid
Author URL: http://rjtanjid24.github.io/me
Agency: RST Multimedia
Facebook: https://www.facebook.com/RJTanjid24/
Description: Professional Educational WordPress Theme.
Version: 1.3.3
Text Domain: bornomala
*/

/* ==========================================================================
   TABLE OF CONTENTS
   ==========================================================================
   1. Typography & Global Styles
   2. Layout & Wrappers
   3. Navigation & Menus
   4. Buttons & Interactive Elements
   5. Notice Board & Tabs
   6. Post Cards (News, Events, Archive)
   7. Staff & Department Profiles
   8. Media (Gallery, Video, Media Coverage)
   9. Portals (Student Login, Result Portal)
   10. Admin Options Panel (RST Panel)
   11. License & Security Block
   12. Footer Styles
   13. Utilities & Animations
   ========================================================================== */

/* ==========================================================================
   1. TYPOGRAPHY & GLOBAL STYLES
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');

@font-face {
    font-family: 'SolaimanLipi';
    src: url('./assets/fonts/SolaimanLipi.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: 'Plus Jakarta Sans', 'SolaimanLipi', sans-serif !important;
    background-color: #f1f5f9;
    color: #334155;
    line-height: 1.6;
}

::selection { 
    background: #0d6efd; 
    color: white; 
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 800;
    color: #1e293b;
}

/* ==========================================================================
   2. LAYOUT & WRAPPERS
   ========================================================================== */
.box-layout-wrapper {
    max-width: 1200px;
    margin: 0 auto;
}

.custom-scrollbar::-webkit-scrollbar { width: 6px; }
.custom-scrollbar::-webkit-scrollbar-track { background: #f8f9fa; border-radius: 4px; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #ced4da; border-radius: 4px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #adb5bd; }

html { scroll-behavior: smooth; }

/* ==========================================================================
   3. NAVIGATION & MENUS
   ========================================================================== */
.custom-menu .nav-link {
    padding: 8px 16px !important;
    border-radius: 6px;
    color: #475569;
    font-weight: 600;
    transition: all 0.2s ease-in-out;
}

.custom-menu .nav-link:hover, 
.custom-menu .nav-link.active {
    background-color: #ffffff;
    color: #0d6efd !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

/* Department Grid Menu (Sidebar/Widget) */
.dept-menu-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    padding-left: 0;
    list-style: none;
}

.dept-menu-grid li a {
    display: block;
    padding: 0.5rem;
    font-size: 13px;
    border-radius: 6px;
    background-color: rgba(255,255,255,0.1);
    color: #ffffff;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.2);
    transition: 0.3s;
}

.dept-menu-grid li a:hover {
    background-color: #ffffff;
    color: #0d6efd;
}

/* ==========================================================================
   4. BUTTONS & INTERACTIVE ELEMENTS
   ========================================================================== */
.smart-login-btn {
    padding: 8px 22px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 700;
    transition: all 0.3s ease;
    color: #fff !important;
}

.btn-student { background-color: #0d6efd; border: 1px solid #0a58ca; }
.btn-teacher { background-color: #198754; border: 1px solid #146c43; }

.btn-student:hover, .btn-teacher:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}

/* ==========================================================================
   5. NOTICE BOARD & TABS
   ========================================================================== */
.notice-tabs-nav .nav-link {
    color: #64748b;
    background-color: #f1f5f9;
    transition: 0.3s;
    font-size: 13px;
}

.notice-tabs-nav .nav-link.active {
    background-color: #0d6efd;
    color: #fff;
}

.notice-link {
    transition: 0.2s ease;
    text-decoration: none;
}

.notice-link:hover { color: #0d6efd !important; }

/* ==========================================================================
   6. POST CARDS (NEWS, EVENTS, ARCHIVE)
   ========================================================================== */
.post-card, .news-card, .event-card {
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    border-bottom: 4px solid transparent !important;
}

.post-card:hover, .news-card:hover, .event-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.08) !important;
    border-bottom-color: #0d6efd !important;
}

.transition-scale { transition: transform 0.5s ease; }
.post-card:hover .transition-scale, 
.news-card:hover .transition-scale { transform: scale(1.1); }

/* Custom Pagination */
.custom-pagination ul { display: flex; list-style: none; padding: 0; gap: 8px; justify-content: center; }
.custom-pagination ul li a, .custom-pagination ul li span {
    display: block; padding: 10px 18px; background: #fff; border: 1px solid #e2e8f0;
    border-radius: 10px; text-decoration: none; color: #0d6efd; font-weight: 700; transition: 0.3s;
}
.custom-pagination ul li span.current { background: #0d6efd; color: #fff; border-color: #0d6efd; }

/* ==========================================================================
   7. STAFF & DEPARTMENT PROFILES
   ========================================================================== */
.staff-card {
    transition: 0.3s ease;
    border: 1px solid #e2e8f0;
}

.staff-card:hover {
    background-color: #fff !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05) !important;
    transform: translateY(-5px);
    border-color: #198754 !important;
}

.staff-icon {
    width: 32px; height: 32px; border-radius: 50%; display: flex; 
    align-items: center; justify-content: center; font-size: 13px;
    text-decoration: none; transition: 0.3s; background: #f1f5f9; color: #64748b;
}
.staff-icon:hover { color: #fff; transform: scale(1.15); }
.staff-icon.call:hover { background: #198754; }
.staff-icon.mail:hover { background: #dc3545; }
.staff-icon.fb:hover { background: #0d6efd; }

/* ==========================================================================
   8. MEDIA (GALLERY, VIDEO, MEDIA COVERAGE)
   ========================================================================== */
.gallery-card .gallery-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    opacity: 0; transition: 0.4s;
}
.gallery-card:hover .gallery-overlay { opacity: 1; }

.video-card:hover img { transform: scale(1.05); opacity: 1 !important; }
.play-btn { transition: 0.3s ease; }
.play-btn:hover { transform: translate(-50%, -50%) scale(1.1); color: #dc3545 !important; }

.grayscale-hover { filter: grayscale(100%); opacity: 0.7; transition: 0.4s; }
.grayscale-hover:hover { filter: grayscale(0%); opacity: 1; transform: scale(1.05); }

/* ==========================================================================
   9. PORTALS (LOGIN & RESULT)
   ========================================================================== */
#result-search-form .form-control:focus {
    box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.15);
    background-color: #fff !important;
}

.result-table th { background-color: #f8fafc; color: #475569; font-weight: 700; }
.result-table td { color: #1e293b; font-weight: 600; }

@media print {
    .site-header, .site-footer, #result-search-form, .btn-outline-secondary { display: none !important; }
    #result-container { position: absolute; top: 0; width: 100%; }
}

/* ==========================================================================
   10. ADMIN OPTIONS PANEL (RST PANEL)
   ========================================================================== */
.rst-panel-wrap { display: flex; background: #fff; height: calc(100vh - 60px); border-radius: 8px; overflow: hidden; box-shadow: 0 5px 20px rgba(0,0,0,0.08); }
.rst-panel-sidebar { width: 250px; background: #0f172a; color: #fff; display: flex; flex-direction: column; }
.rst-panel-nav li { padding: 14px 25px; cursor: pointer; color: #94a3b8; border-left: 3px solid transparent; transition: 0.2s; }
.rst-panel-nav li.active { background: #1e293b; color: #fff; border-left-color: #3b82f6; }

/* ==========================================================================
   11. LICENSE & SECURITY BLOCK
   ========================================================================== */
.license-block-body { background: #f8fafc; height: 100vh; display: flex; align-items: center; justify-content: center; }
.license-overlay { position: fixed; inset: 0; background: rgba(15, 23, 42, 0.9); backdrop-filter: blur(10px); z-index: 99999; display: flex; align-items: center; justify-content: center; }
.license-popup { background: #fff; padding: 40px; border-radius: 20px; text-align: center; border-top: 6px solid #dc2626; box-shadow: 0 25px 50px rgba(0,0,0,0.3); }

/* ==========================================================================
   12. FOOTER STYLES
   ========================================================================== */
.custom-footer-title::after {
    content: ''; position: absolute; bottom: 0; left: 0; width: 45px; height: 2px; background-color: #0d6efd;
}

.custom-footer-menu a { transition: 0.3s; display: inline-block; text-decoration: none; color: rgba(255,255,255,0.7); }
.custom-footer-menu a:hover { color: #0d6efd !important; transform: translateX(5px); }

.mobile-circle-icon {
    display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px;
    background-color: rgba(13, 110, 253, 0.1); color: #0d6efd !important; border-radius: 50%; transition: 0.3s;
}
.mobile-circle-icon:hover { background-color: #0d6efd; color: #fff !important; transform: translateY(-5px); }

/* ==========================================================================
   13. UTILITIES & ANIMATIONS
   ========================================================================== */
.hover-primary:hover { color: #0d6efd !important; }
.hover-shadow:hover { box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade-in { animation: fadeIn 0.5s ease-in-out; }