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

@layer base {
  :root {
    --primary: #990b00;
    --secondary: #0c6672;
    --accent: #bb1e10;
    --error: #9a0d55;
    --warning: #bb6210;
    --info: #388994;
    --success: #73ad0f;
  }
  .dark {
    --primary: #ff0d00;
    --secondary: #0f9aa9;
    --accent: #bb1e10;
    --error: #9a0d55;
    --warning: #bb6210;
    --info: #4ccbda;
    --success: #73ad0f;
  }
}

/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #c9c9c9 transparent;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

*::-webkit-scrollbar-track {
  background: transparent; /*f1f1f1;*/
}

*::-webkit-scrollbar-thumb {
  background-color: #c9c9c9;
  border-radius: 12px;
  border: 0px solid #ffffff;
}

html,
body {
  @apply h-full w-screen m-0 p-0 overflow-hidden bg-gray-100;
  height: 100svh;
}

#app {
  @apply w-full h-full overflow-hidden flex flex-col;
}

button:not([headlessui]):not([class*="fc"]),
a[button]:not([headlessui]) {
  @apply relative box-border h-10 w-full flex justify-center py-2 px-4 text-sm font-medium rounded-md focus:outline-none focus:ring-0;
}

button[primary]:not([primary="false"]),
a[button][primary]:not([primary="false"]) {
  @apply border border-transparent text-white bg-primary hover:bg-primary;
}

button[primary-outline]:not([primary-outline="false"]),
a[button][primary-outline]:not([primary-outline="false"]) {
  @apply border-2 border-primary text-black hover:bg-primary;
}

button:disabled,
a[button]:disabled,
a[button].disabled {
  @apply opacity-75 pointer-events-none;
}

input:not([type="checkbox"]),
textarea {
  @apply rounded-md shadow-sm relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-0 focus:z-10 sm:text-sm resize-none;
}

input[readonly],
textarea[readonly] {
  @apply pointer-events-none;
}

input[disabled],
textarea[disabled] {
  @apply opacity-75 pointer-events-none;
}

.fc-button-primary {
  @apply !bg-primary !border-primary !outline-none !ring-0 hover:!bg-red-700 hover:!border-red-700;
}
.fc-button-active {
  @apply !bg-red-500 !border-red-500;
}
.fc-toolbar {
  @apply flex-wrap;
}