/* GENERATED by resources/scss/v2-toast/build.mjs — do not edit.
   Re-run `npm run build:v2-toast` after changing resources/ts/Common/toast/**,
   and bump the ?v= on the <link> in resources/views/frontend/layouts/master.blade.php. */
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
:root, [data-toast-container] :host, [data-toast-container] :host {
    --color-red-50: oklch(97.1% 0.013 17.38);
    --color-red-500: oklch(63.7% 0.237 25.331);
    --color-red-800: oklch(44.4% 0.177 26.899);
    --color-yellow-50: oklch(98.7% 0.026 102.212);
    --color-yellow-300: oklch(90.5% 0.182 98.111);
    --color-yellow-500: oklch(79.5% 0.184 86.047);
    --color-green-50: oklch(98.2% 0.018 155.826);
    --color-green-500: oklch(72.3% 0.219 149.579);
    --color-green-800: oklch(44.8% 0.119 151.328);
    --color-blue-50: oklch(97% 0.014 254.604);
    --color-blue-500: oklch(62.3% 0.214 259.815);
    --color-blue-800: oklch(42.4% 0.199 265.638);
    --color-gray-200: oklch(92.8% 0.006 264.531);
    --spacing: 0.25rem;
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --font-weight-semibold: 600;
    --ease-in: cubic-bezier(0.4, 0, 1, 1);
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
[data-toast-container].pointer-events-auto, [data-toast-container] .pointer-events-auto {
    pointer-events: auto !important;
  }
[data-toast-container].pointer-events-none, [data-toast-container] .pointer-events-none {
    pointer-events: none !important;
  }
[data-toast-container].visible, [data-toast-container] .visible {
    visibility: visible !important;
  }
[data-toast-container].fixed, [data-toast-container] .fixed {
    position: fixed !important;
  }
[data-toast-container].static, [data-toast-container] .static {
    position: static !important;
  }
[data-toast-container].start-0, [data-toast-container] .start-0 {
    inset-inline-start: calc(var(--spacing) * 0) !important;
  }
[data-toast-container].end-0, [data-toast-container] .end-0 {
    inset-inline-end: calc(var(--spacing) * 0) !important;
  }
[data-toast-container].end-auto, [data-toast-container] .end-auto {
    inset-inline-end: auto !important;
  }
[data-toast-container].top-0, [data-toast-container] .top-0 {
    top: 0px !important;
  }
[data-toast-container].right-0, [data-toast-container] .right-0 {
    right: 0px !important;
  }
[data-toast-container].bottom-0, [data-toast-container] .bottom-0 {
    bottom: 0px !important;
  }
[data-toast-container].left-0, [data-toast-container] .left-0 {
    left: 0px !important;
  }
[data-toast-container].left-1\/2, [data-toast-container] .left-1\/2 {
    left: calc(1 / 2 * 100%) !important;
  }
[data-toast-container].container, [data-toast-container] .container {
    width: 100% !important;
    @media (width >= 576px) {
      max-width: 576px !important;
    }
    @media (width >= 48rem) {
      max-width: 48rem !important;
    }
    @media (width >= 64rem) {
      max-width: 64rem !important;
    }
    @media (width >= 80rem) {
      max-width: 80rem !important;
    }
    @media (width >= 96rem) {
      max-width: 96rem !important;
    }
  }
[data-toast-container].m-0, [data-toast-container] .m-0 {
    margin: 0px !important;
  }
[data-toast-container].mt-3, [data-toast-container] .mt-3 {
    margin-top: calc(var(--spacing) * 3) !important;
  }
[data-toast-container].mb-1, [data-toast-container] .mb-1 {
    margin-bottom: var(--spacing) !important;
  }
[data-toast-container].line-clamp-1, [data-toast-container] .line-clamp-1 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
  }
[data-toast-container].line-clamp-2, [data-toast-container] .line-clamp-2 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }
[data-toast-container].flex, [data-toast-container] .flex {
    display: flex !important;
  }
