/*
 * HTMX-specific CSS - Only styles that are required for HTMX functionality
 * All layout and component styling should use Bootstrap 5 classes
 */

/* Settings card headers — theme-aware purple tint */
.card-header-accent {
    background-color: rgba(102, 16, 242, 0.05);
}

[data-bs-theme="dark"] .card-header-accent {
    background-color: rgba(102, 16, 242, 0.15);
}

.card-header-accent h5 .bi {
    color: #6610f2;
}

[data-bs-theme="dark"] .card-header-accent h5 .bi {
    color: #a78bfa;
}

/* Clickable table rows */
tr[role="button"] {
    cursor: pointer;
}

tr[role="button"]:hover {
    background-color: rgba(var(--bs-primary-rgb), 0.05);
}

/* Collapsible navigation chevron rotation */
.nav-link[data-bs-toggle="collapse"] .bi-chevron-down {
    transition: transform 0.2s ease-in-out;
}

.nav-link[data-bs-toggle="collapse"][aria-expanded="true"] .bi-chevron-down {
    transform: rotate(180deg);
}

/* Sub-navigation styling */
.nav .nav .nav-link {
    font-size: 0.9rem;
}

.nav .nav .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

/* HTMX Loading/Swap Transitions */
.htmx-swapping {
    opacity: 0;
    transition: opacity 200ms ease-out;
}

.htmx-settling {
    opacity: 1;
    transition: opacity 200ms ease-in;
}

/* HTMX Indicator States */
.htmx-request .htmx-indicator {
    opacity: 1;
    transition: opacity 200ms ease-in;
}

.htmx-indicator {
    opacity: 0;
    transition: opacity 200ms ease-out;
}

/* Highlight animation for newly added content */
@keyframes htmx-highlight {
    0% {
        background-color: rgba(var(--bs-success-rgb), 0.2);
    }
    100% {
        background-color: transparent;
    }
}

.htmx-added {
    animation: htmx-highlight 1s ease-out;
}

/* Print styles — hide navigation and UI chrome */
@media print {
    /* Hide sidebar, header, breadcrumbs, buttons */
    .sidebar,
    .offcanvas,
    nav.navbar,
    header.navbar,
    nav[aria-label="breadcrumb"],
    .btn,
    .btn-group,
    .form-control,
    .form-select,
    .alert-dismissible .btn-close,
    .mobile-fab,
    .dropdown-toggle::after {
        display: none !important;
    }

    /* Make main content full width */
    main,
    .col-md-9,
    .col-lg-10 {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
    }

    /* Remove card shadows and borders for cleaner print */
    .card {
        border: 1px solid #dee2e6 !important;
        box-shadow: none !important;
    }

    /* Show all responsive columns */
    .d-none,
    .d-md-none,
    .d-lg-none {
        display: table-cell !important;
    }

    .d-none.d-md-table-cell,
    .d-none.d-lg-table-cell {
        display: table-cell !important;
    }

    /* Ensure page breaks work well */
    .card {
        break-inside: avoid;
    }

    tr {
        break-inside: avoid;
    }

    /* Remove background colors for ink savings */
    .badge {
        border: 1px solid #999 !important;
        background: none !important;
        color: #333 !important;
    }

    body {
        font-size: 11pt;
    }
}