:root {
   --ribbon-label-bg: var(--tw-brand);
   --ribbon-label-box-shadow: 0px -1px 5px 0px rgba(30, 33, 41, 0.1);
   --ribbon-label-border-color: var(--tw-brand);
   --ribbon-clip-bg: #1E2129;
}

.overlay {
   position: relative;
}

   .overlay .overlay-layer {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: var(--tw-dark);
      transition: all .3s ease;
      opacity: 0;
   }

   .overlay.overlay-block .overlay-layer, .overlay.overlay-show .overlay-layer, .overlay:hover .overlay-layer {
      transition: all .3s ease;
      opacity: 0.65;
   }

.ribbon.ribbon-top .ribbon-group .ribbon-label {
   top: 0;
   transform: none !important;
   border-bottom-right-radius: .475rem;
   border-bottom-left-radius: .475rem;
}

.ribbon-vertical .ribbon-group .ribbon-label {
   padding: 5px 10px;
   min-width: 36px;
   min-height: 36px;
   text-align: center;
}

.ribbon .ribbon-group .ribbon-label {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 5px 10px;
   position: relative !important;
   z-index: 1;
   /*background-color: var(--ribbon-label-bg);*/
   box-shadow: var(--ribbon-label-box-shadow);
   /*color: var(--tw-brand-inverse);*/
   transform: none !important;
}

.ribbon.ribbon-top .ribbon-group {
   top: 0;
   transform: translateX(-24px) translateY(-4px) !important;
}

.ribbon .ribbon-group {
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   z-index: 1;
   top: 50%;
   right: 0;
}

.ribbon {
   position: relative
}

   .ribbon .ribbon-label {
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 3px 16px;
      position: absolute;
      z-index: 1;
      /*background-color: var(--ribbon-label-bg);*/
      box-shadow: var(--ribbon-label-box-shadow);
      /*color: var(--tw-brand-inverse);*/
      top: 50%;
      right: 0;
      transform: translateX(5px) translateY(-50%)
   }

      .ribbon .ribbon-label > .ribbon-inner {
         z-index: -1;
         position: absolute;
         padding: 0;
         width: 100%;
         height: 100%;
         top: 0;
         left: 0
      }

      .ribbon .ribbon-label:after {
         /*border-color: var(--ribbon-label-border-color)*/
      }

.ribbon-vertical .ribbon-label {
   padding: 3px 16px;
   min-width: 36px;
   min-height: 36px;
   text-align: center
}

.ribbon.ribbon-top .ribbon-label {
   top: 0;
   transform: translateX(-15px) translateY(-4px);
   border-bottom-right-radius: .475rem;
   border-bottom-left-radius: .475rem
}

.ribbon.ribbon-bottom .ribbon-label {
   border-top-right-radius: .475rem;
   border-top-left-radius: .475rem
}

.ribbon.ribbon-start .ribbon-label {
   top: 50%;
   left: 0;
   right: auto;
   transform: translateX(-5px) translateY(-50%);
   border-top-right-radius: .475rem;
   border-bottom-right-radius: .475rem
}

.ribbon.ribbon-end .ribbon-label {
   border-top-left-radius: .475rem;
   border-bottom-left-radius: .475rem
}

.ribbon.ribbon-clip.ribbon-start .ribbon-label {
   left: -5px
}

   .ribbon.ribbon-clip.ribbon-start .ribbon-label .ribbon-inner {
      border-top-right-radius: .475rem;
      border-bottom-right-radius: .475rem
   }

      .ribbon.ribbon-clip.ribbon-start .ribbon-label .ribbon-inner:after, .ribbon.ribbon-clip.ribbon-start .ribbon-label .ribbon-inner:before {
         content: "";
         position: absolute;
         border-style: solid;
         border-color: transparent !important;
         bottom: -10px
      }

      .ribbon.ribbon-clip.ribbon-start .ribbon-label .ribbon-inner:before {
         border-width: 0 10px 10px 0;
         border-right-color: var(--ribbon-clip-bg) !important;
         left: 0
      }

.ribbon.ribbon-clip.ribbon-end .ribbon-label {
   right: -5px
}

   .ribbon.ribbon-clip.ribbon-end .ribbon-label .ribbon-inner {
      border-top-left-radius: .475rem;
      border-bottom-left-radius: .475rem
   }

      .ribbon.ribbon-clip.ribbon-end .ribbon-label .ribbon-inner:after, .ribbon.ribbon-clip.ribbon-end .ribbon-label .ribbon-inner:before {
         content: "";
         position: absolute;
         border-style: solid;
         border-color: transparent !important;
         bottom: -10px
      }

      .ribbon.ribbon-clip.ribbon-end .ribbon-label .ribbon-inner:before {
         border-width: 0 0 10px 10px;
         border-left-color: var(--bs-ribbon-clip-bg) !important;
         right: 0
      }

