@import url('https://fonts.googleapis.com/css2?family=Work+Sans: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;

*{
  font-family: 'Work Sans', sans-serif;
}

.theme-default {
    --color-primary: var(--p-blue-500);
    --color-primary-hover: var(--p-blue-600);
    --color-secondary: var(--p-blue-400);
    --color-success: var(--p-green-500);
    --color-info:var(--p-sky-500);
    --color-danger: var(--p-rose-500);
    --color-warning: var(--p-yellow-500);
}

.theme-neon {
    --color-primary: var(--p-teal-500);
    --color-primary-hover: var(--p-teal-600);
    --color-secondary: var(--p-teal-400);
    --color-success: var(--p-green-500);
    --color-info: var(--p-sky-500);
    --color-danger: var(--p-rose-500);
    --color-warning: var(--p-yellow-500);
}

.theme-intenso {
  --color-primary: var(--p-rose-500);
  --color-primary-hover: var(--p-rose-600);
  --color-secondary: var(--p-rose-400);
  --color-success: var(--p-green-500);
  --color-info: var(--p-sky-500);
  --color-danger: var(--p-red-500);
  --color-warning: var(--p-orange-500);
}

.theme-soleado {
  --color-primary: var(--p-amber-500);
  --color-primary-hover: var(--p-amber-600);
  --color-secondary: var(--p-amber-400);
  --color-success: var(--p-lime-500);
  --color-info: var(--p-sky-500);
  --color-danger: var(--p-red-500);
  --color-warning: var(--p-orange-500);
}

.theme-moderno {
  --color-primary: var(--p-purple-500);
  --color-primary-hover: var(--p-purple-600);
  --color-secondary: var(--p-purple-400);
  --color-success: var(--p-emerald-500);
  --color-info: var(--p-sky-500);
  --color-danger: var(--p-pink-500);
  --color-warning: var(--p-orange-500);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  color: rgba(0, 0, 0, 0);
  opacity: 1;
  display: block;
  background: url(https://img.icons8.com/emoji/20/calendar-emoji.png) no-repeat;
  width: 20px;
  height: 20px;
  border-width: thin;
}

input[type="time"]::-webkit-calendar-picker-indicator {
  color: rgba(0, 0, 0, 0);
  opacity: 1;
  display: block;
  background: url(https://img.icons8.com/emoji/20/calendar-emoji.png) no-repeat;
  width: 20px;
  height: 20px;
  border-width: thin;
}

input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  color: rgba(0, 0, 0, 0);
  opacity: 1;
  display: block;
  background: url(https://img.icons8.com/emoji/20/calendar-emoji.png) no-repeat;
  width: 20px;
  height: 20px;
  border-width: thin;
}

.slide-fade-enter-active {
  transition: all 0.3s ease-out;
}

.slide-fade-leave-active {
  transition: all 0.3s cubic-bezier(1, 0.5, 0.8, 1);
}

.slide-fade-enter-from,
.slide-fade-leave-to {
  transform: translateX(20px);
  opacity: 0;
}