/*!
 * SPDX-FileCopyrightText: 2017-2024 Enedis
 *
 * SPDX-License-Identifier: Apache-2.0
 *
 */

@use 'global/animations' as *;

:host ::ng-deep {

    .popover {
        max-width: 30vw; /* optional max width */
        width: intrinsic; /* Safari/WebKit uses a non-standard name */
        width: -moz-max-content; /* Firefox/Gecko */
        width: -webkit-max-content; /* Chrome */
        border: 0;
        border-radius: 0.5rem;
    }

    .popover-arrow {
        &::after {
            border-bottom-color: var(--bs-info);
        }
    }

    .popover-body {
        background-color: var(--bs-info);
        color: var(--bs-white);
        border-radius: 0.5rem;
    }
}

@include box-shadow-animation(
  $animation_name: edition-btn-anim,
  $fromOffsetX: 4px,
  $fromOffsetY: 4px,
  $fromBlur: 8px,
  $fromSpread: 0,
  $fromColor: rgba(var(--bs-warning), 30),
  $toOffsetX: 8px,
  $toOffsetY: 8px,
  $toBlur: 16px,
  $toSpread: 0,
  $toColor: rgba(var(--bs-danger), 30)
);

.edition-btn-anim {
    @include animation(
        $animation_name: edition-btn-anim,
        $animation_duration: 1000ms,
        $animation_timing-function: linear,
        $animation_iteration-count: infinite,
        $animation_direction: alternate);
}
