/* COPY of TradeYoke.Shared/Layout/LegalPanelHost.razor.css (a scoped stylesheet cannot style the static sign-in page's plain-DOM panel,
   built by front-door-static.js). Look only: the TEXT is never copied, it is fetched from the same source (LegalPanelEndpoint). */
/* The Terms / Privacy slide-out. Right-hand panel on tablet/desktop; the whole screen (a full-height sheet) on a phone. */
.ty-lp-scrim {
    position: fixed; inset: 0; z-index: 1200;
    background: rgba(var(--ty-color-overlay-rgb, 12, 18, 28), .42);
    animation: ty-lp-fade .22s ease-out;
}
.ty-lp {
    position: fixed; top: 0; right: 0; bottom: 0; z-index: 1201;
    width: 100%;
    display: flex; flex-direction: column;
    background: var(--ty-color-surface, #fff);
    color: var(--ty-color-text, #1c2128);
    padding-top: var(--ty-safe-top, 0px);
    padding-bottom: var(--ty-safe-bottom, 0px);
    box-shadow: -22px 0 60px -20px rgba(var(--ty-shadow-rgb, 12, 18, 28), .45);
    animation: ty-lp-slide-up .28s cubic-bezier(.22, 1, .36, 1);
}
.ty-lp:focus { outline: none; }
.ty-lp--closing { animation: ty-lp-slide-down .22s cubic-bezier(.4, 0, 1, 1) forwards; pointer-events: none; }
.ty-lp-scrim--closing { animation: ty-lp-fade-out .2s ease forwards; pointer-events: none; }

.ty-lp__hd {
    display: flex; align-items: center; gap: var(--ty-space-md, 12px);
    padding: var(--ty-space-md, 12px) var(--ty-space-lg, 16px);
    border-bottom: 1px solid var(--ty-color-border, #e5e9ee);
}
.ty-lp__title { flex: 1 1 auto; margin: 0; font-size: var(--ty-font-lg, 1.15rem); font-weight: var(--ty-weight-semibold, 600); }
.ty-lp__close {
    display: inline-flex; align-items: center; gap: .4rem; flex: none;
    min-height: 44px; min-width: 44px; justify-content: center;
    padding: 0 var(--ty-space-md, 12px);
    border: 1px solid var(--ty-color-border-strong, #d0d7de); border-radius: var(--ty-radius-control, 10px);
    background: var(--ty-color-surface, #fff); color: var(--ty-color-text, #1c2128);
    font-weight: var(--ty-weight-semibold, 600); cursor: pointer;
}
.ty-lp__close:hover { border-color: var(--ty-color-primary, #1E6FD9); color: var(--ty-color-primary-ink, #1457b0); }
.ty-lp__close:focus-visible { outline: 2px solid transparent; box-shadow: var(--ty-focus-ring, 0 0 0 .2rem rgba(30, 111, 217, .35)); }

.ty-lp__body {
    flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column;
    padding: var(--ty-space-md, 12px) var(--ty-space-lg, 16px) var(--ty-space-lg, 16px);
}
.ty-lp__version { margin: 0 0 var(--ty-space-sm, 8px); text-align: left; }
/* The scroll box takes the rest of the panel (overrides the gate's 55vh cap). */
.ty-lp__box { flex: 1 1 auto; min-height: 6rem; max-height: none; }

@media (min-width: 48rem) {
    .ty-lp {
        width: min(40rem, 100%);
        animation-name: ty-lp-slide-in;
    }
    .ty-lp--closing { animation-name: ty-lp-slide-out; }
}
@media (min-width: 62rem) {
    .ty-lp { width: min(46rem, 100%); }
}

@keyframes ty-lp-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ty-lp-fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes ty-lp-slide-in { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes ty-lp-slide-out { from { transform: translateX(0); } to { transform: translateX(100%); } }
@keyframes ty-lp-slide-up { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes ty-lp-slide-down { from { transform: translateY(0); } to { transform: translateY(100%); } }

@media (prefers-reduced-motion: reduce) {
    .ty-lp, .ty-lp-scrim, .ty-lp--closing, .ty-lp-scrim--closing { animation: none; }
}
