@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

@tailwind base;
@tailwind components;
@tailwind utilities;

@import "style/main";

body {
  @apply bg-[rgba(0,0,0,0.025)];
}
.text-primary {
  color: var(--primary);
}
.text-secondry {
  color: var(--secondry);
}
.searchbar label {
  display: none;
}
.searchbar input {
  max-height: 44px;
  border: none;
  background-color: transparent;
}
.searchbar input:focus {
  box-shadow: none;
}
.searchbar p {
  position: absolute;
  margin-top: 0;
}

.fc {
  .fc-license-message {
    display: none !important;
  }
  .fc-toolbar {
    &.fc-header-toolbar {
      @apply flex flex-col sm:flex-row gap-2 mb-2 sm:mb-6;

      & > * {
        @apply flex-[1_0] w-full sm:w-0 flex  justify-center sm:block;
        &:nth-child(2) {
          .fc-button {
            @apply bg-[rgb(var(--primary-rgb)/0%)] text-[rgb(var(--primary-rgb)/100%)] rounded border-0 m-0 capitalize font-medium w-[36px] h-[36px] mr-1 p-0;
            &:last-child {
              @apply mr-0;
            }
            &.fc-button-active {
              @apply bg-[rgb(var(--primary-rgb)/100%)] text-white;
            }
          }
          & > div {
            @apply flex items-center justify-center;
            .fc-toolbar-title {
              @apply text-base font-semibold min-w-[150px] text-center ;
            }
          }
        }
      }
      .fc-button-group {
        .fc-button {
          @apply text-sm bg-[rgb(var(--primary-rgb)/10%)] text-[rgb(var(--primary-rgb)/100%)] rounded border-0 m-0 capitalize font-medium min-w-[60px] mr-1;
          &:last-child {
            @apply mr-0;
          }
          &.fc-button-active {
            @apply bg-[rgb(var(--primary-rgb)/100%)] text-white;
          }
        }
      }
    }
  }
  .fc-timegrid-slot-label-cushion{
    @apply text-xs sm:text-sm md:text-base;
  }
  .fc-daygrid-day-top {
    @apply justify-end;
  }
  .fc-daygrid-day-number {
    @apply w-8 h-8 flex items-center justify-center text-black rounded-tr-lg rounded-br-lg rounded-bl-lg text-xs sm:text-sm md:text-base;
  }
  .fc-day-today {
    --fc-today-bg-color: rgb(var(--primary-rgb) / 3%);
    .fc-daygrid-day-number {
      @apply bg-[rgb(var(--primary-rgb)/100%)] text-white;
    }
  }
  .fc-h-event {
    @apply mt-1 rounded-[0px] border-0 px-0 py-0 text-sm font-medium bg-transparent text-[rgb(var(--primary-rgb)/100%)] border-transparent;
    .fc-event-main {
      color: inherit;
    }
  }
  & &-scrollgrid-liquid {
    border: 0px;
  }
  & &-scrollgrid-section {
    & > th {
      border: none;
    }
    & > td {
      border: 1px solid #ddd;
    }
  }
  & &-col {
    &-header {
      thead {
        tr {
          th {
            border: none;
            @apply font-semibold text-base text-black text-xs sm:text-sm md:text-base;
          }
        }
      }
    }
  }
  &-direction-ltr .fc-timegrid-col-events {
  }
  .fc-timegrid-axis-cushion {
    max-width: 120px;
  }
  .fc-timegrid-event {
    background-color: transparent;
    border-color: transparent;
    .fc-v-event {
    }
    .fc-event-main {
      padding: 0px;
    }
  }
}
.rdt {
  &_Table {
    @apply rounded-xl rounded-tr-xl;
  }
  &_TableHead {
    @apply rounded-tl-xl rounded-tr-xl;
  }
  &_TableHeadRow {
    @apply !min-h-[unset] !border-0 rounded-tl-xl rounded-tr-xl;

    .rdt {
      &_TableCol {
        @apply bg-gray-200/75 text-black/40 font-normal text-sm px-4 py-2 border-b border-black/15;
        &:first-child {
          @apply rounded-tl;
          .no-round & {
            @apply rounded-[unset];
          }
        }
        &:last-child {
          @apply rounded-tr;
          .no-round & {
            @apply rounded-[unset];
          }
        }
      }
      &_TableCol {
        &_Sortable {
          span {
            @apply text-[10px];
          }
        }
      }
    }
  }
  &_TableBody {
    .rdt {
      &_TableRow {
        @apply !border-0;
      }
      &_TableCell {
        @apply text-black font-normal text-xs 2xl:text-sm px-4 py-2.5 border-b border-black/10;
      }
    }
  }
  &_Pagination {
    @apply !border-t-0 rounded-bl rounded-br;
    .no-round & {
      @apply rounded-[unset];
    }
  }
}

.p {
  &-datatable {
    @apply rounded-xl border;
    &-table {
      @apply bg-white rounded-xl min-w-full;
    }
    &-thead {
      tr {
        th {
          @apply bg-[rgb(var(--primary-rgb)/15%)] text-black/50 font-medium text-base px-4 py-2.5 border-b border-black/15;
          &:first-child {
            @apply rounded-tl;
            .no-round & {
              @apply rounded-[unset];
            }
          }
          &:last-child {
            @apply rounded-tr;
            .no-round & {
              @apply rounded-[unset];
            }
          }
        }
      }
    }
    &-tbody {
      tr {
        td {
          @apply text-black font-medium text-base px-4 py-2.5 border-b border-black/10;
        }
        &:last-child {
          td {
            @apply border-b-0;
          }
        }
        &.p-datatable-row-expansion {
          & > td {
            @apply p-0;
          }
        }
      }
    }
  }
  &-column {
    &-header {
      &-content {
      }
    }
  }
}
table {
  width: 100%;
  border-collapse: collapse;
}
table td,
table th {
  padding: 20px;
  text-align: left;
  padding-top: 15px;
  padding-bottom: 15px;
}
table tr {
  border: 1px solid #ddd;
  border-left: 0;
  border-right: 0;
}
table th {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #777777;
}
table td {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #232323;
}

/* code by davin */
.calendar-event {
  cursor: pointer;
  transition: transform 0.1s ease-in-out;
}

.calendar-event:hover {
  transform: scale(1.02);
  z-index: 1;
}

.PhoneInputInput{
  outline: none !important;
}
.Toastify__toast-body{
  font-weight: 400;
  font-size: 14px;
}


/* Hide eyedropper button in Chrome color picker popup */
input[type="color"]::-webkit-color-picker-eyedropper {
  display: none !important;
}

input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 0;
}

input[type="color"]::-webkit-color-swatch {
  border: none;
  border-radius: 0;
}

/* Hide eyedropper in various browsers */
.color-picker-eyedropper,
[data-testid="eyedropper"],
[aria-label*="eyedropper" i],
[title*="eyedropper" i] {
  display: none !important;
  visibility: hidden !important;
}

/* Custom class for inputs that shouldn't show eyedropper */
.no-eyedropper::-webkit-color-picker-eyedropper {
  display: none !important;
}
