@layer base {
    details > summary {
        list-style: none;
    }

    details > summary::-webkit-details-marker {
        display: none;
    }

    :root {
        --sl-bg: #eef4fb;
        --sl-surface: #ffffff;
        --sl-surface-soft: #f4f9ff;
        --sl-border: #cad9eb;
        --sl-border-soft: #deebf6;
        --sl-text: #506681;
        --sl-text-strong: #17345f;
        --sl-primary: #1f5faa;
        --sl-primary-soft: #dbeaff;
        --sl-secondary: #1698b0;
        --sl-secondary-soft: #ddf6fb;
        --sl-accent: #d5a23c;
        --sl-accent-soft: #fff1cb;
        --sl-success-soft: #e6f7ef;
        --sl-blue-soft: #e7f0ff;
        --sl-amber-soft: #fff2d3;
        --sl-shadow: 0 20px 48px rgba(26, 63, 120, 0.10);
    }

    html {
        font-family: 'Manrope', sans-serif;
    }

    body {
        @apply m-0 bg-[var(--sl-bg)] text-[var(--sl-text)];
    }

    * {
        @apply box-border;
    }
}

@layer base {
    .modal {
        display: none;
    }

    .modal.in {
        display: block;
    }

    .modal-dialog {
        margin: 3rem auto;
        max-width: 56rem;
    }

    .modal-content {
        border-radius: 1.5rem;
        border: 1px solid #dce3f3;
        background: #fff;
        box-shadow: 0 24px 60px rgba(88, 107, 152, 0.18);
    }

    .modal-header,
    .modal-body,
    .modal-footer {
        padding: 1.25rem 1.5rem;
    }

    .close {
        border: 0;
        background: transparent;
        font-size: 1.5rem;
        line-height: 1;
    }
}