/*For Mobile */
 .programimg {
 	border-width: 2px;
 	border-color: #009688;
 	border-style: solid;
 }
section {
	padding: 70px 0px;
}
/*
.bar-container {
    height: 40px;
}*/

section .container {
	padding-bottom: 0px;
}
span.titlesec {
	/*text-align: center;*/
	font-weight: bold;
	font-size: 2.0em;
	display: block;
}
span.subtitlesec {
	font-weight: bold;
	font-size: 1.3em;
}

hr {
    margin-top: 0px;
    margin-bottom: 0px;
}
section.smaller {
	padding:35;
}
/*
@media screen and (max-width: 540px) {
    
    .navbar-brand {
    	left: 50%;
    	position: fixed;
    	transform: translate(-50%, 0);
    	top: 1%;
    }
}
*/

.knowledgebase {
	font-size: 15px;
}
.knowledgebase h5 {
	font-size: 18px;
	font-weight: bold;
}

/* For Tablets */ 
@media screen and (min-width: 540px) and (max-width: 780px) {
   

}
.btn {
    border: 1px solid;
}

.btn-primary-outline {
  background-color: transparent;
  border-color: #ccc;
  color: #777;
}

.btn-primary-outline:hover {
  background-color: transparent;
  border-color: #009688;
  color: #009688;
}




.speakerpic {
	/*min-width: 14%;*/
	margin-left: 5%;
	/*width: 180px;*/

}

.speakerpic img {
	width: 180px;
	height: 180px;
  	display: block;
  	object-fit: scale-down;
 }




.profpic .speaker {
	/*min-width: 14%;*/
	margin: auto;
	padding-bottom: 10px;
	width: 210px;

}

.profpic {
	/*min-width: 14%;*/
	margin: auto;
	padding-bottom: 10px;
	width: 190px;

}

.profpic img {
	width: 130px;
	height: 130px;
	  display: block;
	  margin: auto;
	object-fit: cover;
}

.speaker img {
	width: 170px;
	height: 170px;
	  display: block;
	  margin: auto;
}



.profpic .profname {
  text-align: center;
  font-size: large;
  height: 20px;
  margin-top: 15px;
  margin-bottom: 5px;
  color: black;

}
.profpic .profname a {
	color: black;
}
.profpic .institution {
  text-align: center;
  font-size: 15px;
  height: 60px;
}

.paperlink img:hover {
  background-color: transparent;
  border-color: #009688;
  color: #009688;
  border-width: 2px;
  border-style: solid;
  max-width: 100%;
  max-height: 100&;
}
.paperlink img {
  background-color: transparent;
  border-color: #ccc;
  color: #777;
  border-width: 2px;
  border-style: solid;
  max-width: 100%;
  max-height: 100%;
}

.ui-autocomplete { height: 200px; overflow-y: scroll; overflow-x: hidden;}


.into-title {
	text-align: center;
}
.into-pic img {
	height: 80px;
	max-width: 100%;
	width: 80px;
	display: block;
	margin: 8% auto;
}
.into-content {
	padding-left: 10px;
	padding-right: 10px;
	font-size: small;
}

/* Add the below transitions to allow a smooth color change similar to lyft */
.navbar {
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    z-index: 5;
}

.navbar.scrolled {
    background: rgb(220, 220, 220);  IE 
    background: rgba(220, 220, 220, 1.0); /* NON-IE 
/*}*/
}



body {
	font-family: Montserrat; /*Montserrat; */
	font-size: medium;
	text-align: justify;
}
li {
    display: block;
}
ul.list-feat {

    margin-bottom: 35px;
}
ul.list-feat li{
    font-size: 16px;
    margin-top: 25px;
}
ul.list-feat li:before {
    content: "\e080";
    font-family: 'Glyphicons Halflings';
    font-size: 15px;
    margin-top: 6px;
    margin-left: -17px;
    color: #009688;
}

ul.list-feat.clickitems li a:hover{
    cursor: pointer;
    color: #009688;
    font-size: 16px;
    margin-top: 9%;
}

ul.list-download li{
    font-size: 16px;
    margin-top: 20px;
    margin-bottom: 0px;
}

ul.list-download li p {
  margin-left: 5px;
  margin-top: 0px;
  margin-bottom: 0px;
  /*width: 120px;*/
}
ul.list-download li p.download a:before{
    width: 20px;
    height: 20px;
    float: left;
    font-size: 15px;
    background-size: 20px;
    content: " ";
    display: inline-block;
    margin-right: 7px;
    font-family: 'Glyphicons Halflings';
}

ul.list-download li p.download.linux a:before{
  background-image: url('../images/icons/linux_unselected.png');
}