[data-toast-container].hidden, [data-toast-container] .hidden {
    display: none !important;
  }
[data-toast-container].inline, [data-toast-container] .inline {
    display: inline !important;
  }
[data-toast-container].h-1, [data-toast-container] .h-1 {
    height: var(--spacing) !important;
  }
[data-toast-container].h-5, [data-toast-container] .h-5 {
    height: calc(var(--spacing) * 5) !important;
  }
[data-toast-container].h-6, [data-toast-container] .h-6 {
    height: calc(var(--spacing) * 6) !important;
  }
[data-toast-container].h-full, [data-toast-container] .h-full {
    height: 100% !important;
  }
[data-toast-container].w-5, [data-toast-container] .w-5 {
    width: calc(var(--spacing) * 5) !important;
  }
[data-toast-container].w-6, [data-toast-container] .w-6 {
    width: calc(var(--spacing) * 6) !important;
  }
[data-toast-container].w-\[300px\], [data-toast-container] .w-\[300px\] {
    width: 300px !important;
  }
[data-toast-container].min-w-0, [data-toast-container] .min-w-0 {
    min-width: 0px !important;
  }
[data-toast-container].flex-1, [data-toast-container] .flex-1 {
    flex: 1 !important;
  }
[data-toast-container].flex-shrink-0, [data-toast-container] .flex-shrink-0 {
    flex-shrink: 0 !important;
  }
[data-toast-container].shrink, [data-toast-container] .shrink {
    flex-shrink: 1 !important;
  }
[data-toast-container].shrink-0, [data-toast-container] .shrink-0 {
    flex-shrink: 0 !important;
  }
[data-toast-container].-translate-x-1\/2, [data-toast-container] .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y) !important;
  }
[data-toast-container].transform, [data-toast-container] .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,) !important;
  }
[data-toast-container].cursor-pointer, [data-toast-container] .cursor-pointer {
    cursor: pointer !important;
  }
[data-toast-container].flex-col, [data-toast-container] .flex-col {
    flex-direction: column !important;
  }
[data-toast-container].items-start, [data-toast-container] .items-start {
    align-items: flex-start !important;
  }
[data-toast-container].gap-2, [data-toast-container] .gap-2 {
    gap: calc(var(--spacing) * 2) !important;
  }
[data-toast-container].overflow-hidden, [data-toast-container] .overflow-hidden {
    overflow: hidden !important;
  }
[data-toast-container].rounded, [data-toast-container] .rounded {
    border-radius: 0.25rem !important;
  }
[data-toast-container].rounded-full, [data-toast-container] .rounded-full {
    border-radius: calc(infinity * 1px) !important;
  }
[data-toast-container].border, [data-toast-container] .border {
    border-style: var(--tw-border-style) !important;
    border-width: 1px !important;
  }
[data-toast-container].border-s-4, [data-toast-container] .border-s-4 {
    border-inline-start-style: var(--tw-border-style) !important;
    border-inline-start-width: 4px !important;
  }
[data-toast-container].border-l-4, [data-toast-container] .border-l-4 {
    border-left-style: var(--tw-border-style) !important;
    border-left-width: 4px !important;
  }
[data-toast-container].border-blue-500, [data-toast-container] .border-blue-500 {
    border-color: var(--color-blue-500) !important;
  }
[data-toast-container].border-green-500, [data-toast-container] .border-green-500 {
    border-color: var(--color-green-500) !important;
  }
[data-toast-container].border-red-500, [data-toast-container] .border-red-500 {
    border-color: var(--color-red-500) !important;
  }
[data-toast-container].border-yellow-300, [data-toast-container] .border-yellow-300 {
    border-color: var(--color-yellow-300) !important;
  }
[data-toast-container].bg-blue-50, [data-toast-container] .bg-blue-50 {
    background-color: var(--color-blue-50) !important;
  }
[data-toast-container].bg-blue-500, [data-toast-container] .bg-blue-500 {
    background-color: var(--color-blue-500) !important;
  }
