@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* Custom styles complementing Tailwind */
.dark body {
    background-color: #111827;
    color: #F3F4F6;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* Line clamp for description */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.dark .hover\:bg-gray-750:hover {
    background-color: #1f2937;
}

/* Checkbox styling fix for dark mode */
.dark input[type="checkbox"] {
    background-color: #374151;
    border-color: #4B5563;
}
.dark input[type="checkbox"]:checked {
    background-color: #2563eb;
    border-color: #2563eb;
}