/* App-specific tweaks on top of Bootstrap; keep minimal — prefer utilities. */

#app .navbar-brand {
    letter-spacing: 0.2px;
}

.btn {
    --bs-btn-padding-y: 0.45rem;
}

.list-group-item-action {
    cursor: pointer;
}

details > summary {
    cursor: pointer;
}

/* Active top-nav item on the dark navbar. */
.navbar-dark .nav-link.active {
    font-weight: 600;
    border-bottom: 2px solid rgba(255, 255, 255, 0.9);
}

/* Mobile bottom tab bar. */
.app-bottom-nav {
    --bs-navbar-padding-y: 0.15rem;
    z-index: 1030;
}
.app-tab {
    color: var(--bs-secondary-color);
    flex: 1 1 0;
    border-radius: 0.5rem;
    transition: color 0.15s ease, background-color 0.15s ease;
}
.app-tab.active {
    color: var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
}
.app-tab:active {
    background: var(--bs-tertiary-bg);
}
/* Keep content clear of the fixed bottom bar on mobile. */
@media (max-width: 991.98px) {
    .app-main {
        padding-bottom: 4.5rem;
    }
}

/* Drag-and-drop affordances in the checklist editor. */
.drag-handle {
    cursor: grab;
    touch-action: none;
    color: var(--bs-secondary-color);
}
.drag-handle:active {
    cursor: grabbing;
}
.sortable-ghost {
    opacity: 0.45;
    background: var(--bs-primary-bg-subtle);
}
.sortable-chosen {
    box-shadow: 0 0 0 2px var(--bs-primary);
}
.tree-node {
    transition: box-shadow 0.15s ease;
}

/* Guided inspection mode: big tap targets, swipeable card. */
.inspect-stage {
    min-height: 55vh;
}
.inspect-action {
    --bs-btn-padding-y: 0.9rem;
    --bs-btn-font-size: 1.1rem;
    border-radius: 1rem;
}
.inspect-progress {
    height: 0.5rem;
}
.tap-zone {
    cursor: pointer;
    user-select: none;
}

@media print {
    .print-hide,
    .navbar,
    .app-bottom-nav {
        display: none !important;
    }
    body,
    .app-main {
        background: #fff !important;
    }
    .card {
        border: 1px solid #dee2e6 !important;
        box-shadow: none !important;
    }
}