[data-toast-container].bg-gray-200, [data-toast-container] .bg-gray-200 {
    background-color: var(--color-gray-200) !important;
  }
[data-toast-container].bg-green-50, [data-toast-container] .bg-green-50 {
    background-color: var(--color-green-50) !important;
  }
[data-toast-container].bg-green-500, [data-toast-container] .bg-green-500 {
    background-color: var(--color-green-500) !important;
  }
[data-toast-container].bg-red-50, [data-toast-container] .bg-red-50 {
    background-color: var(--color-red-50) !important;
  }
[data-toast-container].bg-red-500, [data-toast-container] .bg-red-500 {
    background-color: var(--color-red-500) !important;
  }
[data-toast-container].bg-yellow-50, [data-toast-container] .bg-yellow-50 {
    background-color: var(--color-yellow-50) !important;
  }
[data-toast-container].bg-yellow-300, [data-toast-container] .bg-yellow-300 {
    background-color: var(--color-yellow-300) !important;
  }
[data-toast-container].p-2, [data-toast-container] .p-2 {
    padding: calc(var(--spacing) * 2) !important;
  }
[data-toast-container].text-sm, [data-toast-container] .text-sm {
    font-size: var(--text-sm) !important;
    line-height: var(--tw-leading, var(--text-sm--line-height)) !important;
  }
[data-toast-container].font-semibold, [data-toast-container] .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold) !important;
  }
[data-toast-container].break-words, [data-toast-container] .break-words {
    overflow-wrap: break-word !important;
  }
[data-toast-container].break-all, [data-toast-container] .break-all {
    word-break: break-all !important;
  }
[data-toast-container].text-blue-500, [data-toast-container] .text-blue-500 {
    color: var(--color-blue-500) !important;
  }
[data-toast-container].text-blue-800, [data-toast-container] .text-blue-800 {
    color: var(--color-blue-800) !important;
  }
[data-toast-container].text-green-500, [data-toast-container] .text-green-500 {
    color: var(--color-green-500) !important;
  }
[data-toast-container].text-green-800, [data-toast-container] .text-green-800 {
    color: var(--color-green-800) !important;
  }
[data-toast-container].text-red-500, [data-toast-container] .text-red-500 {
    color: var(--color-red-500) !important;
  }
[data-toast-container].text-red-800, [data-toast-container] .text-red-800 {
    color: var(--color-red-800) !important;
  }
[data-toast-container].text-yellow-500, [data-toast-container] .text-yellow-500 {
    color: var(--color-yellow-500) !important;
  }
[data-toast-container].opacity-50, [data-toast-container] .opacity-50 {
    opacity: 50% !important;
  }
[data-toast-container].opacity-90, [data-toast-container] .opacity-90 {
    opacity: 90% !important;
  }
[data-toast-container].shadow-lg, [data-toast-container] .shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
[data-toast-container].transition, [data-toast-container] .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events !important;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)) !important;
    transition-duration: var(--tw-duration, var(--default-transition-duration)) !important;
  }
[data-toast-container].transition-all, [data-toast-container] .transition-all {
    transition-property: all !important;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)) !important;
    transition-duration: var(--tw-duration, var(--default-transition-duration)) !important;
  }
[data-toast-container].transition-opacity, [data-toast-container] .transition-opacity {
    transition-property: opacity !important;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)) !important;
    transition-duration: var(--tw-duration, var(--default-transition-duration)) !important;
  }
[data-toast-container].duration-200, [data-toast-container] .duration-200 {
    --tw-duration: 200ms;
    transition-duration: 200ms !important;
  }
[data-toast-container].ease-in, [data-toast-container] .ease-in {
    --tw-ease: var(--ease-in);
    transition-timing-function: var(--ease-in) !important;
  }
[data-toast-container].ease-out, [data-toast-container] .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out) !important;
  }
