/* Timezone-aware time display styles */
.server-time {
    position: relative;
    cursor: help;
    border-bottom: 1px dotted #666;
}

.server-time:hover::after {
    content: attr(title);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.9);
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 1000;
}

.relative-time {
    color: #666;
    font-style: italic;
}

.timezone-selector {
    margin: 10px 0;
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

/* Loading state for time conversion */
.server-time[data-converting="true"] {
    opacity: 0.7;
}

.server-time[data-converted="true"] {
    border-bottom-color: #28a745;
}