﻿/**, :root {
   --tw-page-bg: #ffffff !important;
}
*/
.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;
}


.bg-stripes-secondary {
   background-color: var(--tw-gray-200);
   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;
}

.py-100px {
   padding-top: 100px;
   padding-bottom: 100px;
}

@media (min-width: 1024px) {
   .lg\:py-100px {
      padding-top: 100px;
      padding-bottom: 100px;
   }
}

.ticket {
   width: 100%;
}

.card-ticket {
   /*height: 100%;*/
   float: left;
   position: relative;
}

   .card-ticket .card-header {
      min-height: 40px;
   }

   .card-ticket .card-footer {
      min-height: 30px;
   }

   .card-ticket .card-body {
      background-color: #f0f0f0;
   }

[data-bs-theme=dark] .ticket.incompleto .card-ticket .card-body {
   background-color: #323436;
}

[data-bs-theme=dark] .card-ticket .card-body {
   background-color: var(--tw-info-light);
}

.card-ticket .card-header {
   background-color: var(--tw-info);
}

.card-ticket .card-footer {
   background-color: #f0f0f0;
}

[data-bs-theme=dark] .card-ticket .card-footer {
   background-color: var(--tw-info-light);
}

[data-bs-theme=dark] .ticket.incompleto .card-ticket .card-footer {
   background-color: #323436;
}

/*LEFT*/
.ticket.incompleto .card-header {
   background-color: #f0f0f0 !important;
}

[data-bs-theme=dark] .ticket.incompleto .card-header {
   background-color: #323436 !important;
}

.ticket.incompleto .card-left .card-header .card-title {
   color: var(--tw-gray-600) !important;
}

[data-bs-theme=dark] .ticket.incompleto .card-left .card-header .card-title {
   color: var(--tw-gray-400) !important;
}
/*LEFT*/

