/* Shared components for the modern local UI. Legacy mode has no .foxy-ui. */
html.foxy-design {
  --toggle-bg:#c6cdd6; --toggle-active:var(--fx-accent);
  --document-bg:var(--fx-hover); --excel-bg:var(--fx-hover);
  --input-padding:11px 13px; --overlay-bg:#17233466;
}
.foxy-ui #root,.foxy-ui .Modal { font-family:var(--font-family-base); }
.foxy-ui #root :is(h2,h3,h4,p,span,div,table),.foxy-ui .Modal :is(h2,h3,p,span,div) { font-family:inherit; }
.foxy-ui #root :is(button,input,select,textarea),.foxy-ui .Modal :is(button,input,select,textarea) { transition:border-color .16s,background-color .16s,box-shadow .16s; }
.foxy-ui #root button,.foxy-ui .Modal button {
  min-height:38px; height:auto; padding:9px 16px; line-height:1.4; border:1px solid transparent;
  font-size:12px; font-weight:600; border-radius:9px; box-shadow:none; cursor:pointer;
}
.foxy-ui #root button:hover:not(:disabled),.foxy-ui .Modal button:hover:not(:disabled) { filter:none; box-shadow:0 2px 5px #2531420b; }
.foxy-ui #root button:disabled,.foxy-ui .Modal button:disabled { box-shadow:none; }
.foxy-ui #root :is(input,textarea,select):focus-visible,.foxy-ui .Modal :is(input,textarea,select):focus-visible { outline:2px solid var(--fx-accent); outline-offset:2px; }
.foxy-ui #root :is(input,textarea,select):disabled,.foxy-ui .Modal :is(input,textarea,select):disabled { opacity:.55; cursor:not-allowed; }
.foxy-ui #root select,.foxy-ui .Modal select {
  min-height:40px; appearance:none !important; background-image:linear-gradient(45deg,transparent 50%,#7b8797 50%),linear-gradient(135deg,#7b8797 50%,transparent 50%) !important;
  background-position:calc(100% - 16px) 17px,calc(100% - 12px) 17px !important;
  background-size:4px 4px !important; background-repeat:no-repeat !important; padding-right:32px !important;
}
.foxy-ui #root :is(input,textarea,select).invalid,.foxy-ui .Modal .invalid { border-color:#c85b64 !important; background-color:#c85b6406 !important; }
.foxy-ui .invalid-p { color:#c0525a; font-size:11px; margin:5px 0 0; }
.foxy-ui #root input[type=checkbox],.foxy-ui #root input[type=radio] {
  appearance:none; -webkit-appearance:none; width:18px; height:18px; min-width:18px; padding:0; margin:0;
  border:1.5px solid #bbc4d0; border-radius:5px; background:var(--fx-surface); display:inline-grid; place-content:center;
  vertical-align:middle; cursor:pointer; box-shadow:none; position:relative; flex:none;
}
.foxy-ui #root input[type=checkbox]::before { content:''; width:8px; height:4px; border-left:2px solid #fff; border-bottom:2px solid #fff; transform:translateY(-1px) rotate(-45deg) scale(0); }
.foxy-ui #root input[type=checkbox]:checked,.foxy-ui #root input[type=radio]:checked { border-color:var(--fx-accent); background:var(--fx-accent); }
.foxy-ui #root input[type=checkbox]:checked::before { transform:translateY(-1px) rotate(-45deg) scale(1); }
.foxy-ui #root input[type=radio] { border-radius:50%; }
.foxy-ui #root input[type=radio]:checked::before { content:''; width:6px; height:6px; border-radius:50%; background:#fff; }
/* ToggleBar: a correctly aligned 40 x 24 track, with a keyboard-focusable input. */
.foxy-ui #root .fx-switch { position:relative; width:40px; min-width:40px; height:24px; padding:0; margin:0; display:inline-flex; background:none; flex:none; }
.foxy-ui #root .fx-switch>input[type=checkbox] { display:block; position:absolute; inset:0; z-index:2; width:40px; height:24px; min-width:0; margin:0; opacity:0; cursor:pointer; }
.foxy-ui #root .fx-switch>label.button { display:block; width:40px; height:24px; border:0; border-radius:99px; background:#c5cdd7; box-shadow:inset 0 1px 2px #2531420c; padding:0; margin:0; transition:background-color .18s; }
.foxy-ui #root .fx-switch>label.button::before { content:''; top:3px; left:3px; width:18px; height:18px; border:0; background:#fff; border-radius:50%; transform:none; box-shadow:0 1px 3px #25314225; transition:transform .18s; }
.foxy-ui #root .fx-switch>input:checked+label.button { background:var(--fx-accent); }
.foxy-ui #root .fx-switch>input:checked+label.button::before { transform:translateX(16px); }
.foxy-ui #root .fx-switch>input:focus-visible+label.button { outline:2px solid var(--fx-accent); outline-offset:3px; }
.foxy-ui #root .fx-switch>input:disabled+label.button { opacity:.5; cursor:not-allowed; }
/* Form cards and uploads share the same spacing and control dimensions. */
.foxy-ui #root :is(.call-comment,.choose-domen-or-ip,.call-info,.domen-info,.link-card) { margin:0 0 22px; padding:25px 27px; background:var(--fx-surface); border:1px solid var(--fx-line); border-radius:14px; box-shadow:0 2px 6px #25314202; }
.foxy-ui #root .fx-duplicate-title { display:none; }
.foxy-ui #root .page-title { margin:0; font-size:15px; }
.foxy-ui #root :is(.call-comment,.choose-domen-or-ip) form { max-width:none; margin:0; display:flex; align-items:flex-end; gap:14px; flex-direction:row; }
.foxy-ui #root :is(.call-comment,.choose-domen-or-ip) form>div { flex:1; max-width:none; min-width:0; }
.foxy-ui #root :is(.call-comment,.choose-domen-or-ip) form>button { width:auto; flex:none; min-width:120px; margin:0; }
.foxy-ui #root .choose-domen-or-ip>div { max-width:none; }
.foxy-ui #root :is(.call-comment,.choose-domen-or-ip) input { margin-top:7px; min-height:40px; }
.foxy-ui :is(#root,.Modal) input[type=file] { width:100%; min-width:0; max-width:100%; min-height:46px; padding:5px !important; background:var(--fx-subtle) !important; cursor:pointer; }
.foxy-ui :is(#root,.Modal) input[type=file]::file-selector-button { background:var(--fx-surface); border:1px solid var(--fx-line); color:var(--fx-text); border-radius:8px; padding:9px 12px; margin-right:12px; font:500 14px var(--font-family-base); cursor:pointer; }
.foxy-ui :is(#root,.Modal) input[type=file]::file-selector-button:hover { background:var(--fx-hover); border-color:var(--fx-accent); }
.foxy-ui :is(#root,.Modal) button.choose-file-btn { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-width:0; min-height:50px; height:auto; padding:12px 16px; background:var(--fx-subtle); color:var(--fx-text); border:1px dashed var(--fx-line); border-radius:11px; box-shadow:none; font-size:15px; }
.foxy-ui :is(#root,.Modal) button.choose-file-btn:hover:not(:disabled) { background:var(--fx-tint); border-color:var(--fx-accent); color:var(--fx-accent-ink,var(--fx-text)); box-shadow:none; }
.foxy-ui :is(#root,.Modal) .choose-file-btn :is(svg,path) { color:inherit!important; fill:currentColor; }
.foxy-ui :is(#root,.Modal) :is(.file-name-label,.svg-image-upload__hint,.pages-addition) { color:var(--fx-muted); font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.foxy-ui :is(#root,.Modal) span.file-name-label { display:block; margin-top:8px; font-size:14px; }
.foxy-ui :is(#root,.Modal) .svg-image-upload { min-width:0; padding:18px; background:var(--fx-subtle); border:1px dashed var(--fx-line); border-radius:12px; }
.foxy-ui :is(#root,.Modal) .svg-image-upload .svg-image-upload__label { display:block; font-size:15px!important; line-height:1.5; margin-bottom:10px; }
.foxy-ui :is(#root,.Modal) .svg-image-upload .svg-image-upload__hint { font-size:14px; margin-top:9px; }
.foxy-ui :is(#root,.Modal) .svg-image-upload__preview { margin-top:14px; gap:12px; }
.foxy-ui :is(#root,.Modal) .svg-image-upload__preview img { max-width:min(180px,100%); border:1px solid var(--fx-line); border-radius:10px; background:var(--fx-surface); }
.foxy-ui :is(#root,.Modal) button.svg-image-upload__clear { min-width:0; min-height:38px; height:auto; padding:8px 12px; font-size:14px; background:var(--fx-surface); color:var(--fx-text); border:1px solid var(--fx-line); border-radius:9px; }
.foxy-ui :is(#root,.Modal) button.svg-image-upload__clear:hover { background:var(--fx-hover); }
/* Disclosures: small chevrons, meaningful focus and clean expanded surfaces. */
.foxy-ui #root .spoiler-container { padding:20px 24px; border-radius:12px; margin-bottom:16px; }
.foxy-ui #root .spoiler-header { gap:16px; min-height:20px; border-radius:5px; }
.foxy-ui #root .spoiler-header:focus-visible { outline:2px solid var(--fx-accent); outline-offset:8px; }
.foxy-ui #root .spoiler-arrow { width:18px; height:18px; display:grid; place-items:center; font-size:0; flex:none; }
.foxy-ui #root .spoiler-arrow::before { content:''; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg) translate(-1px,-1px); }
.foxy-ui #root .spoiler-inner-content { padding-top:24px; }
/* Search is always visible; the header becomes a compact advanced-filter button. */
.foxy-ui #root .fx-filter-panel { position:relative; padding:16px; margin:0 0 24px; border-radius:12px; }
.foxy-ui #root .fx-filter-panel>.spoiler-header { position:absolute; top:16px; right:16px; height:40px; min-width:107px; padding:9px 12px; background:var(--fx-subtle); border:1px solid var(--fx-line); border-radius:8px; display:flex; color:var(--fx-text); z-index:1; }
.foxy-ui #root .fx-filter-panel>.spoiler-header[aria-expanded=true] { background:var(--fx-tint); border-color:var(--fx-accent); color:var(--fx-accent-ink,var(--fx-text)); }
.foxy-ui #root .fx-filter-panel>.spoiler-header :is(.spoiler-title,.spoiler-arrow) { display:none; }
.fx-filter-label { display:flex; gap:8px; align-items:center; font-size:12px; font-weight:500; }
.fx-filter-label .fx-icon { width:16px; height:16px; }
.foxy-ui #root .fx-filter-panel>.spoiler-content { height:auto !important; overflow:visible; }
.foxy-ui #root .fx-filter-panel .spoiler-inner-content { padding:0; }
.foxy-ui #root .fx-filter-panel .search-form { max-width:none; width:100%; margin:0; }
.foxy-ui #root .fx-filter-panel .search-inputs { display:block; margin:0; width:100%; }
.foxy-ui #root .fx-filter-panel .search-inputs>div:first-child { width:calc(100% - 120px); max-width:none; margin:0; padding:0; }
.foxy-ui #root .fx-filter-panel .search-inputs>div:first-child label { display:none; }
.foxy-ui #root .fx-filter-panel .search-inputs>div:first-child input { height:40px; margin:0; width:100%; background-color:var(--fx-subtle) !important; }
.foxy-ui #root .fx-filter-panel:not(.fx-filter-expanded) .select-inputs { display:none; }
.foxy-ui #root .fx-filter-panel .select-inputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:20px 0 0; padding-top:20px; border-top:1px solid var(--fx-line); width:100%; }
.foxy-ui #root .fx-filter-panel :is(.search-input,.date-picker-container,.calendar-wrapper) { min-width:0; max-width:none; width:100%; margin:0; }
.foxy-ui #root .fx-filter-panel .search-input { display:flex; flex-direction:column; align-items:stretch; gap:0; }
.foxy-ui #root .fx-filter-panel .date-picker-container { display:block; }
.foxy-ui #root .fx-filter-panel label { display:block; margin-bottom:7px; }
.foxy-ui #root .fx-filter-panel :is(select,input) { width:100%; height:40px; margin:0; }
/* Record cards, history headings and detail rows. */
.foxy-ui #root .divider { display:flex; align-items:center; justify-content:flex-start; background:none; margin:25px 0 15px; min-height:20px; height:auto; }
.foxy-ui #root .divider>div { display:none; }
.foxy-ui #root .divider>span { position:static; transform:none; margin:0; background:none; padding:0; font-size:12px; font-weight:600; color:var(--fx-muted); }
.foxy-ui #root :is(.redirect-info,.pages-info) { padding:21px 23px; border-radius:13px; transition:border-color .15s,box-shadow .15s; }
.foxy-ui #root :is(.redirect-info,.pages-info):hover { border-color:#cdd4df; box-shadow:0 3px 12px #25314205; }
.foxy-ui #root .redirect-info-title { gap:18px; }
.foxy-ui #root .redirect-info-title-label { display:flex; align-items:center; gap:15px; border-radius:5px; }
.foxy-ui #root .redirect-info-title-label>.redirect-info-header { flex:1; }
.fx-record-chevron { color:var(--fx-muted); display:flex; align-items:center; margin-left:auto; }
.fx-record-chevron .fx-icon { width:16px; height:16px; transition:transform .16s; }
.link-inner-active .fx-record-chevron .fx-icon { transform:rotate(90deg); }
.foxy-ui #root :is(.redirect-info-date,.pages-info-date,.call-info-date,.link-card-date) { font-size:11px; font-weight:400; color:var(--fx-muted); }
.foxy-ui #root :is(.redirect-info-comment,.pages-info-comment,.call-info-comment) { font-size:14px; font-weight:600; white-space:normal; }
.foxy-ui #root .red-btn { min-width:32px; min-height:32px; height:32px; padding:7px; background:transparent !important; color:#9a6670 !important; border:1px solid transparent; }
.foxy-ui #root .red-btn:hover { background:#c85b6410 !important; border-color:#c85b6420; }
.foxy-ui #root .link-inner-active .redirect-info-hide { margin-top:20px; padding-top:20px; border-top:1px solid var(--fx-line); }
.foxy-ui #root .redirect-info-main { margin:0; }
.foxy-ui #root :is(.inner-div,.call-info-main,.redirect-info-inner-div,.pages-info-inner-div) { margin:14px 0 0; border:1px solid var(--fx-line); border-radius:9px; background:var(--fx-subtle); box-shadow:none; }
.foxy-ui #root .inner-label { font-size:12px; padding:13px 15px; font-weight:500; }
.foxy-ui #root .inner-label::after { content:'›'; float:right; color:var(--fx-muted); font-size:17px; line-height:1; }
.foxy-ui #root .inner-active>.inner-label::after { transform:rotate(90deg); }
.foxy-ui #root :is(.links-buttons,.links-buttons-redirect) { gap:9px; justify-content:flex-start; }
.foxy-ui #root .links-buttons-redirect { margin-top:18px; }
.foxy-ui #root .links-buttons-redirect button { flex:0 1 auto; min-width:100px; color:var(--fx-text); background:var(--fx-subtle); border:1px solid var(--fx-line); }
.foxy-ui #root .proxy-original-link { font:12px/1.7 var(--font-family-base); padding:0; overflow-wrap:anywhere; }
.foxy-ui #root :is(.proxy-session-item,.link-card) { border-radius:10px; box-shadow:none; background:var(--fx-subtle); }
.foxy-ui #root .proxy-session-name { font:600 13px var(--font-family-base); }
.foxy-ui #root .proxy-session-status { font:11px var(--font-family-base); }
.foxy-ui #root .proxy-session-dot.offline { background:#a1adbb; width:7px; height:7px; }
.foxy-ui #root table { width:100%; max-width:100%; border-collapse:collapse; border-spacing:0; margin:0; }
.foxy-ui #root :is(th,td) { padding:11px 12px; border-bottom:1px solid var(--fx-line); text-align:left; line-height:1.5; font-size:12px; overflow-wrap:anywhere; }
.foxy-ui #root th { color:var(--fx-muted); font-weight:500; background:var(--fx-subtle); }
.foxy-ui #root td { color:var(--fx-text); }
.foxy-ui #root tr:last-child>:is(th,td) { border-bottom:0; }
.foxy-ui #root .check-div :is(th,td) { padding:9px 0; background:transparent; }
.foxy-ui #root .check-div th { min-width:130px; }
.foxy-ui #root .check-div tr { justify-content:space-between; }
/* Editors and previews retain their existing UI-only behavior. */
.foxy-ui #root .pages-main-panels { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.8fr); gap:24px; margin-top:0; }
.foxy-ui #root .pages-main-block { width:auto; min-width:0; }
.foxy-ui #root .f-div { max-width:none; margin-bottom:18px; }
.foxy-ui #root .f-buttons { display:flex; padding:5px; gap:5px; background:var(--fx-hover); border-radius:9px; margin-bottom:16px !important; }
.foxy-ui #root .f-buttons button { border-radius:6px; padding:8px; background:none; color:var(--fx-muted); min-width:0; }
.foxy-ui #root .f-buttons .f-btn-active { background:var(--fx-surface) !important; color:var(--fx-accent-ink,var(--fx-text)) !important; box-shadow:0 1px 4px #25314212; }
.foxy-ui #root .f-buttons .f-btn-active :is(svg,path) { color:var(--fx-accent) !important; }
.foxy-ui #root .f-all { border:0; padding:0; }
.foxy-ui #root .f-all>button { max-width:none; }
.foxy-ui #root .pages-preview-panel { min-width:0; max-width:none; border:1px solid var(--fx-line); border-radius:12px; }
.foxy-ui #root .pages-preview-header { padding:15px 17px; font-size:12px; background:var(--fx-subtle); }
.foxy-ui #root .pages-preview-body { height:410px; background:var(--fx-subtle); }
.foxy-ui #root .pages-preview-empty { font-size:12px; line-height:1.7; padding:25px; }
.foxy-ui #root .spoiler-container .redirect-comment { padding:0; margin:0; border:0; }
.foxy-ui #root .spoiler-container .redirect-comment form { margin:0; }
.fx-native-empty { border:1px dashed var(--fx-line); border-radius:14px; padding:44px 20px; text-align:center; color:var(--fx-muted); margin-top:24px; background:var(--fx-subtle); }
.fx-native-empty>.fx-icon { width:28px; height:28px; color:#9ba8b8; }
.fx-native-empty h2 { font-size:14px; font-weight:500; margin:16px 0 6px; color:var(--fx-text); }
.fx-native-empty p { font-size:12px; line-height:1.6; margin:0; }
/* Charts, account lists and modal surfaces. */
.foxy-ui #root :is(.line-analytics,.last-five-div,.admin-overview-bar,.admin-overview-line,.doughnut-div) { box-shadow:none; border-radius:13px; }
.foxy-ui #root .admin-overview-charts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding:0; border:0; background:transparent; box-shadow:none; }
.foxy-ui #root .admin-overview-charts .doughnut-div { width:100% !important; height:290px !important; min-width:0; padding:20px 18px; gap:12px; justify-content:flex-start; }
.foxy-ui #root .admin-overview-charts .doughnut-analytics { width:min(220px,100%) !important; height:auto !important; aspect-ratio:1; }
.foxy-ui #root .admin-overview-card { text-align:left; }
.foxy-ui #root .admin-overview-card-label { font-size:11px; line-height:1.5; }
.foxy-ui #root .admin-info { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 22px; width:100%; }
.foxy-ui #root .admin-info p { display:flex; gap:8px; align-items:center; min-width:0; overflow-wrap:anywhere; background:none; margin:0; font-size:12px; padding:0; }
.foxy-ui #root .admin-info svg { color:var(--fx-muted); flex:none; width:15px; height:15px; }
.foxy-ui #root .admin-info>.admin-info-name { grid-column:1/-1; font-weight:600; font-size:14px; margin-bottom:5px; }
.foxy-ui #root .admin-info>br { display:none; }
.foxy-ui #root .admin-info>button { grid-column:1/-1; justify-self:start; width:auto; min-width:120px; margin-top:4px; background:var(--fx-subtle); border:1px solid var(--fx-line); color:var(--fx-text); }
.foxy-ui #root .admin-card { border:1px solid var(--fx-line); border-radius:10px; padding:17px; margin-top:12px; }
.foxy-ui #root .admin-head { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:16px; margin-bottom:18px; }
.foxy-ui #root .admin-search-form { width:100%; margin:0; min-width:0; }
.foxy-ui #root .admin-search-form>div:first-child { width:100%; max-width:none; }
.foxy-ui #root .info-head { display:flex; align-items:center; gap:10px; flex-direction:row-reverse; }
.foxy-ui #root .info-head div button { width:38px; min-width:38px; min-height:38px; margin:0; padding:6px; font-size:19px; }
.foxy-ui #root .info-head p { font-size:11px; color:var(--fx-muted); margin:0; white-space:nowrap; }
.foxy-ui #root .admin-select-inputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.foxy-ui #root .admin-select-inputs .search-input { display:flex; flex-direction:column; align-items:stretch; gap:6px; }
.foxy-ui #root .admin-select-inputs select { width:100%; min-width:0; }
.foxy-ui #root .admin-select-inputs>div { width:auto; min-width:0; }
.foxy-ui #root :is(.admin-tabs,.zb-tabs) { gap:4px; background:var(--fx-subtle); padding:6px; border-radius:9px; border:1px solid var(--fx-line); }
.foxy-ui #root :is(.admin-tab,.zb-tab) { background:transparent; color:var(--fx-muted); padding:8px 12px; border:0; border-radius:6px; box-shadow:none; }
.foxy-ui #root :is(.admin-tab.active,.zb-tab.active) { background:var(--fx-surface); color:var(--fx-accent-ink,var(--fx-text)); box-shadow:0 1px 4px #2531420d; }
.foxy-ui .Overlay { background:#17233466; backdrop-filter:blur(4px); z-index:300; }
.foxy-ui .Modal { border:1px solid var(--fx-line); border-radius:16px; background:var(--fx-surface); color:var(--fx-text); box-shadow:0 24px 80px #15233626; padding:26px; }
.foxy-ui .Modal :is(input,textarea,select) { background:var(--fx-subtle); border:1px solid var(--fx-line); border-radius:8px; padding:10px 12px; color:var(--fx-text); font-size:13px; }
.foxy-ui .Modal h2 { font-size:19px; font-weight:600; margin:0 0 18px; }
.foxy-ui .Modal>p { font-size:14px; line-height:1.7; margin:0 0 12px; max-width:430px; }
.foxy-ui .Modal .user-create-head,.foxy-ui .Modal .user-create-form { padding:0; }
.foxy-ui .Modal .modal-btns { padding-top:18px; border-top:1px solid var(--fx-line); gap:10px; }
.foxy-ui :is(.grey-btn,.zb-refresh-btn) { background:var(--fx-hover); color:var(--fx-text); border:1px solid var(--fx-line); }
.foxy-ui #root .zb-modal-overlay { align-items:center; padding:24px; }
.foxy-ui #root .zb-modal { border-radius:16px; }
.foxy-ui #root :is(.zb-modal-header,.zb-modal-body,.zb-command-card,.zb-data-list) { background:var(--fx-surface); box-shadow:none; }
.foxy-ui #root .zb-command-card { height:auto; min-height:98px; border-radius:11px; padding:16px 10px; }
.foxy-ui #root .zb-command-card:hover:not(:disabled) { transform:none; }
.foxy-ui #root .zb-modal-header-info h3 { font:600 19px var(--font-family-base); }
/* The portal and page calendars share explicit dimensions; broad theme button
   rules must not enlarge month arrows or the input's clear affordance. */
.foxy-ui :is(#root,.Modal) .react-datepicker-popper { width:282px!important; min-width:0!important; max-width:calc(100vw - 28px)!important; z-index:1100!important; }
.foxy-ui :is(#root,.Modal) .react-datepicker { --fx-calendar-cell:34px; display:flex!important; flex-wrap:wrap; width:100%; max-width:100%; font:14px/1.5 var(--font-family-base); background:var(--fx-surface); color:var(--fx-text); border:1px solid var(--fx-line); border-radius:14px; overflow:hidden; box-shadow:0 12px 36px #1523361f; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__month-container { float:none; width:100%; min-width:0; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__header { background:var(--fx-subtle); border-bottom:1px solid var(--fx-line); padding:10px 0 0; border-radius:13px 13px 0 0; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__current-month { margin:0; min-height:34px; padding:5px 46px; color:var(--fx-text); font-size:15px; line-height:24px; font-weight:600; }
.foxy-ui :is(#root,.Modal) .react-datepicker :is(.react-datepicker__day-names,.react-datepicker__week) { display:grid; grid-template-columns:repeat(7,var(--fx-calendar-cell)); justify-content:space-between; gap:0; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day-names { margin:7px 12px 5px; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__month { margin:9px 12px 12px; }
.foxy-ui :is(#root,.Modal) .react-datepicker :is(.react-datepicker__day-name,.react-datepicker__day) { display:inline-flex; align-items:center; justify-content:center; width:var(--fx-calendar-cell); height:var(--fx-calendar-cell); min-width:0; padding:0; margin:0; font-size:14px; line-height:var(--fx-calendar-cell); text-align:center; border:1px solid transparent!important; border-radius:8px; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day-name { color:var(--fx-muted); font-weight:500; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day { color:var(--fx-text); }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day:hover { background:var(--fx-hover); }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day--today { background:transparent!important; border:1px solid var(--fx-accent)!important; color:var(--fx-accent-ink,var(--fx-text))!important; font-weight:650; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day--keyboard-selected { background:var(--fx-tint); color:var(--fx-accent-ink,var(--fx-text)); }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day--in-range { background:var(--fx-tint)!important; color:var(--fx-accent-ink,var(--fx-text))!important; border-color:transparent!important; }
.foxy-ui :is(#root,.Modal) .react-datepicker :is(.react-datepicker__day--selected,.react-datepicker__day--range-start,.react-datepicker__day--range-end) { background:var(--fx-accent)!important; color:var(--fx-on-accent)!important; border-color:transparent!important; font-weight:600; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__day--disabled { opacity:.4; cursor:not-allowed; }
.foxy-ui :is(#root,.Modal) .react-datepicker button.react-datepicker__navigation { display:grid; place-items:center; position:absolute; top:10px; width:32px; min-width:32px; height:32px; min-height:32px; padding:0; margin:0; border:1px solid var(--fx-line); border-radius:8px; background:var(--fx-surface); color:var(--fx-text); box-shadow:none; line-height:1; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__navigation--previous { left:11px; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__navigation--next { right:11px; }
.foxy-ui :is(#root,.Modal) .react-datepicker button.react-datepicker__navigation:hover { background:var(--fx-hover); border-color:var(--fx-accent); box-shadow:none; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__navigation-icon { position:relative; top:0; left:0; width:12px; height:12px; font-size:0; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__navigation-icon::before { width:7px; height:7px; top:2px; border-width:1.5px 1.5px 0 0; border-color:currentColor; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__navigation-icon--previous::before { left:4px; right:auto; transform:rotate(225deg); }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__navigation-icon--next::before { left:1px; right:auto; transform:rotate(45deg); }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__today-button { width:100%; min-width:0; min-height:40px; height:auto; padding:10px 14px; margin:0; background:var(--fx-subtle); color:var(--fx-accent-ink,var(--fx-text)); border:0; border-top:1px solid var(--fx-line); border-radius:0; font-size:14px; font-weight:600; }
.foxy-ui :is(#root,.Modal) .react-datepicker__input-container button.react-datepicker__close-icon { position:absolute; display:grid; place-items:center; top:50%; right:7px; transform:translateY(-50%); width:30px; min-width:30px; height:30px; min-height:30px; padding:0; border:0; border-radius:7px; background:transparent; box-shadow:none; }
.foxy-ui :is(#root,.Modal) .react-datepicker__input-container button.react-datepicker__close-icon::after { display:grid; place-items:center; width:24px; height:24px; padding:0; background:var(--fx-hover); color:var(--fx-muted); font:20px/1 var(--font-family-base); border-radius:6px; }
.foxy-ui :is(#root,.Modal) .calendar-wrapper .react-datepicker-wrapper .react-datepicker__input-container:has(.react-datepicker__close-icon) input { padding-right:40px!important; }
.foxy-ui :is(#root,.Modal) .time-picker-popup { max-width:calc(100vw - 28px); border:1px solid var(--fx-line); border-radius:14px; background:var(--fx-surface); box-shadow:0 12px 36px #1523361f; }
.foxy-ui :is(#root,.Modal) .time-picker-header { padding:12px 16px; color:var(--fx-text); background:var(--fx-subtle); border-bottom:1px solid var(--fx-line); font-size:15px; line-height:1.4; }
.foxy-ui :is(#root,.Modal) .time-picker-content { max-height:min(280px,55dvh); overflow-y:auto; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__time-container { float:none; width:100%!important; min-width:0; border:0!important; border-top:1px solid var(--fx-line)!important; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__time { background:var(--fx-surface)!important; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__time-box { width:100%!important; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__time-list { max-height:min(250px,45dvh); padding:6px!important; margin:0; scrollbar-gutter:stable; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__time-list .react-datepicker__time-list-item { height:38px!important; min-height:38px; padding:8px 12px!important; border:0!important; border-radius:8px!important; color:var(--fx-text)!important; background:transparent; font-size:14px!important; line-height:22px!important; text-align:center; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__time-list .react-datepicker__time-list-item:hover { background:var(--fx-hover)!important; }
.foxy-ui :is(#root,.Modal) .react-datepicker .react-datepicker__time-list .react-datepicker__time-list-item--selected { background:var(--fx-accent)!important; color:var(--fx-on-accent)!important; font-weight:600!important; }
@media(max-width:300px) {
  .foxy-ui :is(#root,.Modal) .react-datepicker { --fx-calendar-cell:calc((100vw - 56px) / 7); }
}
@media(max-width:1050px) {
  .foxy-ui #root .admin-overview-charts { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .foxy-ui #root .pages-main-panels { grid-template-columns:1fr; }
  .foxy-ui #root .pages-preview-body { height:290px; }
  .foxy-ui #root .fx-filter-panel .select-inputs,.foxy-ui #root .admin-select-inputs { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
  .foxy-ui #root .admin-head { grid-template-columns:1fr; }
  .foxy-ui #root .info-head { justify-content:space-between; }
  .foxy-ui #root .admin-info { grid-template-columns:1fr; gap:12px; }
  .foxy-ui #root .admin-overview-charts { grid-template-columns:1fr; }
  .foxy-ui #root :is(.call-comment,.choose-domen-or-ip,.call-info,.domen-info,.link-card,.redirect-comment,.redirect-info,.pages-info,.spoiler-container) { padding:18px; border-radius:11px; }
  .foxy-ui #root :is(.call-comment,.choose-domen-or-ip) form { flex-direction:column; align-items:stretch; }
  .foxy-ui #root :is(.call-comment,.choose-domen-or-ip) form>button { align-self:flex-start; }
  .foxy-ui #root .fx-filter-panel { padding:12px; }
  .foxy-ui #root .fx-filter-panel>.spoiler-header { top:12px; right:12px; min-width:40px; width:40px; padding:11px; }
  .foxy-ui #root .fx-filter-label { font-size:0; gap:0; }
  .foxy-ui #root .fx-filter-panel .search-inputs>div:first-child { width:calc(100% - 50px); }
  .foxy-ui #root .fx-filter-panel .select-inputs,.foxy-ui #root .admin-select-inputs { grid-template-columns:1fr; gap:15px; }
  .foxy-ui #root .redirect-info-title { gap:12px; flex-wrap:wrap; }
  .foxy-ui #root .redirect-info-title-label { gap:5px; }
  .foxy-ui #root .redirect-info-title .red-btn { min-width:28px; width:28px; padding:6px; }
  .foxy-ui #root .redirect-info-comment { font-size:12px; }
  .foxy-ui #root .redirect-info-date { font-size:10px; }
  .foxy-ui #root :is(td,th) { font-size:11px; padding:9px 7px; }
  .foxy-ui #root .pages-main-panels { gap:18px; }
  .foxy-ui #root .pages-preview-body { height:220px; }
  .foxy-ui #root .check-div th { min-width:0; }
  .foxy-ui .Modal { padding:20px; max-width:calc(100vw - 24px); }
  .foxy-ui #root .zb-modal-overlay { padding:12px; }
  .fx-native-empty { padding:30px 16px; }
}
@media(prefers-reduced-motion:reduce) { .foxy-ui #root *, .foxy-ui #root *::before { transition:none !important; } }

/* Shared select: native state underneath, one visual menu across forms and dialogs. */
.foxy-ui select[data-fx-select] { display:none !important; }
.foxy-ui .fx-select-control { display:block; width:100%; min-width:0; }
.foxy-ui .fx-select-control[hidden] { display:none; }
.foxy-ui .fx-select-trigger,.foxy-ui #root .fx-select-trigger,.foxy-ui .Modal .fx-select-trigger {
  display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-width:0;
  min-height:42px; height:auto; margin:0; padding:10px 12px; text-align:left; text-transform:none;
  border:1px solid var(--fx-line); border-radius:9px; background:var(--fx-subtle); color:var(--fx-text);
  font:400 13px/1.5 var(--font-family-base); box-shadow:none; cursor:pointer;
}
.foxy-ui .fx-select-trigger:hover:not(:disabled),.foxy-ui #root .fx-select-trigger:hover:not(:disabled),.foxy-ui .Modal .fx-select-trigger:hover:not(:disabled) { border-color:#b6c0cd; box-shadow:none; background:var(--fx-surface); }
.foxy-ui .fx-select-trigger[aria-expanded=true],.foxy-ui #root .fx-select-trigger[aria-expanded=true],.foxy-ui .Modal .fx-select-trigger[aria-expanded=true] { border-color:var(--fx-accent); box-shadow:0 0 0 3px var(--fx-ring); }
.foxy-ui .fx-select-trigger:focus-visible { outline:2px solid var(--fx-accent); outline-offset:3px; }
.foxy-ui .fx-select-trigger:disabled { opacity:.5; cursor:not-allowed; }
.foxy-ui .fx-select-trigger[aria-invalid=true] { border-color:#c85b64 !important; }
.foxy-ui .fx-select-trigger.fx-select-placeholder { color:var(--fx-muted); }
.foxy-ui .fx-select-value { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.foxy-ui .fx-select-arrow { display:flex; color:var(--fx-muted); flex:none; }
.foxy-ui .fx-select-arrow svg,.foxy-ui .fx-option-check svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.foxy-ui .fx-select-arrow path,.foxy-ui .fx-option-check path { fill:none !important; stroke:currentColor; }
.foxy-ui .fx-select-arrow :is(svg,path),.foxy-ui .fx-option-check :is(svg,path) { color:inherit !important; }
.foxy-ui .fx-select-trigger[aria-expanded=true] .fx-select-arrow { transform:rotate(180deg); }
.foxy-ui .fx-select-menu {
  position:fixed; inset:auto; margin:0; padding:6px; z-index:10000; overflow:hidden; box-sizing:border-box;
  border:1px solid var(--fx-line); border-radius:12px; background:var(--fx-surface); color:var(--fx-text);
  font:400 13px/1.5 var(--font-family-base); box-shadow:0 8px 16px #16283d0a,0 20px 55px #16283d24;
}
.foxy-ui .fx-select-menu::backdrop { background:transparent; }
.foxy-ui .fx-select-list { display:block; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#c7cdd7 transparent; }
.foxy-ui .fx-select-option { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:38px; padding:9px 11px; border-radius:7px; cursor:pointer; }
.foxy-ui .fx-select-option>span:first-child { min-width:0; overflow-wrap:anywhere; }
.foxy-ui .fx-select-option[aria-selected=true] { color:var(--fx-accent-ink,var(--fx-text)); background:var(--fx-tint); font-weight:600; }
.foxy-ui .fx-select-option.fx-option-active { background:var(--fx-hover); }
.foxy-ui .fx-select-option[aria-selected=true].fx-option-active { background:var(--fx-tint); }
.foxy-ui .fx-select-option[aria-disabled=true] { opacity:.4; cursor:not-allowed; }
.foxy-ui .fx-option-check { display:flex; flex:none; opacity:0; }
.foxy-ui .fx-select-option[aria-selected=true] .fx-option-check { opacity:1; }
.foxy-ui .fx-option-group { padding:12px 11px 5px; color:var(--fx-muted); font-size:11px; font-weight:600; }
.foxy-ui .fx-select-empty { padding:18px 12px; margin:0; text-align:center; color:var(--fx-muted); font-size:12px; }
.foxy-ui .fx-select-menu .fx-select-search,.foxy-ui .Modal .fx-select-menu .fx-select-search {
  display:block; width:100%; min-width:0; min-height:38px; height:38px; margin:0 0 6px; padding:8px 11px;
  background:var(--fx-subtle); border:1px solid var(--fx-line); border-radius:7px; color:var(--fx-text); font:400 13px var(--font-family-base);
}
.foxy-ui .fx-select-menu .fx-select-search:focus { outline:none; border-color:var(--fx-accent); box-shadow:none; }
.foxy-ui .fx-session-tools>.fx-select-control { flex:none; width:145px; }
.foxy-ui .fx-session-tools .fx-select-trigger { min-height:35px; padding:7px 10px; font-size:11px; }

/* Expanded records: a compact address, flat link groups and a quiet export footer. */
.foxy-ui #root .fx-origin-summary,.foxy-ui #root .fx-origin-summary tbody,.foxy-ui #root .fx-origin-summary tr { display:block; width:100%; margin:0; }
.foxy-ui #root .fx-origin-summary { border:1px solid var(--fx-line); border-radius:9px; padding:13px 16px; background:var(--fx-subtle); }
.foxy-ui #root .fx-origin-summary :is(th,td) { display:block; width:100%; padding:0; border:0; background:none; text-align:left; min-width:0; }
.foxy-ui #root .fx-origin-summary th { margin-bottom:6px; font-size:11px; color:var(--fx-muted); }
.foxy-ui #root .fx-origin-summary th b { font-weight:500; }
.foxy-ui #root .fx-origin-summary td { font:400 13px/1.6 Consolas,monospace; color:var(--fx-text); overflow-wrap:anywhere; }
.foxy-ui #root .proxy-original-link { margin:0; padding:13px 16px; border:1px solid var(--fx-line); border-radius:9px; background:var(--fx-subtle); font:400 13px/1.6 Consolas,monospace; }
.foxy-ui #root .proxy-original-link strong { display:block; margin-bottom:6px; color:var(--fx-muted); font:500 11px/1.5 var(--font-family-base); }
.foxy-ui #root .fx-link-group { margin:0 0 18px; padding:0; border:0; background:none; border-radius:0; }
.foxy-ui #root .fx-link-group>.inner-label { padding:0; margin:0 0 10px; min-height:0; font-size:12px; font-weight:600; color:var(--fx-text); cursor:default; }
.foxy-ui #root .fx-link-group>.inner-label::after,.foxy-ui #root .fx-link-group>.inner-label>svg,.foxy-ui #root .fx-link-group>.inner-label>.arrow { display:none; }
.foxy-ui #root .fx-link-group>.inner-content { display:none; }
.foxy-ui #root .fx-link-group>.links-buttons { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr)); gap:10px; width:100%; max-height:none; height:auto; opacity:1; padding:0; margin:0; visibility:visible; }
.foxy-ui #root .fx-link-group .buttons-qr { display:flex; align-items:stretch; gap:0; width:100%; max-width:420px; margin:0; padding:0; border:1px solid var(--fx-line); border-radius:10px; background:var(--fx-surface); overflow:hidden; }
.foxy-ui #root .fx-link-group .buttons-qr:hover { border-color:#c3cbd6; }
.foxy-ui #root .fx-link-group .btn-link { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:3px; flex:1; min-width:0; min-height:64px; width:auto; margin:0; padding:12px 15px; border:0; border-radius:0; background:transparent !important; color:var(--fx-text); text-align:left; font-size:12px; font-weight:600; overflow-wrap:anywhere; }
.foxy-ui #root .fx-link-group .btn-link::after { content:'Копировать ссылку'; font-size:10px; font-weight:400; color:var(--fx-muted); }
.foxy-ui #root .fx-link-group .qr-btn { flex:none; width:57px; min-width:57px; height:auto; margin:0; padding:12px; border:0; border-left:1px solid var(--fx-line); border-radius:0; background:var(--fx-subtle) !important; color:#647184; }
.foxy-ui #root .fx-link-group .qr-btn svg { width:20px; height:20px; fill:currentColor; }
.foxy-ui #root .fx-link-group .qr-btn svg path { fill:currentColor; }
.foxy-ui #root .fx-link-group .qr-btn :is(svg,path) { color:#647184 !important; }
.foxy-ui #root .fx-link-group .buttons-qr button:hover { background:var(--fx-hover) !important; box-shadow:none; }
.foxy-ui #root .links-buttons-redirect { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:22px 0 0; padding:16px 0 0; border-top:1px solid var(--fx-line); }
.foxy-ui #root .links-buttons-redirect::before { content:'Экспорт'; color:var(--fx-muted); font-size:11px; margin-right:8px; }
.foxy-ui #root .links-buttons-redirect>button { width:auto; min-width:75px; min-height:33px; margin:0; padding:7px 13px; background:var(--fx-subtle); border:1px solid var(--fx-line); color:var(--fx-text); font-size:11px; font-weight:500; border-radius:7px; }
@media(max-width:600px) {
  .foxy-ui .fx-session-tools>.fx-select-control { width:100%; }
  .foxy-ui #root .fx-origin-summary { padding:12px; }
  .foxy-ui #root .fx-origin-summary td { font-size:11px; }
  .foxy-ui #root .proxy-original-link { padding:12px; font-size:11px; }
  .foxy-ui #root .fx-link-group .buttons-qr { max-width:none; }
  .foxy-ui #root .links-buttons-redirect { gap:6px; }
}

/* Labelled mirrors preserve React-owned card values and all native actions. */
.foxy-ui .admin-info>.fx-admin-source { display:none !important; }
.foxy-ui .admin-info>.fx-admin-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-column:1/-1; gap:18px 24px; width:100%; min-width:0; margin:0; padding:0; }
.foxy-ui .fx-admin-fields>.fx-admin-field { min-width:0; margin:0; padding:0; }
.foxy-ui .fx-admin-fields>.fx-admin-field[data-field-kind=name] { grid-column:1/-1; padding-bottom:15px; border-bottom:1px solid var(--fx-line); }
.foxy-ui .fx-admin-fields dt { color:var(--fx-muted); font-size:13px; font-weight:400; line-height:1.5; margin:0 0 5px; }
.foxy-ui .fx-admin-fields dd { color:var(--fx-text); font-size:15px; font-weight:500; line-height:1.5; margin:0; overflow-wrap:anywhere; }
.foxy-ui .fx-admin-fields [data-field-kind=name] dd { font-size:18px; font-weight:600; }
.foxy-ui .fx-admin-fields [data-field-kind=identifier] dd { font-family:Consolas,monospace; font-size:14px; }
.foxy-ui .fx-admin-fields .fx-admin-value-missing { color:var(--fx-muted); font-weight:400; }
.foxy-ui .fx-admin-counts>.fx-admin-count-source { display:none !important; }
.foxy-ui .fx-admin-counts>.fx-admin-count { display:inline-flex; align-items:center; padding:6px 10px; border:1px solid var(--fx-line); border-radius:8px; background:var(--fx-subtle); color:var(--fx-muted); font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.foxy-ui #root .fx-admin-counts { display:flex; align-items:center; flex-wrap:wrap; gap:10px; min-width:0; }
@media(max-width:600px) {
  .foxy-ui .admin-info>.fx-admin-fields { grid-template-columns:minmax(0,1fr); gap:16px; }
  .foxy-ui .fx-admin-fields dd { font-size:14px; }
  .foxy-ui .fx-admin-fields [data-field-kind=name] dd { font-size:17px; }
}