@media (hover: hover) {
    [data-toast-container].hover\:-translate-y-1:hover, [data-toast-container] .hover\:-translate-y-1:hover {
      --tw-translate-y: calc(var(--spacing) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y) !important;
    }
    [data-toast-container].hover\:opacity-100:hover, [data-toast-container] .hover\:opacity-100:hover {
      opacity: 100% !important;
    }
    [data-toast-container].hover\:shadow-medium-all-side:hover, [data-toast-container] .hover\:shadow-medium-all-side:hover {
      --tw-shadow: var(--tw-shadow-color, rgba(99, 99, 99, 0.2)) 0px 2px 8px 0px;
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    }
  }
@media (width >= 576px) {
    [data-toast-container].sm\:w-\[380px\], [data-toast-container] .sm\:w-\[380px\] {
      width: 380px !important;
    }
    [data-toast-container].sm\:gap-4, [data-toast-container] .sm\:gap-4 {
      gap: calc(var(--spacing) * 4) !important;
    }
    [data-toast-container].sm\:p-3, [data-toast-container] .sm\:p-3 {
      padding: calc(var(--spacing) * 3) !important;
    }
    [data-toast-container].sm\:p-4, [data-toast-container] .sm\:p-4 {
      padding: calc(var(--spacing) * 4) !important;
    }
  }
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    [data-toast-container] *, [data-toast-container] *, [data-toast-container] ::before, [data-toast-container] ::before, [data-toast-container] ::after, [data-toast-container] ::after, [data-toast-container] ::backdrop, [data-toast-container] ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-font-weight: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-duration: initial;
      --tw-ease: initial;
    }
  }

/* Toast Animation Classes */

/* Slide In Animations */
@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInLeft {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInTop {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideInBottom {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Fade In Animation */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Zoom In Animation */
@keyframes zoomIn {
    from {
        transform: scale(0.8);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Bounce In Animation */
@keyframes bounceIn {
    0% {
        transform: scale(0.3);
        opacity: 0;
    }
    50% {
        transform: scale(1.05);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* Progress Bar Animation */
@keyframes progressBar {
    from {
        width: 100%;
    }
    to {
        width: 0%;
    }
}

/* Toast Animation Classes */
.toast-slide-in-right {
    animation: slideInRight 0.3s ease-out;
}

.toast-slide-in-left {
    animation: slideInLeft 0.3s ease-out;
}

.toast-slide-in-top {
    animation: slideInTop 0.3s ease-out;
}

.toast-slide-in-bottom {
    animation: slideInBottom 0.3s ease-out;
}

.toast-fade-in {
    animation: fadeIn 0.3s ease-out;
}

.toast-zoom-in {
    animation: zoomIn 0.3s ease-out;
}

.toast-bounce-in {
    animation: bounceIn 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

/* Progress Bar Styling */
.toast-progress {
    animation: progressBar linear forwards;
    animation-play-state: running;
}

.toast-progress.paused {
    animation-play-state: paused !important;
}

.toast-removing {
    pointer-events: none;
}

[data-toast-container] {
    transition: all 0.2s ease-out;
}

/* RTL: the container is anchored with logical insets (start-0 / end-0 in ToastContainer), so
   a toast configured 'bottom-left' sits against the right edge of the screen in Arabic/Hebrew.
   The slide direction has to follow it, otherwise the toast flies in across the whole viewport
   from the far side. Only animation-name is swapped, so timing and easing stay identical.
   ToastBase.getCloseTransform() flips the exit transform the same way. */
[dir="rtl"] .toast-slide-in-left {
    animation-name: slideInRight;
}

[dir="rtl"] .toast-slide-in-right {
    animation-name: slideInLeft;
}

[data-toast-container] button {
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
    font: inherit !important;
    line-height: 1 !important;
}

[data-toast-container] svg {
    display: block;
    vertical-align: middle;
}

.dark_mode [data-toast-container] .toast-item {
    background-color: #121212 !important;
}

.dark_mode [data-toast-container] .toast-item button {
    color: #c5c5c5 !important;
    opacity: 0.8 !important;
}

.dark_mode [data-toast-container] .toast-item button:hover {
    opacity: 1 !important;
}