/*RIGHT*/
.ticket .card-right {
   background: linear-gradient(to bottom, var(--tw-info) 0%, var(--tw-info) 26%, #f0f0f0 26%, #f0f0f0 100%);
}

[data-bs-theme=dark] .ticket .card-right {
   background: linear-gradient(to bottom, var(--tw-info) 0%, var(--tw-info) 26%, #212529 26%, #212529 100%);
}

.ticket.incompleto .card-right .text-cor1 {
   color: var(--tw-gray-500) !important;
}

.ticket.incompleto .card-right .text-cor1-inverse {
   color: var(--tw-gray-500) !important;
}

.ticket.incompleto .card-right {
   background: linear-gradient(to bottom, #f0f0f0 0%, #f0f0f0 26%, #f0f0f0 26%, #f0f0f0 100%);
}

[data-bs-theme=dark] .ticket.incompleto .card-right {
   background: linear-gradient(to bottom, var(--tw-card-bg) 0%, var(--tw-card-bg) 26%, var(--tw-card-bg) 26%, var(--tw-card-bg) 100%);
}

.card-right .card-footer {
   display: flex;
   justify-content: center;
}

.card-right:before {
   left: -.5em;
   top: -.4em;
}

.card-right:after, .card-right:before {
   content: "";
   position: absolute;
   display: block;
   width: .9em;
   height: .9em;
   background: #fff;
   border-radius: 50%;
}

[data-bs-theme=dark] .card-right:after, [data-bs-theme=dark] .card-right:before {
   background: var(--tw-card-bg);
}
/*RIGHT*/

@media (min-width: 576px) {
   .card-left {
      width: 75%;
      border-top-left-radius: 0.75rem;
      border-bottom-left-radius: 0.75rem;
   }

   .card-right {
      width: 25%;
      border-left: .18em dashed #fff;
      border-top-right-radius: 0.75rem;
      border-bottom-right-radius: 0.75rem;
   }

   [data-bs-theme=dark] .card-right {
      border-left: .18em dashed #323436;
   }

   .card-right:after {
      bottom: -.4em;
   }

   .card-right:before, .card-right:after {
      left: -.5em;
   }

   .card-ticket .card-footer {
      border-radius: 0 0 0 0.75rem;
   }

   .card-ticket.card-right .card-footer {
      border-bottom-right-radius: 0.75rem;
   }

   .card-ticket.card-right .card-header {
      border-top-right-radius: 0.75rem;
   }

   .card-ticket.card-right .card-body {
      border-bottom-right-radius: 0.75rem;
   }

   .card-ticket .card-header {
      border-radius: 0.75rem 0 0 0;
   }

   .preenchido {
      color: var(--tw-info-inverse);
   }

   .ticket.incompleto .card-right .card-header {
      background-color: #f0f0f0;
   }

   [data-bs-theme=dark] .ticket.incompleto .card-right .card-header {
      background-color: #323436;
   }
}

@media (max-width: 576px) {
   .card-left {
      width: 100%;
      border-top-left-radius: 0.75rem;
      border-bottom-left-radius: 0px;
      border-bottom-right-radius: 0px;
   }

   .card-right:after {
      right: -0.3em;
      top: -.4em;
   }

   .card-right {
      width: 100%;
      border-top: .18em dashed #fff;
      border-top-right-radius: 0px;
      border-bottom-right-radius: 0.75rem;
      border-bottom-left-radius: 0.75rem;
   }

      .card-right .card-header {
         background-color: #f0f0f0;
      }

   [data-bs-theme=dark] .card-right {
      border-top: .18em dashed #fff;
   }

      [data-bs-theme=dark] .card-right .card-header {
         background-color: #323436;
      }

   .preenchido {
      color: var(--tw-info);
   }

   .ticket.incompleto .card-right .card-header {
      background-color: #f0f0f0;
   }

   [data-bs-theme=dark] .ticket.incompleto .card-right .card-header {
      background-color: #323436;
   }
}

.bg-stripes-danger {
   background-color: #60a5fa1a;
   background-image: linear-gradient(135deg, var(--tw-danger) 10%, #0000 0, #0000 50%, var(--tw-danger) 0, var(--tw-danger) 60%, #0000 0, #0000);
   background-size: 7.07px 7.07px;
}

@keyframes wiggleRight {
   0% {
      transform: translateX(0);
   }

   50% {
      transform: translateX(0.5em);
   }

   100% {
      transform: translateX(0);
   }
}

.stroke-warning-clarity {
   stroke: var(--tw-warning-clarity);
}

.fill-warning-light {
   fill: var(--tw-warning-light);
}

.tab.active {
   border-bottom-color: var(--tw-info);
}

.tab.active, .tab:hover, .tab:focus {
   color: var(--tw-info);
}

   .tab.active i, .tab:hover i, .tab:focus i {
      color: var(--tw-info);
   }

.wiggle-right {
   display: inline-block;
   animation: wiggleRight 2s infinite;
}

.card-header, .card-footer {
   padding-inline-start: 1.25rem;
   padding-inline-end: 1.25rem;
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
}
.modal-body {
   padding-block-start: 1.25rem;
   padding-block-end: 1.25rem;
}

.modal-title {
   font-size: 0.975rem;
}
.modal-center-y{

}

/* Define a borda padrão */
.grid-border .group {
   border-right: 1px solid var(--tw-gray-200);
   border-bottom: 1px solid var(--tw-gray-200);
}

   /* Remove a borda direita dos últimos itens de cada linha */
   .grid-border .group:nth-child(4n) {
      border-right: none;
   }

   /* Remove a borda inferior apenas dos itens da última linha (se houver mais de uma linha) */
   .grid-border .group:nth-child(n+5) {
      border-bottom: none;
   }

   /* Se houver exatamente 4 itens, remove a borda inferior de todos eles */
   .grid-border .group:nth-child(4):nth-last-child(1),
   .grid-border .group:nth-child(3):nth-last-child(2),
   .grid-border .group:nth-child(2):nth-last-child(3),
   .grid-border .group:nth-child(1):nth-last-child(4) {
      border-bottom: none;
   }



.demo1 {
   --tw-header-height: 60px;
}

.w-500px {
   width: 500px;
}

.w-650px {
   width: 650px;
}

.w-850px {
   width: 850px;
}

.w-1200px {
   width: 1200px;
}

.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;
}
.tabs.agenda, .tabs.agenda-local {
   justify-content: space-around;
   gap: 0;
   border-bottom: none;
}

   .tabs.agenda .tab, .tabs.agenda-local .tab {
      width: 100%;
      justify-content: center;
   }

.agenda > .tab.active {
   font-weight: 600;
}

.agenda > .tab:not(.active) {
   font-weight: 400;
}

.agenda > .tab.active:is(:first-child) {
   border-start-start-radius: 0.675rem;
}

.agenda > .tab.active:is(:last-child) {
   border-start-end-radius: 0.675rem;
}

/* Estilos exclusivos para .agenda-local */
.agenda-local > .tab {
   padding: 6px 0px;
}



.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 {
   cursor: auto;
   color: var(--tw-gray-700);
   border-color: var(--tw-gray-300);
   background-color: var(--tw-light-active);
}

.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));
   }
}

@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));
   }
}

#reconnect-modal {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
    text-align: center;
    z-index: 1000;
}

@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-dark);
   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-dark);
   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-dark);
   }

      .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-info);
   }

      .flicker-btn:active .flicker-btn__icon {
         scale: 1;
         transition: var(--transition);
      }

      .flicker-btn:active .flicker-btn__filler {
         scale: 100;
         animation: none;
      }
}