/* main.css — IEEE-style workshop theme
 *
 * Fonts:  'Source Serif 4',serif  — body / headings / schedule
 *         'Roboto',sans-serif    — navigation bar, footer, UI
 * Colors:
 *   #032b5a            : IEEE blue (logo, current nav, site title)
 *   #0b5cad            : links and hover
 *   #1a1a2e            : dark text (nav links on white bg)
 *   #f5f6f7            : page background
 *   #1c1c1c            : body text
 */

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400&family=Source+Serif+4:ital,opsz,wght@0,8..60,400..700;1,8..60,400..700&display=swap');

*{
    border:0;
    font:inherit;
    font-size:1em;
    margin:0;
    padding:0;
    vertical-align:baseline;
    box-sizing:border-box;
}

body{
    background-color:#f5f6f7;
    color:#1c1c1c;
    font-family:'Source Serif 4',Georgia,'Times New Roman',serif;
    font-size:20px; /* ---------- Main body size ---------- */
    line-height:1.6;
    text-align:left;
}

a{color:#0b5cad; text-decoration:none;}
a:hover{color:#084a8a; text-decoration:underline;}

/* ---------- top navigation bar (white background) ---------- */
.navbar{
    position:sticky; top:0; z-index:100;
    display:flex; align-items:center; flex-wrap:wrap;
    gap:10px 18px;
    min-height:50px;
    padding:2px 28px;
    background:#ffffff;
    font-family:'Roboto',sans-serif;
    box-shadow:0 1px 6px rgba(0,0,0,.12);
    border-bottom:1px solid #e2e5e9;
}
.brand{display:flex; align-items:center; gap:14px;}
.brand:hover{text-decoration:none;}
.logo-img {display: block; height: 56px; width: auto; margin: 0 auto;}
.site-title{color:#032b5a; font-weight:700; font-size:1.3em; letter-spacing:.3px;}

.nav{margin-left:auto; display:flex; align-items:center; gap:8px 26px; flex-wrap:wrap;}
.nav > a, .nav-links > a, .dropbtn{
    color:#1a1a2e; text-decoration:none; font-size:1.3em;
    background:none; cursor:pointer; padding:18px 0;
}
.nav > a:hover, .nav-links > a:hover, .dropbtn:hover{color:#0b5cad; text-decoration:none;}
.nav > a.current, .nav-links > a.current{color:#032b5a; font-weight:700;}
.caret{font-size:.8em; display:inline-block; margin-left:2px;}

.dropdown{position:relative; display:inline-block;}
.dropdown-content{
    display:none; position:absolute; right:0; top:100%;
    background:#fff; min-width:190px;
    box-shadow:0 6px 16px rgba(0,0,0,.25);
    border-radius:0 0 4px 4px; z-index:110;
}
.dropdown-content a{display:block; padding:10px 18px; color:#0b5cad; font-size:.95em;}
.dropdown-content a:hover{background:#eef6fc; text-decoration:none;}
.dropdown-content a.current{background:#eef6fc; color:#084a8a; font-weight:700;}
.dropdown:hover .dropdown-content{display:block;}

.search-btn{background:none; cursor:pointer; display:flex; align-items:center; padding:4px;}
.search-btn svg{width:19px; height:19px; fill:none; stroke:#1a1a2e; stroke-width:2; stroke-linecap:round;}

/* search box opened by the magnifier button */
.search-box{display:none; position:relative;}
.search-box.open{display:flex; align-items:center;}
.search-box input{
    font-family:'Roboto',sans-serif; font-size:.95em;
    padding:6px 10px; width:190px;
    border:1px solid #d0d5da; border-radius:3px; outline:none;
    background:#f8f9fa;
}
.search-results{
    display:none; position:absolute; top:100%; right:0; margin-top:8px;
    background:#fff; width:300px; max-height:340px; overflow:auto;
    box-shadow:0 6px 16px rgba(0,0,0,.25); border-radius:4px; z-index:120;
}
.search-box input:not(:placeholder-shown) ~ .search-results{display:block;}
.search-results a{display:block; padding:8px 14px; color:#1c1c1c; font-size:.85em;}
.search-results a:hover{background:#eef6fc; text-decoration:none;}
.sr-title{display:block; color:#0b5cad; font-weight:700;}
.sr-snippet{display:block; color:#66707a; font-size:.9em;}
.sr-empty{display:block; padding:10px 14px; color:#66707a; font-size:.85em;}

/* ---------- hamburger menu (mobile) ---------- */
.menu-toggle{
    display:none;
    background:none; border:none; cursor:pointer;
    flex-direction:column; justify-content:center; align-items:center;
    gap:5px; padding:8px; width:40px; height:40px;
}
.menu-toggle .bar{
    display:block; width:24px; height:2.5px;
    background:#1a1a2e; border-radius:1px;
    transition: transform 0.25s ease, opacity 0.25s ease;
}
.menu-toggle[aria-expanded="true"] .bar:nth-child(1){
    transform: translateY(7.5px) rotate(45deg);
}
.menu-toggle[aria-expanded="true"] .bar:nth-child(2){
    opacity:0;
}
.menu-toggle[aria-expanded="true"] .bar:nth-child(3){
    transform: translateY(-7.5px) rotate(-45deg);
}

.nav-links{
    display:flex; align-items:center; gap:8px 26px; flex-wrap:wrap;
}

/* ---------- hero banner ---------- */
.hero{position:relative; overflow:hidden;}
.hero img{display:block; width:100%; height:520px; object-fit:cover;}
.hero::before{
    content:'';
    position:absolute; top:0; left:0; right:0; bottom:0;
    background:rgba(0,0,0,.50);   /* 黑色 45% 透明度，可调 */
    z-index:1;
}
.hero-title{
    position:absolute; top:0; left:0; right:0; bottom:0;
    display:flex; align-items:center; justify-content:center;
    text-align:center; padding:0 7%;
    color:#fff; font-weight:700;
    font-size:3.1em; line-height:1.4;
    text-shadow:0 2px 12px rgba(0,0,0,.5);
    z-index:2;   /* 确保文字在蒙层之上 */
}
.hero.slim img{height:200px;}
.hero.slim .hero-title{font-size:2.1em; text-shadow:0 1px 8px rgba(0,0,0,.6);}

/* ---------- page content ---------- */
.content{max-width:80%; margin:0 auto; padding:56px 30px 30px;}
.content h2{font-size:1.8em; font-weight:700; margin:1.6em 0 0.2em;}
.content h3, .break{font-size:1.4em; font-weight:700; margin:0.6em 0 0.1em;}
.content p{margin:0 0 0.3em;}
.slot{font-size:1.22em; line-height:1.65; margin:0 0 1.4em;}
.content ul{margin:0 0 1.4em 1.4em;}
.content li{margin:0 0 .5em;}
.content li a, .content p a{text-decoration:underline; text-decoration-color:#0b5cad;}

.speaker-block{margin:0 0 0.8em;padding-left:0.3em;} /* 新增：内容整体向右缩进 2em */
.speaker-block h3{font-size:1.35em; margin:0 0 .1em;}
.speaker-block .affil{font-style:italic; color:#555; margin:0 0 .1em;}
.speaker-block .talk-title{font-weight:700; margin:0 0 .1em;} 

/* ---------- paper list (accepted papers) ---------- */
.paper-list{
    margin:0 0 2em 1.6em;
    list-style:disc;
}
.paper-list li{
    margin:0 0 2.2em;
}
.paper-list li:last-child{
    margin-bottom:0;
}
.paper-title{
    font-size:1.15em;
    font-weight:700;
    color:#032b5a;
    margin:0 0 .25em;
    line-height:1.4;
}
.paper-authors{
    font-style:italic;
    color:#555;
    margin:0 0 .7em;
    font-size:.95em;
}
.paper-abstract{
    margin:0;
    line-height:1.7;
    color:#1c1c1c;
}


/* embedded frames & images (registration / directions / flyer) */
iframe.registration{display:block; margin:1em auto 2em; width:700px; max-width:100%; height:1400px; border:none;}
iframe.directions{display:block; margin:1em auto 2em; width:800px; max-width:100%; height:400px; border:none;}
img.center{display:block; width:67%; margin:1em auto 2em; border-radius:6px;}
table.flyers{width:100%; border-spacing:20px 0;}
td.flyer{width:50%; text-align:center; vertical-align:top;}
td.flyer img{width:100%; box-shadow:0 2px 10px rgba(0,0,0,.2);}

footer{
    text-align:center; font-size:.85em; color:#66707a;
    font-family:'Roboto',sans-serif;
    padding:30px 16px 40px; margin-top:4em;
}
footer a{color:#0b5cad;}

/* ---------- mobile ---------- */
@media only screen and (max-width: 1200px){
    .navbar{padding:8px 16px;}
    .nav{margin-left:0; gap:6px 12px;}
    .menu-toggle{display:flex;}
    .nav-links{
        display:none;
        position:absolute; top:100%; left:0; right:0;
        background:#fff;
        flex-direction:column; align-items:stretch;
        padding:8px 0;
        box-shadow:0 6px 16px rgba(0,0,0,.25);
        border-radius:0 0 6px 6px;
        z-index:110;
        gap:0;
    }
    .nav-links.open{display:flex;}
    .nav-links a{
        color:#0b5cad; font-size:1.1em;
        padding:12px 24px;
        border-bottom:1px solid #e8ecf0;
    }
    .nav-links a:last-child{border-bottom:none;}
    .nav-links a:hover{background:#eef6fc; text-decoration:none;}
    .nav-links a.current{background:#eef6fc; color:#084a8a; font-weight:700;}
    .hero img{height:360px;}
    .hero-title{font-size:1.9em;}
    .hero.slim img{height:150px;}
    .hero.slim .hero-title{font-size:1.4em;}
    .content{padding:36px 18px 20px;}
    .slot{font-size:1.05em;}
}
