@tailwind base;
@tailwind components;
@tailwind utilities;
/* Calendar styles */
/* Calendar container */
/* line 4, app/assets/stylesheets/calendar.scss */
.calendar-container {
  @apply bg-white rounded-lg shadow-sm p-4 mb-6;
}

/* Calendar grid */
/* line 9, app/assets/stylesheets/calendar.scss */
.calendar-grid {
  @apply grid grid-cols-7 gap-2;
}

/* Calendar day header */
/* line 14, app/assets/stylesheets/calendar.scss */
.calendar-day-header {
  @apply text-center text-sm font-medium text-gray-600 py-2;
}

/* Calendar day cell */
/* line 19, app/assets/stylesheets/calendar.scss */
.calendar-day {
  @apply bg-white rounded-lg border border-gray-200 p-2 min-h-[120px] relative transition-all duration-200 hover:shadow-md;
}

/* line 23, app/assets/stylesheets/calendar.scss */
.calendar-day.today {
  @apply border-primary-400 bg-primary-50 border-2;
}

/* line 27, app/assets/stylesheets/calendar.scss */
.calendar-day.weekend {
  @apply bg-gray-50;
}

/* Day header with date and day name */
/* line 32, app/assets/stylesheets/calendar.scss */
.day-header {
  @apply flex justify-between items-center mb-2 border-b border-gray-100 pb-1;
}

/* line 36, app/assets/stylesheets/calendar.scss */
.day-name {
  @apply text-xs font-semibold text-gray-700;
}

/* line 40, app/assets/stylesheets/calendar.scss */
.day-date {
  @apply text-xs text-gray-500;
}

/* Day content */
/* line 45, app/assets/stylesheets/calendar.scss */
.day-content {
  @apply space-y-2;
}

/* Day total hours */
/* line 50, app/assets/stylesheets/calendar.scss */
.day-total-hours {
  @apply text-sm font-medium text-gray-800 bg-blue-50 rounded-md p-1 text-center;
}

/* Project hours in day */
/* line 55, app/assets/stylesheets/calendar.scss */
.day-project-hours {
  @apply flex justify-between items-center text-xs p-1 rounded-md bg-gray-50;
}

/* line 59, app/assets/stylesheets/calendar.scss */
.project-name {
  @apply font-medium text-gray-700 truncate flex-1;
}

/* line 63, app/assets/stylesheets/calendar.scss */
.project-hours {
  @apply text-gray-600 whitespace-nowrap;
}

/* No entries message */
/* line 68, app/assets/stylesheets/calendar.scss */
.no-entries {
  @apply text-xs text-gray-400 italic text-center mt-2;
}

/* Project filter */
/* line 73, app/assets/stylesheets/calendar.scss */
.project-filter {
  @apply mb-4 overflow-x-auto pb-2;
}

/* line 77, app/assets/stylesheets/calendar.scss */
.project-filter-item {
  @apply px-3 py-1 rounded-md text-sm text-gray-600 bg-gray-100 transition-all duration-200;
}

/* line 81, app/assets/stylesheets/calendar.scss */
.project-filter-item:hover {
  @apply bg-gray-200;
}

/* line 85, app/assets/stylesheets/calendar.scss */
.project-filter-item.active {
  @apply bg-blue-100 text-blue-700 font-medium;
}

/* Metrics panel */
/* line 90, app/assets/stylesheets/calendar.scss */
.metrics-panel {
  @apply bg-white rounded-lg shadow-sm p-4 mb-6;
}

/* line 94, app/assets/stylesheets/calendar.scss */
.metrics-header {
  @apply border-b border-gray-100 pb-3 mb-3;
}

/* line 98, app/assets/stylesheets/calendar.scss */
.metrics-content {
  @apply space-y-4;
}

/* line 102, app/assets/stylesheets/calendar.scss */
.metric-card {
  @apply bg-blue-50 rounded-lg p-3 text-center;
}

/* line 106, app/assets/stylesheets/calendar.scss */
.metric-label {
  @apply text-sm text-gray-600 mb-1;
}

/* line 110, app/assets/stylesheets/calendar.scss */
.metric-value {
  @apply text-xl font-bold text-blue-700;
}

/* line 114, app/assets/stylesheets/calendar.scss */
.metric-section {
  @apply mt-4;
}

/* line 118, app/assets/stylesheets/calendar.scss */
.project-hours-list {
  @apply space-y-2 mt-2;
}

/* line 122, app/assets/stylesheets/calendar.scss */
.project-hours-item {
  @apply flex justify-between items-center p-2 rounded-md bg-gray-50 border border-gray-100;
}

