/* ── Animated button (from inventory module) ── */
    .btn-action-primary {
        position: relative;
        overflow: hidden;
        transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .btn-action-primary::before {
        content: '';
        position: absolute;
        inset: 0;
        background: #ff2301;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 0;
        border-radius: inherit;
    }
    .btn-action-primary:not(:disabled):hover::before {
        transform: scaleX(1);
    }
    .btn-action-primary:not(:disabled):hover {
        color: #fff !important;
        border-color: #ff2301 !important;
        transform: scale(1.03);
        box-shadow: 0 4px 16px rgba(255, 35, 1, 0.3);
    }
    .btn-action-primary > *,
    .btn-action-primary span,
    .btn-action-primary svg {
        position: relative;
        z-index: 1;
    }

    /* Danger action button overrides (red instead of orange) */
    .btn-action-primary.btn-action-danger::before {
        background: #ef4444 !important;
    }
    .btn-action-primary.btn-action-danger:not(:disabled):hover {
        border-color: #ef4444 !important;
        box-shadow: 0 4px 16px rgba(239, 68, 68, 0.3) !important;
    }

    /* ── Tooltip helper ── */
    .tooltip-help {
        position: relative;
        display: inline-flex;
        cursor: help;
    }

    /* Ensure hovered tooltips stack above other page components (like sticky headers/footers) */
    .tooltip-help:hover {
        z-index: 50;
    }

    .tooltip-help .tooltip-text {
        position: absolute;
        bottom: calc(100% + 8px);
        left: 50%;
        transform: translateX(-50%) scale(0.95);
        padding: 8px 12px;
        background: #2a2a2d;
        border: 1px solid #4a4a4f;
        color: #fff;
        font-size: 11px;
        font-family: 'Poppins', sans-serif;
        font-weight: 500;
        border-radius: 8px;
        white-space: normal;
        word-wrap: break-word;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s ease, transform 0.2s ease;
        z-index: 9999;
        box-shadow: 0 4px 12px rgba(0,0,0,0.4);
        line-height: 1.4;
        width: max-content;
        max-width: min(260px, 90vw);
        text-align: center;
    }

    .tooltip-help .tooltip-text.wide {
        max-width: min(280px, 90vw);
    }

    /* Hover state: show tooltip */
    .tooltip-help:hover .tooltip-text {
        opacity: 1;
        transform: translateX(-50%) scale(1);
    }

    /* Hide absolute tooltips when JS is active, letting the global body-level tooltip take over */
    html.js-active .tooltip-help .tooltip-text,
    html.js-active [data-tooltip]::after,
    html.js-active [data-tooltip]::before {
        display: none !important;
    }

    .tooltip-help.right-aligned .tooltip-text {
        left: auto;
        right: 0;
        transform: scale(0.95);
    }
    .tooltip-help.right-aligned:hover .tooltip-text {
        transform: scale(1);
    }

    /* Left alignment (tooltip extends to the right) */
    .tooltip-help.left-aligned .tooltip-text {
        left: 0;
        right: auto;
        transform: scale(0.95);
    }
    .tooltip-help.left-aligned:hover .tooltip-text {
        transform: scale(1);
    }

    /* Bottom alignment (tooltip displays below the icon) */
    .tooltip-help.bottom-aligned .tooltip-text {
        bottom: auto;
        top: calc(100% + 8px);
        transform: translateX(-50%) scale(0.95);
    }
    .tooltip-help.bottom-aligned:hover .tooltip-text {
        transform: translateX(-50%) scale(1);
    }

    /* Bottom + Right alignment */
    .tooltip-help.bottom-aligned.right-aligned .tooltip-text {
        bottom: auto;
        top: calc(100% + 8px);
        left: auto;
        right: 0;
        transform: scale(0.95);
    }
    .tooltip-help.bottom-aligned.right-aligned:hover .tooltip-text {
        transform: scale(1);
    }

    /* Bottom + Left alignment */
    .tooltip-help.bottom-aligned.left-aligned .tooltip-text {
        bottom: auto;
        top: calc(100% + 8px);
        left: 0;
        right: auto;
        transform: scale(0.95);
    }
    .tooltip-help.bottom-aligned.left-aligned:hover .tooltip-text {
        transform: scale(1);
    }

    /* Responsive adjustments for mobile screens */
    @media (max-width: 640px) {
        .tooltip-help:not(.left-aligned):not(.right-aligned) .tooltip-text {
            left: 50%;
            transform: translateX(-50%) scale(0.95);
        }
        .tooltip-help:not(.left-aligned):not(.right-aligned):hover .tooltip-text {
            transform: translateX(-50%) scale(1);
        }
    }

    /* ── Flatpickr global styling overrides ── */
    .flatpickr-calendar {
        background: #2a2a2d !important;
        border: 1px solid #4a4a4f !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
    }
    .flatpickr-calendar.arrowUp::after {
        border-bottom-color: #2a2a2d !important;
    }
    .flatpickr-calendar.arrowUp::before {
        border-bottom-color: #4a4a4f !important;
    }
    .flatpickr-calendar.arrowDown::after {
        border-top-color: #2a2a2d !important;
    }
    .flatpickr-calendar.arrowDown::before {
        border-top-color: #4a4a4f !important;
    }
    .flatpickr-day {
        color: #fff !important;
    }
    .flatpickr-day:hover,
    .flatpickr-day:focus {
        background: rgba(255, 255, 255, 0.05) !important;
    }
    .flatpickr-day.selected, 
    .flatpickr-day.startRange, 
    .flatpickr-day.endRange {
        background: #ff2301 !important;
        border-color: #ff2301 !important;
        color: #fff !important;
    }
    .flatpickr-day.inRange {
        background: rgba(255, 35, 1, 0.15) !important;
        box-shadow: -5px 0 0 rgba(255, 35, 1, 0.15), 5px 0 0 rgba(255, 35, 1, 0.15) !important;
    }
    .flatpickr-day.prevMonthDay, 
    .flatpickr-day.nextMonthDay {
        color: #59595d !important;
    }
    .flatpickr-confirm {
        background: #ff2301 !important;
        color: #fff !important;
        font-weight: 600 !important;
        border: none !important;
        border-radius: 0 0 8px 8px !important;
        padding: 8px !important;
        cursor: pointer !important;
        transition: background 0.2s ease !important;
    }
    .flatpickr-confirm:hover {
        background: #e01e00 !important;
    }
    .flatpickr-confirm svg {
        display: none !important;
    }
    .flatpickr-months .flatpickr-month {
        color: #fff !important;
    }
    .flatpickr-months .flatpickr-prev-month,
    .flatpickr-months .flatpickr-next-month {
        color: #fff !important;
        fill: #fff !important;
    }
    .flatpickr-weekday {
        color: #b8b8be !important;
    }

    /* Flatpickr Timepicker overrides */
    .flatpickr-time {
        border-top: 1px solid #4a4a4f !important;
        background: #2a2a2d !important;
    }
    .flatpickr-time .numInputWrapper span {
        border-color: #4a4a4f !important;
    }
    .flatpickr-time .numInputWrapper span:hover {
        background: #ff2301 !important;
    }
    .flatpickr-time .numInputWrapper span:hover::after {
        border-top-color: #fff !important;
        border-bottom-color: #fff !important;
    }
    .flatpickr-time input {
        color: #fff !important;
        background: transparent !important;
    }
    .flatpickr-time input:hover, 
    .flatpickr-time input:focus {
        background: rgba(255, 255, 255, 0.05) !important;
        color: #fff !important;
    }
    .flatpickr-time .flatpickr-am-pm {
        color: #fff !important;
    }
    .flatpickr-time .flatpickr-am-pm:hover, 
    .flatpickr-time .flatpickr-am-pm:focus {
        background: rgba(255, 255, 255, 0.05) !important;
    }
    .flatpickr-time .flatpickr-time-separator {
        color: #b8b8be !important;
    }
    .flatpickr-calendar.noCalendar {
        height: auto !important;
    }

    /* Input focus and autofill dark theme protection */
    .filters-panel input {
        background-color: #2a2a2d !important;
        color: #fff !important;
    }
    .filters-panel input:focus {
        background-color: #2a2a2d !important;
        border-color: #ff2301 !important;
        outline: none !important;
        box-shadow: 0 0 0 2px rgba(255, 35, 1, 0.15) !important;
    }
    /* Webkit Autocomplete override to prevent blue background */
    .filters-panel input:-webkit-autofill,
    .filters-panel input:-webkit-autofill:hover,
    .filters-panel input:-webkit-autofill:focus {
        -webkit-text-fill-color: #fff !important;
        -webkit-box-shadow: 0 0 0px 1000px #2a2a2d inset !important;
        transition: background-color 5000s ease-in-out 0s;
    }

    /* Unified checkbox styling across the application to force brand orange color */
    input[type="checkbox"] {
        accent-color: #ff2301 !important;
    }
    input[type="checkbox"]:checked {
        background-color: #ff2301 !important;
        border-color: #ff2301 !important;
        color: #ff2301 !important;
    }
    input[type="checkbox"]:focus {
        --tw-ring-color: #ff2301 !important;
        border-color: #ff2301 !important;
    }