        .sheet-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 49;
            opacity: 0;
            transition: opacity 0.3s ease-in-out;
            pointer-events: none;
        }

        .sheet-overlay.open {
            opacity: 1;
            pointer-events: auto;
        }

        .sheet-content {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            height: 0;
            max-height: 85vh;
            overflow: hidden;
            z-index: 50;
            transform: translateY(100%);
            transition: transform 0.3s ease-in-out, height 0.3s ease-in-out;
            border-top-left-radius: 0.5rem;
            border-top-right-radius: 0.5rem;
        }

        .sheet-content.open {
            height: 85vh;
            transform: translateY(0);
        }

        .sheet-header {
            padding: 1rem;
            border-bottom: 1px solid #e9d5ff;
        }

        .sheet-title {
            font-size: 1.125rem;
            font-weight: 600;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .sheet-body {
            padding: 1rem;
            overflow-y: auto;
            height: calc(100% - 60px);
            padding-bottom: 5rem;
        }

        .collapsible-content {
            max-height: 0;
            opacity: 0;
            transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;
        }

        .collapsible-content.open {
            max-height: 24rem;
            opacity: 1;
        }

        input[type="checkbox"].peer:checked {
            background-image: linear-gradient(to right, var(--tw-gradient-from), var(--tw-gradient-to));
            --tw-gradient-from: #8b5cf6;
            --tw-gradient-to: #3b82f6;
            border-color: transparent;
        }

        input[type="checkbox"].peer:checked + svg {
            display: block;
        }

        input[type="checkbox"].peer:not(:checked) + svg {
            display: none;
        }
