body { font-family: 'Inter', sans-serif; }
.modal { display: none; }
.modal.flex { display: flex; }
.modal-enter { animation: fadeIn 0.3s ease-out; }
@keyframes fadeIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.card { background-color: white; border-radius: 0.75rem; box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); transition: all 0.2s ease-in-out; }
.dark .card { background-color: #1f2937; }
.card:hover { transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); }
.nav-link { transition: all 0.2s; position: relative; }
.nav-link.active { border-bottom-color: rgb(var(--color-primary-600)); color: rgb(var(--color-primary-700)); font-weight: 600; }
.dark .nav-link.active { border-bottom-color: rgb(var(--color-primary-400)); color: rgb(var(--color-primary-400)); }
.nav-link .reorder-arrows { visibility: hidden; opacity: 0; transition: opacity 0.2s; }
.nav-link:hover .reorder-arrows { visibility: visible; opacity: 1; }
.calendar-day { min-height: 140px; }
#notification-toast { transition: transform 0.5s ease-in-out, opacity 0.5s; }
.input-style { display: block; width: 100%; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; background-color: white; border: 1px solid #D1D5DB; color: #1f2937; border-radius: 0.375rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); outline: none; transition: background-color 0.2s, border-color 0.2s, color 0.2s; }
.dark .input-style { background-color: #374151; border-color: #4b5563; color: #f3f4f6; }
.input-style:focus { --tw-ring-color: rgb(var(--color-primary-600)); border-color: rgb(var(--color-primary-600)); }
.dark .input-style:focus { --tw-ring-color: rgb(var(--color-primary-400)); border-color: rgb(var(--color-primary-400)); }
.toggle-checkbox:checked { right: 0; border-color: rgb(var(--color-primary-500)); }
.toggle-checkbox:checked+.toggle-label { background-color: rgb(var(--color-primary-500)); }

/* Custom Select Dropdown */
.custom-select-container { position: relative; }
.custom-select-display {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background-color: white; border: 1px solid #D1D5DB; color: #1f2937;
    border-radius: 0.375rem;
    cursor: pointer;
    min-height: 42px; /* Same as input */
}
.dark .custom-select-display { background-color: #374151; border-color: #4b5563; color: #f3f4f6; }
.custom-select-options {
    display: none;
    position: absolute;
    top: 100%; left: 0; right: 0;
    background-color: white; border: 1px solid #D1D5DB;
    border-top: none; border-radius: 0 0 0.375rem 0.375rem;
    z-index: 10; max-height: 200px; overflow-y: auto;
}
.dark .custom-select-options { background-color: #374151; border-color: #4b5563; }
.custom-select-options.show { display: block; }
.custom-select-option { display: flex; align-items: center; padding: 0.5rem 0.75rem; cursor: pointer; }
.custom-select-option:hover { background-color: #f3f4f6; }
.dark .custom-select-option:hover { background-color: #4b5563; }
.list-item { list-style-type: none !important; }
.list-item.selected { background-color: rgb(var(--color-primary-50)); }
.dark .list-item.selected { background-color: rgb(var(--color-primary-900) / 0.5); }