//@import "../../../abstracts/abstracts";

.dbq-popup-notification-container {
	@include dropdown-menu;
    z-index: 9999;
	position: fixed;
	top: 20px;
	right: 80px;
	width: 350px;
	padding: $padding-default;
	height: auto;
	overflow: initial;

	// Arrow sticking out
	&::after {
		content: " ";
		width: 16px;
		height: 16px;
		position: absolute;
		top: 10px;
		right: -9px;
		border-radius: 0;
		background: $popup-menu-background-color;
		border-top: 2px solid $popup-menu-border-color;
		border-right: 2px solid $popup-menu-border-color;
		transform: rotate(45deg);
	}
	h3 {
        font-size: 18px;
		line-height: 20px;
		font-weight: 600;
		color: $color-primary;
	}
	p {
        font-size: $font-size-small;
		line-height: 20px;
		font-weight: 400;
		color: $text-color-default;
	}
    button {
		float: left;
		width: auto;
		clear: both;
		padding: 7px 15px;
		font-size: $font-size-small;
		line-height: 20px;
		font-weight: 600;
		text-align: left;
		border-radius: $border-radius-button-default;
        &.btn-primary {
            margin-top: 5px;
            background-color: $color-primary;
            border: 2px solid $global-border-color; // To-do: change global border to button border color
            @include shadow;
			&:hover {
				background: color(button-hover-background-color);
				border-color: color(button-hover-border-color);
				color: color(button-hover-text-color);
			}
        }
        &.btn-link {
            width: auto;
            padding: 0;
            margin-top: 10px;
            text-align: left;
            font-size: $font-size-small;
            line-height: 20px;
            font-weight: 600;
            border-radius: $border-radius-button-default;
            color: $text-color-default;
        }
	}

	.dbq-popup-notification-checkbox-label {
		float: left;
		clear: both;
		margin-top: $margin-default;
		display: flex;
		gap: 10px;
		cursor: pointer;
		justify-content: center;
		align-items: center;

		input[type="checkbox"] {
			width: 18px;
			height: 18px;
			accent-color: $color-primary;
			cursor: pointer;
		}

		.dbq-popup-notification-checkbox-label-title {
			font-size: $font-size-small;
		}
	}
}