@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css');
/* General container styling */
.registration-timer-widget {
    background-color: #ffffff; /* White background */
    border: 1px solid #e5e7eb; /* Light gray border */
    border-radius: 12px; /* Smooth corners */
    padding: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    font-family: 'Inter', sans-serif; /* Modern font */
    max-width: 600px;
    margin: 0 auto; /* Center the widget */
}

/* Header styling */
.registration-timer-widget h3 {
    font-size: 1.5rem; /* Larger text size */
    font-weight: bold;
    text-align: center;
    color: #1f2937; /* Dark gray */
    margin-bottom: 16px;
}

/* Timer container */
.registration-timer-widget .timer {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 16px;
}

/* Individual timer box */
.registration-timer-widget .timer-box {
    background-color: #f3f4f6; /* Light gray background */
    border-radius: 8px;
    padding: 12px 16px;
    text-align: center;
    min-width: 80px;
}

/* Timer box text */
.registration-timer-widget .timer-box span {
    display: block;
    font-size: 1.25rem; /* Number size */
    font-weight: bold;
    color: #111827; /* Dark text */
}

.registration-timer-widget .timer-box .label {
    font-size: 0.875rem; /* Smaller label text */
    color: #6b7280; /* Gray */
}

/* Warning styling */
.registration-timer-widget .warning {
    background-color: #fee2e2; /* Red-100 */
    color: #b91c1c; /* Red-700 */
    border: 1px solid #fca5a5; /* Red-400 */
    border-radius: 8px;
    padding: 12px;
    text-align: center;
    margin-top: 16px;
    font-size: 1rem;
    font-weight: bold;
}

/* Icon styling */
.registration-timer-widget i {
    margin-right: 8px;
    color: #9ca3af; /* Gray-400 */
    font-size: 1.5rem;
    vertical-align: middle;
}