Add Tailwind-like styles for a calendar component

sample/tailwindSample.css

@@ -0,0 +1,62 @@
+/* Container principal - estilo Tailwind-like */
+.react-calendar {
+  @apply w-full max-w-md bg-white font-sans rounded-lg shadow-sm overflow-hidden items-center justify-center;
+  line-height: 1.125em;
+}
+
+/* Header do calendário */
+.react-calendar__navigation {
+  @apply flex justify-between items-center mb-4 bg-gray-100 p-2 rounded-t-lg;
+}
+
+.react-calendar__navigation button {
+  @apply bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-full p-2 transition-colors;
+  min-width: 44px;
+}
+
+/* Dias da semana */
+.react-calendar__month-view__weekdays {
+  @apply text-xs text-gray-500 uppercase font-medium text-center mb-2;
+}
+
+/* Dias do calendário */
+.react-calendar__tile {
+  @apply w-10 h-10 m-1 p-0 rounded-full flex items-center justify-center 
+         text-gray-700 hover:bg-gray-100 transition-colors;
+}
+
+/* Dia atual */
+.react-calendar__tile--now {
+  @apply bg-blue-100 text-blue-600 font-medium;
+}
+
+/* Dia selecionado */
+.react-calendar__tile--active {
+  @apply bg-blue-500 text-white hover:bg-blue-600;
+}
+
+/* Dias de fim de semana */
+.react-calendar__month-view__days__day--weekend {
+  @apply text-gray-400;
+}
+
+/* Dias do mês vizinho */
+.react-calendar__month-view__days__day--neighboringMonth {
+  @apply text-gray-300;
+}
+
+/* Container dos dias */
+.react-calendar__month-view__days {
+  @apply grid grid-cols-7 gap-1 p-2;
+}
+
+/* Ajustes para hover e estados */
+.react-calendar__tile:enabled:hover,
+.react-calendar__tile:enabled:focus {
+  @apply bg-gray-100;
+}
+
+.react-calendar__tile--active:enabled:hover,
+.react-calendar__tile--active:enabled:focus {
+  @apply bg-blue-600;
+}