.ribbon.ribbon-triangle {
   position: absolute;
   z-index: 1;
   display: flex;
   align-items: flex-start;
   justify-content: flex-start
}

   .ribbon.ribbon-triangle.ribbon-top-start {
      top: 0;
      left: 0;
      width: 4rem;
      height: 4rem;
      border-bottom: solid 2rem transparent !important;
      border-left: solid 2rem transparent;
      border-right: solid 2rem transparent !important;
      border-top: solid 2rem transparent
   }

   .ribbon.ribbon-triangle.ribbon-top-end {
      top: 0;
      right: 0;
      width: 4rem;
      height: 4rem;
      border-bottom: solid 2rem transparent !important;
      border-left: solid 2rem transparent !important;
      border-right: solid 2rem transparent;
      border-top: solid 2rem transparent
   }

   .ribbon.ribbon-triangle.ribbon-bottom-start {
      bottom: 0;
      left: 0;
      width: 4rem;
      height: 4rem;
      border-bottom: solid 2rem transparent;
      border-left: solid 2rem transparent;
      border-right: solid 2rem transparent !important;
      border-top: solid 2rem transparent !important
   }

   .ribbon.ribbon-triangle.ribbon-bottom-end {
      bottom: 0;
      right: 0;
      width: 4rem;
      height: 4rem;
      border-bottom: solid 2rem transparent;
      border-right: solid 2rem transparent;
      border-left: solid 2rem transparent !important;
      border-top: solid 2rem transparent !important
   }

@media (min-width: 992px) {
   .intro {
      padding-bottom: 100px !important;
   }

      .intro.sem-conteudo {
         padding-bottom: 180px !important;
      }

      .intro + .container-fixed {
         margin-top: -100px !important;
      }

      /*.intro .container-fixed {
         margin-top: -100px !important;
      }*/

      .intro  + .card {
         margin-top: -100px !important;
      }

      .intro + .container-fluid {
         margin-top: -100px !important;
      }

      .intro.sem-conteudo + .container-fixed {
         margin-top: -180px !important;
      }

      .intro.sem-conteudo + .container-fluid {
         margin-top: -180px !important;
      }
}

@keyframes skeletonAnimation {

   0% {
      background-position: 200% 50%;
   }

   100% {
      background-position: -200% 50%;
   }
}

.textarea-chat {
   field-sizing: content;
   font-size: 0.8125rem;
   line-height: 1.1;
   max-height: 100px;
   height: auto;
   background-color: transparent;
   resize: none;
   padding-right: 72px
}

.skeleton {
   width: 250px;
   max-width: 100%;
   height: inherit;
   padding: 0px 20px 0px 20px;
   background: linear-gradient(to left, var(--tw-gray-200) 10%, var(--tw-gray-300) 50%, var(--tw-gray-200) 90%);
   background-size: 200% 100%;
   animation: skeletonAnimation 3s linear infinite;
   border-radius: 0.7rem;
}

.skeleton-xs {
   width: 60px;
   max-width: 100%;
   height: inherit;
   padding: 0px 10px 0px 10px;
   background: linear-gradient(to left, var(--tw-gray-200) 10%, var(--tw-gray-300) 50%, var(--tw-gray-200) 90%);
   background-size: 200% 100%;
   animation: skeletonAnimation 3s linear infinite;
   border-radius: 0.7rem;
}

.skeleton-sm {
   width: 100px;
   max-width: 100%;
   height: inherit;
   padding: 0px 10px 0px 10px;
   background: linear-gradient(to left, var(--tw-gray-200) 10%, var(--tw-gray-300) 50%, var(--tw-gray-200) 90%);
   background-size: 200% 100%;
   animation: skeletonAnimation 3s linear infinite;
   border-radius: 0.7rem;
}

.skeleton-lg {
   width: 350px;
   max-width: 100%;
   height: inherit;
   padding: 0px 10px 0px 10px;
   background: linear-gradient(to left, var(--tw-gray-200) 10%, var(--tw-gray-300) 50%, var(--tw-gray-200) 90%);
   background-size: 200% 100%;
   animation: skeletonAnimation 3s linear infinite;
   border-radius: 0.7rem;
}

.skeleton-100 {
   width: 100%;
   max-width: 100%;
   /*height: inherit;*/
   padding: 0px 10px 0px 10px;
   background: linear-gradient(to left, var(--tw-gray-200) 10%, var(--tw-gray-300) 50%, var(--tw-gray-200) 90%);
   background-size: 200% 100%;
   animation: skeletonAnimation 3s linear infinite;
   border-radius: 0.7rem;
}

   .skeleton.p-0, .skeleton-sm.p-0, .skeleton-xs.p-0, .skeleton-100.p-0 {
      text-align: center;
      padding: 0px
   }

   .skeleton::after, .skeleton-sm::after, .skeleton-xs::after, .skeleton-100::after {
      content: "\00a0";
   }
   /**/
   .skeleton i, .skeleton div, .skeleton-sm i, .skeleton-sm div, .skeleton-xs i, .skeleton-xs div, .skeleton-100 i, .skeleton-100 div {
      display: none;
   }

#blazor-error-ui {
   background: lightyellow;
   bottom: 0;
   box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
   display: none;
   left: 0;
   padding: 0.6rem 1.25rem 0.7rem 1.25rem;
   position: fixed;
   width: 100%;
   z-index: 1000;
}

   #blazor-error-ui .dismiss {
      cursor: pointer;
      position: absolute;
      right: 0.75rem;
      top: 0.5rem;
   }

.blazor-error-boundary {
   background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
   padding: 1rem 1rem 1rem 3.7rem;
   color: white;
}

   .blazor-error-boundary::after {
      content: "An error has occurred."
   }


