/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Pagination Styling */
.pagination {
  @apply flex justify-center items-center space-x-2 mt-8;
}

.pagination span,
.pagination a {
  @apply px-4 py-2 border border-gray-300 rounded-md text-sm font-medium;
}

.pagination a {
  @apply text-blue-600 bg-white hover:bg-blue-50 hover:text-blue-700 transition duration-150 ease-in-out;
}

.pagination .current {
  @apply bg-blue-600 text-white border-blue-600;
}

.pagination .disabled a {
  @apply text-gray-400 bg-white cursor-not-allowed;
}

.pagination .gap {
  @apply text-gray-500;
}

/* Custom Styles from Gemini Share */
.tab-active {
    background-color: #D6CDBF;
    color: #FFFFFF;
    font-weight: 600;
}
.tab-inactive {
    background-color: #F0EBE5;
    color: #7D7463;
}
.card {
    background-color: #FFFFFF;
    border: 1px solid #F0EBE5;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
.section-title {
    color: #7D7463;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Pagination Styling */
.pagination {
  @apply flex justify-center items-center space-x-2 mt-8;
}

.pagination a,
.pagination span {
  @apply px-4 py-2 border border-gray-300 rounded-md text-sm font-medium;
}

.pagination a {
  @apply text-blue-600 bg-white hover:bg-blue-50 hover:text-blue-700 transition duration-150 ease-in-out;
}

.pagination span.current {
  @apply bg-blue-600 text-white border-blue-600;
}

.pagination span.disabled {
  @apply text-gray-400 bg-white cursor-not-allowed;
}

.pagination .gap {
  @apply text-gray-500;
}