@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root { --ink:#0a192f; --blue:#0052cc; --blue-dark:#003d9b; --pale:#e1f0ff; --canvas:#f7f9fb; --line:#e2e8f0; --muted:#64748b; }
* { box-sizing:border-box; }
body.resources-page { margin:0; background:var(--canvas); color:#191c1e; font-family:Inter,Arial,sans-serif; min-height:100vh; }
body.resources-page > header { background:rgba(255,255,255,.94); color:var(--ink); padding:13px 24px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--line); text-align:left; }
.resources-page .logo-container { display:flex; align-items:center; gap:10px; margin:0; min-width:max-content; }
.resources-page .logo-container img { width:42px; max-width:42px; height:42px; object-fit:contain; }
.resources-page .logo-container h1 { display:block; margin:0; color:var(--blue-dark); font-size:18px; line-height:1; text-align:left; }
.resources-page .logo-container h3 { display:none; }
.resources-page .navbar { background:transparent; display:flex; justify-content:flex-end; align-items:center; flex-wrap:wrap; gap:2px; overflow:visible; }
.resources-page .navbar a, .resources-page .dropdown .dropbtn { color:#334155; padding:9px 11px; font-size:13px; border-radius:5px; background:transparent; }
.resources-page .navbar a:hover, .resources-page .dropdown:hover .dropbtn { color:var(--blue-dark); background:#e6efff; }
.resources-page .navbar a.active, .resources-page .dropdown .dropbtn.active { color:var(--blue-dark); background:#cfe0fc; }
.resources-page .navbar .admin-login-link, .resources-page .navbar a[onclick] { display:none; }
.resources-page .navbar > a:not(:first-child), .resources-page .navbar > .dropdown { display:none; }
.resources-page .home-nav-item > a { border:1px solid var(--blue-dark); }
.resources-page .home-nav-item { display:flex; align-items:center; gap:8px; }
.resources-page .home-nav-item .theme-toggle { display:inline-flex; align-items:center; gap:7px; min-height:32px; padding:5px 10px 5px 8px; border:1px solid #b8cceb; border-radius:999px; background:#f5f8fc; color:#52627a; font:600 12px Inter,Arial,sans-serif; cursor:pointer; transition:background .25s, border-color .25s, color .25s, transform .15s; }
.resources-page .home-nav-item .theme-toggle i { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#fff; color:#e09f18; box-shadow:0 1px 3px rgba(15,23,42,.15); transition:transform .35s cubic-bezier(.2,.8,.2,1), background .25s, color .25s; }
.resources-page .home-nav-item .theme-toggle i.fa-sun { transform:rotate(180deg); }
.resources-page .home-nav-item .theme-toggle:active { transform:scale(.96); }
.resources-page .home-nav-item .theme-toggle:hover { color:var(--blue-dark); background:#e6efff; }
.resources-page .dropdown-content { right:auto; min-width:190px; }

.container { width:min(100%, 1240px); margin:0 auto; padding:0 24px; }
.container:first-of-type { width:100%; max-width:none; padding:0; }
.search-section { min-height:360px; padding:68px 24px 60px; text-align:center; background:radial-gradient(circle at 50% 0%, #edf5ff 0%, #dceaff 42%, #f7f9fb 100%); border:1px solid #e3edf9; border-top:0; border-radius:0 0 34px 34px; }
.search-header { max-width:680px; margin:0 auto 34px; }
.hub-kicker { display:inline-block; padding:6px 15px; margin-bottom:15px; border-radius:999px; background:#0b59d5; color:#fff; text-transform:uppercase; font-size:12px; font-weight:600; letter-spacing:.08em; }
.search-header h1 { margin:0 0 13px; color:#101820; font-size:36px; letter-spacing:-.03em; line-height:1.1; }
.search-subtitle { margin:0; color:#334155; font-size:15px; line-height:1.6; }
.search-container { max-width:680px; margin:0 auto; }
.search-form { display:flex; gap:0; padding:4px; background:#fff; border:1px solid #dbe5f1; border-radius:9px; box-shadow:0 12px 26px rgba(16,55,115,.12); }
.search-input-wrapper { position:relative; flex:1; display:flex; align-items:center; }
.search-icon { position:absolute; left:16px; color:var(--blue); }
.search-input { width:100%; min-width:0; border:0; outline:0; padding:15px 14px 15px 43px; color:var(--ink); background:transparent; font:400 15px Inter,Arial,sans-serif; }
.search-input::placeholder { color:#778195; }
.search-buttons-wrapper { display:flex; gap:5px; }
.search-submit-btn, .view-all-btn, .download-btn, .btn { border:0; border-radius:5px; background:var(--blue-dark); color:#fff; padding:12px 18px; font:600 14px Inter,Arial,sans-serif; text-decoration:none; cursor:pointer; white-space:nowrap; transition:background .2s,transform .2s,box-shadow .2s; }
.search-submit-btn:hover, .download-btn:hover, .btn:hover { background:#002e75; transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,61,155,.18); }
.view-all-btn { display:flex; align-items:center; background:#edf3fc; color:var(--blue-dark); }
.view-all-btn:hover { background:#dae7fb; }
.resource-action-buttons { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:14px; }
.resource-request-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 16px; border:1px solid #b8cceb; border-radius:6px; background:#fff; color:var(--blue-dark); font:600 13px Inter,Arial,sans-serif; text-decoration:none; transition:background .2s,transform .2s,box-shadow .2s; }
.resource-request-btn:hover { background:#edf3fc; transform:translateY(-1px); box-shadow:0 5px 14px rgba(0,61,155,.14); }
.admin-login-btn { background:var(--blue-dark); border-color:var(--blue-dark); color:#fff; }
.admin-login-btn:hover { background:#002e75; }
.results-count { max-width:680px; margin:15px auto 0; color:#516078; font-size:13px; }

.main-layout { display:flex; flex-direction:column; gap:0; padding:38px 0 64px; }
.sidebar-right { order:1; }
.sidebar-left { order:2; }
.main-content { order:3; }
.sidebar-right .category-section { margin:0 0 24px; }
.category-section-title { display:flex; align-items:center; gap:12px; margin:0 0 13px; color:#172033; font-size:19px; font-weight:600; }
.category-section-title small { display:none !important; }
.category-cards-list { display:flex; flex-wrap:wrap; gap:8px; }
.category-card { display:flex; align-items:center; gap:7px; padding:9px 14px; border:1px solid transparent; border-radius:999px; background:#e9edf2; color:#19202a; cursor:pointer; transition:all .2s; }
.category-card:hover, .category-card.active-category { color:#fff; border-color:var(--blue-dark); background:var(--blue-dark); }
.category-card .category-icon { display:grid; place-items:center; width:auto !important; height:auto !important; color:inherit !important; background:transparent !important; font-size:14px; }
.category-card .category-content { display:flex; align-items:center; gap:5px; }
.category-card .category-name { margin:0; font-size:13px; font-weight:500; }
.category-card .category-count, .category-arrow { display:none; }
.view-all-card { order:-1; background:var(--blue-dark); color:#fff; }

.sidebar-left { margin:9px 0 31px; background:#f0f3f7; border:1px solid #e8edf3; border-radius:9px; }
.filter-section { padding:16px 20px; }
.filter-title { display:none; }
.filter-form { display:flex; align-items:end; gap:14px; flex-wrap:wrap; }
.filter-group { flex:1 1 190px; }
.filter-group label { display:block; margin:0 0 6px; color:#64748b; font-size:12px; font-weight:500; }
.filter-group select { width:100%; appearance:auto; border:1px solid #dfe6ee; border-radius:5px; background:#fff; color:#253046; padding:10px 12px; font:400 13px Inter,Arial,sans-serif; outline-color:var(--blue); }
.filter-buttons { display:flex; gap:8px; }
.filter-buttons .btn { padding:10px 15px; }
.filter-buttons .btn-secondary { background:#fff; color:var(--blue-dark); border:1px solid #ccd8e7; }

.resources-header { display:flex; align-items:center; justify-content:center; margin:0 0 19px; padding:16px 20px; background:var(--blue-dark); border-radius:16px; }
.resources-header h2 { margin:0; color:#fff; font-size:20px; font-weight:700; text-align:center; }

.resources-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.resource-card { display:flex; flex-direction:column; min-height:286px; position:relative; overflow:hidden; padding:21px; background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 2px 5px rgba(15,23,42,.05); transition:transform .2s,box-shadow .2s,border .2s; }
.resource-card:hover { transform:translateY(-3px); border-color:#cbdcf7; box-shadow:0 14px 26px rgba(15,55,120,.1); }
.resource-category-badge { order:0; align-self:flex-start; margin-bottom:15px; padding:4px 8px; border-radius:3px; background:#d9e7ff; color:#124aab; text-transform:uppercase; font-size:10px; font-weight:600; letter-spacing:.07em; }
.resource-preview { height:150px; margin:0 -21px 17px; overflow:hidden; background:#eef3f9; border-bottom:1px solid #dbe5f1; }
.pdf-preview-canvas { display:block; width:100%; min-height:100%; object-fit:cover; object-position:top center; opacity:0; transition:opacity .2s; }
.pdf-preview-canvas.is-loaded { opacity:1; }
.image-preview img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.pdf-preview-fallback { display:flex; height:100%; align-items:center; justify-content:center; gap:8px; flex-direction:column; color:#b42318; font-size:12px; }
.pdf-preview-fallback i { font-size:30px; }
.resource-icon { position:absolute; top:20px; right:20px; display:grid; place-items:center; width:29px; height:29px; border-radius:5px; color:#fff; font-size:14px; box-shadow:none !important; }
.resource-icon .thumbnail { width:100%; height:100%; object-fit:cover; border-radius:5px; }
.resource-content { display:flex; flex:1; flex-direction:column; }
.resource-title { margin:0 28px 8px 0; color:#101820; font-size:17px; font-weight:600; line-height:1.4; }
.resource-description { display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; -webkit-line-clamp:3; color:#536176; font-size:13px; line-height:1.5; }
.resource-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:16px; border-top:1px solid #edf0f4; }
.resource-actions { display:flex; align-items:center; gap:5px; }
.resource-action-btn { display:inline-flex; align-items:center; gap:5px; padding:8px 9px; border:1px solid #d7e0ec; border-radius:5px; background:#f7f9fc; color:#40516a; font:600 11px Inter,Arial,sans-serif; cursor:pointer; transition:background .2s, color .2s, border-color .2s, transform .2s; }
.resource-action-btn:hover { border-color:#b8cceb; background:#edf3fc; color:var(--blue-dark); transform:translateY(-1px); }
.resource-meta { color:#667085; font-size:12px; }
.resource-meta i { color:var(--blue); }
.download-btn { padding:9px 12px; font-size:12px; }
.no-resources { padding:42px 24px; text-align:center; background:#fff; border:1px dashed #cbd5e1; border-radius:8px; color:#64748b; }
.no-resources a { color:var(--blue); }
.pagination-container { margin-top:34px; }
.pagination { display:flex; justify-content:center; gap:7px; padding:0; margin:0; list-style:none; }
.page-link { display:grid; place-items:center; min-width:37px; height:37px; padding:0 10px; color:#27364e; text-decoration:none; border-radius:5px; background:#edf0f4; font-size:13px; }
.page-item.active .page-link, .page-link:hover { background:var(--blue-dark); color:#fff; }
.resources-page footer { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0; padding:25px max(24px,calc((100vw - 1192px)/2)); background:#f0f3f7; color:#536176; font-size:12px; text-align:left; }
.resources-page footer p { margin:0; }

body.resources-page.dark-mode { --ink:#e8eef7; --blue:#66a3ff; --blue-dark:#8bb9ff; --pale:#1b2b43; --canvas:#101722; --line:#2a394d; --muted:#aab8ca; background:var(--canvas); color:#e8eef7; }
.resources-page.dark-mode > header { background:#162234; border-color:var(--line); }
.resources-page.dark-mode .logo-container h1 { color:#b7d3ff; }
.resources-page.dark-mode .navbar a, .resources-page.dark-mode .dropdown .dropbtn { color:#d2deed; }
.resources-page.dark-mode .home-nav-item > a { border-color:#8bb9ff; }
.resources-page.dark-mode .home-nav-item .theme-toggle { color:#d2deed; border-color:#8bb9ff; background:#202f43; }
.resources-page.dark-mode .home-nav-item .theme-toggle i { background:#8bb9ff; color:#10233e; }
.resources-page.dark-mode .home-nav-item .theme-toggle:hover { color:#fff; background:#263b58; }
.resources-page.dark-mode .search-section { background:radial-gradient(circle at 50% 0%, #1e3554 0%, #17283f 42%, #101722 100%); border-color:#2b405d; }
.resources-page.dark-mode .search-header h1, .resources-page.dark-mode .search-subtitle { color:#edf4ff; }
.resources-page.dark-mode .search-form, .resources-page.dark-mode .resource-card, .resources-page.dark-mode .no-resources { background:#182536; border-color:var(--line); }
.resources-page.dark-mode .search-input, .resources-page.dark-mode .resource-title { color:#edf4ff; }
.resources-page.dark-mode .search-input::placeholder, .resources-page.dark-mode .resource-description, .resources-page.dark-mode .results-count { color:#aab8ca; }
.resources-page.dark-mode .resource-request-btn,
.resources-page.dark-mode .admin-login-btn,
.resources-page.dark-mode .search-submit-btn,
.resources-page.dark-mode .download-btn,
.resources-page.dark-mode .btn-primary { background:#06234b; border-color:#06234b; color:#fff; }
.resources-page.dark-mode .resource-request-btn:hover,
.resources-page.dark-mode .admin-login-btn:hover,
.resources-page.dark-mode .search-submit-btn:hover,
.resources-page.dark-mode .download-btn:hover,
.resources-page.dark-mode .btn-primary:hover { background:#0b3b78; border-color:#0b3b78; color:#fff; }
.resources-page.dark-mode .view-all-btn { background:#263448; color:#fff; border-color:#40516a; }
.resources-page.dark-mode .view-all-btn:hover { background:#315b91; color:#fff; }
.resources-page.dark-mode .category-section-title { color:#fff; font-weight:700; }
.resources-page.dark-mode .category-card { background:#263448; color:#dce7f5; }
.resources-page.dark-mode .category-card:hover, .resources-page.dark-mode .category-card.active-category, .resources-page.dark-mode .view-all-card { background:#315b91; color:#fff; }
.resources-page.dark-mode .sidebar-left { background:#182536; border-color:var(--line); }
.resources-page.dark-mode .filter-group label, .resources-page.dark-mode .no-resources { color:#aab8ca; }
.resources-page.dark-mode .filter-group select, .resources-page.dark-mode .filter-buttons .btn-secondary { background:#202f43; border-color:#40516a; color:#e8eef7; }
.resources-page.dark-mode .resource-category-badge { background:#294b75; color:#cfe1ff; }
.resources-page.dark-mode .resource-footer { border-color:#2a394d; }
.resources-page.dark-mode .resource-action-btn { border-color:#40516a; background:#202f43; color:#dce7f5; }
.resources-page.dark-mode .resource-action-btn:hover { border-color:#8bb9ff; background:#263b58; color:#fff; }
.resources-page.dark-mode .resources-header { background:#06234b; }
.resources-page.dark-mode .resources-header h2 { color:#fff; font-weight:700; }
.resources-page.dark-mode .page-link { background:#263448; border:1px solid #40516a; color:#dce7f5; }
.resources-page.dark-mode .page-item.active .page-link { background:#0b59d5; border-color:#66a3ff; color:#fff; font-weight:700; box-shadow:0 0 0 2px rgba(102,163,255,.35); }
.resources-page.dark-mode .page-link:hover { background:#315b91; border-color:#8bb9ff; color:#fff; }
.resources-page.dark-mode footer { background:#162234; color:#aab8ca; }

@media (max-width:900px) { .resources-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .resources-page > header { align-items:flex-start; } .resources-page .navbar { justify-content:flex-start; } }
@media (max-width:650px) { body.resources-page > header { padding:12px 16px; display:block; } .resources-page .logo-container { margin-bottom:10px; } .resources-page .navbar { justify-content:flex-start; } .resources-page .navbar a, .resources-page .dropdown .dropbtn { padding:7px 8px; font-size:12px; } .container { padding:0 16px; } .search-section { min-height:auto; padding:48px 16px; border-radius:0 0 24px 24px; } .search-header h1 { font-size:30px; } .search-form { flex-direction:column; } .search-buttons-wrapper { display:grid; grid-template-columns:1fr 1fr; } .search-submit-btn, .view-all-btn { justify-content:center; } .filter-form { display:grid; grid-template-columns:1fr; } .filter-buttons { display:grid; grid-template-columns:1fr 1fr; } .resources-header { display:block; } .resources-header p { margin-top:5px; } .resources-grid { grid-template-columns:1fr; } .resources-page footer { display:block; padding:22px 16px; } .resources-page footer p + p { margin-top:6px; } }