.eds-c-modal {
	&__trigger,
	&__close {
		display: none;
	}
}

.eds-c-modal__content {
    position: relative;
    background-color: $t-a-palette-default-white;
    padding: $t-a-space-absolute-600;
    border: $t-eds-c-modal-border;
    border-radius: $t-a-space-absolute-200;
    box-shadow: $t-eds-c-modal-box-shadow;
    z-index: $t-eds-c-modal-stack-order;
    width: $t-eds-c-modal-initial-width;
    max-width: $t-eds-c-modal-max-width;

    .eds-c-modal__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative; /* Ensure relative positioning for absolute positioning of close button */

        .eds-c-modal__dismiss {
            position: absolute;
            width: $t-eds-c-modal-close-icon-container-size;
            height: $t-eds-c-modal-close-icon-container-size;
            top: 0;
            right: 0;
            background: none;
            border: none;
            cursor: pointer;
            color: $t-a-palette-default-greyscale-800;
            padding: 0;
        }

        .eds-c-modal__title {
            margin-top: 24px;
            font-weight: $t-eds-c-modal-title-font-weight;
        }
    }

    .eds-c-modal__body {
        margin-top: $t-eds-c-modal-margin;
        margin-bottom: $t-eds-c-modal-margin;
        font-size: $t-a-typography-font-size-s;
    }

    .eds-c-modal__footer {
        display: flex;
        justify-content: flex-end;
        gap: $t-a-space-absolute-400;
    }
}

 @media (max-width: 768px) {
    .eds-c-modal__footer {
        flex-direction: column;
        align-items: stretch;
    }
}

.js .eds-c-modal {
	display: none;

	&--open {
		align-items: center;
		background-color: $t-eds-c-modal-background-color;
		display: flex;
		height: 100%;
		justify-content: center;
		left: 0;
		overflow-y: scroll;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: $t-eds-c-modal-stack-order;
	}

	&__trigger {
		display: inherit;
		display: unset;
	}
}

html.has-eds-c-modal {
	overflow: hidden;
}