@charset "utf-8";

:root {
    --text-main: #1f2937;
    --text-muted: #6b7280;
    --header-bg-start: #f4f5f7;
    --header-bg-end: #eceff3;
    --header-border: rgba(17, 24, 39, 0.14);
    --header-text: #111827;
    --header-text-muted: #374151;
    --header-accent: #0f172a;
}

body {
    font-family: "IBM Plex Sans", sans-serif;
    font-weight: 400;
    padding-top: 4.8rem;
    color: var(--text-main);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: "Space Grotesk", sans-serif;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.site-navbar {
    opacity: 0.97;
    background: linear-gradient(110deg, var(--header-bg-start) 0%, var(--header-bg-end) 100%);
    border-bottom: 1px solid var(--header-border);
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
}

.site-navbar .navbar-brand {
    font-family: "Space Grotesk", sans-serif;
    color: var(--header-text);
    font-weight: 700;
    letter-spacing: 0.02em;
    font-size: 1.12rem;
    position: relative;
    display: inline-block;
    transition: color 0.2s ease;
}

.site-navbar .navbar-brand:hover {
    color: var(--header-accent);
}

.site-navbar .navbar-brand::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0.1rem;
    width: 0;
    height: 0;
    border-bottom: 1px solid currentColor;
    transition: width 0.22s ease;
    opacity: 0.65;
}

.site-navbar .navbar-brand:hover::after,
.site-navbar .navbar-brand:focus-visible::after {
    width: 100%;
}

.site-navbar .navbar-toggler {
    color: var(--header-text);
    border: 1px solid rgba(17, 24, 39, 0.24);
}

.site-navbar .nav-link {
    color: var(--header-text-muted);
    font-weight: 500;
    letter-spacing: 0.01em;
    transition: color 0.2s ease;
    padding-top: 0.42rem;
    padding-bottom: 0.42rem;
    position: relative;
    display: inline-block;
}

.site-navbar .nav-link:hover,
.site-navbar .nav-item.active .nav-link {
    color: var(--header-accent);
}

.site-navbar .nav-link::after {
    content: "";
    position: absolute;
    left: 0.5rem;
    width: 0;
    bottom: 0.25rem;
    height: 0;
    border-bottom: 1px solid currentColor;
    transition: width 0.22s ease;
    opacity: 0.6;
}

.site-navbar .nav-link:hover::after,
.site-navbar .nav-link:focus-visible::after,
.site-navbar .nav-item.active .nav-link::after {
    width: calc(100% - 1rem);
}

.card {
    border-radius: 0.8rem!important;
}

.card-img-overlay {
    border-radius: 0.8rem!important;
}

.rounded-xl {
    border-radius: 0.8rem!important;
}

.rounded-xl-bottom {
    border-bottom-right-radius: 0.8rem !important;
    border-bottom-left-radius: 0.8rem !important;
}

.rounded-xl-top {
    border-top-left-radius: 0.8rem !important;
    border-top-right-radius: 0.8rem !important;
}


.text-profile-position {
    font-weight: 400;
}

.text-profile-bio {
    /* font-family: "Raleway"; */
    font-weight: 400;
}

.navbar {
    opacity: 0.95;
}

.inline-badge {
    height: 16px;
    vertical-align: -10%;
    margin-right: 2px;
    line-break: unset;
}

/* Homepage card spacing and typography tuning */
.homepage-card {
    margin: 0.75rem 0.35rem 1rem;
}

.homepage-card .card-body {
    padding: 1.65rem !important;
}

.homepage-card-content {
    font-size: 1.04rem;
    line-height: 1.56;
}

.homepage-card-content .small {
    font-size: 0.95rem;
}

.homepage-card-content .institution-name {
    font-size: 1rem;
}

/* Slightly smaller text scale for the About Me card */
.about-me-card-content {
    font-size: 0.99rem;
    line-height: 1.54;
}

.about-me-card-content .h3 {
    font-size: 1.12rem;
}

/* Match News/Education/Experience/Scholarships to a clearer text size */
.profile-list-card-content {
    font-size: 1rem;
    line-height: 1.55;
}

.profile-list-card-content h6 {
    font-size: 1.12rem;
}

.publication-card-heading {
    font-size: 1.12rem;
}

.profile-list-card-content .small {
    font-size: 1rem;
}

