/* docara-shell-source: runtime/utility/drop-shadow/default/css/default.css */
@layer sf.utilities {
  .drop-shadow-0 {
    --sf-shadow--level-ratio: 0;
  }
  .drop-shadow-1 {
    --sf-shadow--level-ratio: 1;
  }
  .drop-shadow-2 {
    --sf-shadow--level-ratio: 2;
  }
  .drop-shadow-3 {
    --sf-shadow--level-ratio: 4;
  }
  .drop-shadow-4 {
    --sf-shadow--level-ratio: 8;
  }
  .drop-shadow-5 {
    --sf-shadow--level-ratio: 16;
  }
}

/* docara-shell-source: runtime/utility/drop-shadow-color/default/css/default.css */
@layer sf.utilities {
  .drop-shadow-transparent {
    --sf-shadow--color: var(--sf-transparent);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-transparent) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-transparent) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-transparent) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-current {
    --sf-shadow--color: var(--sf-current);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-current) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-current) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-current) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface {
    --sf-shadow--color: var(--sf-surface-1);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-0 {
    --sf-shadow--color: var(--sf-surface-0);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-0) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-0) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-0) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-1 {
    --sf-shadow--color: var(--sf-surface-1);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-2 {
    --sf-shadow--color: var(--sf-surface-2);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-2) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-2) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-2) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-3 {
    --sf-shadow--color: var(--sf-surface-3);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-3) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-3) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-3) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-4 {
    --sf-shadow--color: var(--sf-surface-4);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-4) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-4) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-4) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-container {
    --sf-shadow--color: var(--sf-surface-container);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-container) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-container) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-container) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-inverse {
    --sf-shadow--color: var(--sf-surface-inverse);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-surface-inverse-fixed {
    --sf-shadow--color: var(--sf-surface-inverse-fixed);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse-fixed) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse-fixed) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse-fixed) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-on-surface-variant {
    --sf-shadow--color: var(--sf-on-surface-variant);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface-variant) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface-variant) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface-variant) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-primary {
    --sf-shadow--color: var(--sf-primary);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-primary-container {
    --sf-shadow--color: var(--sf-primary-container);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-container) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-container) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-container) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-primary-transparent-select {
    --sf-shadow--color: var(--sf-primary-transparent-select);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-select) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-select) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-select) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-primary-transparent-overlay {
    --sf-shadow--color: var(--sf-primary-transparent-overlay);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-overlay) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-overlay) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-overlay) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-secondary {
    --sf-shadow--color: var(--sf-secondary);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-secondary-container {
    --sf-shadow--color: var(--sf-secondary-container);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-container) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-container) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-container) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-secondary-transparent-select {
    --sf-shadow--color: var(--sf-secondary-transparent-select);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-select) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-select) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-select) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-secondary-transparent-overlay {
    --sf-shadow--color: var(--sf-secondary-transparent-overlay);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-overlay) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-overlay) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-overlay) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-tertiary {
    --sf-shadow--color: var(--sf-tertiary);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-tertiary-container {
    --sf-shadow--color: var(--sf-tertiary-container);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-container) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-container) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-container) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-tertiary-transparent-select {
    --sf-shadow--color: var(--sf-tertiary-transparent-select);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-select) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-select) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-select) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-tertiary-transparent-overlay {
    --sf-shadow--color: var(--sf-tertiary-transparent-overlay);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-overlay) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-overlay) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-overlay) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-error {
    --sf-shadow--color: var(--sf-error);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-error-container {
    --sf-shadow--color: var(--sf-error-container);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error-container) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error-container) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error-container) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-error-transparent-select {
    --sf-shadow--color: var(--sf-error-transparent-select);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-select) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-select) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-select) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-error-transparent-overlay {
    --sf-shadow--color: var(--sf-error-transparent-overlay);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-overlay) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-overlay) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-overlay) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-warning {
    --sf-shadow--color: var(--sf-warning);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-warning-container {
    --sf-shadow--color: var(--sf-warning-container);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-container) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-container) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-container) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-warning-transparent-select {
    --sf-shadow--color: var(--sf-warning-transparent-select);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-select) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-select) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-select) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-warning-transparent-overlay {
    --sf-shadow--color: var(--sf-warning-transparent-overlay);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-overlay) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-overlay) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-overlay) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-success {
    --sf-shadow--color: var(--sf-success);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-success-container {
    --sf-shadow--color: var(--sf-success-container);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success-container) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success-container) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success-container) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-success-transparent-select {
    --sf-shadow--color: var(--sf-success-transparent-select);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-select) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-select) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-select) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-success-transparent-overlay {
    --sf-shadow--color: var(--sf-success-transparent-overlay);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-overlay) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-overlay) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-overlay) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
  .drop-shadow-on-surface {
    --sf-shadow--color: var(--sf-on-surface);
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface) var(--sf-shadow--alfa-fill));
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface) var(--sf-shadow--alfa-outline));
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface) var(--sf-shadow--alfa-shade));
    --sf-shadow--color-shade: var(--sf-shadow--color-shading);
  }
}

