/*--  Overrides  --*/

/* == Components == */

/* Button styles are handled exclusively by DaisyUI theme in daisyui.css */
/* All button styling comes from the custom theme defined in daisyui.css */



.turbo-progress-bar {
    top: 4;
    left: 4;
    right: 4;
    height: 6px;
    @apply bg-primary rounded-lg;
}

/* Card styles are handled exclusively by DaisyUI theme in daisyui.css */
/* All card styling (background, borders, layout) is defined in daisyui.css */
/* This allows complete theme customization by changing only the DaisyUI theme */

.fieldset {
    .fieldset-legend {
        @apply text-base-content text-sm font-bold;
    }

    .input {
        input {
            padding-left: 0 !important;
            outline: none !important;
        }
    }
}

.table {
    thead {
        @apply bg-base-200 text-sm text-base-content;

        th {
            @apply font-medium;
        }
    }

    /* Customize zebra striping color - use DaisyUI theme colors */
    &.table-zebra {
        tbody tr:nth-child(even) {
            background-color: var(--color-base-200);
        }

        tbody tr:nth-child(odd) {
            background-color: var(--color-base-100);
        }
    }
}



/* Responsive Table: mobile layout in core/responsive-table-mobile.css */
/* Desktop: Ensure table cells display normally and hover works */
@media (min-width: 768px) {
    .responsive-table {
        border-spacing: 0 !important;
    }

    .responsive-table-tbody {
        display: table-row-group !important;
        background-color: transparent !important;
    }

    /* Reset mobile styles on desktop */
    .responsive-table-row {
        display: table-row !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        margin-bottom: 0 !important;
    }

    /* Zebra striping: one row white (base-100), one row darker (base-200) */
    .responsive-table-tbody tr.responsive-table-row:nth-child(odd) {
        background-color: var(--color-base-100) !important;
    }

    .responsive-table-tbody tr.responsive-table-row:nth-child(even) {
        background-color: var(--color-base-200) !important;
    }

    .responsive-table-row td {
        display: table-cell !important;
        background-color: transparent !important;
    }

    /* Actions column: allow dropdown to overflow and sit above following rows */
    .responsive-table-row td:last-child {
        overflow: visible !important;
        position: relative;
    }

    /* Hover effect - darker gray (base-300), must override odd/even */
    .responsive-table-tbody tr.responsive-table-row:hover {
        background-color: oklch(92% 0.013 255.508) !important;
    }
}

/* Hide "more options" fallback character when Iconify has loaded the icon */
.iconify:has(svg) .action-btn-more-fallback {
    display: none !important;
}

.menu {
    .menu-title {
        @apply text-base-content font-medium;
    }
}

/* == Tooltip Customization == */
.tooltip {
    --tooltip-text-color: var(--tooltip-content, var(--color-primary-content));
}

.tooltip::before {
    background-color: var(--tooltip-color) !important;
    color: var(--tooltip-text-color) !important;
    @apply text-xs;
    @apply font-semibold;
    line-height: 1.25 !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 0.25rem !important;
    border: 1px solid var(--tooltip-border-color) !important;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1) !important;
    z-index: 1000 !important;

    @media (max-width: 768px) {
        max-width: 180px !important;
    }
}

.tooltip::after {
    border-top-color: var(--tooltip-color) !important;
    border-bottom-color: var(--tooltip-color) !important;
    border-left-color: var(--tooltip-color) !important;
    border-right-color: var(--tooltip-color) !important;
}

.timeline:not(.timeline-vertical)>li>hr {
    height: 2px;
}

.timeline.timeline-vertical>li>hr {
    width: 2px;
}

/* == Forms == */
.cally {
    ::part(button) {
        @apply font-sans;
    }
}

/* == Forms == */

.no-spinner::-webkit-outer-spin-button,
.no-spinner::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.no-spinner {
    -moz-appearance: textfield;
    appearance: textfield;
}


.checkbox,
.radio,
.range,
.toggle {
    &:disabled {
        @apply opacity-35;
    }
}



input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-background-clip: text;
}

/* Staggered button entrance animation */
@keyframes buttonFadeIn {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.95);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Safe area support for devices with notches */
.h-safe-area-inset-bottom {
    height: env(safe-area-inset-bottom, 0px);
}

/* Sidebar Toggle Button Icons */
.sidebar-toggle-btn {

    /* Default state: show menu icon, hide close icon */
    .sidebar-menu-icon {
        @apply block;
    }

    .sidebar-close-icon {
        @apply hidden;
    }
}

/* Mobile viewport with sidebar open (not collapsed) */
@media (max-width: 1023px) {
    .sidebar-menu:not(.collapsed) {
        .sidebar-toggle-btn {
            .sidebar-menu-icon {
                @apply hidden;
            }

            .sidebar-close-icon {
                @apply block;
            }
        }
    }
}

/* Desktop viewport: always show menu icon */
@media (min-width: 1024px) {
    .sidebar-toggle-btn {
        .sidebar-menu-icon {
            @apply block;
        }

        .sidebar-close-icon {
            @apply hidden;
        }
    }
}

.pagination-container {
    @apply flex items-center justify-end space-x-4 px-6 pb-6;
}

@media (max-width: 767px) {
    .pagination-container {
        flex-direction: column;
        align-items: stretch;
        @apply space-y-4 space-x-0 px-4 pb-4;
    }

    .pagination-container>span {
        @apply text-sm text-center;
        order: 2;
        margin-top: 0.5rem;
    }

    .pagination-container .join {
        @apply justify-center;
        flex-wrap: wrap;
        gap: 0.375rem;
        width: 100%;
    }

    .pagination-container .join .btn {
        @apply min-w-0;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        font-size: 0.875rem;
        line-height: 2rem;
        height: 2rem;
    }
}