.profile-list-card-content .institution-name {
    font-size: 1rem;
    font-weight: 700;
}

/* Logo spacing for Education/Experience/Scholarships entries */
.institution-entry-logo {
    margin-left: 0.5rem;
    margin-right: 1.05rem;
    flex-shrink: 0;
    object-fit: contain;
}

.institution-entry-item {
    margin-bottom: 0.9rem !important;
}

.institution-entry-item:last-child {
    margin-bottom: 0 !important;
}

.institution-entry-date {
    font-size: 0.82rem;
    display: block;
    margin-top: -0.12rem;
    margin-bottom: 0.06rem;
    color: var(--text-muted);
}

.institution-entry-date + .small {
    margin-top: -0.08rem;
}

.institution-entry-position {
    display: block;
    width: 100%;
}

/* Compact two-line styling for positions in the mini profile card */
.mini-position-list {
    max-width: 16rem;
    margin: 0 auto;
}

.mini-position-entry {
    margin-bottom: 0;
}

.mini-position-role {
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.2;
    color: var(--text-main);
    text-align: left;
}

.mini-position-institution-row {
    display: flex;
    align-items: center;
    margin-top: 0.14rem;
    line-height: 1.2;
    text-align: left;
}

.mini-position-logo {
    height: auto;
    max-height: 28px;
    object-fit: contain;
    flex-shrink: 0;
}

.mini-position-logo-slot {
    width: var(--mini-position-logo-slot-width, 28px);
    margin-right: 0.35rem;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.mini-position-institution {
    font-size: 0.8rem;
    color: var(--text-muted);
}

.mini-social-icons {
    font-size: 1.75rem;
    line-height: 1;
}

.mini-social-icons a {
    color: #1f6feb;
}

.mini-social-icons a:hover {
    color: #0f4fc7;
}

.mini-email-display {
    font-size: 0.78rem;
    color: #1f6feb;
}

.mini-email-display:hover {
    color: #0f4fc7;
}

/* Automatic news bullets with hanging indent for wrapped lines */
.news-bullet-item {
    position: relative;
    padding-left: 1.1rem;
    line-height: 1.45;
}

.news-bullet-item::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0;
    color: inherit;
}

@media (max-width: 767.98px) {
    .homepage-card {
        margin: 0.6rem 0 0.9rem;
    }

    .homepage-card .card-body {
        padding: 1.3rem !important;
    }
}

.no-break {
    white-space: nowrap;
}

.cover-image {
    width: 180px;
    max-height: 120px;
}

.abstract-body {
    min-height: 100px;
}

img.lazy {
    background-image: url('images/loading.gif');
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 50px 50px;
    min-height: 80px;
}

div.lazy {
    background-image: url('images/loading.gif');
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 50px 50px;
    min-height: 80px;
}

.badge-publication {
    font-size: 100%;
}

/* Publication styling customizations */
.abstract-links {
    font-size: 0.95rem; /* Slightly bigger than default small text */
}

.abstract-links a {
    font-weight: 400;
}

.publication-image-col {
    max-width: 40%; /* Set image column to exactly 40% width */
}

@media (min-width: 768px) {
    .publication-image-col {
        flex: 0 0 40%;
    }
}

/* Emoji bullet point styling with hanging indent */
.publication-details .publication-line {
    display: block !important;
    text-indent: -1.5em !important;
    padding-left: 1.5em !important;
    margin-bottom: 0.25rem !important;
    line-height: 1.4 !important;
}

/* Ensure hanging indent works with Bootstrap paragraphs */
.publication-details p.publication-line {
    text-indent: -1.5em !important;
    padding-left: 1.5em !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
}

/* Additional safeguards for publication formatting */
.publication-details {
    text-align: left;
}

.publication-details .publication-line * {
    text-indent: 0 !important;
}

/* Mobile publication image styling */
.publication-mobile-image {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

.publication-mobile-image img,
.publication-mobile-image svg {
    max-width: 100%;
    height: auto;
    max-height: 200px;
    object-fit: contain;
}

/* Custom publication title sizing - between h5 and h6 */
.publication-title {
    font-size: 1.125rem !important; /* Between h5 (1.25rem) and h6 (1rem) */
}

.email-text {
    font-family: Source Code Pro, monospace;
}
