.red-hat-display {
  font-family: "Red Hat Display", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
}

 .tig-img-saturate-110 {
     filter: saturate(1.1);
 }

 .tig-hr-label-bg {
     background-color: oklch(0.98 0 0);
 }
/* Misc */
.img-flag {
    border-radius: 50%;
    height: 22px;
    width: 22px;
}
/* Radio Card */
label.radio-card {
    cursor: pointer;
}
label.radio-card .card-content-wrapper {
    background: #fff;
    border-radius: 5px;
    padding: 13px;
    display: flex;
    border: var(--border-width) solid var(--gray-400);
    transition: 200ms linear;
}
label.radio-card .check-icon {
    width: 20px;
    height: 20px;
    display: inline-block;
    border: solid 2px #e3e3e3;
    transition: 200ms linear;
    position: relative;
    border-radius: 0.1875em;
}
label.radio-card .check-icon:before {
    content: "";
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    transform: scale(1.6);
    transition: 200ms linear;
    opacity: 0;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M5 10l4 4l6-8'/%3e%3c/svg%3e");
}
label.radio-card input[type=radio] {
    position: absolute;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
label.radio-card input[type=radio]:checked + .card-content-wrapper {    
    border: var(--border-width) solid var(--component-active-bg);    
}
label.radio-card input[type=radio]:checked:focus + .card-content-wrapper {
    box-shadow: 0 0 0 0 transparent, var(--focus-ring-box-shadow);
    border: var(--border-width) solid var(--component-active-bg);    
}
label.radio-card input[type=radio]:checked + .card-content-wrapper .check-icon {
    background: rgba(var(--primary-rgb));
    border-color: rgba(var(--primary-rgb));
    transform: scale(1);
}
label.radio-card input[type=radio]:checked + .card-content-wrapper .check-icon:before {
    transform: scale(1);
    opacity: 1;
}
label.radio-card input[type=radio]:focus + .card-content-wrapper .check-icon {
    box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.25);
    border-color: rgba(var(--primary-rgb));
}
label.radio-card .card-content img {
    margin-bottom: 10px;
}
label.radio-card .card-content h4 {
    font-size: 16px;
    letter-spacing: -0.24px;
    margin-bottom: 10px;
}
label.radio-card .card-content h5 {
    font-size: 14px;
    line-height: 1.4;
    text-align: center;
    color: #686d73;
}
/* Block UI */
.blockui-loading {
    -webkit-animation: loading 1s linear infinite;
    animation: loading 1s linear infinite;
    background: transparent;
    border: 4px solid #888;
    border-bottom-color: #fff;
    border-radius: 50%;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 50px;
    z-index: 99999
}
@-webkit-keyframes loading {
    to {
        transform: rotate(1turn)
    }
}