ul.list-download li p.download.mac a:before {
  background-image: url('../images/icons/apple_unselected.png');
}

ul.list-download li p.download.github a:before{
    background-image: url('../images/icons/github_unselected.png');
}


ul.list-download li p.download.linux a:hover:before{
  background-image: url('../images/icons/linux_selected.png');
}

ul.list-download li p.download.mac a:hover:before {
  background-image: url('../images/icons/apple_selected.png');
}

ul.list-download li p.download.github a:hover:before{
    background-image: url('../images/icons/github_selected.png');
}

/*ul.list-download li a.ubuntu:before{
    display: block;
    width: 20px;
    height: 20px;
    float: left;
    background: url('../images/icons/linux.svg') center left no-repeat;
}*/

.publication {
    margin-bottom: 30px;
    padding-bottom: 50px;
}
.content_publication {
    margin-left: 20px;
    display: inline-block;
    width: 70%; 
    vertical-align: top;
}

.content_publication p {
    font-weight: bolder;
}
.icon_publication {
    display: inline-block;
    width: 20%; 
    vertical-align: top;
}


#titleprogram {
	color: #009688;
}

p.title_paper {
    margin-bottom: 5px;
}
p.explanation_paper {
    font-weight: normal;

}


button.search_banner {

    color: lightgray;
    height: 40px;
    bottom: 13px;
    width: 40px;
    font-size: 1.5em;
    background-color: rgb(110, 132, 96, 0);
    border-width:0px;
}

button.search_banner:hover {
    font-size: 1.5em;
    cursor: pointer;
    color: white;
    height: 40px;
    bottom: 13px;
    width: 40px;
    background-color: rgb(174, 200, 152, 0);
    border-width:0px;


}

button.search_top {

    color: white;
    height: 30px;
    bottom: 13px;
    width: 60px;
    object-position: bottom;
    position: absolute;
    margin-left: 5px;
    background-color: rgb(110, 132, 96);
    border-width:0px;
}

button.search_top:hover {
    color: white;
    height: 30px;
    bottom: 13px;
    width: 60px;
    object-position: bottom;
    position: absolute;
    margin-left: 5px;
    background-color: rgb(174, 200, 152);
    border-width:0px;


}

.robothowsearch:focus {
    outline-width: 0;

}

.doccontent .row h5{
    padding-bottom: 10px;
    width: 100%;
    padding-top: 10px;
    font-weight: 700;
}


.doccontent .row h3{
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    font-weight: 700;
}

.doccontent .row h2{
    font-weight: 700;
    width: 100%;
    padding-bottom: 20px;
}
.doccontent .row h2:after{
    content:' ';
    margin-top: 10px;
    display:block;
    border:1px solid rgba(235, 235, 235, 0.9);
}
.doccontent {
    padding: 50px;
}

#itemdoc a:hover {
    font-size: large;
    font-weight: 600;
    text-decoration: None
}

#itemdoc a {
    font-size: large;
    font-weight: 600;
    color: rgb(50,50,50)
}

.half-rule.hl {
    border-top: 2px solid #009688;
}

.card-text {
    font-size: 0.8rem;
}


.col-md-3.mx-auto.wide {
    padding-left: 10px;
    padding-right: 10px;

}

.title {
    font-size: 2.7em;
}
.subtitle {
    font-size: 1.5em;
}

.titlebox {
    padding-top: 1%;
    padding-bottom: 1%;
}

@media screen and (min-width: 481px){
    .searchnav {
	display: inline-block;
    }
}

@media screen and (max-width: 480px){
    .searchnav {
	display: none;
	font-size: 50px;
    }
}
@media only screen and (max-width: 480px){
    .titlebox {
	padding: 0px;
    }

    .title {
	font-size: 3em;
    }
    .subtitle {
	font-size: 1.5em;
    }
}
ul.listpapers li {
        
    display: list-item;
    margin-top:  15px;
    font-size:  15px;
    font-weight: bold;
}

li {
	display: list-item
}
.authorname {
    color:  rgb(120,120,120);
    font-weight: normal
}


/* ======================================================== */
/*  Challenge section components                            */
/* ======================================================== */

