/* Service Opus Razor surface foundation.
   Keep this file byte-for-byte aligned across CP, Internal, and public hosts. */
:root {
    --so-focus-ring: #2563eb;
    --so-focus-halo: rgba(37, 99, 235, 0.24);
    --so-safe-top: env(safe-area-inset-top, 0px);
    --so-safe-right: env(safe-area-inset-right, 0px);
    --so-safe-bottom: env(safe-area-inset-bottom, 0px);
    --so-safe-left: env(safe-area-inset-left, 0px);
    --so-touch-target: 44px;
}

html {
    min-width: 320px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body[data-razor-surface] {
    overflow-wrap: anywhere;
}

body[data-razor-surface] :where(img, svg, video, canvas) {
    max-width: 100%;
}

body[data-razor-surface] :where(button, input, select, textarea) {
    font: inherit;
}

body[data-razor-surface] :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--so-focus-ring);
    outline-offset: 3px;
    box-shadow: 0 0 0 6px var(--so-focus-halo);
}

.razor-skip-link {
    position: fixed;
    top: max(0.5rem, var(--so-safe-top));
    left: max(0.5rem, var(--so-safe-left));
    z-index: 10000;
    max-width: calc(100vw - 1rem - var(--so-safe-left) - var(--so-safe-right));
    transform: translateY(calc(-100% - 1rem - var(--so-safe-top)));
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    background: #0f172a;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    transition: transform 120ms ease-out;
}

.razor-skip-link:focus {
    transform: translateY(0);
}

.razor-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.razor-table-region,
.table-responsive {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
}

.razor-table-region:focus-visible,
.table-responsive:focus-visible {
    border-radius: 0.5rem;
}

.razor-table-region > table {
    width: max-content;
    min-width: 100%;
    margin-bottom: 0;
}

@media (pointer: coarse), (max-width: 767.98px) {
    body[data-razor-surface] :where(button, select, input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), textarea, .btn, [role="button"]) {
        min-height: var(--so-touch-target);
    }

    body[data-razor-surface] :where(input[type="checkbox"], input[type="radio"]) {
        min-width: 1.25rem;
        min-height: 1.25rem;
    }
}

@media (max-width: 640px) {
    body[data-razor-surface] :where(input, select, textarea) {
        font-size: 16px;
    }

    body[data-razor-surface] :where(dialog, [role="dialog"]) {
        max-width: calc(100vw - 2rem - var(--so-safe-left) - var(--so-safe-right));
        max-height: calc(100dvh - 2rem - var(--so-safe-top) - var(--so-safe-bottom));
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

@media print {
    .razor-skip-link,
    .razor-table-region[tabindex]::before {
        display: none !important;
    }
}