@keyframes loading {
    to {
        transform: rotate(1turn)
    }
}
/* CKEditor 5 Fix */
.ck.ck-button.ck-insert-table-dropdown-grid-box {
    --ck-spacing-tiny: 0;    
}
.ck-source-editing-area {
    overflow: hidden;
    position: relative;
    border: 1px solid var(--ck-color-base-border);
    border-radius: var(--ck-border-radius);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.ck-focused+ .ck-source-editing-area {
    box-shadow: var(--ck-inner-shadow),0 0;
    border: var(--border-width) solid var(--component-active-bg);
    border-radius: var(--ck-border-radius);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.ck-source-editing-area textarea {
    border-color: transparent!important;
}
.ck.ck-labeled-field-view>.ck.ck-labeled-field-view__input-wrapper>.ck.ck-label {
    background: #fff!important;
}
.ck.ck-powered-by {
    display: none!important;
}
/* DateRangePicker Fix */
.daterangepicker.auto-apply .drp-buttons, .daterangepicker.single .drp-selected  {
    display: none;
}
/* FilePond Fix */
.filepond--credits {
    display: none;
}
.filepond--root {
    margin-bottom: 0;
}
/*.filepond--root .filepond--drop-label {
    height: 100%;
}*/
.filepond-avatar {
    width: 80px;
}
/* Fix Maxlength */
.input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating).maxlength {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}
/* Fix DataTable buttons mobile */
@media (max-width: 575.98px) {
    .dt-buttons {
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}
.swal2-container {
    z-index: 99999 !important;
}

.jconfirm.jconfirm-supervan .jconfirm-bg {
    background-color: rgba(0,0,0,.7)
}
.jconfirm .jconfirm-box div.jconfirm-title-c {
    line-height: 32px;
}
.jconfirm.jconfirm-supervan .jconfirm-box .jconfirm-buttons button {
    font-family: Roboto,Helvetica Neue,Helvetica,Arial,sans-serif;
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 8px 16px;
    font-size: 13px;
    line-height: 1.5384616;
    border-radius: 3px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight: 500;
    text-transform: uppercase;
    border-width: 0;
    padding: 9px 17px
}
.jconfirm-content .form-control {
    color: #fff;
    font-weight: 500;
    text-align: center;
}
.jconfirm-content .form-control:focus {
    outline: 0;
    border-color: transparent;
    border-bottom-color: #fff;
    -webkit-box-shadow: 0 1px 0 #fff;
    box-shadow: 0 1px 0 #fff;
}
.jconfirm.jconfirm-supervan .jconfirm-box .jconfirm-buttons button:hover {
    transform: none;
    -webkit-transform: none
}
.jconfirm-holder .jc-bs3-container {
    max-width: 100% !important;
}
.vc {
    z-index: 99999 !important;
}

/* ========================================
   jQuery Confirm - Preline Theme
   Custom theme to match Preline UI design system
   ======================================== */

/* Background overlay */
.jconfirm.jconfirm-preline .jconfirm-bg {
    background: rgba(0, 0, 0, 0.4) !important;
}

/* Modal container */
.jconfirm.jconfirm-preline .jconfirm-box {
    border-radius: 0.75rem !important;
    border: 1px solid rgb(229 231 235) !important;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important;
    background: white !important;
    font-family: inherit !important;
    max-width: 28rem !important;
    width: 90% !important;
    margin: 2rem auto !important;
}

/* Responsive width adjustments */
@media (min-width: 640px) {
    .jconfirm.jconfirm-preline .jconfirm-box {
        width: 100% !important;
        max-width: 28rem !important;
        margin: 3rem auto !important;
    }
}

@media (min-width: 768px) {
    .jconfirm.jconfirm-preline .jconfirm-box {
        margin: 4rem auto !important;
    }
}

.jconfirm.jconfirm-preline .jconfirm-box-container {
    padding: 0 !important;
}

.jconfirm.jconfirm-preline .jconfirm-title-c {
    padding: 0.75rem 1rem !important;
    border-bottom: 1px solid rgb(229 231 235) !important;
    background: transparent !important;
}

.jconfirm.jconfirm-preline .jconfirm-title {
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: rgb(31 41 55) !important;
    margin: 0 !important;
}

.jconfirm.jconfirm-preline .jconfirm-content {
    padding: 1rem !important;
    color: rgb(75 85 99) !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
}

.jconfirm.jconfirm-preline .jconfirm-buttons {
    padding: 0.75rem 1rem !important;
    border-top: 1px solid rgb(229 231 235) !important;
    background: transparent !important;
    text-align: right !important;
}

.jconfirm.jconfirm-preline .jconfirm-buttons button {
    display: inline-flex!important;
    align-items: center;
    column-gap: calc(var(--spacing) * 2);
    margin-left: 0.5rem !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    border-radius: 0.5rem !important;
    border: 1px solid transparent !important;
    cursor: pointer !important;
    transition: all 0.15s ease-in-out !important;
}

.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-light {
    background: white !important;
    border-color: rgb(229 231 235) !important;
    color: rgb(31 41 55) !important;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-light:hover {
    background: rgb(249 250 251) !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-light:focus {
    background: rgb(249 250 251) !important;
    outline: none !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-light:disabled {
    opacity: 0.5 !important;
    pointer-events: none !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-primary {
    background: rgb(31 41 55) !important;
    border-color: transparent !important;
    color: white !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-primary:hover {
    background: rgb(17 24 39) !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-primary:focus {
    background: rgb(17 24 39) !important;
    outline: none !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-primary:disabled {
    opacity: 0.5 !important;
    pointer-events: none !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-red {
    background: rgb(220 38 38) !important;
    color: white !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-red:hover {
    background: rgb(185 28 28) !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-blue {
    background: rgb(37 99 235) !important;
    color: white !important;
}
.jconfirm.jconfirm-preline .jconfirm-buttons button.btn-blue:hover {
    background: rgb(29 78 216) !important;
}

/* Dark mode support */
.dark .jconfirm.jconfirm-preline .jconfirm-box {
    background: rgb(38 38 38) !important;
    border-color: rgb(64 64 64) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-title-c {
    border-bottom-color: rgb(64 64 64) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-title {
    color: white !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-content {
    color: rgb(163 163 163) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-buttons {
    border-top-color: rgb(64 64 64) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-buttons button.btn-light {
    background: rgb(38 38 38) !important;
    border-color: rgb(64 64 64) !important;
    color: white !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-buttons button.btn-light:hover {
    background: rgb(64 64 64) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-buttons button.btn-light:focus {
    background: rgb(64 64 64) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-buttons button.btn-primary {
    background: rgb(229 231 235) !important;
    color: rgb(31 41 55) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-buttons button.btn-primary:hover {
    background: rgb(209 213 219) !important;
}
.dark .jconfirm.jconfirm-preline .jconfirm-buttons button.btn-primary:focus {
    background: rgb(209 213 219) !important;
}

/* Funnel pubblico (FE): tutti i popup preline hanno bottoni stondati (pill).
   Scope su :root[data-theme] (impostato solo dal base FE) -> i modali del backend restano squadrati.
   La variante 'funnel-public' aggiunge anche il colore primario ai bottoni btn-primary. */
:root[data-theme] .jconfirm.jconfirm-preline .jconfirm-buttons button,
.jconfirm.jconfirm-funnel-public .jconfirm-buttons button {
    border-radius: 9999px !important;
}
.jconfirm.jconfirm-funnel-public .jconfirm-buttons button.btn-primary,
.dark .jconfirm.jconfirm-funnel-public .jconfirm-buttons button.btn-primary {
    background: var(--primary-500) !important;
    color: white !important;
}
.jconfirm.jconfirm-funnel-public .jconfirm-buttons button.btn-primary:hover,
.jconfirm.jconfirm-funnel-public .jconfirm-buttons button.btn-primary:focus,
.dark .jconfirm.jconfirm-funnel-public .jconfirm-buttons button.btn-primary:hover,
.dark .jconfirm.jconfirm-funnel-public .jconfirm-buttons button.btn-primary:focus {
    background: var(--primary-600) !important;
}

/* Funnel pubblico: la card riepilogo non mostra il bordo su mobile (solo da >=640px) */
.funnel-summary-card {
    border-width: 0;
}
@media (min-width: 640px) {
    .funnel-summary-card {
        border-width: 1px;
    }
}

/* Icon styling for draft modals */
.draft-modal-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    background: rgb(254 243 199);
    border-radius: 0.5rem;
    margin-right: 1rem;
    flex-shrink: 0;
}

.draft-modal-icon svg {
    width: 1.5rem;
    height: 1.5rem;
    color: rgb(217 119 6);
}

.dark .draft-modal-icon {
    background: rgb(120 53 15);
}

.dark .draft-modal-icon svg {
    color: rgb(251 191 36);
}

.draft-modal-content {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.draft-modal-text h4 {
    font-weight: 600;
    color: rgb(31 41 55);
    margin: 0 0 0.25rem 0;
}

.dark .draft-modal-text h4 {
    color: white;
}

.draft-modal-text p {
    margin: 0.25rem 0;
    color: rgb(75 85 99);
    font-size: 0.875rem;
}

.dark .draft-modal-text p {
    color: rgb(163 163 163);
}

.draft-modal-text strong {
    font-weight: 600;
}
.jconfirm .jconfirm-box {
    padding: 0!important ;
}

/* tiptap */
.funnel-message-content {
    white-space: pre-line;
}

.funnel-message-content p {
    margin: 0.75rem 0;
}

.funnel-message-content p:empty::before {
    content: "\00a0";
}

.funnel-message-content ul,
.funnel-message-content ol {
    margin: 0.75rem 0;
    padding-left: 1.25rem;
}

.funnel-message-content ul {
    list-style: disc;
}

.funnel-message-content ol {
    list-style: decimal;
}

.funnel-message-content li > p {
    margin: 0;
}

.funnel-message-content blockquote {
    margin: 0.75rem 0;
    padding-left: 1rem;
    border-left: 3px solid currentColor;
}

.funnel-message-content > :first-child {
    margin-top: 0;
}

.funnel-message-content > :last-child {
    margin-bottom: 0;
}

.ProseMirror:focus {
    outline: none;
}

.tiptap ul p,
.tiptap ol p {
    display: inline;
}

.tiptap p.is-editor-empty:first-child::before {
    content: attr(data-placeholder);
    float: left;
    height: 0;
    pointer-events: none;
}

.tig-required-input-empty {
    border-color: rgb(239 68 68) !important;
    --tw-ring-color: rgb(239 68 68) !important;
}

.tig-required-input-empty:focus,
.tig-required-input-empty:focus-within {
    border-color: rgb(239 68 68) !important;
    box-shadow: 0 0 0 1px rgb(239 68 68) !important;
    outline: none !important;
    --tw-ring-color: rgb(239 68 68) !important;
}

.tig-required-input-filled {
    border-color: rgb(34 197 94) !important;
    --tw-ring-color: rgb(34 197 94) !important;
}

.tig-required-input-filled:focus,
.tig-required-input-filled:focus-within {
    border-color: rgb(34 197 94) !important;
    box-shadow: 0 0 0 1px rgb(34 197 94) !important;
    outline: none !important;
    --tw-ring-color: rgb(34 197 94) !important;
}

/* tiptap */
/* datatable */
[data-hs-datatable-paging-pages] button {
  min-width: calc(var(--spacing) * 10);
}
/* datatable*/


    @keyframes marquee
    {
      0%
      {
        transform: translateX(0);
      }

      100%
      {
        transform: translateX(calc(-400px * 5));
      }
    }

    @keyframes marquee-reverse
    {
      0%
      {
        transform: translateX(calc(-400px * 5));
      }

      100%
      {
        transform: translateX(0);
      }
    }

    .animate-marquee
    {
      animation: marquee 40s linear infinite;
    }

@media (min-width: 1024px) {
  .tig-fe-header-nav {
    padding-inline-start: 1.25rem !important;
  }

  .tig-fe-header-nav > a,
  .tig-fe-header-nav > .hs-dropdown > button,
  .tig-fe-header-nav > a > span,
  .tig-fe-header-nav > button {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}

    .animate-marquee-reverse
    {
      animation: marquee-reverse 40s linear infinite;
    }

    .animate-marquee
    {
      animation: marquee 40s linear infinite;
    }

/* Tema Ducati: il font istituzionale è molto sottile, quindi alziamo
   font-medium di un livello di peso (500 -> 600). Solo per data-theme="ducati". */
:root[data-theme="ducati"] .font-medium {
    font-weight: 600;
}