/* Weekly view header */
/* line 127, app/assets/stylesheets/calendar.scss */
.calendar-header {
  @apply mb-4;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  /* line 133, app/assets/stylesheets/calendar.scss */
  .calendar-grid {
    @apply grid-cols-1;
  }
  /* line 137, app/assets/stylesheets/calendar.scss */
  .calendar-day {
    @apply mb-2;
  }
  /* line 141, app/assets/stylesheets/calendar.scss */
  .day-header {
    @apply justify-center;
  }
  /* line 145, app/assets/stylesheets/calendar.scss */
  .day-name {
    @apply mr-2;
  }
}

/* Add some animations */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* line 156, app/assets/stylesheets/calendar.scss */
.calendar-container {
  animation: fadeIn 0.3s ease-in-out;
}

/* Hover effects */
/* line 161, app/assets/stylesheets/calendar.scss */
.calendar-day:hover {
  @apply border-blue-300;
}

/* line 165, app/assets/stylesheets/calendar.scss */
.day-project-hours:hover {
  @apply bg-blue-50;
}

/* Time entries list */
/* line 170, app/assets/stylesheets/calendar.scss */
.time-entries-list {
  @apply space-y-2 overflow-y-auto max-h-[200px];
}

/* Time entry */
/* line 175, app/assets/stylesheets/calendar.scss */
.time-entry {
  @apply rounded-md p-2 text-white shadow-sm relative;
}

/* line 179, app/assets/stylesheets/calendar.scss */
.time-entry-hours {
  @apply text-sm font-medium;
}

/* line 183, app/assets/stylesheets/calendar.scss */
.time-entry-project {
  @apply text-xs font-medium;
}

/* line 187, app/assets/stylesheets/calendar.scss */
.time-entry-task {
  @apply text-xs opacity-90;
}

/* Project tabs */
/* line 192, app/assets/stylesheets/calendar.scss */
.project-tabs {
  @apply bg-white rounded-lg shadow-sm p-2 mb-4;
}

/* line 196, app/assets/stylesheets/calendar.scss */
.project-tab {
  @apply px-4 py-2 text-sm font-medium text-gray-600 rounded-md cursor-pointer whitespace-nowrap;
}

/* line 200, app/assets/stylesheets/calendar.scss */
.project-tab.active {
  @apply bg-primary-100 text-primary-700;
}

/* Calendar navigation buttons */
/* line 205, app/assets/stylesheets/calendar.scss */
.calendar-nav-btn {
  @apply px-3 py-1 text-sm font-medium text-gray-600 bg-white rounded-md border border-gray-200 hover:bg-gray-50;
}

/* Loading state */
/* line 210, app/assets/stylesheets/calendar.scss */
.calendar-loading::after {
  content: "";
  @apply fixed inset-0 bg-black bg-opacity-20 flex items-center justify-center z-50;
}

/* Responsive adjustments */
@media (max-width: 640px) {
  /* line 217, app/assets/stylesheets/calendar.scss */
  .calendar-grid {
    @apply grid-cols-1;
  }
  /* line 221, app/assets/stylesheets/calendar.scss */
  .calendar-day-header {
    @apply hidden;
  }
  /* line 225, app/assets/stylesheets/calendar.scss */
  .calendar-day {
    @apply mb-4;
  }
  /* line 229, app/assets/stylesheets/calendar.scss */
  .day-date {
    @apply text-sm font-medium;
  }
}
/* PDF Styles */
body {
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 1.4;
  color: #333;
}

.invoice-header {
  margin-bottom: 30px;
}

.invoice-header h1 {
  font-size: 24px;
  color: #2c3e50;
  margin-bottom: 10px;
}

.company-details, .client-details {
  margin-bottom: 20px;
}

.invoice-table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
}

.invoice-table th {
  background-color: #f8f9fa;
  padding: 10px;
  text-align: left;
  border-bottom: 2px solid #dee2e6;
}

.invoice-table td {
  padding: 10px;
  border-bottom: 1px solid #dee2e6;
}

.amount {
  text-align: right;
}

.total-section {
  margin-top: 20px;
  text-align: right;
}

.total-section .total-row {
  margin: 5px 0;
}

.total-section .total-label {
  font-weight: bold;
  margin-right: 20px;
}

.footer {
  margin-top: 40px;
  text-align: center;
  font-size: 10px;
  color: #666;
  border-top: 1px solid #dee2e6;
  padding-top: 20px;
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is suggested that you include your application-specific styles in a separate file instead of
 * adding them here directly.
 *


 */