html, body {
    font-family: 'Open Sans', sans-serif;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxwYXRoIGlkPSJkZWZzYSIgZD0iTTI2LjE4NCAyOS4wOThDMjUuNzkzIDI5LjY4NSA4LjQwNyA0OC4wNjMgNy45NjUgNDhDNy41MjMgNDggNy4yNDcgNDcuNzQ3IDcuMjQ3IDQ3LjQzNkM3LjI0NyA0Ny4xMjYgNy41MjMgNDYuODY5IDcuOTY1IDQ2Ljg2OUw5LjE0MSA0NC44M0wxNy44NjIgMjQuNDY0TDE5LjM1MiAyMS40ODVMMjIuNzk2IDE1LjEwOEwyOC4xNDggNS4xNDZDMjguNTg5IDQuNDY0IDI5LjAwNiA0IDI5LjYwNiA0QzMwLjY0NiA0IDMxLjU2IDQuODg2IDMxLjU2IDYuMDY5QzMxLjU2IDYuNjg2IDMxLjI4NCA3LjIzNiAzMC43NzkgOC4xNDRMMjYuMTg0IDI5LjA5OHoiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIi8+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMC40MjcuMzg2KSI+PHBhdGggZD0iTTI2LjE4NCAyOS4wOThDMjUuNzkzIDI5LjY4NSA4LjQwNyA0OC4wNjMgNy45NjUgNDhDNy41MjMgNDggNy4yNDcgNDcuNzQ3IDcuMjQ3IDQ3LjQzNkM3LjI0NyA0Ny4xMjYgNy41MjMgNDYuODY5IDcuOTY1IDQ2Ljg2OUw5LjE0MSA0NC44M0wxNy44NjIgMjQuNDY0TDE5LjM1MiAyMS40ODVMMjIuNzk2IDE1LjEwOEwyOC4xNDggNS4xNDZDMjguNTg5IDQuNDY0IDI5LjAwNiA0IDI5LjYwNiA0QzMwLjY0NiA0IDMxLjU2IDQuODg2IDMxLjU2IDYuMDY5QzMxLjU2IDYuNjg2IDMxLjI4NCA3LjIzNiAzMC43NzkgOC4xNDRMMjYuMTg0IDI5LjA5OHoiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTQ2LjE0OCA0OEM0NS43MDcgNDggNDUuNDMxIDQ3Ljc0NyA0NS40MzEgNDcuNDM2QzQ1LjQzMSA0Ny4xMjYgNDUuNzA3IDQ2Ljg2OSA0Ni4xNDggNDYuODY5TDUwLjEwNyA0NC44M0w0OS45NjMgNDIuMDExTDU0LjY4NSA2LjEzNkM1OS4xMjcgNS40NTUgNTkuMzg5IDUgNjAgNUM2MS4wNDEgNSA2MS45NTUgNS44ODYgNjEuOTU1IDcuMDY5QzYxLjk1NSA3LjY4NiA2MS42NzkgOC4yMzYgNjEuMTc0IDkuMTQ0TDQ2LjE0OCA0OHoiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIi8+PC9nPjwvc3ZnPg==) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}

.centerAll {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Note: Status badges have been migrated to Tailwind CSS classes.
   Use the following Tailwind classes instead of custom CSS:

   - Zrealizowane (Completed):
     <span class="inline-block px-2.5 py-1 text-xs font-bold text-center whitespace-nowrap align-baseline rounded-md text-green-800 bg-green-100">

   - W trakcie (In Progress):
     <span class="inline-block px-2.5 py-1 text-xs font-bold text-center whitespace-nowrap align-baseline rounded-md text-yellow-800 bg-yellow-100">

   - Anulowane (Cancelled):
     <span class="inline-block px-2.5 py-1 text-xs font-bold text-center whitespace-nowrap align-baseline rounded-md text-red-800 bg-red-100">

   - Default:
     <span class="inline-block px-2.5 py-1 text-xs font-bold text-center whitespace-nowrap align-baseline rounded-md text-gray-700 bg-gray-100">
*/

/* ========================================
   Radzen DataGrid Dark Mode Support
   ======================================== */

/* Light Mode - default Radzen styles work fine */
.rz-datatable {
    background-color: white;
    color: #1f2937;
}

.rz-datatable-data td {
    border-bottom: 1px solid #e5e7eb;
}

.rz-datatable thead th {
    background-color: #f9fafb;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    font-weight: 600;
}

.rz-datatable tbody tr:hover {
    background-color: #f3f4f6;
}

.rz-paginator {
    background-color: white;
    border-top: 1px solid #e5e7eb;
}

/* Dark Mode - parent with bg-gray-800 */
.bg-gray-800 .rz-datatable,
.bg-gray-800 .rz-grid,
.bg-gray-800 .rz-datatable-scrollable-body,
.bg-gray-800 .rz-datatable-scrollable-wrapper {
    background-color: #1f2937 !important;
    color: #f9fafb !important;
}

.bg-gray-800 .rz-datatable-data td {
    border-bottom: 1px solid #374151 !important;
    color: #f9fafb !important;
    background-color: transparent !important;
}

.bg-gray-800 .rz-datatable thead th {
    background-color: #111827 !important;
    color: #f9fafb !important;
    border-bottom: 1px solid #374151 !important;
    font-weight: 600;
}

.bg-gray-800 .rz-datatable tbody tr {
    background-color: transparent !important;
}

.bg-gray-800 .rz-datatable tbody tr:hover {
    background-color: #374151 !important;
}

.bg-gray-800 .rz-paginator {
    background-color: #1f2937 !important;
    border-top: 1px solid #374151 !important;
    color: #f9fafb !important;
}

.bg-gray-800 .rz-paginator button {
    color: #f9fafb !important;
}

.bg-gray-800 .rz-paginator button:hover {
    background-color: #374151 !important;
}

.bg-gray-800 .rz-paginator .rz-state-active {
    background-color: #2563eb !important;
    color: white !important;
}

.bg-gray-800 .rz-sortable-column-icon {
    color: #9ca3af !important;
}

.bg-gray-800 .rz-cell-data,
.bg-gray-800 .rz-grid-td {
    color: #f9fafb !important;
}

/* Alternating row colors in dark mode */
.bg-gray-800 .rz-datatable tbody tr:nth-child(even) {
    background-color: rgba(55, 65, 81, 0.3) !important;
}

/* Selected row in dark mode */
.bg-gray-800 .rz-state-highlight {
    background-color: #1e40af !important;
    color: white !important;
}

/* Empty state in dark mode */
.bg-gray-800 .rz-datatable-emptymessage {
    color: #9ca3af !important;
}