#challenge .subtitlesec {
    display: block;
    margin-top: 36px;
    margin-bottom: 12px;
    color: #009688;
}
#challenge p, #challenge li { text-align: justify; }
.challenge-intro { margin-top: 8px; margin-bottom: 28px; }
.challenge-caption { color: #777; font-size: 0.95em; margin-bottom: 18px; }

/* Track cards (Phase 1 evaluation) */
.tracks-row { margin-top: 8px; margin-bottom: 8px; }
.track-card {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 24px;
    background: #fff;
    text-align: center;
    margin-bottom: 24px;
    height: 100%;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.track-card:hover {
    border-color: #009688;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 150, 136, 0.12);
}
.track-card-icon { font-size: 2.4em; color: #009688; margin-bottom: 12px; }
.track-card h5 { font-weight: 600; margin-bottom: 10px; }
.track-card p { font-size: 0.95em; color: #555; margin-bottom: 0; text-align: center; }

/* Dataset card */
.dataset-card {
    border: 1px solid #e0e0e0;
    border-left: 4px solid #009688;
    border-radius: 8px;
    padding: 24px;
    background: #fafafa;
    margin: 8px 0 24px 0;
}
.dataset-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.dataset-card-header i { font-size: 1.8em; color: #009688; }
.dataset-card-header h5 { margin: 0; font-weight: 600; }
.dataset-feature-list { list-style: none; padding-left: 0; margin-bottom: 12px; }
.dataset-feature-list li {
    padding: 6px 0 6px 24px;
    position: relative;
    text-align: left;
}
.dataset-feature-list li::before {
    content: "\2713";
    color: #009688;
    font-weight: 700;
    position: absolute;
    left: 4px;
    top: 6px;
}
.dataset-intro { margin-top: 8px; margin-bottom: 16px; }
.dataset-components { margin-top: 8px; margin-bottom: 8px; }
.dataset-component {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 18px 16px;
    text-align: center;
    height: 100%;
    margin-bottom: 14px;
    transition: border-color 0.2s ease, transform 0.2s ease;
    display: flex;
    flex-direction: column;
}
.dataset-component:hover {
    border-color: #009688;
    transform: translateY(-2px);
}
.dataset-component-icon { font-size: 1.8em; color: #009688; margin-bottom: 8px; line-height: 1; }
.dataset-component-icon.success { color: #2e9e5b; }
.dataset-component-icon.failure { color: #c0463a; }
.dataset-component-icon.hitl    { color: #b07cc6; }
.dataset-component h6 {
    font-weight: 600;
    margin-bottom: 10px;
    color: #333;
    font-size: 1.0em;
    text-align: center;
    min-height: 2.6em;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dataset-component p {
    font-size: 0.88em;
    color: #555;
    margin-bottom: 0;
    text-align: left;
    line-height: 1.5;
    flex: 1;
}
.dataset-note {
    font-size: 0.9em;
    color: #777;
    font-style: italic;
    margin-bottom: 12px;
    text-align: left;
}
.btn-primary-outline.disabled,
.btn-primary-outline[aria-disabled="true"] {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* Solid teal primary button — used for live CTAs (Download, Register) */
.btn-primary-solid {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 22px;
    background: linear-gradient(135deg, #009688 0%, #00796b 100%);
    color: #fff;
    border: 1px solid #00796b;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.95em;
    text-decoration: none;
    box-shadow: 0 2px 10px rgba(0, 150, 136, 0.28);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.btn-primary-solid:hover,
.btn-primary-solid:focus {
    background: linear-gradient(135deg, #00a99a 0%, #00897b 100%);
    color: #fff;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(0, 150, 136, 0.42);
}
.btn-primary-solid:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(0, 150, 136, 0.32);
}
.btn-primary-solid i { font-size: 1.05em; }

/* Phase 2 list */
.phase2-list { list-style: disc; padding-left: 22px; margin-bottom: 16px; }
.phase2-list li { display: list-item; padding: 4px 0; }

/* ======================================================== */
/*  Leaderboard                                             */
/* ======================================================== */
/* Segmented track switcher */
.lb-tabs {
    display: inline-flex;
    background: #f0f2f3;
    border: 1px solid #e0e0e0;
    border-radius: 999px;
    padding: 4px;
    margin: 0 0 16px 0;
    gap: 2px;
}
.lb-tab {
    border: none;
    background: transparent;
    color: #555;
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 0.92em;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.lb-tab i { font-size: 1.0em; }
.lb-tab:hover { color: #009688; }
.lb-tab.active {
    background: linear-gradient(135deg, #009688 0%, #00796b 100%);
    color: #fff;
    box-shadow: 0 2px 10px rgba(0, 150, 136, 0.32);
}
.lb-tab-sub { font-weight: 400; opacity: 0.85; }
.lb-tab.active .lb-tab-sub { opacity: 0.92; }

/* Tab panes */
.lb-pane { display: none; }
.lb-pane.active { display: block; }

/* Task cell <code> styling inside the table headers */
.leaderboard-table thead th code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.9em;
    background: rgba(255, 255, 255, 0.18);
    padding: 3px 8px;
    border-radius: 4px;
    color: #fff;
}

@media (max-width: 576px) {
    .lb-tabs { width: 100%; }
    .lb-tab { flex: 1; padding: 8px 10px; font-size: 0.85em; }
    .lb-tab-sub { display: none; }
}

.leaderboard-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    background: linear-gradient(135deg, rgba(0, 150, 136, 0.10) 0%, rgba(0, 121, 107, 0.06) 100%);
    border: 1px solid rgba(0, 150, 136, 0.30);
    border-left: 4px solid #009688;
    border-radius: 8px;
    padding: 14px 18px;
    margin: 8px 0 18px 0;
    font-size: 0.95em;
    color: #333;
}
.leaderboard-banner i { font-size: 1.6em; color: #009688; flex-shrink: 0; }

.leaderboard-wrapper {
    overflow-x: auto;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
    background: #fff;
}
.leaderboard-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 0.88em;
    margin: 0;
    text-align: center;
}

/* Header rows */
.leaderboard-table thead th {
    background: #fafafa;
    color: #333;
    font-weight: 600;
    border: 1px solid #e6e6e6;
    padding: 10px 8px;
    white-space: nowrap;
}
.leaderboard-table thead tr:first-child th.lb-task,
.leaderboard-table thead tr:first-child th.lb-avg {
    background: linear-gradient(135deg, #009688 0%, #00796b 100%);
    color: #fff;
    border: 1px solid #00796b;
}
.leaderboard-table thead tr:first-child th.lb-rank,
.leaderboard-table thead tr:first-child th.lb-team {
    background: linear-gradient(135deg, #1a3940 0%, #0f2329 100%);
    color: #fff;
    border: 1px solid #0f2329;
}
.leaderboard-table thead .lb-track {
    background: rgba(0, 150, 136, 0.10);
    color: #00695c;
    font-weight: 600;
}
.leaderboard-table thead .lb-track.lb-mt { background: rgba(0, 150, 136, 0.18); }
.leaderboard-table thead .lb-metric-row th {
    background: #fcfcfc;
    font-weight: 500;
    color: #555;
    font-size: 0.95em;
}

/* Body rows */
.leaderboard-table tbody td {
    padding: 12px 8px;
    border: 1px solid #eee;
    color: #333;
    font-variant-numeric: tabular-nums;
}
.leaderboard-table tbody tr.lb-row:hover td { background: rgba(0, 150, 136, 0.05); }

.lb-rank-cell {
    font-weight: 700;
    font-size: 1em;
    color: #555;
    width: 58px;
    white-space: nowrap;
}
.lb-medal { font-size: 1.15em; margin-right: 4px; }

.lb-team-cell {
    text-align: left;
    min-width: 180px;
    padding-left: 14px !important;
}
.lb-team-name { font-weight: 600; color: #1a1a1a; font-size: 1.0em; line-height: 1.2; }
.lb-model-name {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.85em;
    color: #777;
    margin-top: 2px;
}

/* Average column emphasis */
.leaderboard-table tbody .lb-avg-score,
.leaderboard-table tbody .lb-avg-sr {
    font-weight: 700;
    color: #009688;
    background: rgba(0, 150, 136, 0.04);
}

/* Top-3 row treatments */
.leaderboard-table tbody .lb-row.gold   .lb-rank-cell { color: #b8881f; }
.leaderboard-table tbody .lb-row.silver .lb-rank-cell { color: #7a7a7a; }
.leaderboard-table tbody .lb-row.bronze .lb-rank-cell { color: #9e5b27; }
.leaderboard-table tbody .lb-row.gold   td:first-child { border-left: 3px solid #d4af37; }
.leaderboard-table tbody .lb-row.silver td:first-child { border-left: 3px solid #c0c0c0; }
.leaderboard-table tbody .lb-row.bronze td:first-child { border-left: 3px solid #cd7f32; }

/* "Your team here" placeholder row */
.leaderboard-table tbody .lb-placeholder { background: rgba(0, 150, 136, 0.03); }
.leaderboard-table tbody .lb-placeholder .lb-team-name { color: #009688; font-style: italic; }
.leaderboard-table tbody .lb-placeholder .lb-model-name { color: #80a8a4; }
.leaderboard-table tbody .lb-placeholder-cell {
    color: #777;
    font-style: italic;
    text-align: center;
}

.leaderboard-note {
    margin-top: 14px;
    font-size: 0.88em;
    color: #666;
    background: #fafafa;
    padding: 10px 14px;
    border-radius: 6px;
    border-left: 3px solid #009688;
}
.leaderboard-note i { color: #009688; margin-right: 6px; }

@media (max-width: 768px) {
    .leaderboard-wrapper {
        font-size: 0.95em;
    }
    .leaderboard-table { min-width: 880px; }
}


/* ======================================================== */
/*  Task Samples & Scoring                                  */
/* ======================================================== */
.tasks-intro { color: #555; margin-bottom: 16px; }

.task-selector-wrapper {
    margin-bottom: 24px;
}

.task-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    padding: 6px;
    background: #f0f2f3;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
}
.task-tab {
    flex: 1 1 0;
    min-width: 200px;
    border: 1px solid transparent;
    background: transparent;
    color: #555;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 0.92em;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-align: left;
}
.task-tab:hover {
    color: #009688;
    background: rgba(255, 255, 255, 0.7);
    border-color: rgba(0, 150, 136, 0.20);
}
.task-tab.active {
    background: linear-gradient(135deg, #009688 0%, #00796b 100%);
    color: #fff;
    border-color: #00796b;
    box-shadow: 0 2px 10px rgba(0, 150, 136, 0.32);
}
.task-tab-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(0, 150, 136, 0.18);
    color: #009688;
    font-size: 0.85em;
    font-weight: 700;
    flex-shrink: 0;
}
.task-tab.active .task-tab-num {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}
.task-tab code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.92em;
    background: transparent;
    color: inherit;
    padding: 0;
}

.task-pane { display: none; }
.task-pane.active { display: block; }

.task-videos-row { margin-top: 16px; }
.task-videos-row > [class*="col-"] { margin-bottom: 14px; }

.task-video-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 16px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.task-video-card:hover {
    border-color: rgba(0, 150, 136, 0.45);
    box-shadow: 0 4px 14px rgba(0, 150, 136, 0.12);
}
.task-video-label {
    padding: 8px 14px;
    font-size: 0.85em;
    font-weight: 600;
    color: #00695c;
    background: rgba(0, 150, 136, 0.08);
    border-bottom: 1px solid rgba(0, 150, 136, 0.18);
    display: flex;
    align-items: center;
    gap: 6px;
}
.task-video-label i { font-size: 1.05em; color: #009688; }

.task-video-container {
    width: 100%;
    background: #1a1a1a;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    display: flex;
    align-items: stretch;
}
.task-video-container > video,
.task-video-container > iframe {
    width: 100%;
    height: 100%;
    border: 0;
    object-fit: cover;
    display: block;
}
.task-video-placeholder {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #999;
    background: linear-gradient(135deg, #1f2229 0%, #0f2329 100%);
    padding: 24px;
    gap: 10px;
}
.task-video-placeholder i {
    font-size: 3em;
    color: rgba(0, 150, 136, 0.55);
}
.task-video-placeholder span { color: #fff; font-size: 0.95em; font-weight: 500; }
.task-video-placeholder small { color: #888; font-size: 0.82em; }
.task-video-placeholder code {
    background: rgba(255, 255, 255, 0.10);
    color: #80cbc4;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.92em;
}

.task-criteria {
    width: 100%;
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-left: 4px solid #009688;
    border-radius: 8px;
    padding: 18px 22px;
}
.task-criteria h6 {
    color: #009688;
    font-weight: 600;
    margin-bottom: 14px;
    font-size: 1.05em;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.task-criteria h6 code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.92em;
    background: rgba(0, 150, 136, 0.10);
    color: #00695c;
    padding: 2px 8px;
    border-radius: 4px;
}
.task-criteria p { font-size: 0.95em; margin-bottom: 10px; }
.task-criteria .criteria-placeholder {
    color: #888;
    font-style: italic;
    margin-bottom: 0;
}
.task-criteria .criteria-list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 12px;
}
.task-criteria .criteria-list li {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0, 150, 136, 0.10);
    font-size: 0.95em;
    line-height: 1.45;
}
.task-criteria .criteria-list li:last-child { border-bottom: none; }
.task-criteria .criteria-list li::before {
    content: "✓";
    color: #009688;
    font-weight: 700;
    margin-right: 6px;
    flex-shrink: 0;
}
.task-criteria .criteria-list li .criteria-text { flex: 1; }
.task-criteria .badge-group {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 1px;
}
.task-criteria .score-badge {
    background: linear-gradient(135deg, #009688 0%, #00796b 100%);
    color: #fff;
    font-weight: 700;
    font-size: 0.85em;
    padding: 4px 10px;
    border-radius: 999px;
    white-space: nowrap;
    box-shadow: 0 1px 4px rgba(0, 150, 136, 0.30);
}
.task-criteria .score-badge.graduated {
    background: linear-gradient(135deg, #00b8a9 0%, #009688 50%, #00796b 100%);
    box-shadow: 0 1px 4px rgba(0, 150, 136, 0.40),
                inset 0 0 0 1px rgba(255, 255, 255, 0.15);
}
.task-criteria .cumulative {
    font-size: 0.78em;
    color: #777;
    font-style: italic;
    white-space: nowrap;
}
.task-criteria .criteria-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 14px;
    background: rgba(0, 150, 136, 0.08);
    border-left: 3px solid #009688;
    border-radius: 6px;
    font-size: 0.92em;
    color: #333;
}
.task-criteria .criteria-notice i { color: #009688; font-size: 1.1em; flex-shrink: 0; margin-top: 2px; }

@media (max-width: 768px) {
    .task-criteria { padding: 14px 16px; }
}
@media (max-width: 576px) {
    .task-tab { min-width: 0; padding: 8px 10px; font-size: 0.82em; gap: 6px; }
    .task-tab code { font-size: 0.85em; }
    .task-video-placeholder { padding: 14px; gap: 6px; }
    .task-video-placeholder i { font-size: 2.2em; }
    .task-criteria .criteria-list li {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
    .task-criteria .score-badge { margin-left: 28px; }
}


/* Tutorial cards */
.tutorial-intro { color: #555; margin-bottom: 16px; }
.tutorial-row { margin-top: 8px; }
.tutorial-row > [class*="col-"] { margin-bottom: 16px; display: flex; }
.tutorial-card {
    width: 100%;
    border: 1px solid #e0e0e0;
    border-left: 4px solid #009688;
    border-radius: 8px;
    padding: 22px 24px;
    background: #fafafa;
    display: flex;
    flex-direction: column;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.tutorial-card:hover {
    border-color: #009688;
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(0, 150, 136, 0.10);
}
.tutorial-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}
.tutorial-card-header i { font-size: 1.8em; color: #009688; line-height: 1; }
.tutorial-card-header h5 { margin: 0; font-weight: 600; }
.tutorial-card p {
    margin-bottom: 16px;
    flex: 1;
    text-align: left;
    line-height: 1.5;
    color: #444;
}
.tutorial-card p code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.92em;
    background: rgba(0, 150, 136, 0.10);
    color: #00695c;
    padding: 1px 6px;
    border-radius: 4px;
}
.tutorial-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.tutorial-actions .btn i,
.tutorial-actions .btn-primary-solid i { margin-right: 6px; }

/* Schedule grid */
.schedule-grid { margin-top: 8px; margin-bottom: 8px; }
.schedule-grid h6 {
    color: #009688;
    font-weight: 600;
    margin-bottom: 18px;
    font-size: 1.05em;
}
.schedule-grid h6 i { margin-right: 6px; }
.timeline-vertical {
    border-left: 2px solid #009688;
    padding-left: 20px;
    margin-bottom: 24px;
}
.timeline-event { margin-bottom: 18px; position: relative; }
.timeline-event::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #009688;
    position: absolute;
    left: -25px;
    top: 6px;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px #009688;
}
.timeline-event.highlight .timeline-date { color: #00796b; }
.timeline-date {
    font-weight: 600;
    color: #009688;
    font-size: 0.95em;
}
.timeline-content { font-size: 0.95em; color: #333; }
.phase-list { list-style: none; padding-left: 0; }
.phase-list li {
    display: block;
    padding: 12px 0;
    border-bottom: 1px solid #eee;
    text-align: left;
}
.phase-list li:last-child { border-bottom: none; }
.phase-list li strong { color: #009688; }

/* Prize banner + award cards */
.prize-banner {
    text-align: center;
    padding: 28px;
    background: linear-gradient(135deg, #009688 0%, #00796b 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    margin: 12px 0 24px 0;
}
.prize-banner .prize-icon { font-size: 1.6em; margin-right: 8px; vertical-align: middle; }
.prize-banner .prize-amount {
    font-size: 2.4em;
    font-weight: 700;
    display: inline-block;
    vertical-align: middle;
    margin-right: 12px;
}
.prize-banner .prize-label {
    font-size: 1em;
    opacity: 0.95;
    vertical-align: middle;
}
.awards-grid { margin-top: 8px; }
.award-card {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 20px 14px;
    background: #fff;
    text-align: center;
    margin-bottom: 16px;
    height: 100%;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.award-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.award-card.gold     { border-top: 4px solid #d4af37; }
.award-card.silver   { border-top: 4px solid #c0c0c0; }
.award-card.bronze   { border-top: 4px solid #cd7f32; }
.award-card.honorable{ border-top: 4px solid #009688; }
.award-medal { font-size: 2em; line-height: 1; }
.award-rank {
    color: #777;
    font-size: 0.95em;
    margin: 6px 0 4px 0;
}
.award-amount {
    font-size: 1.4em;
    font-weight: 600;
    color: #009688;
}
.award-each { font-size: 0.7em; color: #777; font-weight: 400; }

.award-bonus {
    margin-top: 8px;
    padding: 6px 10px;
    border-top: 1px dashed rgba(212, 175, 55, 0.5);
    font-size: 0.78em;
    font-weight: 600;
    color: #b8881f;
    line-height: 1.25;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}
.award-bonus i { font-size: 1.05em; }

.award-extra-note {
    margin-top: 14px;
    padding: 14px 18px;
    background: linear-gradient(135deg, rgba(0, 150, 136, 0.08) 0%, rgba(212, 175, 55, 0.08) 100%);
    border-left: 4px solid #d4af37;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.95em;
    color: #333;
}
.award-extra-note:first-of-type { margin-top: 18px; }
.award-extra-note i { font-size: 1.4em; color: #d4af37; flex-shrink: 0; }
.award-extra-note b { color: #009688; }

/* Technical report variant — teal-led to differentiate from the gold "presentation" callout */
.award-extra-note.report {
    background: linear-gradient(135deg, rgba(0, 150, 136, 0.12) 0%, rgba(0, 150, 136, 0.04) 100%);
    border-left-color: #009688;
}
.award-extra-note.report i { color: #009688; }

/* Mobile tweaks for Challenge components */
@media screen and (max-width: 768px) {
    .prize-banner .prize-amount { font-size: 1.9em; display: block; margin-right: 0; }
    .prize-banner .prize-icon { display: block; margin: 0 auto 6px auto; }
    .prize-banner .prize-label { display: block; margin-top: 4px; }
    .schedule-grid .col-md-6:first-child { margin-bottom: 24px; }
}


/* ======================================================== */
/*  Page-wide style alignment with Challenge section        */
/* ======================================================== */

/* --- Section title icon styling (used by all sections) --- */
span.titlesec > i.bi {
    color: #009688;
    margin-right: 10px;
    font-size: 0.9em;
    vertical-align: -2px;
}
#challenge span.titlesec > i.bi { font-size: 0.95em; }

/* --- Section dividers: subtle teal accent --- */
hr.half-rule {
    border: none;
    height: 2px;
    background: linear-gradient(to right,
        rgba(0, 150, 136, 0) 0%,
        rgba(0, 150, 136, 0.35) 50%,
        rgba(0, 150, 136, 0) 100%);
    margin: 0 auto;
    max-width: 80%;
}

/* ======================================================== */
/*  HERO SECTION (replaces old dark-box header)             */
/*  Drop a Sydney photo at images/header-bg.jpg to enable   */
/*  the photo background. Fallback gradient ships by default*/
/* ======================================================== */
#hero.hero-section {
    position: relative;
    width: 100%;
    min-height: 92vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
    background:
        linear-gradient(135deg,
            rgba(0, 25, 40, 0.55) 0%,
            rgba(0, 80, 90, 0.50) 50%,
            rgba(0, 121, 107, 0.55) 100%),
        url("../images/sydney_background.jpg"),
        linear-gradient(135deg, #001828 0%, #00424a 50%, #00796b 100%);
    background-size: cover, cover, cover;
    background-position: center center;
    background-attachment: scroll, scroll, scroll;
    color: #fff;
    overflow: hidden;
}
@media (min-width: 1024px) {
    #hero.hero-section { background-attachment: scroll, fixed, scroll; }
}

#hero .hero-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.0) 0%, rgba(0, 0, 0, 0.35) 100%);
    pointer-events: none;
}

#hero .hero-content {
    position: relative;
    z-index: 1;
    text-align: center;
    color: #fff;
    max-width: 900px;
}

#hero .hero-eyebrow {
    display: inline-block;
    padding: 6px 16px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 999px;
    font-size: 0.95em;
    letter-spacing: 0.04em;
    margin-bottom: 24px;
    backdrop-filter: blur(4px);
    background: rgba(255, 255, 255, 0.08);
}
#hero .hero-eyebrow i { color: #ffd166; margin-right: 6px; }

#hero .hero-title {
    font-size: 3.4em;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 18px;
    text-shadow: 0 2px 24px rgba(0, 0, 0, 0.3);
}

#hero .hero-slogan {
    font-size: 1.4em;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.92);
    margin-bottom: 26px;
    font-style: italic;
}

#hero .hero-meta {
    font-size: 1.05em;
    color: rgba(255, 255, 255, 0.92);
    margin-bottom: 36px;
}
#hero .hero-meta i { color: #80cbc4; margin-right: 6px; }
#hero .hero-meta-sep { margin: 0 14px; opacity: 0.6; }

#hero .hero-cta { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
#hero .btn-hero-primary,
#hero .btn-hero-outline {
    padding: 12px 28px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 1em;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    border: 1.5px solid #fff;
}
#hero .btn-hero-primary {
    background: #009688;
    color: #fff;
    border-color: #009688;
    box-shadow: 0 4px 18px rgba(0, 150, 136, 0.4);
}
#hero .btn-hero-primary:hover {
    background: #00796b;
    border-color: #00796b;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(0, 150, 136, 0.55);
    text-decoration: none;
}
#hero .btn-hero-outline {
    background: transparent;
    color: #fff;
}
#hero .btn-hero-outline:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    transform: translateY(-2px);
    text-decoration: none;
}

@media (max-width: 768px) {
    #hero .hero-title { font-size: 2.0em; }
    #hero .hero-slogan { font-size: 1.05em; }
    #hero .hero-meta-sep { display: none; }
    #hero .hero-meta span { display: block; margin-bottom: 6px; }
}

/* --- Profile card hover (Speakers + Organizers) --- */
.profpic {
    border-radius: 8px;
    padding: 14px 8px 8px 8px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.profpic:hover {
    transform: translateY(-3px);
    background: #fafafa;
    box-shadow: 0 4px 14px rgba(0, 150, 136, 0.12);
}
.profpic img {
    border-radius: 50%;
    border: 3px solid transparent;
    transition: border-color 0.2s ease, transform 0.2s ease;
}
.profpic:hover img { border-color: #009688; }

/* TBA placeholder for upcoming speakers */
.profpic.speaker-tba { padding-top: 14px; }
.profpic.speaker-tba .speaker-tba-circle {
    width: 130px;
    height: 130px;
    margin: 0 auto;
    border-radius: 50%;
    border: 3px dashed rgba(0, 150, 136, 0.45);
    background: rgba(0, 150, 136, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #009688;
    font-size: 2.2em;
    transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
.profpic.speaker-tba:hover .speaker-tba-circle {
    border-color: #009688;
    background: rgba(0, 150, 136, 0.10);
    transform: scale(1.02);
}
.profpic.speaker-tba .profname { color: #009688; font-style: italic; }
.profpic.speaker-tba .institution { color: #777; font-style: italic; }

/* Inline muted-em used in Schedule for "more speakers TBA" */
.text-muted-em { color: #888; font-style: italic; }

/* --- Schedule table polish --- */
#schedule .table {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 8px;
}
#schedule .table thead th,
#schedule .table tr:first-child th {
    background: linear-gradient(135deg, #009688 0%, #00796b 100%);
    color: #fff;
    font-weight: 600;
    border: none;
    padding: 14px 16px;
}
#schedule .table tbody tr td {
    padding: 14px 16px;
    border-top: 1px solid #eee;
    vertical-align: middle;
}
#schedule .table tbody tr:hover td { background: rgba(0, 150, 136, 0.06); }
#schedule .table tbody tr td b { color: #009688; }

/* --- Topics card grid --- */
.topics-intro { color: #555; margin-bottom: 18px; }
.topics-grid { margin-top: 8px; }
.topic-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-left: 3px solid #009688;
    border-radius: 6px;
    padding: 14px 16px;
    margin-bottom: 14px;
    height: 100%;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.topic-card:hover {
    transform: translateY(-2px);
    border-color: #009688;
    box-shadow: 0 4px 12px rgba(0, 150, 136, 0.12);
}
.topic-card i {
    color: #009688;
    font-size: 1.4em;
    flex-shrink: 0;
    margin-top: 2px;
    line-height: 1.1;
}
.topic-card span {
    flex: 1;
    font-size: 0.95em;
    color: #333;
    line-height: 1.4;
    text-align: left;
}

/* --- Industry Partner logos: hover lift + saturate --- */
[data-partner-link] {
    border-radius: 8px;
    padding: 12px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
[data-partner-link] img {
    filter: grayscale(20%);
    transition: filter 0.2s ease, transform 0.2s ease;
}
[data-partner-link]:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}
[data-partner-link]:hover img { filter: grayscale(0%); }

/* --- Contact card --- */
.contact-card {
    display: flex;
    align-items: center;
    gap: 18px;
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-left: 4px solid #009688;
    border-radius: 8px;
    padding: 22px 26px;
    margin-top: 16px;
}
.contact-card .contact-icon {
    font-size: 2.2em;
    color: #009688;
    flex-shrink: 0;
}
.contact-card .contact-body p { margin-bottom: 4px; }
.contact-card .contact-person { font-size: 1.05em; }
.contact-card .contact-person a { color: #009688; font-weight: 600; }
.contact-card .contact-person a:hover { color: #00796b; }

@media (max-width: 576px) {
    .contact-card { flex-direction: column; text-align: center; }
}