/*
 * Custom overrides layered on top of the Minia theme.
 * Loaded last in layouts/head-style.php so it wins over bootstrap.min.css / app.min.css.
 * Scope: accessibility + interaction fixes only. No visual restyle of the theme.
 */

/* ---------------------------------------------------------------
   1. Skip link — lets keyboard users jump past the sidebar/topbar
   --------------------------------------------------------------- */
.skip-to-content {
    position: absolute;
    top: -100px;
    left: 1rem;
    z-index: 2000;
    padding: 0.625rem 1rem;
    border-radius: 0.25rem;
    background-color: var(--bs-primary, #3b76e1);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    transition: top 150ms ease-in-out;
}

.skip-to-content:focus {
    top: 1rem;
    color: #fff;
}

/* ---------------------------------------------------------------
   2. Focus states — Bootstrap drops the outline on several
      components. Restore a visible ring for keyboard users only,
      so mouse users see no change.
   --------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
.btn:focus-visible,
.page-link:focus-visible,
.dropdown-item:focus-visible,
.nav-link:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible,
summary:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible {
    outline: 2px solid var(--bs-primary, #3b76e1);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(59, 118, 225, 0.25);
}

/* Sidebar sits on a dark surface in some layout modes — use a light ring there */
.vertical-menu a:focus-visible,
#page-topbar a:focus-visible,
#page-topbar button:focus-visible {
    outline-color: #fff;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.35);
}

/* ---------------------------------------------------------------
   3. Interaction affordances
   --------------------------------------------------------------- */
.btn,
.view-btn,
.print-btn,
.btn-take-fees,
.delete-item,
[data-bs-toggle],
.page-link,
.dropdown-item,
label[for] {
    cursor: pointer;
}

.btn:disabled,
.btn.disabled,
[disabled] {
    cursor: not-allowed;
}

/* Smooth, layout-stable hover feedback (colour only — never transform) */
.btn {
    transition: background-color 200ms ease, border-color 200ms ease,
                color 200ms ease, box-shadow 200ms ease;
}

/* ---------------------------------------------------------------
   4. Touch targets — 44x44 minimum on coarse pointers
   --------------------------------------------------------------- */
@media (pointer: coarse) {
    .btn,
    .page-link,
    .form-control,
    .form-select {
        min-height: 44px;
    }

    .btn-group .btn {
        min-width: 44px;
    }
}

/* ---------------------------------------------------------------
   5. Readability — 16px minimum body text on mobile stops iOS
      Safari from zooming the viewport on input focus
   --------------------------------------------------------------- */
@media (max-width: 767.98px) {
    body,
    .form-control,
    .form-select,
    textarea,
    input {
        font-size: 16px;
    }
}

/* ---------------------------------------------------------------
   6. Tables — keep wide data tables inside their card instead of
      forcing the whole page to scroll sideways
   --------------------------------------------------------------- */
.card-body > table,
.table-wrap {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ---------------------------------------------------------------
   7. Respect prefers-reduced-motion
   --------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .waves-effect .waves-ripple {
        display: none !important;
    }
}

/* ---------------------------------------------------------------
   8. Async feedback — used by the inline "saving..." button states
   --------------------------------------------------------------- */
.btn[aria-busy="true"] {
    pointer-events: none;
    opacity: 0.65;
}