/* ============================================================ THEME: MODERN ============================================================ A deliberately different visual language from the "Classic" navy/gold academic theme: bold geometric type, a warm light background instead of navy, gradient pill buttons, floating rounded-pill navigation, a centered avatar-first hero, and soft colorful cards instead of thin gray-bordered ones. Reuses the exact same HTML/class names as public.css (the Classic theme) — every page template, every piece of content, works unchanged. Only the look changes. Applied by adding class="theme-modern" to (done in includes/header.php based on the professor's saved theme_name). Uses the SAME --primary / --gold CSS variables as Classic, so a professor's custom accent-color picker still personalizes this theme too — these defaults are just very different ones. ============================================================ */ body.theme-modern{ --navy:#1e1b3a; --text-dark:#211f36; --text-muted:#6b6685; --bg-soft:#f7f5ff; --radius:22px; background:#fffaf6; font-family:'Inter', sans-serif; } body.theme-modern h1, body.theme-modern h2, body.theme-modern h3, body.theme-modern h4{ font-family:'Space Grotesk', sans-serif; letter-spacing:-.01em; } /* ===== Hide the classic top information strip — modern header replaces it ===== */ body.theme-modern .top-strip{ display:none; } /* ===== Floating pill navigation ===== */ body.theme-modern .site-header{ background:transparent; border-bottom:none; position:sticky; top:0; z-index:1030; padding:1rem 0 0; } body.theme-modern .site-header > .container-fluid{ background:#fff; border-radius:100px; box-shadow:0 10px 34px rgba(79,70,229,.12); max-width:1180px; margin:0 auto; padding:.4rem 1.4rem !important; } body.theme-modern .brand-monogram{ background:linear-gradient(135deg, var(--primary), var(--gold)); color:#fff; border-radius:14px; } body.theme-modern .brand-name{ font-family:'Space Grotesk', sans-serif; font-weight:700; } body.theme-modern .main-nav a{ border-bottom:none; border-radius:100px; padding:.55rem 1rem; font-weight:600; } body.theme-modern .main-nav a.active, body.theme-modern .main-nav a:hover{ background:var(--bg-soft); color:var(--primary); } body.theme-modern .main-nav .btn-primary{ background:linear-gradient(135deg, var(--primary), var(--gold)); border:none; border-radius:100px; box-shadow:0 6px 16px rgba(79,70,229,.3); } body.theme-modern .nav-more-dropdown .dropdown-menu{ border-radius:20px; } body.theme-modern .dropdown-item-icon{ border-radius:12px; } /* ===== Buttons: pill + gradient everywhere ===== */ body.theme-modern .btn-primary{ background:linear-gradient(135deg, var(--primary), var(--gold)); border:none; border-radius:100px; font-weight:600; box-shadow:0 8px 20px rgba(79,70,229,.25); } body.theme-modern .btn-primary:hover{ filter:brightness(1.06); } body.theme-modern .btn-gold{ background:linear-gradient(135deg, var(--gold), #ffb199); border:none; border-radius:100px; font-weight:600; } body.theme-modern .btn-outline-primary{ border-radius:100px; border-width:2px; font-weight:600; } body.theme-modern .btn-light-outline{ border-radius:100px; } body.theme-modern .btn-sm{ border-radius:100px; } /* ===== Hero: centered avatar-first layout ===== */ body.theme-modern .home-hero{ background:radial-gradient(circle at 15% 20%, rgba(79,70,229,.10), transparent 45%), radial-gradient(circle at 85% 10%, rgba(255,107,74,.12), transparent 40%); } body.theme-modern .home-hero .row{ flex-direction:column-reverse; text-align:center; } body.theme-modern .home-hero .col-lg-6:first-child{ display:flex; flex-direction:column; align-items:center; } body.theme-modern .home-hero-sub{ margin-left:auto; margin-right:auto; } body.theme-modern .hero-social{ justify-content:center; } body.theme-modern .home-hero .d-flex.flex-wrap.gap-3{ justify-content:center; } body.theme-modern .home-hero-title{ font-size:3.1rem; background:linear-gradient(135deg, var(--navy), var(--primary)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; } body.theme-modern .section-kicker{ color:var(--primary); background:var(--bg-soft); padding:.35rem .9rem; border-radius:100px; } body.theme-modern .hero-illustration{ border-radius:50% !important; max-width:220px; border:6px solid #fff; box-shadow:0 20px 50px rgba(79,70,229,.25); } /* ===== Stats bar: floating pill badges instead of a dark strip ===== */ body.theme-modern .stats-bar{ background:transparent; padding:1.5rem 0 3rem; } body.theme-modern .stat-block{ background:#fff; border-radius:20px; padding:1.3rem 1rem; box-shadow:0 10px 26px rgba(79,70,229,.08); } body.theme-modern .stat-block i{ color:var(--gold); } body.theme-modern .stat-block-num{ color:var(--navy); font-family:'Space Grotesk', sans-serif; } body.theme-modern .stat-block-label{ color:var(--text-muted); } /* ===== Cards: soft, rounded, colorful — one grouped rule covers every card type ===== */ body.theme-modern .content-card, body.theme-modern .side-card, body.theme-modern .profile-side-card, body.theme-modern .research-mini-card, body.theme-modern .pub-mini-card, body.theme-modern .split-card, body.theme-modern .press-mini-card, body.theme-modern .research-detail-card, body.theme-modern .phd-card, body.theme-modern .pub-list-item, body.theme-modern .book-card .book-card, body.theme-modern .patent-item, body.theme-modern .event-item, body.theme-modern .membership-card, body.theme-modern .press-full-card, body.theme-modern .resource-card, body.theme-modern .empty-notice{ border:none !important; border-radius:20px !important; box-shadow:0 8px 24px rgba(79,70,229,.08); } body.theme-modern .research-mini-card:hover, body.theme-modern .press-mini-card:hover, body.theme-modern .press-full-card:hover, body.theme-modern .resource-card:hover{ box-shadow:0 16px 34px rgba(79,70,229,.16) !important; } body.theme-modern .research-detail-card{ border-top:none !important; position:relative; overflow:hidden; } body.theme-modern .research-detail-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:6px; background:linear-gradient(90deg, var(--primary), var(--gold)); } body.theme-modern .research-detail-icon, body.theme-modern .split-card-icon, body.theme-modern .patent-icon, body.theme-modern .membership-icon, body.theme-modern .pub-list-icon{ border-radius:14px !important; } body.theme-modern .split-card-icon{ background:var(--bg-soft); color:var(--primary); border-radius:16px; padding:.6rem; width:52px; height:52px; display:flex; align-items:center; justify-content:center; } /* ===== Section titles ===== */ body.theme-modern .section-title{ font-weight:700; } body.theme-modern .bg-soft-section{ background:var(--bg-soft); } /* ===== Page header banner: gradient instead of flat navy ===== */ body.theme-modern .page-header-banner{ background:linear-gradient(120deg, var(--primary) 0%, var(--gold) 100%); border-radius:0 0 40px 40px; } body.theme-modern .page-header-stats strong{ font-family:'Space Grotesk', sans-serif; } /* ===== Breadcrumb ===== */ body.theme-modern .breadcrumb-bar{ background:transparent; border-bottom:none; } body.theme-modern .breadcrumb-bar .breadcrumb{ padding-top:1.2rem; } /* ===== Sidebar profile card ===== */ body.theme-modern .profile-side-photo{ border-color:var(--bg-soft); } body.theme-modern .profile-side-stats strong{ font-family:'Space Grotesk', sans-serif; color:var(--primary); } body.theme-modern .tag-chip{ border-radius:100px; background:var(--bg-soft); border:none; } body.theme-modern .tag-chip:hover{ background:var(--primary); } /* ===== Timeline ===== */ body.theme-modern .timeline::before{ background:var(--bg-soft); width:3px; } body.theme-modern .timeline-dot{ box-shadow:0 0 0 4px #fff, 0 0 0 6px var(--bg-soft); } /* ===== Filter pills ===== */ body.theme-modern .phd-filter-pills .nav-link{ border-radius:100px; border:none; background:var(--bg-soft); } body.theme-modern .phd-filter-pills .nav-link.active{ background:linear-gradient(135deg, var(--primary), var(--gold)); color:#fff; } body.theme-modern .level-badge, body.theme-modern .status-badge, body.theme-modern .index-chip, body.theme-modern .pub-type-badge, body.theme-modern .resource-type-badge, body.theme-modern .post-category{ border-radius:100px !important; } /* ===== CTA banner ===== */ body.theme-modern .cta-banner{ background:linear-gradient(120deg, var(--navy) 0%, var(--primary) 55%, var(--gold) 130%); border-radius:32px; } /* ===== Gallery / resource thumbs ===== */ body.theme-modern .gallery-tile{ border-radius:18px; } body.theme-modern .resource-thumb{ border-radius:20px 20px 0 0; } body.theme-modern .book-card img{ border-radius:14px; } /* ===== Footer: deep indigo instead of navy, tighter and more minimal ===== */ body.theme-modern .site-footer{ background:var(--navy); border-radius:40px 40px 0 0; margin-top:2rem; } body.theme-modern .footer-social a{ border-radius:12px; } body.theme-modern .footer-social a:hover{ background:var(--gold); } body.theme-modern .footer-bottom-bar{ background:transparent; border-top:1px solid rgba(255,255,255,.08); } /* ===== Forms ===== */ body.theme-modern .form-control, body.theme-modern .form-select{ border-radius:14px; } body.theme-modern .alert{ border-radius:16px; }