@layer theme,base,components;@layer kirby{.panel-mock{--dialog-color-back:var(--panel-color-back);--dialog-color-text:currentColor;--dialog-margin:var(--spacing-6);--dialog-padding:var(--spacing-6);--dialog-rounded:var(--rounded-xl);--dialog-shadow:var(--shadow-xl);--dialog-width:22rem}.panel-mock .k-dialog-portal{padding:var(--dialog-margin)}.panel-mock .k-dialog{background:var(--dialog-color-back);color:var(--dialog-color-text);width:clamp(10rem,100%,var(--dialog-width));max-height:calc(100dvh - var(--dialog-margin) - var(--dialog-margin));box-shadow:var(--dialog-shadow);border-radius:var(--dialog-rounded);flex-direction:column;line-height:1;display:flex;position:relative;overflow:clip;container-type:inline-size}@media screen and (width>=20rem){.panel-mock .k-dialog[data-size=small]{--dialog-width:20rem}}@media screen and (width>=22rem){.panel-mock .k-dialog[data-size=default]{--dialog-width:22rem}}@media screen and (width>=30rem){.panel-mock .k-dialog[data-size=medium]{--dialog-width:30rem}}@media screen and (width>=40rem){.panel-mock .k-dialog[data-size=large]{--dialog-width:40rem}}@media screen and (width>=60rem){.panel-mock .k-dialog[data-size=huge]{--dialog-width:60rem}}.panel-mock .k-dialog .k-pagination{justify-content:center;align-items:center;margin-bottom:-1.5rem;display:flex}.panel-mock .k-dialog>.k-dropzone{flex-direction:column;min-height:0;display:flex}.panel-mock .k-dialog>.k-dropzone:after{border-radius:var(--dialog-rounded);outline-offset:-2px}.panel-mock .k-dialog-body{padding:var(--dialog-padding)}.panel-mock .k-dialog:has(.k-dialog-footer) .k-dialog-body{padding-bottom:0}.panel-mock .k-dialog-footer{padding:var(--dialog-padding);flex-shrink:0;line-height:1}}@layer utilities;
