/* 
 * Global Poppins Font Override
 * This file overrides Semantic UI's Lato font with Poppins across the entire platform
 * Include this file AFTER semantic-ui CSS and poppins.css
 */

/* =====================================================
   GLOBAL FONT OVERRIDE - Replace Lato with Poppins
   ===================================================== */

/* Base body and html */
body,
html {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* All headings */
h1, h2, h3, h4, h5, h6,
.ui.header {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Semantic UI Components */
.ui.button,
.ui.buttons .button {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.menu,
.ui.menu .item {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.dropdown,
.ui.dropdown .menu > .item {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.input > input,
.ui.form input,
.ui.form textarea,
.ui.form select {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.label,
.ui.labels .label {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.message,
.ui.card,
.ui.cards > .card {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.modal,
.ui.modal > .header,
.ui.modal > .content,
.ui.modal > .actions {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.popup {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
  z-index: 2000 !important;
}

.ui.segment,
.ui.segments .segment {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.table,
.ui.table th,
.ui.table td {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.list,
.ui.list .item,
.ui.list .list > .item {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.list .item .header,
.ui.list .list > .item .header {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.steps .step .title,
.ui.steps .step .description {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.accordion .title,
.ui.accordion .content {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.tab {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.breadcrumb {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.statistic,
.ui.statistics .statistic {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.text.container {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Form elements */
.ui.form .field > label {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

.ui.checkbox label,
.ui.radio.checkbox label {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Toastr notifications */
.toast-message,
.toast-title {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Calendar */
.ui.calendar {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Pagination */
.ui.pagination.menu .item {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Search */
.ui.search > .results .result .title,
.ui.search > .results .result .description {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Dimmer */
.ui.dimmer .content {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Loader */
.ui.loader:before,
.ui.loader:after {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Progress */
.ui.progress .bar > .progress {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Rating */
.ui.rating {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Sidebar */
.ui.sidebar {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Sticky */
.ui.sticky {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* =====================================================
   ADDITIONAL CUSTOM ELEMENTS
   ===================================================== */

/* Navigation */
.nav-bar,
.navbar,
.navigation {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Footer */
footer,
.footer {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Competition cards and tiles */
.competition-tile,
.competition-card {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* User interface elements */
.user-dropdown,
.user-menu {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Tooltips */
[data-tooltip]:after {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
  white-space: nowrap !important;
  min-width: 150px !important;
  max-width: 400px !important;
  width: auto !important;
  text-align: left !important;
}

/* General paragraph and text */
p, span, div, a, li, td, th, label {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif;
}

/* Placeholder text */
::placeholder {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

::-webkit-input-placeholder {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

::-moz-placeholder {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

:-ms-input-placeholder {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* EasyMDE Editor */
.EasyMDEContainer,
.CodeMirror {
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Exception: Keep monospace for code elements */
code, pre, kbd, samp,
.ui.code,
#version {
  font-family: 'Overpass Mono', 'Consolas', 'Monaco', monospace !important;
}

/* =====================================================
   FORM DROPDOWN STYLING - Fix dark dropdown text issue
   ===================================================== */

/* Form dropdowns inside modals and form pages - keep white background with dark text */
.ui.modal .ui.form .ui.dropdown,
.ui.modal .ui.form .ui.selection.dropdown,
.ui.modal .ui.form .ui.search.dropdown,
.ui.form .ui.dropdown,
.ui.form .ui.selection.dropdown,
.ui.form .ui.search.dropdown,
competition-form .ui.dropdown,
competition-form .ui.selection.dropdown,
competition-details .ui.dropdown,
competition-phases .ui.dropdown,
competition-leaderboards .ui.dropdown,
competition-pages .ui.dropdown,
competition-participation .ui.dropdown,
competition-collaborators .ui.dropdown {
  background: #ffffff !important;
  color: rgba(0, 0, 0, 0.87) !important;
  border: 1px solid rgba(34, 36, 38, 0.15) !important;
}

.ui.modal .ui.form .ui.dropdown .menu,
.ui.modal .ui.form .ui.selection.dropdown .menu,
.ui.modal .ui.form .ui.search.dropdown .menu,
.ui.form .ui.dropdown .menu,
.ui.form .ui.selection.dropdown .menu,
.ui.form .ui.search.dropdown .menu,
competition-form .ui.dropdown .menu,
competition-details .ui.dropdown .menu,
competition-phases .ui.dropdown .menu,
competition-leaderboards .ui.dropdown .menu,
competition-pages .ui.dropdown .menu,
competition-participation .ui.dropdown .menu,
competition-collaborators .ui.dropdown .menu {
  background: #ffffff !important;
  border: 1px solid rgba(34, 36, 38, 0.15) !important;
  box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15) !important;
}

.ui.modal .ui.form .ui.dropdown .menu > .item,
.ui.modal .ui.form .ui.selection.dropdown .menu > .item,
.ui.modal .ui.form .ui.search.dropdown .menu > .item,
.ui.form .ui.dropdown .menu > .item,
.ui.form .ui.selection.dropdown .menu > .item,
.ui.form .ui.search.dropdown .menu > .item,
competition-form .ui.dropdown .menu > .item,
competition-details .ui.dropdown .menu > .item,
competition-phases .ui.dropdown .menu > .item,
competition-leaderboards .ui.dropdown .menu > .item,
competition-pages .ui.dropdown .menu > .item,
competition-participation .ui.dropdown .menu > .item,
competition-collaborators .ui.dropdown .menu > .item {
  color: rgba(0, 0, 0, 0.87) !important;
  border-top: 1px solid #fafafa !important;
}

.ui.modal .ui.form .ui.dropdown .menu > .item:hover,
.ui.modal .ui.form .ui.selection.dropdown .menu > .item:hover,
.ui.modal .ui.form .ui.search.dropdown .menu > .item:hover,
.ui.form .ui.dropdown .menu > .item:hover,
.ui.form .ui.selection.dropdown .menu > .item:hover,
.ui.form .ui.search.dropdown .menu > .item:hover,
competition-form .ui.dropdown .menu > .item:hover,
competition-details .ui.dropdown .menu > .item:hover,
competition-phases .ui.dropdown .menu > .item:hover,
competition-leaderboards .ui.dropdown .menu > .item:hover,
competition-pages .ui.dropdown .menu > .item:hover,
competition-participation .ui.dropdown .menu > .item:hover,
competition-collaborators .ui.dropdown .menu > .item:hover {
  background: rgba(0, 0, 0, 0.05) !important;
  color: rgba(0, 0, 0, 0.95) !important;
}

.ui.modal .ui.form .ui.dropdown .menu > .item.selected,
.ui.modal .ui.form .ui.selection.dropdown .menu > .item.selected,
.ui.modal .ui.form .ui.search.dropdown .menu > .item.selected,
.ui.form .ui.dropdown .menu > .item.selected,
.ui.form .ui.selection.dropdown .menu > .item.selected,
.ui.form .ui.search.dropdown .menu > .item.selected,
competition-form .ui.dropdown .menu > .item.selected,
competition-details .ui.dropdown .menu > .item.selected,
competition-phases .ui.dropdown .menu > .item.selected {
  background: rgba(0, 0, 0, 0.03) !important;
  color: rgba(0, 0, 0, 0.95) !important;
}

.ui.modal .ui.form .ui.dropdown .text,
.ui.modal .ui.form .ui.selection.dropdown .text,
.ui.form .ui.dropdown .text,
.ui.form .ui.selection.dropdown .text,
competition-form .ui.dropdown .text,
competition-details .ui.dropdown .text,
competition-phases .ui.dropdown .text {
  color: rgba(0, 0, 0, 0.87) !important;
}

.ui.modal .ui.form .ui.dropdown .default.text,
.ui.form .ui.dropdown .default.text,
competition-form .ui.dropdown .default.text,
competition-details .ui.dropdown .default.text,
competition-phases .ui.dropdown .default.text {
  color: rgba(0, 0, 0, 0.4) !important;
}

.ui.modal .ui.form .ui.dropdown input.search,
.ui.form .ui.dropdown input.search,
competition-form .ui.dropdown input.search,
competition-details .ui.dropdown input.search,
competition-phases .ui.dropdown input.search {
  color: rgba(0, 0, 0, 0.87) !important;
}

/* Selected items in multiple selection dropdown */
.ui.modal .ui.form .ui.multiple.dropdown > .label,
.ui.modal .ui.form .ui.multiple.selection.dropdown > a.ui.label,
.ui.form .ui.multiple.dropdown > .label,
.ui.form .ui.multiple.selection.dropdown > a.ui.label,
competition-form .ui.multiple.dropdown > .label,
competition-details .ui.multiple.dropdown > .label,
competition-phases .ui.multiple.dropdown > .label {
  background: #e8e8e8 !important;
  color: rgba(0, 0, 0, 0.87) !important;
  border: none !important;
  box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset !important;
}

/* =====================================================
   TOOLTIP Z-INDEX FIX - Show tooltips above modals
   ===================================================== */

/* Semantic UI tooltips use [data-tooltip] attribute */
[data-tooltip]:before,
[data-tooltip]:after {
  z-index: 2000 !important;
}

/* Ensure tooltips appear above modals (modal z-index is typically 1000) */
.ui.dimmer {
  z-index: 1000 !important;
}

.ui.modal {
  z-index: 1001 !important;
}

/* Specifically target help icon tooltips */
.help.icon.circle[data-tooltip]:before,
.help.icon.circle[data-tooltip]:after,
i.help.circle.icon[data-tooltip]:before,
i.help.circle.icon[data-tooltip]:after,
span[data-tooltip]:before,
span[data-tooltip]:after {
  z-index: 2000 !important;
}

/* Make sure inverted tooltips also have high z-index */
[data-inverted][data-tooltip]:before,
[data-inverted][data-tooltip]:after {
  z-index: 2000 !important;
}

/* For longer tooltips, allow wrapping but keep minimum width */
[data-tooltip][data-position="bottom center"]:after,
[data-tooltip][data-position="top center"]:after,
[data-tooltip][data-position="right center"]:after,
[data-tooltip][data-position="left center"]:after {
  white-space: normal !important;
  min-width: 200px !important;
  max-width: 350px !important;
  width: max-content !important;
}
/* =====================================================================================
   Markdown Table Styling - for tables generated by marked.js
   These styles make plain <table> elements look like Semantic UI .ui.table
   ===================================================================================== */

/* Base table styling */
table:not(.ui) {
  width: 100%;
  background: #fff;
  margin: 1em 0;
  border: 1px solid rgba(34, 36, 38, 0.15);
  border-radius: 0.28571429rem;
  text-align: left;
  color: rgba(0, 0, 0, 0.87);
  border-collapse: separate;
  border-spacing: 0;
  font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
}

/* Table header styling */
table:not(.ui) th {
  cursor: auto;
  background: #f9fafb;
  text-align: inherit;
  color: rgba(0, 0, 0, 0.87);
  padding: 0.92857143em 0.78571429em;
  vertical-align: inherit;
  font-style: normal;
  font-weight: 700;
  text-transform: none;
  border-bottom: 1px solid rgba(34, 36, 38, 0.1);
  border-left: none;
}

/* Table cell styling */
table:not(.ui) td {
  padding: 0.78571429em 0.78571429em;
  text-align: inherit;
  border-top: 1px solid rgba(34, 36, 38, 0.1);
}

/* First row cells have no top border */
table:not(.ui) tbody tr:first-child td {
  border-top: none;
}

/* Border radius for corners */
table:not(.ui) thead tr:first-child th:first-child {
  border-radius: 0.28571429rem 0 0 0;
}

table:not(.ui) thead tr:first-child th:last-child {
  border-radius: 0 0.28571429rem 0 0;
}

table:not(.ui) tbody tr:last-child td:first-child {
  border-radius: 0 0 0 0.28571429rem;
}

table:not(.ui) tbody tr:last-child td:last-child {
  border-radius: 0 0 0.28571429rem 0;
}

/* Hover effect for table rows */
table:not(.ui) tbody tr:hover {
  background: rgba(0, 0, 0, 0.05);
}

/* Striped table effect */
table:not(.ui) tbody tr:nth-child(even) {
  background: rgba(0, 0, 50, 0.02);
}

table:not(.ui) tbody tr:nth-child(even):hover {
  background: rgba(0, 0, 0, 0.05);
}