/* docara-shell-source: runtime/utility/drop-shadow-color/hover/css/hover.css */
@layer sf.utilities {
  .hover\:drop-shadow-transparent:hover {
    --sf-shadow--color: var(--sf-transparent) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-transparent) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-transparent) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-transparent) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-current:hover {
    --sf-shadow--color: var(--sf-current) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-current) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-current) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-current) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface:hover {
    --sf-shadow--color: var(--sf-surface-1) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-0:hover {
    --sf-shadow--color: var(--sf-surface-0) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-0) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-0) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-0) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-1:hover {
    --sf-shadow--color: var(--sf-surface-1) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-1) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-2:hover {
    --sf-shadow--color: var(--sf-surface-2) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-2) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-2) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-2) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-3:hover {
    --sf-shadow--color: var(--sf-surface-3) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-3) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-3) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-3) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-4:hover {
    --sf-shadow--color: var(--sf-surface-4) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-4) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-4) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-4) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-container:hover {
    --sf-shadow--color: var(--sf-surface-container) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-container) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-container) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-container) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-inverse:hover {
    --sf-shadow--color: var(--sf-surface-inverse) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-surface-inverse-fixed:hover {
    --sf-shadow--color: var(--sf-surface-inverse-fixed) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse-fixed) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse-fixed) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-surface-inverse-fixed) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-on-surface-variant:hover {
    --sf-shadow--color: var(--sf-on-surface-variant) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface-variant) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface-variant) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface-variant) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-primary:hover {
    --sf-shadow--color: var(--sf-primary) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-primary-container:hover {
    --sf-shadow--color: var(--sf-primary-container) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-container) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-container) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-container) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-primary-transparent-select:hover {
    --sf-shadow--color: var(--sf-primary-transparent-select) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-select) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-select) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-select) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-primary-transparent-overlay:hover {
    --sf-shadow--color: var(--sf-primary-transparent-overlay) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-overlay) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-overlay) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-primary-transparent-overlay) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-secondary:hover {
    --sf-shadow--color: var(--sf-secondary) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-secondary-container:hover {
    --sf-shadow--color: var(--sf-secondary-container) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-container) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-container) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-container) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-secondary-transparent-select:hover {
    --sf-shadow--color: var(--sf-secondary-transparent-select) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-select) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-select) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-select) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-secondary-transparent-overlay:hover {
    --sf-shadow--color: var(--sf-secondary-transparent-overlay) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-overlay) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-overlay) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-secondary-transparent-overlay) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-tertiary:hover {
    --sf-shadow--color: var(--sf-tertiary) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-tertiary-container:hover {
    --sf-shadow--color: var(--sf-tertiary-container) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-container) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-container) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-container) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-tertiary-transparent-select:hover {
    --sf-shadow--color: var(--sf-tertiary-transparent-select) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-select) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-select) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-select) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-tertiary-transparent-overlay:hover {
    --sf-shadow--color: var(--sf-tertiary-transparent-overlay) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-overlay) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-overlay) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-tertiary-transparent-overlay) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-error:hover {
    --sf-shadow--color: var(--sf-error) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-error-container:hover {
    --sf-shadow--color: var(--sf-error-container) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error-container) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error-container) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error-container) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-error-transparent-select:hover {
    --sf-shadow--color: var(--sf-error-transparent-select) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-select) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-select) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-select) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-error-transparent-overlay:hover {
    --sf-shadow--color: var(--sf-error-transparent-overlay) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-overlay) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-overlay) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-error-transparent-overlay) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-warning:hover {
    --sf-shadow--color: var(--sf-warning) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-warning-container:hover {
    --sf-shadow--color: var(--sf-warning-container) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-container) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-container) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-container) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-warning-transparent-select:hover {
    --sf-shadow--color: var(--sf-warning-transparent-select) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-select) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-select) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-select) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-warning-transparent-overlay:hover {
    --sf-shadow--color: var(--sf-warning-transparent-overlay) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-overlay) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-overlay) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-warning-transparent-overlay) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-success:hover {
    --sf-shadow--color: var(--sf-success) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-success-container:hover {
    --sf-shadow--color: var(--sf-success-container) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success-container) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success-container) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success-container) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-success-transparent-select:hover {
    --sf-shadow--color: var(--sf-success-transparent-select) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-select) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-select) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-select) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-success-transparent-overlay:hover {
    --sf-shadow--color: var(--sf-success-transparent-overlay) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-overlay) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-overlay) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-success-transparent-overlay) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
  .hover\:drop-shadow-on-surface:hover {
    --sf-shadow--color: var(--sf-on-surface) !important;
    --sf-shadow--color-fill: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface) var(--sf-shadow--alfa-fill)) !important;
    --sf-shadow--color-outline: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface) var(--sf-shadow--alfa-outline)) !important;
    --sf-shadow--color-shading: color-mix(in srgb, var(--sf-transparent), var(--sf-on-surface) var(--sf-shadow--alfa-shade)) !important;
    --sf-shadow--color-shade: var(--sf-shadow--color-shading) !important;
  }
}