.carregando {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

.loading-progress {
   position: relative;
   display: block;
   width: 8rem;
   height: 8rem;
}

   .loading-progress circle {
      fill: none;
      stroke: #e0e0e0;
      stroke-width: 0.6rem;
      transform-origin: 50% 50%;
      transform: rotate(-90deg);
   }

      .loading-progress circle:last-child {
         stroke: var(--tw-info) !important;
         stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
         transition: stroke-dasharray 0.05s ease-in-out;
      }

.loading-progress-text {
   position: absolute;
   text-align: center;
   font-weight: 600;
   font-size: 0.9rem;
}

   .loading-progress-text:after {
      content: var(--blazor-load-percentage-text, "Loading");
   }

.coluna .auxiliar {
   border: none;
   font-size: 14px;
   font-weight: 600;
   field-sizing: content;
}

.coluna .titulo {
   border: none;
   font-size: 26px;
   color: var(--tw-gray-900);
   font-weight: 600;
   field-sizing: content;
   text-wrap: pretty;
}

@media (min-width: 768px) {
   .coluna .titulo {
      font-size: 24px;
      text-wrap: balance;
   }
}

.coluna .subtitulo {
   border: none;
   font-size: 14px;
   color: var(--tw-gray-600);
   font-weight: 400;
   field-sizing: content;
   text-wrap: pretty;
}


.demo1 {
   --tw-header-height: 60px;
}

.bg-stripes-brand {
   background-color: #60a5fa1a;
   background-image: linear-gradient(135deg, var(--tw-brand) 10%, #0000 0, #0000 50%, var(--tw-brand) 0, var(--tw-brand) 60%, #0000 0, #0000);
   background-size: 7.07px 7.07px;
}

.bg-stripes-secondary {
   background-color: var(--tw-gray-100);
   background-image: linear-gradient(135deg, var(--tw-gray-300) 10%, #0000 0, #0000 50%, var(--tw-gray-300) 0, var(--tw-gray-300) 60%, #0000 0, #0000);
   background-size: 8px 8px;
}


.bg-stripes-success {
   background-color: var(--tw-gray-100);
   background-image: linear-gradient(135deg, var(--tw-success) 10%, #0000 0, #0000 50%, var(--tw-success) 0, var(--tw-success) 60%, #0000 0, #0000);
   background-size: 8px 8px;
}

.bg-wavy {
   background-color: var(--tw-gray-100);
   opacity: 0.5;
   z-index: -1;
   background-image: repeating-radial-gradient( circle at 0 0, transparent 0, var(--tw-gray-100) 10px ), repeating-linear-gradient( var(--tw-brand) 10%, var(--tw-brand) );
}

.bg-isometric {
   background-color: #e5e5f7;
   opacity: 0.8;
   z-index: -1;
   background-image: linear-gradient(30deg, #7239EA 12%, transparent 12.5%, transparent 87%, #7239EA 87.5%, #7239EA), linear-gradient(150deg, #7239EA 12%, transparent 12.5%, transparent 87%, #7239EA 87.5%, #7239EA), linear-gradient(30deg, #7239EA 12%, transparent 12.5%, transparent 87%, #7239EA 87.5%, #7239EA), linear-gradient(150deg, #7239EA 12%, transparent 12.5%, transparent 87%, #7239EA 87.5%, #7239EA), linear-gradient(60deg, #7239EA77 25%, transparent 25.5%, transparent 75%, #7239EA77 75%, #7239EA77), linear-gradient(60deg, #7239EA77 25%, transparent 25.5%, transparent 75%, #7239EA77 75%, #7239EA77);
   background-size: 28px 49px;
   background-position: 0 0, 0 0, 14px 25px, 14px 25px, 0 0, 14px 25px;
}

.bg-cross {
   background-color: #e5e5f7;
   opacity: 0.8;
   z-index: -1;
   background: radial-gradient(circle, transparent 20%, #e5e5f7 20%, #e5e5f7 80%, transparent 80%, transparent), radial-gradient(circle, transparent 20%, #e5e5f7 20%, #e5e5f7 80%, transparent 80%, transparent) 35px 35px, linear-gradient(#7239EA 2.8000000000000003px, transparent 2.8000000000000003px) 0 -1.4000000000000001px, linear-gradient(90deg, #7239EA 2.8000000000000003px, #e5e5f7 2.8000000000000003px) -1.4000000000000001px 0;
   background-size: 70px 70px, 70px 70px, 35px 35px, 35px 35px;
}

.bg-zigzag {
   background-color: #e5e5f7;
   opacity: 0.5;
   z-index: -1;
   background: linear-gradient(135deg, #7239EA55 25%, transparent 25%) -14px 0/ 28px 28px, linear-gradient(225deg, #7239EA 25%, transparent 25%) -14px 0/ 28px 28px, linear-gradient(315deg, #7239EA55 25%, transparent 25%) 0px 0/ 28px 28px, linear-gradient(45deg, #7239EA 25%, #e5e5f7 25%) 0px 0/ 28px 28px;
}

.bg-honeycomb {
   --s: 10px; /* control the size*/
   --c1: var(--tw-brand-light);
   --c2: var(--tw-brand);
   --c: #0000,var(--c1) .5deg 119.5deg,#0000 120deg;
   --g1: conic-gradient(from 60deg at 56.25% calc(425%/6),var(--c));
   --g2: conic-gradient(from 180deg at 43.75% calc(425%/6),var(--c));
   --g3: conic-gradient(from -60deg at 50% calc(175%/12),var(--c));
   background: var(--g1),var(--g1) var(--s) calc(1.73*var(--s)), var(--g2),var(--g2) var(--s) calc(1.73*var(--s)), var(--g3) var(--s) 0,var(--g3) 0 calc(1.73*var(--s)) var(--c2);
   background-size: calc(2*var(--s)) calc(3.46*var(--s));
}

.group:has(:checked) .group-has-\[\:checked\]\:stroke-brand-clarity {
   stroke: var(--tw-brand-clarity);
}

.group:has(:checked) .group-has-\[\:checked\]\:fill-brand-light {
   fill: var(--tw-brand-light);
}

.hover\:border-dashed:hover {
   border-style: dashed;
}

.hover\:bg-danger-active:hover {
   background-color: var(--tw-danger-active);
}

.group:hover .group-hover\:bg-success {
   background-color: var(--tw-success);
}

.group:hover .group-hover\:bg-primary {
   background-color: var(--tw-primary);
}

.group:hover .group-hover\:text-white {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
}

.group:hover .group-hover\:stroke-brand-clarity {
   stroke: var(--tw-brand-clarity);
}

.group:hover .group-hover\:stroke-primary-clarity {
   stroke: var(--tw-primary-clarity);
}

.group:hover .group-hover\:fill-brand-light {
   fill: var(--tw-brand-light);
}

.group:hover .group-hover\:fill-primary-light {
   fill: var(--tw-primary-light);
}

.group:hover .group-hover\:text-brand {
   color: var(--tw-brand);
}

.group:hover .group-hover\:text-primary {
   color: var(--tw-primary);
}

.hover\:border-brand:hover {
   border-color: var(--tw-brand);
}

.hover\:border-primary:hover {
   border-color: var(--tw-primary);
}

.hero-bg {
   background-image: url('assets/media/images/2600x1200/bg-1.png');
}

.dark .hero-bg {
   background-image: url('assets/media/images/2600x1200/bg-1-dark.png');
}

.modal-body {
   padding-block-start: 1.25rem;
   padding-block-end: 1.25rem;
}

.modal-title {
   font-size: 0.975rem;
}

.card.drag {
   display: flex;
   flex-direction: row;
}

.drag-quadrado.drag-handle {
   max-width: 25px;
   padding: 0 3px;
   background-color: #f3f3f3;
   /*border-right: 1px solid #edeff1;*/
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: grab;
   transition: background-color 0.3s;
   border-radius: 0.5rem 0 0 0.5rem;
}

   .drag-quadrado.drag-handle:hover {
      background-color: #e6e6e6;
      border-radius: 0.5rem 0 0 0.5rem;
   }

.drag-quadrado.drag-blocked {
   max-width: 25px;
   padding: 0 3px;
   background-color: #f3f3f3;
   /*border-right: 1px solid #edeff1;*/
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: not-allowed;
   pointer-events: none;
   transition: background-color 0.3s;
   border-radius: 0.5rem 0 0 0.5rem;
}

.btn-group .btn:first-child {
   border-radius: 0.375rem 0px 0px 0.375rem;
}

.btn-group .btn:not(:first-child):not(:last-child) {
   border-radius: 0px;
}

.btn-group .btn:last-child {
   border-radius: 0px 0.375rem 0.375rem 0px;
}

.btn-group a.btn.btn-sm.btn-icon i,
.btn-group button.btn.btn-sm.btn-icon i {
   font-size: 0.875rem !important;
   line-height: 1.25rem !important
}

@keyframes flicker {
   0% {
      transform: scale(1);
   }

   25% {
      transform: scale(0);
   }

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

   50% {
      transform: scale(1) translateX(100%);
   }

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

   76% {
      transform: scale(0);
   }

   100% {
      transform: scale(1);
   }
}

@keyframes ping {
   75%, 100% {
      transform: scale(2);
      opacity: 0;
   }
}

.flicker-btn {
   --transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.3);
   display: inline-flex;
   align-items: center;
   gap: 30px;
   position: relative;
   z-index: 1;
   overflow: hidden;
   min-width: 100px;
   min-height: 44px;
   padding: 8px 20px;
   background: var(--tw-brand);
   border-radius: 0.625rem;
   font-family: var(--font-monserrat);
   font-weight: 500;
   font-size: 14px;
   color: var(--tw-gray-100);
   text-decoration: none;
   transition: 0.3s;
}

   .flicker-btn:hover {
      background: transparent;
      transition: background 0.3s ease-in-out;
   }

   .flicker-btn:focus {
      box-shadow: 0 0 30px rgb(114 57 234 / 17%);
   }

.flicker-btn__text {
   padding-right: 34px;
   position: relative;
   z-index: 1;
}

.flicker-btn__icon {
   flex-shrink: 0;
   aspect-ratio: 1;
   width: 24px;
   border-radius: 100%;
   background: center center no-repeat var(--tw-brand);
   position: absolute;
   right: 19px;
   top: 50%;
   z-index: 1;
   translate: 0 -50%;
   scale: 0;
   overflow: hidden;
   transition: 0.3s ease-in;
}

   .flicker-btn__icon::before {
      content: "\e98c"; /* Código do ícone da fonte */
      font-family: 'keenicons-duotone'; /* Nome da fonte */
      font-size: 14px; /* Ajuste o tamanho conforme necessário */
      color: var(--tw-gray-100); /* Define a cor do ícone */
      display: inline-flex;
      margin-top: 2px;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
      text-align: center;
   }

.flicker-btn__filler {
   aspect-ratio: 1;
   width: 9px;
   background: var(--tw-gray-200);
   border-radius: 100%;
   position: absolute;
   right: 26px;
   top: 50%;
   translate: 0 -50%;
   transition: 0.3s;
   animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; /* Animação de pulsação contínua */
}

.flicker-btn__filler2 {
   aspect-ratio: 1;
   width: 8px;
   background: var(--tw-gray-200);
   border-radius: 100%;
   position: absolute;
   right: 27px;
   top: 50%;
   translate: 0 -50%;
   transition: 0.3s;
   animation: flicker 0.4s ease 0.3s forwards; /* Animação do hover */
}

.flicker-btn:hover .flicker-btn__filler {
   animation: flicker 0.4s ease 0.3s forwards; /* Animação no hover */
}

@media (hover: hover) and (pointer: fine) {
   .flicker-btn:hover {
      color: var(--tw-brand);
   }

      .flicker-btn:hover .flicker-btn__icon {
         scale: 1;
         transition: var(--transition);
      }

      .flicker-btn:hover .flicker-btn__filler {
         scale: 100;
         animation: none;
      }
}

@media (hover: none) {
   .flicker-btn:active {
      color: var(--tw-brand);
   }

      .flicker-btn:active .flicker-btn__icon {
         scale: 1;
         transition: var(--transition);
      }

      .flicker-btn:active .flicker-btn__filler {
         scale: 100;
         animation: none;
      }
}

.ratio {
   position: relative;
   width: 100%
}

   .ratio::before {
      display: block;
      padding-top: var(--aspect-ratio);
      content: ""
   }

   .ratio > * {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%
   }

.ratio-16x9 {
   --aspect-ratio: 56.25%
}

.switch input[type=checkbox]:checked, .switch input[type=checkbox][aria-checked="true"] {
   background-color: var(--tw-brand);
}

.checkbox[type="checkbox"]:checked, .checkbox[type="checkbox"][aria-checked="true"] {
   background-color: var(--tw-brand);
   border: 1px solid var(--tw-brand);
}

.switch input[type=checkbox]:disabled:checked, .switch input[type=checkbox]:disabled[aria-checked="true"] {
   background-color: var(--tw-brand-clarity);
   border: 0;
}

.checkbox[type="checkbox"]:focus {
   border-color: var(--tw-brand);
}

.w-500px {
   width: 500px;
}

.w-650px {
   width: 650px;
}

.w-850px {
   width: 850px;
}

.w-1200px {
   width: 1200px;
}

.size-40px {
   width: 40px;
   height: 40px;
}

.size-65px {
   width: 65px;
   height: 65px;
}

.card-header, .card-footer {
   padding-inline-start: 1.25rem;
   padding-inline-end: 1.25rem;
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
}

.modal .modal {
   overflow: hidden;
   padding: 0
}

.badge-group {
   display: flex;
   align-items: stretch;
}

   .badge-group .btn:has(~ .badge, ~ .btn), .badge-group .badge:has(~ .badge) {
      border-start-end-radius: 0;
      border-end-end-radius: 0;
      border-inline-end: 0;
   }

   .badge-group .btn:has(~ .badge, ~ .btn), .badge-group .badge:has(~ .badge) {
      border: none;
   }

   .badge-group .btn {
      flex-shrink: 0;
   }

      .badge-group .btn ~ .badge, .badge-group .btn ~ .btn, .badge-group .badge ~ .badge {
         border-start-start-radius: 0;
         border-end-start-radius: 0;
         border-start-end-radius: 0.35rem;
         border-end-end-radius: 0.35rem;
      }

   .badge-group .badge {
      flex-grow: 1;
   }

.card-foto {
   border-radius: 0.675rem;
   max-width: 100%;
   box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.75), 0 1rem 1rem -0.5rem rgba(0, 0, 0, 0.3);
   object-fit: cover;
   object-position: center center;
}

.btn-link.btn-danger {
   color: var(--tw-danger);
   font-size: 0.8125rem;
   height: auto;
   padding-bottom: 0.25em;
   padding-inline-start: 0;
   padding-inline-end: 0;
   border-radius: 0;
   background-color: transparent;
   border-bottom: 1px dashed var(--tw-danger);
}

   .btn-link.btn-danger:hover, .btn-link.btn-danger:focus, .btn-link.btn-danger:active, .btn-link.btn-danger.active {
      background-color: transparent;
      border-bottom: 1px dashed var(--tw-danger-active);
      color: var(--tw-danger-active);
      box-shadow: none;
   }

.btn-link.btn-success {
   color: var(--tw-success);
   font-size: 0.8125rem;
   height: auto;
   padding-bottom: 0.25em;
   padding-inline-start: 0;
   padding-inline-end: 0;
   border-radius: 0;
   background-color: transparent;
   border-bottom: 1px dashed var(--tw-success);
}

   .btn-link.btn-success:hover, .btn-link.btn-success:focus, .btn-link.btn-success:active, .btn-link.btn-success.active {
      background-color: transparent;
      border-bottom: 1px dashed var(--tw-success-active);
      color: var(--tw-success-active);
      box-shadow: none;
   }

.btn-link.btn-brand {
   color: var(--tw-brand);
   font-size: 0.8125rem;
   height: auto;
   padding-bottom: 0.25em;
   padding-inline-start: 0;
   padding-inline-end: 0;
   border-radius: 0;
   background-color: transparent;
   border-bottom: 1px dashed var(--tw-brand);
}

   .btn-link.btn-brand:hover, .btn-link.btn-brand:focus, .btn-link.btn-brand:active, .btn-link.btn-brand.active {
      background-color: transparent;
      border-bottom: 1px dashed var(--tw-brand-active);
      color: var(--tw-brand-active);
      box-shadow: none;
   }

.switch.switch-success input[type=checkbox]:checked, .switch input[type=checkbox][aria-checked="true"] {
   background-color: var(--tw-success);
   transition: all .15s ease-in-out;
}

input:focus.plaintext, input:focus-visible.plaintext {
   outline: none;
   -webkit-box-shadow: none;
   box-shadow: none;
}

.plaintext {
   border: none;
   font-size: 20px;
   font-weight: 700;
   field-sizing: content;
}

input:focus.plaintext + i, input:focus-visible.plaintext + i {
   display: none;
}

/*label:has(input[type="radio"]:checked) svg {
   stroke: var(--tw-primary);
}

label:has(input[type="radio"]:checked) i {
   color: var(--tw-primary);
}*/
.flex-root {
   flex: 1;
}

.flex-column-fluid {
   flex: 1 0 auto;
}

.text-2sm .switch .switch-label {
   font-size: 0.8125rem;
}

.titulo {
   font-size: 1.25rem; /* text-xl */
   line-height: 1.75rem;
   font-weight: 500;
   /*color: var(--tw-gray-900);*/
}

.subtitulo {
   font-size: 0.9375rem; /* text-md */
   line-height: 1.375rem;
   /*color: var(--tw-gray-700);*/
}

.texto {
   font-size: 0.875rem; /* text-sm */
   line-height: 1.25rem;
   /*text-align: justify;*/
   /*color: var(--tw-gray-700);*/
}

.btn-principal:hover {
   filter: brightness(96%);
}


.input-color input[type="color"] {
   appearance: none;
   -moz-appearance: none;
   -webkit-appearance: none;
   background: none;
   cursor: pointer;
   height: 40px;
   width: 40px;
   border: 1px solid var(--tw-gray-300);
   padding: 0 !important;
   border-top-left-radius: 0.375rem;
   border-bottom-left-radius: 0.375rem;
   border-top-right-radius: 0px;
   border-bottom-right-radius: 0;
}

.input-color-icon {
   position: relative;
}

   .input-color-icon input[type="color"] {
      appearance: none;
      -moz-appearance: none;
      -webkit-appearance: none;
      flex-grow: unset;
      margin-left: -8px;
      padding: 0;
      cursor: pointer;
      width: 30px;
      height: 30px;
      position: relative;
      background-color: transparent;
      -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 200"><path d="M163.2,133.6l16.2,51.4c.7,2.8,2.4,5.4,4.7,7.2,2.3,1.8,5.1,2.8,8.1,2.9,2.9,0,5.8-.8,8.2-2.6,2.4-1.7,4.1-4.2,5-7l5.3-14.6c.6-1.8,1.7-3.5,3.1-4.9,1.4-1.4,3.1-2.4,4.9-3l14.6-5.4c2.7-.9,5-2.6,6.7-4.9,1.7-2.3,2.5-5.1,2.5-7.9s-.9-5.6-2.5-7.9c-1.7-2.3-4-4-6.7-4.9l-52.4-16c-2.5-.8-5.1-.9-7.6-.3-2.5.6-4.8,1.9-6.7,3.7-1.8,1.8-3.1,4.1-3.8,6.7-.6,2.5-.5,5.2.3,7.7h0ZM184.7,102.5c-4.2-1.3-8.6-1.6-12.9-.8-4.3.7-8.4,2.5-11.9,5-3.5,2.6-6.4,5.9-8.4,9.8s-3,8.1-3.1,12.5c0,2.9.5,5.7,1.4,8.5l12.3,39h-61.8c-5.6,0-11.2-1.1-16.5-3.2s-10-5.3-14-9.3c-4-4-7.2-8.7-9.3-14-2.2-5.2-3.3-10.8-3.2-16.5V52.8c0-11.4,4.5-22.3,12.6-30.4s19-12.6,30.4-12.6h80.9c11.4,0,22.2,4.6,30.2,12.7,8,8,12.5,18.9,12.5,30.3v61.8l-39.3-12h0Z" /></svg>');
      -webkit-mask-size: contain;
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-position: center;
      mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 200"><path d="M163.2,133.6l16.2,51.4c.7,2.8,2.4,5.4,4.7,7.2,2.3,1.8,5.1,2.8,8.1,2.9,2.9,0,5.8-.8,8.2-2.6,2.4-1.7,4.1-4.2,5-7l5.3-14.6c.6-1.8,1.7-3.5,3.1-4.9,1.4-1.4,3.1-2.4,4.9-3l14.6-5.4c2.7-.9,5-2.6,6.7-4.9,1.7-2.3,2.5-5.1,2.5-7.9s-.9-5.6-2.5-7.9c-1.7-2.3-4-4-6.7-4.9l-52.4-16c-2.5-.8-5.1-.9-7.6-.3-2.5.6-4.8,1.9-6.7,3.7-1.8,1.8-3.1,4.1-3.8,6.7-.6,2.5-.5,5.2.3,7.7h0ZM184.7,102.5c-4.2-1.3-8.6-1.6-12.9-.8-4.3.7-8.4,2.5-11.9,5-3.5,2.6-6.4,5.9-8.4,9.8s-3,8.1-3.1,12.5c0,2.9.5,5.7,1.4,8.5l12.3,39h-61.8c-5.6,0-11.2-1.1-16.5-3.2s-10-5.3-14-9.3c-4-4-7.2-8.7-9.3-14-2.2-5.2-3.3-10.8-3.2-16.5V52.8c0-11.4,4.5-22.3,12.6-30.4s19-12.6,30.4-12.6h80.9c11.4,0,22.2,4.6,30.2,12.7,8,8,12.5,18.9,12.5,30.3v61.8l-39.3-12h0Z" /></svg>');
      mask-size: contain;
      mask-repeat: no-repeat;
      mask-position: center;
      z-index: 99;
   }

   .input-color-icon::before {
      content: '';
      flex-grow: unset;
      margin-top: 1px;
      margin-left: -10px;
      background-color: var(--tw-gray-300);
      padding: 0;
      position: absolute;
      /*top: 0;
      left: 0;*/
      cursor: pointer;
      width: 34px;
      height: 34px;
      z-index: 1;
      -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 200"><path d="M241.7,135.6c-1.9-2.7-4.6-4.6-7.7-5.7l-7.9-2.4V52.8c0-12-4.7-23.2-13.1-31.7-8.4-8.5-19.7-13.2-31.6-13.3h-80.9c-12,0-23.3,4.7-31.8,13.2-8.5,8.5-13.2,19.8-13.2,31.8v80.7c0,5.9,1.1,11.7,3.4,17.2,2.3,5.5,5.5,10.4,9.7,14.6,4.2,4.2,9.1,7.5,14.6,9.7,5.5,2.3,11.2,3.4,17.1,3.4h75l2.2,7c.8,3.2,2.8,6.1,5.4,8.2,2.6,2.1,5.9,3.3,9.3,3.3.1,0,.2,0,.3,0,3.2,0,6.5-1,9.1-2.9,2.7-2,4.7-4.8,5.7-8l5.3-14.6c.5-1.5,1.4-3,2.6-4.1,1.2-1.2,2.6-2,4.2-2.6l14.6-5.4c3.1-1,5.8-3,7.7-5.6,1.9-2.7,2.9-5.8,2.9-9.1s-1-6.4-2.9-9.1Z" /></svg>');
      -webkit-mask-size: contain;
      -webkit-mask-repeat: no-repeat;
      -webkit-mask-position: center;
      mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 200"><path d="M241.7,135.6c-1.9-2.7-4.6-4.6-7.7-5.7l-7.9-2.4V52.8c0-12-4.7-23.2-13.1-31.7-8.4-8.5-19.7-13.2-31.6-13.3h-80.9c-12,0-23.3,4.7-31.8,13.2-8.5,8.5-13.2,19.8-13.2,31.8v80.7c0,5.9,1.1,11.7,3.4,17.2,2.3,5.5,5.5,10.4,9.7,14.6,4.2,4.2,9.1,7.5,14.6,9.7,5.5,2.3,11.2,3.4,17.1,3.4h75l2.2,7c.8,3.2,2.8,6.1,5.4,8.2,2.6,2.1,5.9,3.3,9.3,3.3.1,0,.2,0,.3,0,3.2,0,6.5-1,9.1-2.9,2.7-2,4.7-4.8,5.7-8l5.3-14.6c.5-1.5,1.4-3,2.6-4.1,1.2-1.2,2.6-2,4.2-2.6l14.6-5.4c3.1-1,5.8-3,7.7-5.6,1.9-2.7,2.9-5.8,2.9-9.1s-1-6.4-2.9-9.1Z" /></svg>');
      mask-size: contain;
      mask-repeat: no-repeat;
      mask-position: center;
   }

   .input-color .input-color-text, .input-color-icon .input-color-text {
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: var(--tw-gray-600)
   }

   .input-color-icon .input-color-text {
      padding-left: 10px;
   }

   .input-color label, .input-color-icon label {
      flex: 1 1 auto;
   }

.input-group.input-color > .input, .input-group.input-color-icon > .input {
   flex: none;
}

.input-color ::-webkit-color-swatch-wrapper, .input-color-icon ::-webkit-color-swatch-wrapper {
   padding: 0;
}

.input-color ::-webkit-color-swatch, .input-color-icon ::-webkit-color-swatch {
   border: 0;
   border-radius: 0.375rem;
}

.input-color ::-webkit-color-swatch, .input-color-icon ::-webkit-color-swatch {
   border: 0;
   border-top-left-radius: 0.375rem;
   border-bottom-left-radius: 0.375rem;
   border-top-right-radius: 0px;
   border-bottom-right-radius: 0;
}

::-moz-color-swatch {
   border: 0;
}

.input-sm input[type="color"] {
   font-weight: 500;
   font-size: 0.75rem;
   height: 2rem;
   padding-inline-start: 0.625rem;
   padding-inline-end: 0.625rem;
   background-color: var(--tw-light-active);
}

@media (min-width: 992px) {
   .flex-lg-row {
      flex-direction: row !important;
   }

   .flex-lg-row-auto {
      flex: 0 0 auto;
   }

   .flex-lg-row-fluid {
      flex: 1 auto;
      min-width: 0;
   }
}

.text-4xl {
   font-size: 2.25rem; /* 36px */
   line-height: 2.5rem; /* 40px */
}

.text-5xl {
   font-size: 3rem; /* 48px */
   line-height: 1;
}

.text-6xl {
   font-size: 3.75rem; /* 60px */
   line-height: 1;
}

.text-7xl {
   font-size: 4.5rem; /* 72px */
   line-height: 1;
}

.text-8xl {
   font-size: 6rem; /* 96px */
   line-height: 1;
}

.text-9xl {
   font-size: 8rem; /* 128px */
   line-height: 1;
}

.flex-center {
   display: flex;
   justify-content: center;
   align-items: center;
}

.img-responsive {
   object-fit: cover;
   object-position: center center;
}

.hover-darken {
   background-color: transparent;
   transition: background-color 0.5s ease;
}

   .hover-darken:hover {
      background-color: rgba(0, 0, 0, 0.2);
   }

.card-header.darken1 {
   background-color: rgba(0, 0, 0, 0.1);
}

   .card-header.darken1:hover {
      background-color: rgba(0, 0, 0, 0.3);
   }

@media (min-width: 992px) {
   .flex-lg-row-auto {
      flex: 0 0 auto;
   }

   .flex-lg-row-fluid {
      flex: 1 auto;
      min-width: 0;
   }
}

.my-auto {
   margin-top: auto !important;
   margin-bottom: auto !important;
}

.btn-input {
   color: var(--tw-gray-700);
   border-color: var(--tw-gray-300);
   background-color: var(--tw-light-active);
}

.py-100px {
   padding-top: 100px;
   padding-bottom: 100px;
}

@media (min-width: 1024px) {
   .lg\:py-\[70px\] {
      padding-top: 70px;
      padding-bottom: 70px;
   }
   .lg\:pb-\[70px\] {
      padding-bottom: 70px;
   }
}

.col-span-12 {
   grid-column: span 12 / span 12;
}

.col-span-11 {
   grid-column: span 11 / span 11;
}

.col-span-10 {
   grid-column: span 10 / span 10;
}

.col-span-9 {
   grid-column: span 9 / span 9;
}

.col-span-8 {
   grid-column: span 8 / span 8;
}

.col-span-7 {
   grid-column: span 7 / span 7;
}

.col-span-6 {
   grid-column: span 6 / span 6;
}

.col-span-5 {
   grid-column: span 5 / span 5;
}

.col-span-4 {
   grid-column: span 4 / span 4;
}

.col-span-3 {
   grid-column: span 3 / span 3;
}

.grid-cols-4 {
   grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid-cols-5 {
   grid-template-columns: repeat(5, minmax(0, 1fr));
}

.grid-cols-6 {
   grid-template-columns: repeat(6, minmax(0, 1fr));
}

.grid-cols-7 {
   grid-template-columns: repeat(7, minmax(0, 1fr));
}

.grid-cols-8 {
   grid-template-columns: repeat(8, minmax(0, 1fr));
}

@media (min-width: 640px) {
   .sm\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
   }

   .sm\:grid-cols-5 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
   }

   .sm\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
   }

   .sm\:grid-cols-7 {
      grid-template-columns: repeat(7, minmax(0, 1fr));
   }

   .sm\:grid-cols-8 {
      grid-template-columns: repeat(8, minmax(0, 1fr));
   }

   .sm\:grid-cols-9 {
      grid-template-columns: repeat(9, minmax(0, 1fr));
   }

   .sm\:grid-cols-10 {
      grid-template-columns: repeat(10, minmax(0, 1fr));
   }

   .sm\:grid-cols-11 {
      grid-template-columns: repeat(11, minmax(0, 1fr));
   }

   .sm\:grid-cols-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr));
   }
}

