/* Extracted from morse-runner-v2.html */
.section-header {
position: relative !important;
display: flex !important;
justify-content: flex-start !important;
align-items: center !important;
width: 100% !important;
min-height: 40px !important;
padding: 8px 40px 8px 8px !important;
}
.section-header h2 {
flex: 1 1 auto !important;
margin: 0 !important;
font-size: 1.25rem !important;
}
.icon-container {
position: absolute !important;
right: 8px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 24px !important;
height: 24px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
cursor: default !important;
transition: none !important;
}
/* Remove any hover effects on icon containers */
.icon-container:hover {
transform: translateY(-50%) !important;
background-color: transparent !important;
}
.section-header svg {
width: 24px !important;
height: 24px !important;
stroke: white !important;
cursor: default !important;
transition: none !important;
}
/* Remove any hover effects on section header icons */
.section-header svg:hover {
transform: none !important;
color: inherit !important;
stroke: white !important;
}
/* Contest Log Styling */
.contest-log {
font-family: 'Courier New', monospace;
font-size: 14px;
}
.contest-log th {
background: #374151;
position: sticky;
top: 0;
z-index: 10;
}
.contest-log tr.logged-qso {
background: #065f46;
}
.contest-log tr.duplicate {
background: #7f1d1d;
}
.contest-log tr.multiplier {
background: #1e40af;
}
/* Input Field Styling */
.callsign-input {
font-family: 'Courier New', monospace;
font-size: 18px;
font-weight: bold;
text-transform: uppercase;
}
/* Function Key Styling */
.function-key {
font-family: 'Courier New', monospace;
font-size: 12px;
min-height: 60px;
}
/* Disabled state for function keys and action buttons */
.function-key.disabled, .action-button.disabled {
opacity: 0.4;
cursor: not-allowed;
pointer-events: none;
}
/* Score Display */
.score-display {
font-family: 'Courier New', monospace;
font-weight: bold;
}
/* Station Status Indicators */
.station-indicator {
display: inline-block;
width: 12px;
height: 12px;
border-radius: 50%;
margin-right: 6px;
}
.station-cq { background: #10b981; }
.station-sp { background: #f59e0b; }
.station-pile { background: #ef4444; }
/* Animation for new QSOs */
@keyframes newQSO {
0% { background: #3b82f6; }
100% { background: transparent; }
}
.new-qso {
animation: newQSO 2s ease-out;
}
/* Contest Timer */
.contest-timer {
font-family: 'Courier New', monospace;
font-size: 24px;
font-weight: bold;
}
.morse-logo {
font-family: 'Courier New', monospace;
font-size: 16px;
letter-spacing: 2px;
color: #60a5fa;
padding: 8px 12px;
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
border-radius: 8px;
border: 1px solid #4b5563;
display: inline-block;
}
.professional-header {
background: linear-gradient(135deg, #1f2937, #111827);
}
/* Prevent boxes from being draggable/movable - make completely static */
.section {
position: static !important;
cursor: default !important;
user-select: none;
-webkit-user-drag: none;
-khtml-user-drag: none;
-moz-user-drag: none;
-o-user-drag: none;
user-drag: none;
pointer-events: auto;
transition: none !important;
}
/* Remove any hover effects on sections to make them feel static */
.section:hover {
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
transform: none !important;
cursor: default !important;
}
.section * {
user-select: text;
-webkit-user-drag: none;
-khtml-user-drag: none;
-moz-user-drag: none;
-o-user-drag: none;
user-drag: none;
}
.section-header {
cursor: default !important;
user-select: none;
transition: none !important;
}
.section-header * {
cursor: default !important;
user-select: none;
}
/* Remove any hover effects on section headers to make them feel static */
.section-header:hover {
background-color: transparent !important;
color: inherit !important;
transform: none !important;
box-shadow: none !important;
}
/* Ensure inputs and controls remain interactive */
.section input,
.section select,
.section button,
.section textarea {
cursor: auto !important;
user-select: text;
pointer-events: auto;
}
/* Make all non-interactive elements in sections feel completely static */
.section h1, .section h2, .section h3, .section h4, .section h5, .section h6,
.section p, .section div:not([class*="button"]):not([class*="input"]):not([class*="select"]):not([id*="Button"]),
.section span:not([class*="button"]):not([class*="input"]) {
cursor: default !important;
user-select: text !important;
transition: none !important;
}
/* Remove hover effects from all static elements */
.section h1:hover, .section h2:hover, .section h3:hover, .section h4:hover, .section h5:hover, .section h6:hover,
.section p:hover, .section span:hover:not([class*="button"]):not([class*="input"]) {
background-color: transparent !important;
color: inherit !important;
transform: none !important;
box-shadow: none !important;
}
/* Make sure the contest settings section doesn't look movable */
.section[data-id="contest-settings"] {
border: 1px solid #374151 !important;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
}
.section[data-id="contest-settings"]:hover {
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
transform: none !important;
}
border-bottom: 2px solid #374151;
}
.nav-link {
position: relative;
transition: all 0.3s ease;
}
.nav-link:hover::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
right: 0;
height: 2px;
background: linear-gradient(90deg, #60a5fa, #3b82f6);
border-radius: 1px;
}
.word-separator {
font-size: 14px;
color: #9ca3af;
margin: 0 3px;
}
/* Version 2 Badge */
.version-badge {
display: inline-block;
background: linear-gradient(135deg, #3b82f6, #2563eb);
color: white;
font-size: 12px;
font-weight: bold;
padding: 4px 8px;
border-radius: 12px;
margin-left: 8px;
text-transform: uppercase;
letter-spacing: 0.5px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
/* Leaderboard styles moved to separate page */