/* ==========================================================================
   DD Dialog – sdílené styly (frontend + editor)
   ========================================================================== */

/* --------------------------------------------------------------------------
   Trigger tlačítko / odkaz
   -------------------------------------------------------------------------- */
.dd-dialog__trigger--button {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	padding: .55em 1.3em;
	background: var(--wp--preset--color--primary, #1a1a1a);
	color: var(--wp--preset--color--base, #fff);
	border: 2px solid transparent;
	border-radius: 4px;
	font-size: inherit;
	font-family: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
	text-decoration: none;
}

.dd-dialog__trigger--button:hover,
.dd-dialog__trigger--button:focus-visible {
	background: transparent;
	color: var(--wp--preset--color--primary, #1a1a1a);
	border-color: var(--wp--preset--color--primary, #1a1a1a);
	outline: none;
}

.dd-dialog__trigger--link {
	display: inline-block;
	color: var(--wp--preset--color--primary, #1a1a1a);
	font-weight: 600;
	cursor: pointer;
	text-decoration: underline;
	background: none;
	border: none;
	padding: 0;
	font-size: inherit;
	font-family: inherit;
}

.dd-dialog__trigger--link:hover {
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Overlay
   -------------------------------------------------------------------------- */
.dd-dialog__overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .55);
    backdrop-filter: blur(3px);
	z-index: 99998;
	opacity: 0;
	pointer-events: none;
	transition: opacity .25s ease;
}

.dd-dialog--open .dd-dialog__overlay {
	opacity: 1;
	pointer-events: auto;
}

/* --------------------------------------------------------------------------
   Box – základní
   -------------------------------------------------------------------------- */
.dd-dialog__box {
	position: fixed;
	z-index: 99999;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 8px 48px rgba(0, 0, 0, .22);
	width: calc(100% - 2rem);
	display: flex;
	flex-direction: column;
	max-height: 90vh;
	overflow: hidden;
	pointer-events: none;
	opacity: 0;
	/* Zabráníme přetékání obsahu */
}

.dd-dialog--open .dd-dialog__box {
	pointer-events: auto;
	opacity: 1;
}

/* --------------------------------------------------------------------------
   Pozice
   -------------------------------------------------------------------------- */

/* Střed (default) */
.dd-dialog--pos-center .dd-dialog__box {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) translateY(0);
}

/* Vlevo */
.dd-dialog--pos-left .dd-dialog__box {
	top: 50%;
	left: 1rem;
	transform: translateY(-50%) translateX(0);
}

/* Vpravo */
.dd-dialog--pos-right .dd-dialog__box {
	top: 50%;
	right: 1rem;
	left: auto;
	transform: translateY(-50%) translateX(0);
}

/* Nahoře */
.dd-dialog--pos-top .dd-dialog__box {
	top: 1rem;
	left: 50%;
	transform: translateX(-50%);
}

/* Dole */
.dd-dialog--pos-bottom .dd-dialog__box {
	bottom: 1rem;
	top: auto;
	left: 50%;
	transform: translateX(-50%);
}

/* --------------------------------------------------------------------------
   Animace – fade
   -------------------------------------------------------------------------- */
.dd-dialog__box--anim-fade {
	transition: opacity .25s ease;
}

.dd-dialog--open .dd-dialog__box--anim-fade {
	opacity: 1;
}

/* --------------------------------------------------------------------------
   Animace – slide
   -------------------------------------------------------------------------- */
.dd-dialog--pos-center .dd-dialog__box--anim-slide {
	transform: translate(-50%, calc(-50% - 24px));
	transition: opacity .28s ease, transform .28s cubic-bezier(.22,1,.36,1);
}
.dd-dialog--pos-center.dd-dialog--open .dd-dialog__box--anim-slide {
	transform: translate(-50%, -50%);
	opacity: 1;
}

.dd-dialog--pos-top .dd-dialog__box--anim-slide {
	transform: translateX(-50%) translateY(-24px);
	transition: opacity .28s ease, transform .28s cubic-bezier(.22,1,.36,1);
}
.dd-dialog--pos-top.dd-dialog--open .dd-dialog__box--anim-slide {
	transform: translateX(-50%) translateY(0);
	opacity: 1;
}

.dd-dialog--pos-bottom .dd-dialog__box--anim-slide {
	transform: translateX(-50%) translateY(24px);
	transition: opacity .28s ease, transform .28s cubic-bezier(.22,1,.36,1);
}
.dd-dialog--pos-bottom.dd-dialog--open .dd-dialog__box--anim-slide {
	transform: translateX(-50%) translateY(0);
	opacity: 1;
}

.dd-dialog--pos-left .dd-dialog__box--anim-slide {
	transform: translateY(-50%) translateX(-24px);
	transition: opacity .28s ease, transform .28s cubic-bezier(.22,1,.36,1);
}
.dd-dialog--pos-left.dd-dialog--open .dd-dialog__box--anim-slide {
	transform: translateY(-50%) translateX(0);
	opacity: 1;
}

.dd-dialog--pos-right .dd-dialog__box--anim-slide {
	transform: translateY(-50%) translateX(24px);
	transition: opacity .28s ease, transform .28s cubic-bezier(.22,1,.36,1);
}
.dd-dialog--pos-right.dd-dialog--open .dd-dialog__box--anim-slide {
	transform: translateY(-50%) translateX(0);
	opacity: 1;
}

/* --------------------------------------------------------------------------
   Animace – zoom
   -------------------------------------------------------------------------- */
.dd-dialog--pos-center .dd-dialog__box--anim-zoom {
	transform: translate(-50%, -50%) scale(.92);
	transition: opacity .22s ease, transform .22s cubic-bezier(.34,1.56,.64,1);
}
.dd-dialog--pos-center.dd-dialog--open .dd-dialog__box--anim-zoom {
	transform: translate(-50%, -50%) scale(1);
	opacity: 1;
}

/* Ostatní pozice – zoom */
.dd-dialog--pos-top .dd-dialog__box--anim-zoom,
.dd-dialog--pos-bottom .dd-dialog__box--anim-zoom,
.dd-dialog--pos-left .dd-dialog__box--anim-zoom,
.dd-dialog--pos-right .dd-dialog__box--anim-zoom {
	transition: opacity .22s ease, transform .22s cubic-bezier(.34,1.56,.64,1);
}

/* --------------------------------------------------------------------------
   Zavírací X
   -------------------------------------------------------------------------- */
.dd-dialog__close-x {
	position: absolute;
	top: 0rem;
	right: 0rem;
	background: none;
	border: none;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	color: #666;
	padding: .15rem .4rem;
	border-radius: 4px;
	transition: color .15s, background .15s;
	z-index: 1;
}

.dd-dialog__close-x:hover,
.dd-dialog__close-x:focus-visible {
	color: #000;
	background: #f0f0f0;
	outline: none;
}

/* --------------------------------------------------------------------------
   Obsah
   -------------------------------------------------------------------------- */
.dd-dialog__content {
	padding: 1.75rem 1.75rem 1rem;
	overflow-y: auto;
	flex: 1 1 auto;
}

.dd-dialog__content > *:first-child { margin-top: 0; }
.dd-dialog__content > *:last-child  { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   Footer (zavírací tlačítko)
   -------------------------------------------------------------------------- */
.dd-dialog__footer {
	padding: .85rem 1.75rem 1.25rem;
	display: flex;
	/* justify-content: flex-end; */
    justify-content: center;
	border-top: 1px solid #e5e5e5;
	flex-shrink: 0;
}

.dd-dialog__close-btn {
	display: inline-flex;
	align-items: center;
	padding: .48em 1.2em;
	background: var(--wp--preset--color--primary, #1a1a1a);
	color: var(--wp--preset--color--base, #fff);
	border: 2px solid transparent;
	border-radius: 4px;
	font-size: .95rem;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
	font-family: inherit;
}

.dd-dialog__close-btn:hover,
.dd-dialog__close-btn:focus-visible {
	background: transparent;
	color: var(--wp--preset--color--primary, #1a1a1a);
	border-color: var(--wp--preset--color--primary, #1a1a1a);
	outline: none;
}

/* --------------------------------------------------------------------------
   Body lock při otevřeném dialogu
   -------------------------------------------------------------------------- */
.dd-dialog-body--locked {
	overflow: hidden;
}

/* --------------------------------------------------------------------------
   Responsivita
   -------------------------------------------------------------------------- */
@media ( max-width: 600px ) {
	.dd-dialog__box {
		width: calc(100% - 1rem);
		border-radius: 6px;
	}

	.dd-dialog--pos-left .dd-dialog__box,
	.dd-dialog--pos-right .dd-dialog__box {
		left: .5rem;
		right: .5rem;
		transform: translateY(-50%);
	}

	.dd-dialog__content {
		padding: 1.25rem 1.1rem .75rem;
	}

	.dd-dialog__footer {
		padding: .65rem 1.1rem 1rem;
	}
}