@media (min-width: 768px) {
   .md\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
   }

   .md\:grid-cols-5 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
   }

   .md\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
   }

   .md\:grid-cols-7 {
      grid-template-columns: repeat(7, minmax(0, 1fr));
   }

   .md\:grid-cols-8 {
      grid-template-columns: repeat(8, minmax(0, 1fr));
   }

   .md\:grid-cols-9 {
      grid-template-columns: repeat(9, minmax(0, 1fr));
   }

   .md\:grid-cols-10 {
      grid-template-columns: repeat(10, minmax(0, 1fr));
   }

   .md\:grid-cols-11 {
      grid-template-columns: repeat(11, minmax(0, 1fr));
   }

   .md\:grid-cols-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr));
   }
}

@media (min-width: 1024px) {
   .lg\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
   }

   .lg\:grid-cols-5 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
   }

   .lg\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
   }

   .lg\:grid-cols-7 {
      grid-template-columns: repeat(7, minmax(0, 1fr));
   }

   .lg\:grid-cols-8 {
      grid-template-columns: repeat(8, minmax(0, 1fr));
   }

   .lg\:grid-cols-9 {
      grid-template-columns: repeat(9, minmax(0, 1fr));
   }

   .lg\:grid-cols-10 {
      grid-template-columns: repeat(10, minmax(0, 1fr));
   }

   .lg\:grid-cols-11 {
      grid-template-columns: repeat(11, minmax(0, 1fr));
   }

   .lg\:grid-cols-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr));
   }
   .lg\:py-100px {
      padding-top: 100px;
      padding-bottom: 100px;
   }
}

@media (min-width: 1280px) {
   .xl\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
   }

   .xl\:grid-cols-5 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
   }

   .xl\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
   }

   .xl\:grid-cols-7 {
      grid-template-columns: repeat(7, minmax(0, 1fr));
   }

   .xl\:grid-cols-8 {
      grid-template-columns: repeat(8, minmax(0, 1fr));
   }

   .xl\:grid-cols-9 {
      grid-template-columns: repeat(9, minmax(0, 1fr));
   }

   .xl\:grid-cols-10 {
      grid-template-columns: repeat(10, minmax(0, 1fr));
   }

   .xl\:grid-cols-11 {
      grid-template-columns: repeat(11, minmax(0, 1fr));
   }

   .xl\:grid-cols-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr));
   }
}