// ------------------------------------------------------------------------------
// <auto-generated>
//     This code was generated by a tool.
//     Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
// </auto-generated>
// ------------------------------------------------------------------------------
// #region Imports
import { css } from '../../../../../Dom/Css';
// #endregion
/**
 * @public
 */
export function dropZoneElementMemphisStyle() {
    return css `
:host {
  --drop-zone-background-color: var(--memphis-scheme-background);
  --drop-zone-border-color: var(--memphis-scheme-highlight);
  --drop-zone-border-radius: var(--memphis-layout-radius);
  --drop-zone-border-style: solid;
  --drop-zone-border-width: var(--memphis-layout-thickness);
  --drop-zone-font-family: unset;
  --drop-zone-font-letter-spacing: unset;
  --drop-zone-font-line-height: unset;
  --drop-zone-font-size: unset;
  --drop-zone-font-text-decoration: unset;
  --drop-zone-font-text-transform: unset;
  --drop-zone-font-weight: unset;
  --drop-zone-gap: unset;
  --drop-zone-padding-bottom: unset;
  --drop-zone-padding-left: unset;
  --drop-zone-padding-right: unset;
  --drop-zone-padding-top: unset;
  --drop-zone-shadow: unset unset unset unset unset;
  --drop-zone-shadow-blur: unset;
  --drop-zone-shadow-color: unset;
  --drop-zone-shadow-offset-x: unset;
  --drop-zone-shadow-offset-y: unset;
  --drop-zone-shadow-spread: unset;
  --drop-zone-transition-duration: unset;
  --drop-zone-transition-mode: unset;
  --drop-zone-transition-property: unset;
  --drop-zone-translate: none;
}

@media screen and (prefers-reduced-motion: reduce) {
  :host {
    transition-duration: .01ms;
  }
}

:host {
  box-sizing: border-box;
  display: block;
  position: relative;
}

:host *, :host :before, :host :after {
  box-sizing: border-box;
  background-repeat: no-repeat;
}

:host :before, :host :after {
  text-decoration: inherit;
  vertical-align: inherit;
}

:host([hidden]) {
  display: none !important;
}

:host {
  border-color: var(--drop-zone-border-color);
  border-radius: var(--drop-zone-border-radius);
  border-style: var(--drop-zone-border-style);
  border-width: var(--drop-zone-border-width);
  --dz-surface: transparent;
  --dz-accent: #5aa6ff;
  --dz-border: var(--dz-accent);
  --dz-radius: 14px;
  --dz-pad: 1.25rem;
  --dz-duration: .22s;
  --dz-shadow: 0 8px 24px #00000047;
  --dz-dash-size: 16px;
  --dz-dash-thickness: 2px;
  --dz-dash-offset: 0px;
}

@keyframes dz-dash-move {
  to {
    --dz-dash-offset: var(--dz-dash-size, 16px);
  }
}

@keyframes dz-glow {
  from {
    box-shadow: 0 0 0 0 color-mix(in oklab, var(--dz-accent, #5aa6ff) 45%, transparent);
  }

  to {
    box-shadow: 0 0 0 8px color-mix(in oklab, var(--dz-accent, #5aa6ff) 0%, transparent);
  }
}

:host([disabled]:not([disabled="false"])) {
  transition: opacity var(--dz-duration, .22s) ease, filter var(--dz-duration, .22s) ease, transform var(--dz-duration, .22s) ease;
  opacity: .6;
  filter: saturate(.75);
  cursor: not-allowed;
  pointer-events: none;
  transform: scale(.998);
}

:host([state="none"]) {
  padding: var(--dz-pad);
  border: var(--dz-dash-thickness) solid transparent;
  background: linear-gradient(var(--dz-surface), var(--dz-surface)) padding-box, repeating-linear-gradient(90deg, var(--dz-border) 0 calc(var(--dz-dash-size) / 2), transparent calc(var(--dz-dash-size) / 2) var(--dz-dash-size)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  background-position: 0 0, var(--dz-dash-offset) 0;
  background-size: auto, var(--dz-dash-size) var(--dz-dash-thickness);
  transition: transform var(--dz-duration) ease, box-shadow var(--dz-duration) ease, background-color var(--dz-duration) ease, opacity var(--dz-duration) ease, filter var(--dz-duration) ease;
  display: block;
  position: relative;
}

:host([state="drag"]) {
  box-shadow: var(--dz-shadow);
  transition: transform var(--dz-duration, .22s) ease, box-shadow var(--dz-duration, .22s) ease;
  background: linear-gradient(var(--dz-surface, transparent), var(--dz-surface, transparent)) padding-box, repeating-linear-gradient(90deg, var(--dz-border) 0 calc(var(--dz-dash-size, 16px) / 2), transparent calc(var(--dz-dash-size, 16px) / 2) var(--dz-dash-size, 16px)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  background-position: 0 0, var(--dz-dash-offset) 0;
  background-size: auto, var(--dz-dash-size, 16px) var(--dz-dash-thickness, 2px);
  animation: .7s linear infinite dz-dash-move;
  transform: scale(1.01);
}

:host([state="dragover"]) {
  transition: transform var(--dz-duration, .22s) ease;
  background: linear-gradient(var(--dz-surface, transparent), var(--dz-surface, transparent)) padding-box, linear-gradient(var(--dz-accent, #5aa6ff), var(--dz-accent, #5aa6ff)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  animation: .5s linear infinite dz-dash-move, .9s ease-in-out infinite alternate dz-glow;
  transform: scale(1.02);
}

:host([state="dragstart"]) {
  transition: transform var(--dz-duration, .22s) ease;
  background: linear-gradient(var(--dz-surface, transparent), var(--dz-surface, transparent)) padding-box, repeating-linear-gradient(90deg, var(--dz-border) 0 calc(var(--dz-dash-size, 16px) / 2), transparent calc(var(--dz-dash-size, 16px) / 2) var(--dz-dash-size, 16px)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  background-position: 0 0, var(--dz-dash-offset) 0;
  background-size: auto, var(--dz-dash-size, 16px) var(--dz-dash-thickness, 2px);
  animation: .65s linear infinite dz-dash-move;
  transform: scale(1.012);
}

:host([state="dragend"]) {
  opacity: .92;
  transition: opacity var(--dz-duration, .22s) ease, transform var(--dz-duration, .22s) ease;
  background: linear-gradient(var(--dz-surface, transparent), var(--dz-surface, transparent)) padding-box, linear-gradient(var(--dz-border), var(--dz-border)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  transform: scale(1);
}

:host([state="dragenter"]) {
  transition: transform var(--dz-duration, .22s) ease;
  background: linear-gradient(var(--dz-surface, transparent), var(--dz-surface, transparent)) padding-box, linear-gradient(var(--dz-accent, #5aa6ff), var(--dz-accent, #5aa6ff)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  animation: .6s linear infinite dz-dash-move;
  transform: scale(1.015);
}

:host([state="dragleave"]) {
  transition: transform var(--dz-duration, .22s) ease;
  background: linear-gradient(var(--dz-surface, transparent), var(--dz-surface, transparent)) padding-box, repeating-linear-gradient(90deg, var(--dz-border) 0 calc(var(--dz-dash-size, 16px) / 2), transparent calc(var(--dz-dash-size, 16px) / 2) var(--dz-dash-size, 16px)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  background-position: 0 0, var(--dz-dash-offset) 0;
  background-size: auto, var(--dz-dash-size, 16px) var(--dz-dash-thickness, 2px);
  animation: .6s linear infinite dz-dash-move;
  transform: scale(1.005);
}

:host([state="drop"]) {
  transition: transform var(--dz-duration, .22s) ease;
  background: linear-gradient(var(--dz-surface, transparent), var(--dz-surface, transparent)) padding-box, linear-gradient(var(--dz-accent, #5aa6ff), var(--dz-accent, #5aa6ff)) border-box;
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  transform: scale(1.005);
}

    `;
}
//# sourceMappingURL=DropZoneElement.Memphis.js.map