/* UFS Phase 11: responsive, RTL and accessibility normalization. */

/* Keyboard access */
.ufs-skip-link {
    position: fixed;
    inset-block-start: .75rem;
    inset-inline-start: .75rem;
    z-index: calc(var(--ufs-z-overlay) + 10);
    transform: translateY(-180%);
    padding: .7rem 1rem;
    border: 2px solid currentColor;
    border-radius: var(--ufs-radius-md);
    background: var(--ufs-navy);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    box-shadow: var(--ufs-shadow-lg);
    transition: transform var(--ufs-duration-fast) var(--ufs-ease-standard);
}
.ufs-skip-link:focus { transform: translateY(0); }

#ufs-main-content:focus { outline: none; }
#ufs-main-content:focus-visible {
    outline: 3px solid var(--ufs-context-primary);
    outline-offset: -3px;
}

.ufs-app-shell :where(a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible,
.ufs-public-layout :where(a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible,
.ufs-auth-layout :where(a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ufs-context-primary) 78%, #fff);
    outline-offset: 2px;
    box-shadow: 0 0 0 2px var(--ufs-surface);
}

/* Minimum interactive target size without forcing visual button size. */
.ufs-app-shell :where(button, .btn, .nav-link, .ufs-context-nav__link, .ufs-help-button),
.ufs-public-layout :where(button, .btn, .nav-link),
.ufs-auth-layout :where(button, .btn, .nav-link) {
    min-block-size: 2.75rem;
}
.ufs-help-button { min-inline-size: 2.75rem; }

/* Reading and wrapping safety */
.ufs-app-shell,
.ufs-public-layout,
.ufs-auth-layout { overflow-wrap: anywhere; }
.ufs-app-shell img,
.ufs-public-layout img,
.ufs-auth-layout img { max-inline-size: 100%; block-size: auto; }
.ufs-app-shell pre,
.ufs-app-shell code { white-space: pre-wrap; word-break: break-word; }

/* Tables remain usable instead of forcing the whole page to scroll horizontally. */
.ufs-app-shell :where(.table-responsive, .ufs-table-scroll, .workspace-table-wrap) {
    max-inline-size: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}
.ufs-app-shell table { margin-block-end: 0; }
.ufs-app-shell th { white-space: nowrap; }

/* RTL uses logical alignment while preserving numeric and technical values. */
[dir="rtl"] .ufs-page-header__actions,
[dir="rtl"] .ufs-page-toolbar__actions,
[dir="rtl"] .ufs-form-actions__main { margin-inline-start: 0; margin-inline-end: auto; }
[dir="rtl"] .ufs-context-nav__link i,
[dir="rtl"] .ufs-page-header__icon { transform: none; }
[dir="rtl"] :where(input[type="email"], input[type="url"], input[type="tel"], input[type="number"], .ufs-ltr-value, code, pre) {
    direction: ltr;
    text-align: left;
}
[dir="rtl"] .dropdown-menu { text-align: start; }
[dir="rtl"] .form-check { padding-inline-start: 0; padding-inline-end: 1.5em; }
[dir="rtl"] .form-check .form-check-input { float: inline-start; margin-inline-start: 0; margin-inline-end: -1.5em; }

/* Dialog and live-state accessibility */
.ufs-modal-shell:focus { outline: none; }
.ufs-modal-shell:focus-visible {
    outline: 3px solid var(--ufs-context-primary);
    outline-offset: 3px;
}
.ufs-state[aria-live="assertive"] { border-color: var(--ufs-danger-light); }

/* Responsive normalization */
@media (max-width: 1199.98px) {
    .ufs-app-main { padding-inline: clamp(.875rem, 2vw, 1.5rem); }
    .ufs-page-header { align-items: flex-start; }
    .ufs-page-header__actions { flex-wrap: wrap; }
}

@media (max-width: 991.98px) {
    .ufs-context-nav__links {
        scroll-snap-type: inline proximity;
        overscroll-behavior-inline: contain;
    }
    .ufs-context-nav__link { scroll-snap-align: start; }
    .ufs-page-toolbar,
    .ufs-page-header { gap: var(--ufs-space-3); }
    .ufs-page-toolbar__actions,
    .ufs-page-header__actions { inline-size: 100%; }
}

@media (max-width: 767.98px) {
    .ufs-app-main { padding-inline: .75rem; }
    .ufs-page-header { display: grid; grid-template-columns: minmax(0, 1fr); }
    .ufs-page-header__main { min-inline-size: 0; }
    .ufs-page-header__actions > :where(.btn, button, a.btn) { flex: 1 1 auto; }
    .ufs-page-toolbar { align-items: stretch; }
    .ufs-page-toolbar__main,
    .ufs-page-toolbar__actions { inline-size: 100%; }
    .ufs-page-toolbar__actions > :where(.btn, button, a.btn) { flex: 1 1 auto; }
    .ufs-panel__header { align-items: flex-start; }
    .ufs-panel__actions { inline-size: 100%; }
    .ufs-panel__actions > :where(.btn, button, a.btn) { flex: 1 1 auto; }
    .ufs-confirm-panel { grid-template-columns: minmax(0, 1fr); }
    .ufs-app-shell .table { min-inline-size: 40rem; }
}

@media (max-width: 479.98px) {
    .ufs-page-header__title { font-size: clamp(1.35rem, 8vw, 1.8rem); }
    .ufs-form-actions__main > :where(.btn, button, a.btn),
    .ufs-form-actions__leading > :where(.btn, button, a.btn) { inline-size: 100%; }
    .ufs-app-shell .modal-header,
    .ufs-app-shell .modal-body,
    .ufs-app-shell .modal-footer,
    .ufs-modal-shell__header,
    .ufs-modal-shell__body,
    .ufs-modal-shell__footer { padding-inline: var(--ufs-space-3); }
}

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

@media (prefers-contrast: more) {
    .ufs-app-shell,
    .ufs-public-layout,
    .ufs-auth-layout { --ufs-gray-200: #b4bbc2; --ufs-gray-300: #8b949d; }
    .ufs-panel,
    .ufs-action-card,
    .ufs-state,
    .ufs-confirm-panel { border-width: 2px; }
}

@media (forced-colors: active) {
    .ufs-context-nav__link.active,
    .ufs-page-header__icon,
    .ufs-context-nav__icon { forced-color-adjust: none; border: 1px solid ButtonText; }
    .ufs-app-shell :where(a, button, input, select, textarea):focus-visible { outline: 3px solid Highlight; }
}

@media print {
    .ufs-skip-link,
    .ufs-app-sidebar,
    .ufs-page-toolbar,
    .ufs-form-actions,
    .ufs-help-button { display: none !important; }
    .ufs-app-frame { display: block !important; }
    .ufs-app-main { padding: 0 !important; }
    .ufs-app-content { max-width: none !important; }
}