/* CURSORS */
.tt-cursor-pointer {
    cursor: pointer;
}

.float-right {
    float: right;
}

/* TABLES */
.table-row-archived {
    opacity: 0.6;
    text-decoration: line-through; /* optional */
}

 /* LOADER */
.tt-loader-wrapper-overlay {
    position: fixed;           /* cover entire viewport */
    inset: 0;                  /* top:0; right:0; bottom:0; left:0; */
    display: flex !important;  /* override live-component display toggle */
    justify-content: center;   /* center horizontally */
    align-items: center;       /* center vertically */
    background: transparent;
    z-index: 9999;             /* above everything */
    overflow: hidden;          /* prevent scrolling */
}

.loader {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 8px solid var(--primary-color);
    animation:
            l20-1 0.8s infinite linear alternate,
            l20-2 1.6s infinite linear;
}
@keyframes l20-1{
    0%    {clip-path: polygon(50% 50%,0       0,  50%   0%,  50%    0%, 50%    0%, 50%    0%, 50%    0% )}
    12.5% {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100%   0%, 100%   0%, 100%   0% )}
    25%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 100% 100%, 100% 100% )}
    50%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
    62.5% {clip-path: polygon(50% 50%,100%    0, 100%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
    75%   {clip-path: polygon(50% 50%,100% 100%, 100% 100%,  100% 100%, 100% 100%, 50%  100%, 0%   100% )}
    100%  {clip-path: polygon(50% 50%,50%  100%,  50% 100%,   50% 100%,  50% 100%, 50%  100%, 0%   100% )}
}
@keyframes l20-2{
    0%    {transform:scaleY(1)  rotate(0deg)}
    49.99%{transform:scaleY(1)  rotate(135deg)}
    50%   {transform:scaleY(-1) rotate(0deg)}
    100%  {transform:scaleY(-1) rotate(-135deg)}
}