/* Task 384 (owner 04.11.2026): «верстка должна быть идеальная у всех чартов и для десктопа и для мобильника; крестик и другие иконки по центру; верхняя строка на одной линии, ничего не скачет; на телефоне лишнее убрано». The layout of the charts in one place, this file is loaded last. No figures, no algorithms here. */ /* ------------------------------------------------------------ 1. An icon in a button stands exactly in the middle (svg, no padding: the ink of a font's «×» sits low and depends on the font) */ #bgp-sales .bgp-viewer .bgp-viewer-close{display:inline-grid;place-items:center;box-sizing:border-box;flex:none;width:36px;height:36px;min-width:0;min-height:0;padding:0;margin:0 0 0 auto} #bgp-sales .bgp-viewer .bi-chart-theme-controls+.bgp-viewer-close{margin-left:0} #bgp-sales .bgp-viewer .bgp-viewer-close svg{display:block;width:20px;height:20px;margin:0} #bgp-sales :is(.bi-tip-close,.bi-group-close,.bi-pie-tooltip-close,.bi-adv-chip-remove,[data-adv-unfilter]) svg{display:block;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} #bgp-sales .bi-adv-chip .bi-adv-chip-remove svg,#bgp-sales .bi-adv-filter [data-adv-unfilter] svg{width:12px;height:12px} #bgp-sales .bi-group-close,#bgp-sales .bi-adv-filter button{flex:none} #bgp-sales .bi-adv-chip .bi-adv-chip-remove,#bgp-sales .bi-adv-filter [data-adv-unfilter]{display:inline-grid;place-items:center;padding:0} #bgp-sales .bi-detail-tree-actions .bi-detail-gear{padding:0} #bgp-sales .bi-gt-filter .bi-gt-funnel{display:inline-grid;place-items:center;padding:0;text-align:center} #bgp-sales .bi-debt .bi-gt-filter .bi-gt-funnel{width:30px} #bgp-sales .bi-debt .bd-help{font-size:11px;line-height:16px} #bgp-sales .bi-info{font:600 11px/16px Verdana,'Golos Text','Segoe UI',sans-serif} #bgp-sales .bi-detail-card{padding-bottom:1px} #bgp-sales .bi-mk-year.is-collapsed .bi-mk-fold{padding:6px 4px} #theme svg path,[data-chart-theme="theme"] svg path{transform:translate(.6px,-.6px)} #bgp-sales .theme-controls svg{width:18px;height:18px} #bgp-sales>.top :is(.theme-controls,.bi-nav-back){position:relative;top:.5px} #nav-back svg path{transform:translateX(.5px)} #bgp-sales .bi-nav-back{flex:none} /* + and − of the details tree are drawn, not typed */ #bgp-sales .bi-detail-drill>span:first-child{font-size:0;background-image:linear-gradient(currentColor,currentColor),linear-gradient(currentColor,currentColor);background-position:center;background-repeat:no-repeat;background-size:10px 2px,2px 10px} #bgp-sales .bi-detail-drill[aria-expanded="true"]>span:first-child{background-size:10px 2px,0 0} @media(max-width:640px),(pointer:coarse){#bgp-sales .bi-detail-drill>span:first-child{background-size:12px 2px,2px 12px}#bgp-sales .bi-detail-drill[aria-expanded="true"]>span:first-child{background-size:12px 2px,0 0}} /* the initials in a circle: the ink of a capital sits low */ #bgp-sales :is(.bi-row-photo,.bi-picker-avatar):not(:has(img,.bi-bgp-mark)){padding-bottom:1px;box-sizing:border-box} #bgp-sales :is(.bgp-bars,.bi-compact-fact-row)>.bi-row-photo:not(:has(img,.bi-bgp-mark)){padding-bottom:0} @media(min-width:769px){#bgp-sales .bi-pie-photo:not(:has(img,.bi-bgp-mark)){padding-bottom:0}} /* the last typed crosses */ #bgp-sales .bi-saved-preset .bi-saved-preset-drop{display:inline-grid;place-items:center;padding:0;width:26px} #bgp-sales .bi-saved-preset-drop svg{display:block;width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} /* ------------------------------------------------------------ 2. The buttons of a chart's toolbar: one size, one frame, the icon in the middle */ #bgp-sales .bgp-panel-tools>.bgp-replay{display:inline-grid;place-items:center;box-sizing:border-box;flex:none;width:30px;height:30px;min-width:0;min-height:0;margin:0;padding:0;border:1px solid var(--line);border-radius:8px} #bgp-sales .bgp-panel-tools>.bgp-replay svg{display:block;width:16px;height:16px;margin:0} #bgp-sales .bgp-panel-tools>.bgp-replay span{display:none} #bgp-sales .bgp-panel-tools>.bgp-expand{box-sizing:border-box;width:30px;height:30px;min-height:0;margin:0} #bgp-sales .bgp-panel-tools>.bgp-expand svg{width:16px;height:16px} /* the view picker keeps its place in every mode: the second picker always before it */ #bgp-sales .bgp-panel-tools>.xsel-map-group{order:-1} #bgp-sales .bgp-panel-tools .bgp-year{display:inline-flex;align-items:center;box-sizing:border-box;height:30px} /* an empty status of the Excel button must not push the footer's buttons off the edge */ #bgp-sales .bgp-seller-footer>[role="status"]:empty,#bgp-sales :is(.bi-mk-excel,.bi-ec-excel) .field-note:empty{display:none} #bgp-sales .bi-bounded-map-pages:empty{display:none} /* the focus of a month's column: no white frame after a tap, only for the keyboard */ #bgp-sales .source-line :is(rect[data-chart-month],rect[data-chart-week]):focus{outline:none} #bgp-sales .source-line :is(rect[data-chart-month],rect[data-chart-week]):focus-visible{outline:2px solid var(--actual);outline-offset:-2px} /* the chevron of a long name stays beside the text */ #bgp-sales .bgp-seller-name{display:flex;align-items:baseline;gap:6px} #bgp-sales .bgp-seller-name .bi-seller-display-name{flex:0 1 auto;min-width:0} #bgp-sales .bgp-seller-name .bgp-name-chevron{flex:none} /* «Итого» starts on the line of the names */ #bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bi-seller-total-row .bgp-seller-name{padding-left:30px} #bgp-sales .bgp-sellers-panel[data-kind="revenue"][data-row-view="compact"] .bi-seller-total-row .bgp-seller-name{padding-left:0} /* ------------------------------------------------------------ 3. The computer, the page: the heads of two neighbouring panels on one line */ @media(min-width:1100px){ html.bi-test body#bgp-sales{margin-top:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){display:flex;flex-wrap:nowrap;align-items:flex-start;gap:8px;box-sizing:border-box;min-height:58px;padding:10px 18px 6px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>div:first-child{flex:1 1 auto;min-width:0;padding:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{font-size:16px;line-height:30px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-subtitle{margin:0;white-space:nowrap} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools{flex:none;display:flex;flex-wrap:nowrap;align-items:center;gap:6px;margin:0;min-height:30px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-panel-tools .xsel{flex:none;width:auto;min-width:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-panel-tools .xsel-t{width:auto;min-width:0;max-width:170px;height:30px;min-height:30px;padding:0 8px;font-size:13px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-panel-tools .xsel-dynamics-view .xsel-t{min-width:160px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bi-map-header-total{line-height:30px} } @media(min-width:1100px) and (max-width:1279px){ #bgp-sales .bi-financial-year-control{flex-wrap:nowrap!important;gap:8px!important} #bgp-sales .bi-financial-year-control .bgp-dynamics-filter{flex-wrap:nowrap} #bgp-sales .bi-financial-year-control .xsel-originator,#bgp-sales .bi-financial-year-control .xsel-cfo{width:150px;flex:0 1 150px;min-width:0} } /* the second set of the same cards under a pie with all its captions */ @media(min-width:641px){#bgp-sales .bi-financial-pie:not(:has(.bi-pie-callout[hidden])) .bi-pie-category-list{display:none}} @media(min-width:768px){ #bgp-sales .bi-financial-pie:not(:has(.bi-pie-callout[hidden])) .bi-pie-note{margin-bottom:0;padding-bottom:0} #bgp-sales :is(.bi-debt-sellers,.bi-adv-charts) .bgp-seller-list:has(.bi-pie-callout):not(:has(.bi-pie-callout[hidden])){overflow:hidden!important} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-row-view="full"] .bgp-scale{padding-left:60px} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row:has(.bgp-bars>.bi-row-photo) .bgp-seller-info{padding-left:0} #bgp-sales .bgp-seller-footer [data-all-originators]{padding:8px 12px;font-size:11px;min-height:32px;line-height:1.35} } @media(min-width:1100px){#bgp-sales .bi-all-fact-row{grid-template-columns:minmax(118px,240px) minmax(90px,1fr) minmax(300px,1fr)}} /* ------------------------------------------------------------ 4. The computer and a tablet, the whole screen: a low head of the window, one head for both panels */ @media(min-width:1100px),(min-width:769px) and (min-height:501px){ #bgp-sales .bi-native-viewer .bgp-viewer-head{min-height:0;padding-block:6px} #bgp-sales .bi-native-viewer .bi-app-mark{width:36px;height:36px;font-size:23px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){display:flex;flex-wrap:nowrap;align-items:flex-start;gap:8px;box-sizing:border-box;padding:10px 24px 8px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>div:first-child{flex:1 1 auto;min-width:0;padding:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{line-height:30px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools{flex:none;display:flex;flex-wrap:nowrap;align-items:center;gap:6px;width:auto;margin:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel{flex:none;width:auto;min-width:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel-t{width:auto;height:30px;min-height:30px;padding:0 8px;font-size:13px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bi-map-header-total{line-height:30px} #bgp-sales .bi-native-viewer :is(.xsel-dynamics-view,.xsel-financial-view) .xsel-t{min-width:192px} #bgp-sales .bi-native-viewer .bgp-panel-tools .bgp-year{display:none} #bgp-sales .bi-native-viewer .bgp-dynamics-panel>.bgp-legend{padding-top:0} #bgp-sales .bi-native-viewer .bi-financial-access-note{margin:0;padding:0 24px 6px} /* the map is taller than the window: the reel scrolls down to its legend and footer */ #bgp-sales .bi-native-viewer .bgp-slide:has(.bi-bounded-map){height:auto;min-height:100%} #bgp-sales .bi-native-viewer .bgp-panel:has(.bi-bounded-map){flex:none;height:auto;min-height:100%;overflow:visible} /* the receivables' map fills the window */ #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-list[data-financial-view=treemap]{display:flex;flex-direction:column;overflow:hidden} #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-list[data-financial-view=treemap]>div,#bgp-sales .bi-native-viewer .bi-debt-sellers .bi-map-canvas{flex:1;display:flex;flex-direction:column;min-height:0} #bgp-sales .bi-native-viewer .bi-debt-sellers .bi-map-stage{flex:1 1 auto;height:auto;min-height:0} } /* the total of «Сводная» at the bottom of the window also under a short list */ #bgp-sales .bi-native-viewer .bi-pivot-grid{height:100%} #bgp-sales .bi-native-viewer .bi-pivot-grid tbody::after{content:"";display:table-row;height:100%} /* ------------------------------------------------------------ 5. A tablet, a narrow window, a laptop at 125 %: the rows and the heads keep their columns */ @media(min-width:641px) and (max-width:1099px){ #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row{grid-template-columns:minmax(0,1fr) 180px!important;row-gap:2px} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row>.bgp-seller-info{grid-column:1/-1!important;grid-row:1!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row>.bgp-bars{grid-column:1!important;grid-row:2!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row>.bgp-seller-values{grid-column:2!important;grid-row:2!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row>.bgp-seller-details{grid-column:1/-1!important;grid-row:3!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-row-head{grid-template-columns:minmax(0,1fr) 180px!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-row-head>:first-child{display:none} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-row-view="full"] .bgp-row-head>.bgp-scale{padding-left:60px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){display:flex;flex-wrap:nowrap;align-items:flex-start;gap:8px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>div:first-child{flex:1 1 auto;min-width:0;padding:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{line-height:32px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-subtitle{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools{flex:none;display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:6px;width:auto;min-width:0;margin:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel{flex:none;width:auto!important;min-width:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel .xsel-t{width:100%;min-width:0;height:32px;min-height:32px;padding:0 8px;font-size:13px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.bgp-replay,.bgp-expand){position:static;flex:none;width:32px;height:32px;margin:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bi-map-header-total{line-height:32px;margin:0 8px 0 0} } @media(min-width:769px) and (max-width:1099px) and (min-height:501px){ #bgp-sales .bi-native-viewer .bgp-viewer-head{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;padding:6px 10px} #bgp-sales .bi-native-viewer .bgp-viewer-head>span{flex:none} #bgp-sales .bi-native-viewer .bi-financial-year-control{display:flex!important;flex:1 1 auto;min-width:0;flex-wrap:nowrap!important;align-items:center;gap:8px!important;width:auto!important} #bgp-sales .bi-native-viewer .bi-financial-year-control .xsel-year{flex:none;width:84px} #bgp-sales .bi-native-viewer .bi-financial-year-control>.bgp-dynamics-filter{display:flex;flex:1 1 auto;min-width:0;flex-wrap:nowrap;align-items:center;gap:6px;width:auto;margin:0;padding:0} #bgp-sales .bi-native-viewer .bgp-dynamics-filter>*{grid-column:auto!important;grid-row:auto!important;margin:0} #bgp-sales .bi-native-viewer .bi-financial-year-control .xsel-originator,#bgp-sales .bi-native-viewer .bi-financial-year-control .xsel-cfo{flex:0 1 150px;width:auto!important;min-width:90px;max-width:150px!important} #bgp-sales .bi-native-viewer .bi-chart-theme-controls{flex:none} #bgp-sales .bi-native-viewer .bgp-reel:has(.bgp-dynamics-panel,.bi-debt-dynamics){overflow:hidden} #bgp-sales .bi-native-viewer .bgp-slide:has(.bgp-dynamics-panel,.bi-debt-dynamics){height:100%;min-height:0} #bgp-sales .bi-native-viewer :is(.bgp-dynamics-panel,.bi-debt-dynamics){display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden} #bgp-sales .bi-native-viewer :is(.bgp-dynamics-panel,.bi-debt-dynamics) .source-line{flex:1 1 auto;height:auto;min-height:0} #bgp-sales .bi-native-viewer .bgp-reel:has(.bgp-sellers-panel){overflow:hidden} #bgp-sales .bi-native-viewer .bgp-reel:has(.bi-bounded-map){overflow-y:auto} #bgp-sales .bi-native-viewer .bgp-slide:has(.bgp-sellers-panel){display:flex;flex-direction:column;height:100%;min-height:0} #bgp-sales .bi-native-viewer .bgp-slide:has(.bi-bounded-map){height:auto;min-height:100%} #bgp-sales .bi-native-viewer .bgp-sellers-panel{display:flex;flex-direction:column;flex:1 1 auto;height:100%;min-height:0;overflow:hidden} #bgp-sales .bi-native-viewer .bgp-sellers-panel:has(.bi-bounded-map){flex:none;height:auto;min-height:100%;overflow:visible} #bgp-sales .bi-native-viewer .bgp-sellers-panel .bgp-seller-list{flex:1 1 auto;min-height:0;max-height:none;overflow:auto} #bgp-sales .bi-native-viewer .bgp-sellers-panel:has(.bi-bounded-map) .bgp-seller-list{flex:none;overflow:visible} } /* ------------------------------------------------------------ 6. The phone (and a phone on its side), the whole screen: one line under the bar — the title, the view, the reset, the close — and the chart to the end of the screen */ html.bi-test #bgp-sales .bi-native-viewer{top:26px;height:calc(100dvh - 26px)} @media(max-width:768px),(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer{grid-template-rows:minmax(0,1fr)} #bgp-sales .bi-native-viewer .bgp-viewer-head{position:absolute;top:calc(4px + env(safe-area-inset-top,0px));right:max(8px,env(safe-area-inset-right,0px));z-index:6;display:block;width:auto;min-height:0;padding:0;border:0;background:none} #bgp-sales .bi-native-viewer .bgp-viewer-head>:not(.bgp-viewer-close){display:none!important} #bgp-sales .bgp-viewer .bgp-viewer-close{width:34px;height:34px} /* the line */ #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){display:grid;grid-template-columns:minmax(0,1fr) 118px 34px;column-gap:6px;row-gap:4px;align-items:center;flex:none;box-sizing:border-box;width:auto;min-height:42px;margin:0;padding:calc(4px + env(safe-area-inset-top,0px)) 50px 4px 10px;border-bottom:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>div:first-child{grid-column:1;grid-row:1;flex:none;min-width:0;padding:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{font-size:14px;line-height:20px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]::before{content:attr(data-short);content:attr(data-short) / "";min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-subtitle{display:none} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools{display:contents} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.xsel-dynamics-view,.xsel-financial-view){grid-column:2!important;grid-row:1;width:100%!important;min-width:0;max-width:none;flex:none} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel .xsel-t{width:100%;min-width:0;height:34px;min-height:34px;padding:0 6px;gap:4px;font-size:12px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>.bgp-replay{position:static!important;grid-column:3;grid-row:1;width:34px;height:34px;margin:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.xsel-pie-group,.xsel-map-group,.xsel-sort){grid-column:1/-1!important;grid-row:2;width:auto!important;max-width:none;margin-right:-40px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>.bi-sales-unplanned{grid-column:1/-1;grid-row:3;justify-self:end} #bgp-sales .bi-native-viewer .bgp-panel-tools .bgp-year{display:none} #bgp-sales .xsel-t .lbl[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .xsel-t .lbl[data-short]::before{content:attr(data-short);font-size:12px} /* the chart takes the rest */ #bgp-sales .bi-native-viewer .bgp-panel{border:0;border-radius:0} #bgp-sales .bi-native-viewer .bgp-reel{overflow:hidden} #bgp-sales .bi-native-viewer .bgp-slide{display:flex;flex-direction:column;height:100%;min-height:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel{display:flex;flex-direction:column;flex:1 1 auto;height:100%;min-height:0;overflow:hidden} #bgp-sales .bi-native-viewer .source-line{flex:1 1 auto;height:auto;min-height:0;margin:0 2px!important} #bgp-sales .bi-native-viewer :is(.bgp-forecast-note,.bi-pie-note,.bi-map-note,.bi-financial-access-note,.bi-debt-note){display:none} #bgp-sales .bi-native-viewer .bgp-plot-footer{flex:none;min-height:0;padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px))} #bgp-sales .bi-native-viewer .bgp-plot-footer:not(:has(.bgp-forecast-value:not(:empty))){display:none} #bgp-sales .bi-native-viewer .bi-mobile-seller-meta{padding-bottom:4px} #bgp-sales .bi-native-viewer .bgp-dynamics-panel>.bgp-legend{flex:none;gap:2px 6px;padding:0 10px 4px;min-height:0} #bgp-sales .bi-native-viewer .bgp-dynamics-panel>.bgp-legend .bgp-legend-item{font-size:10px;gap:4px} #bgp-sales .bi-native-viewer .bgp-dynamics-panel>.bgp-legend .bgp-line-swatch{width:12px} /* «Сводная»: the switch and the sum on one line, no download, the table to the end of the screen */ #bgp-sales .bi-native-viewer .bi-pivot-export{display:none} #bgp-sales .bi-native-viewer .bgp-dynamics-panel[data-dynamics-view="pivot"] .bgp-plot-footer{display:none} #bgp-sales .bi-native-viewer .bi-pivot{gap:4px} #bgp-sales .bi-native-viewer .bi-pivot-tools{flex-wrap:nowrap;gap:8px;min-width:0;padding:0 10px} #bgp-sales .bi-native-viewer .bi-pivot-tools .bi-sales-unplanned{flex:none} #bgp-sales .bi-native-viewer .bi-pivot-sum{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} #bgp-sales .bi-native-viewer .bi-pivot-scroll{border-width:1px 0 0;border-radius:0} /* the panel of the rows: the list scrolls under the fixed head, the footer stays at the bottom */ #bgp-sales .bi-native-viewer .bgp-seller-toolbar{flex:none;padding:0 0 4px} #bgp-sales .bi-native-viewer .bgp-seller-toolbar .bgp-seller-legend{padding:0 10px} #bgp-sales .bi-native-viewer .bgp-seller-list{flex:1 1 auto;min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain} #bgp-sales .bi-native-viewer .bgp-seller-footer{display:flex;flex:none;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:8px;min-height:0;padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px))} #bgp-sales .bi-native-viewer .bgp-seller-footer>span:first-child{display:none} #bgp-sales .bi-native-viewer .bgp-seller-footer [data-all-originators]{margin-right:auto} #bgp-sales .bi-native-viewer .bi-pie-category-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible;padding-inline:10px} /* the map: the stage takes what is left over its legend and corrections */ #bgp-sales .bi-native-viewer .bgp-reel:has(.bi-bounded-map){overflow:hidden} #bgp-sales .bi-native-viewer .bgp-seller-list:has(.bi-bounded-map){flex:1 1 auto;min-height:0;max-height:none;overflow:auto} #bgp-sales .bi-native-viewer .bi-bounded-map{height:100%;min-height:300px} #bgp-sales .bi-native-viewer .bi-project-map{height:100%;min-height:300px} #bgp-sales .bi-native-viewer .bi-project-map>.bi-map-canvas{flex:1 1 auto;min-height:0} #bgp-sales .bi-native-viewer .bi-project-map .bi-map-stage{flex:1 1 auto;height:auto;min-height:0;margin:0} } @media(max-width:359px){ #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{font-size:12px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]{font-size:0} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]::before{font-size:12px} } @media(max-width:340px){ #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){grid-template-columns:minmax(0,1fr) 104px 34px;column-gap:4px;padding-left:8px;padding-right:44px} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel .xsel-t{padding:0 4px;gap:2px;font-size:11px} #bgp-sales .bi-native-viewer .bi-pivot-tools .bi-sales-unplanned{font-size:10px} } /* a phone on its side: the view picker has the room for its whole name */ @media(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){grid-template-columns:minmax(0,1fr) 170px 34px} #bgp-sales .xsel-t .lbl[data-short]{display:inline;font-size:inherit} #bgp-sales .xsel-t .lbl[data-short]::before{content:none} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.xsel-pie-group,.xsel-map-group,.xsel-sort){grid-column:1!important;grid-row:1;justify-self:end;width:210px!important;margin:0} #bgp-sales .bi-native-viewer .bgp-seller-footer{padding-block:4px} #bgp-sales .bi-native-viewer :is(.bi-project-map,.bi-bounded-map){min-height:240px} #bgp-sales .bi-native-viewer :is(.bi-project-map,.bi-bounded-map) .bi-map-stage{min-height:200px} } /* ------------------------------------------------------------ 7. The phone, the page: the same line, the toolbar a little smaller; nothing explanatory */ @media(max-width:640px){ #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){display:grid;grid-template-columns:minmax(0,1fr) 118px 32px 32px;column-gap:4px;row-gap:4px;align-items:center;flex:none;flex-wrap:nowrap;box-sizing:border-box;min-height:48px;padding:8px 10px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>div:first-child{grid-column:1;grid-row:1;flex:none;min-width:0;padding:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{font-size:14px;line-height:20px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]::before{content:attr(data-short);content:attr(data-short) / "";min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-subtitle{display:none} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools{display:contents} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.xsel-dynamics-view,.xsel-financial-view){grid-column:2!important;grid-row:1;width:100%!important;min-width:0;max-width:none;flex:none} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel .xsel-t{width:100%;min-width:0;height:32px;min-height:32px;padding:0 6px;gap:4px;font-size:12px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>.bgp-replay{position:static!important;grid-column:3;grid-row:1;width:32px;height:32px;margin:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>.bgp-expand{position:static!important;grid-column:4;grid-row:1;width:32px;height:32px;margin:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.xsel-pie-group,.xsel-map-group,.xsel-sort){grid-column:1/-1!important;grid-row:2;width:100%!important;max-width:none} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>.bi-sales-unplanned{grid-column:1/-1;grid-row:3;justify-self:end} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-year{display:none} #bgp-sales .bgp-charts-grid .bgp-panel-tools>:is(.bgp-replay,.bgp-expand){position:static} #bgp-sales .xsel-t .lbl[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .xsel-t .lbl[data-short]::before{content:attr(data-short);font-size:12px} #bgp-sales .bi-pivot-export{display:none} #bgp-sales .bgp-charts-grid :is(.bgp-forecast-note:not([data-ec-range-sum]),.bi-pie-note,.bi-map-note){display:none} #bgp-sales .bgp-charts-grid .bgp-dynamics-panel[data-dynamics-view="pivot"] .bgp-plot-footer{display:none} #bgp-sales .bgp-charts-grid .bgp-plot-footer{min-height:0;padding:6px 10px} #bgp-sales .bgp-charts-grid .bgp-plot-footer:not(:has(.bgp-forecast-value:not(:empty))):not(.bi-ec-chart-footer){display:none} #bgp-sales .bgp-charts-grid .bi-pivot-tools{flex-wrap:nowrap;gap:8px;padding-inline:8px} #bgp-sales .bgp-charts-grid .bi-pivot-tools .bi-sales-unplanned{flex:none} #bgp-sales .bgp-charts-grid .bi-pivot-sum{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} #bgp-sales .bgp-charts-grid>.bgp-dynamics-panel[data-dynamics-view="pivot"] .source-line{height:auto;max-height:none} #bgp-sales .bgp-charts-grid>.bgp-dynamics-panel[data-dynamics-view="pivot"] .bi-pivot{height:auto;max-height:350px} #bgp-sales .bgp-charts-grid .bgp-dynamics-panel>.bgp-legend{gap:2px 6px;padding-inline:10px} #bgp-sales .bgp-charts-grid .bgp-dynamics-panel>.bgp-legend .bgp-legend-item{font-size:10px;gap:4px} #bgp-sales .bgp-charts-grid .bgp-dynamics-panel>.bgp-legend .bgp-line-swatch{width:12px} #bgp-sales .bgp-seller-toolbar{padding:0 0 4px} #bgp-sales .bgp-seller-toolbar .bgp-seller-legend{padding:0 10px} #bgp-sales .bgp-seller-legend .bi-legend-info{display:none} #bgp-sales .bgp-sellers-panel .bgp-seller-footer{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px} #bgp-sales .bgp-sellers-panel .bgp-seller-footer>span:first-child{font-size:11px;line-height:1.3;min-width:0} #bgp-sales .bgp-sellers-panel .bgp-seller-footer:has([data-all-originators])>span:first-child{display:none} #bgp-sales .bgp-sellers-panel .bgp-seller-footer [data-all-originators]{margin:0 auto 0 0} #bgp-sales .bi-pie-category-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible;padding-inline:10px} #bgp-sales .bgp-footnote>:not(:nth-child(2)){display:none} #bgp-sales .bi-revenue-notice{display:none} #bgp-sales .bi-financial-year-control>.bgp-dynamics-filter:has(>.xsel-revenue-cfo){grid-template-columns:auto minmax(0,1fr);align-items:center} #bgp-sales .bi-financial-year-control>.bgp-dynamics-filter>.xsel-revenue-cfo{grid-column:2;grid-row:1} #bgp-sales .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bgp-seller-row[data-entity]{grid-template-columns:minmax(0,1fr) 137px!important} #bgp-sales .bi-full-head span:first-child{display:flex;justify-content:flex-end} #bgp-sales .bi-row-stacked>.bi-compact-fact-row{grid-template-columns:44px minmax(0,1fr) auto 58px!important} } @media(max-width:640px){ #bgp-sales .bgp-charts-grid>.bgp-panel>.bgp-sellers-head>.bgp-panel-tools:not(:has(.bgp-expand))>.xsel-financial-view{grid-column:2/-1!important} } @media(max-width:375px){ #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{font-size:13px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]{font-size:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]::before{font-size:13px} } @media(max-width:359px){ #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{font-size:12px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]{font-size:0} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2[data-short]::before{font-size:12px} } @media(max-width:340px){ #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){grid-template-columns:minmax(0,1fr) 104px 30px 30px;column-gap:3px;padding-inline:8px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel .xsel-t{padding:0 4px;gap:2px;font-size:11px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.bgp-replay,.bgp-expand){width:30px;height:30px} } /* ------------------------------------------------------------ 8. The receivables */ /* the rule .bi-debt button{min-height:38px} must not reach the chart: the tiles, the group names, the square buttons */ #bgp-sales .bi-debt :is(.bi-map-project,.bi-map-group-name,.bi-map-legend button,.bgp-expand,.bgp-replay){min-height:0} #bgp-sales .bi-map-group-link{display:block;max-width:100%;box-sizing:border-box} /* the value column of «Полный»: both lines at the right edge, no empty cell of a label */ #bgp-sales .bi-debt-sellers .bgp-seller-values .bgp-value-row{display:block;text-align:right} #bgp-sales .bi-debt-sellers .bgp-seller-values .bgp-amount{display:block;text-align:right;width:auto;white-space:nowrap} #bgp-sales .bi-debt-sellers[data-row-view=full] .bgp-seller-row{grid-template-columns:minmax(0,1fr) auto} @media(min-width:768px){#bgp-sales .bi-native-viewer .bi-debt-sellers[data-row-view=full] .bgp-seller-row{grid-template-columns:235px minmax(0,1fr) auto}} /* the compact rows: the names are readable, two CFOs do not read the same */ #bgp-sales .bi-debt-sellers[data-row-view=compact] .bi-seller-display-name{white-space:normal;overflow:visible;text-overflow:clip;flex:0 1 auto;min-width:0;max-width:none;width:auto} #bgp-sales .bi-debt-sellers .bi-compact-completion>.bgp-progress-kind{font-size:10px;color:var(--secondary)} @media(min-width:769px){#bgp-sales .bi-debt-sellers[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,clamp(180px,26%,340px)) minmax(0,1fr)}} @media(max-width:768px){ #bgp-sales .bi-debt-sellers[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,1fr);row-gap:2px} #bgp-sales .bi-debt-sellers[data-row-view=compact] .bgp-seller-row>.bgp-seller-info{grid-column:1;grid-row:1;width:auto;max-width:none} #bgp-sales .bi-debt-sellers[data-row-view=compact] .bgp-seller-row>.bi-compact-fact-row{grid-column:1;grid-row:2;min-width:0} #bgp-sales .bi-debt-sellers[data-row-view=compact] .bi-compact-completion>.bgp-progress-kind{display:none} } @media(max-width:1099px) and (min-width:641px){#bgp-sales .bi-debt-sellers .bgp-sellers-head>[data-map-header-total]{margin-right:44px}} /* the filters never run into each other */ #bgp-sales .bi-debt .bd-filter .xsel{width:100%;min-width:0;max-width:none} #bgp-sales .bi-debt .bd-filter .xsel-t{width:100%;min-width:0} @media(max-width:1100px) and (min-width:641px){#bgp-sales .bi-debt .bd-filters{grid-template-columns:repeat(3,minmax(0,1fr))}} /* a long project name must not press the card's head to nothing */ #bgp-sales .bi-debt .bd-head{flex-wrap:wrap} #bgp-sales .bi-debt .bd-head>div:first-child{flex:1 1 420px;min-width:0} #bgp-sales .bi-debt .bd-head-meta{flex:1 1 360px} @media(max-width:767px){#bgp-sales .bi-debt .bd-refresh{gap:0;justify-content:center;width:40px;height:40px;min-height:0;padding:0!important}} /* the phone, the page */ @media(max-width:640px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-financial-view{grid-column:2/4!important} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-pie-group{grid-column:1!important} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bi-map-header-total{grid-column:2/-1;grid-row:2;justify-self:end;margin:0;font-size:13px;line-height:32px} #bgp-sales .bi-debt-dynamics>.bgp-legend,#bgp-sales .bi-debt-dynamics .bi-debt-note,#bgp-sales .bi-debt-dynamics .bgp-panel-tools>.bgp-replay{display:none} #bgp-sales .bi-debt-sellers .bi-map-legend{max-height:none;overflow:visible} #bgp-sales .bi-debt .bd-financial-dashboard .bgp-seller-list[data-financial-view=treemap] .bi-map-stage{flex:none;height:460px} #bgp-sales .bi-debt .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{line-height:20px;margin:0} } /* the phone, the whole screen: the title and two pickers on the line of the close; the legend and the total under them */ @media(max-width:768px),(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head{grid-template-columns:auto minmax(0,1fr) minmax(0,1.1fr);min-height:0} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-pie-group{grid-column:2!important;grid-row:1;width:100%!important;margin:0} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-financial-view{grid-column:3!important} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools:not(:has(.xsel-pie-group))>.xsel-financial-view{grid-column:3!important} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bi-map-header-total{grid-column:1/-1;grid-row:2;justify-self:end;margin:0 -40px 0 0;font-size:13px;line-height:20px;text-align:right} #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-toolbar{margin-top:-24px;padding:0 10px 4px;min-height:20px;border:0} #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-toolbar .bgp-subtitle{display:none} #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-legend{padding:0;min-height:20px;width:auto;margin:0;align-items:center} #bgp-sales .bi-native-viewer .bi-debt-sellers .bi-map-legend,#bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-footer{display:none} #bgp-sales .bi-native-viewer .bi-debt-sellers .bi-financial-pie{height:auto;overflow:visible} #bgp-sales .bi-native-viewer .bi-debt-sellers[data-row-view=compact] .bgp-seller-row{padding-inline:10px} #bgp-sales .bi-native-viewer .bi-debt-dynamics>.bgp-legend,#bgp-sales .bi-native-viewer .bi-debt-dynamics .bgp-panel-tools>.bgp-replay{display:none} } /* ------------------------------------------------------------ 9. The advances */ #bgp-sales .bi-adv-charts .bi-compact-completion>.bgp-progress-kind{display:none} #bgp-sales .bi-adv-charts .bgp-sellers-panel:not([data-row-view=compact]) .bgp-seller-values .bgp-value-row{display:block;height:auto;text-align:right} #bgp-sales .bi-adv-charts .bgp-sellers-panel:not([data-row-view=compact]) .bgp-seller-values .bgp-amount{display:block;min-width:0;text-align:right;white-space:nowrap} #bgp-sales .bi-pie-tooltip .bi-financial-details+.bi-financial-details{margin-left:8px} @media(min-width:1100px){ #bgp-sales .bi-adv-charts .bgp-sellers-panel[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,260px) minmax(0,1fr)} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv{display:grid;grid-template-columns:auto minmax(220px,420px) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:12px;row-gap:8px} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv>.bi-adv-head{grid-column:1;grid-row:1;align-self:center} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv>.bi-adv-tools{grid-column:2;grid-row:1;align-self:center} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv .bi-adv-search>span{display:none} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv>.bi-adv-gridhead{grid-column:3;grid-row:1;align-self:center} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv>.bi-adv-scroll{grid-column:1/-1;grid-row:2} } @media(max-width:640px){ #bgp-sales .bi-adv-head{display:none} #bgp-sales .bi-adv-search>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} #bgp-sales .bi-adv-charts :is(.bgp-seller-toolbar,.bgp-seller-footer,.bgp-bar-label,.bgp-mobile-bar-label){display:none} #bgp-sales #sales-view>.bi-adv>.bgp-charts-grid>.bgp-sellers-panel{height:auto;max-height:480px} #bgp-sales #sales-view>.bi-adv>.bgp-charts-grid>.bgp-sellers-panel:has(.bgp-seller-list[data-financial-view=pie]){max-height:none} #bgp-sales .bi-adv-charts .bgp-seller-list[data-financial-view=pie]{flex:none;overflow:visible} #bgp-sales .bi-adv-charts .bgp-sellers-panel[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,150px) minmax(0,1fr);padding-inline:10px} #bgp-sales .bi-adv-charts .bgp-sellers-panel[data-row-view=compact] .bi-seller-display-name{white-space:normal;line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden} #bgp-sales .bi-adv-charts .bgp-sellers-panel:not([data-row-view=compact]) .bgp-seller-row{grid-template-columns:minmax(0,1fr) 84px;padding-inline:10px} #bgp-sales .bi-adv-charts .bgp-sellers-panel:not([data-row-view=compact]) .bgp-seller-row .bgp-bars:not(:has(>.bi-row-photo)){padding-left:0} #bgp-sales .bi-adv-gridhead{flex-wrap:nowrap} #bgp-sales .bi-adv-groupbar{border:0;padding:0;min-height:0;flex:1 1 0} } @media(max-width:400px){ #bgp-sales .bi-group-table .bi-financial-details{font-size:0;width:36px;padding:0} #bgp-sales .bi-group-table .bi-financial-details::after{content:'↓';font-size:14px} } #bgp-sales .bgp-catalog[data-tile-size=compact] .bgp-report-favorite{top:5.5px} /* ------------------------------------------------------------ 10. «Клиенты в динамике» */ #bgp-sales .bi-mk-state:empty{display:none} #bgp-sales .bi-mk-measures{padding:2px} #bgp-sales .bi-mk-segments-title{align-self:flex-end;line-height:38px} #bgp-sales .bi-mk-year .bi-mk-fold{position:sticky;left:calc(var(--mk-name) + 1px)} @media(min-width:1100px){#bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-segments{display:grid;grid-template-columns:auto repeat(10,minmax(0,1fr))}#bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-segments .bi-mk-field .xsel{width:100%}} @media(max-width:700px){ /* the head and the totals keep the columns of the body */ #bgp-sales .bi-mk-grid .bi-mk-spark-col,#bgp-sales .bi-mk-grid .bi-mk-trend-col{right:auto} #bgp-sales .bi-mk-grid thead .bi-mk-name,#bgp-sales .bi-mk-grid tfoot .bi-mk-name{z-index:6} #bgp-sales .bi-mk-grid thead .bi-mk-name button{white-space:normal;line-height:1.25} #bgp-sales .bi-mk{--mk-col:76px;padding-top:12px} #bgp-sales .bi-mk-count,#bgp-sales .bi-mk-spark-col{display:none} /* nothing explanatory above the table */ #bgp-sales .bi-mk-head .bgp-eyebrow,#bgp-sales .bi-mk-sub,#bgp-sales .bi-mk-period,#bgp-sales .bi-mk-note,#bgp-sales [data-mk-years],#bgp-sales .bi-mk-columns{display:none} /* the filters: two columns, the same width */ #bgp-sales .bi-mk-segments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} #bgp-sales .bi-mk-segments-title{grid-column:1/-1;line-height:1.4} #bgp-sales .bi-mk-segments .bi-mk-field .xsel{width:100%} #bgp-sales .bi-mk-years{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)} #bgp-sales .bi-mk-years .xsel{width:100%} #bgp-sales .bi-mk-kpis{grid-template-columns:repeat(6,minmax(0,1fr))} #bgp-sales .bi-mk-kpi{grid-column:span 2} #bgp-sales .bi-mk-kpi:nth-child(-n+2){grid-column:span 3} /* the table on the whole screen, as a chart */ #bgp-sales .bi-mk [data-mk-full]{display:inline-block} #bgp-sales .bi-mk.bi-gt-fullscreen.bi-gt-fullscreen{padding:calc(6px + var(--bi-banner-height,0px)) 0 0;gap:6px} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-filters,#bgp-sales .bi-mk.bi-gt-fullscreen .bi-mk-state{display:none} #bgp-sales .bi-mk.bi-gt-fullscreen .bi-mk-actions>:not([data-mk-full]){display:none} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-tools{padding:0 8px} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-scroll{border-width:1px 0 0;border-radius:0} #bgp-sales .bi-mk-search input,#bgp-sales .bi-mp-search input,#bgp-sales .bi-ec-search input{font-size:16px} } @media(hover:none){#bgp-sales .bi-mk-card{opacity:1}} /* ------------------------------------------------------------ 11. The cards of a project, a client, a group and a CFO */ #bgp-sales .bi-ec-grid .bi-gt-filter .bi-gt-funnel{display:inline-grid;place-items:center;text-align:center} #bgp-sales .bi-ec-kpis>div{align-content:start;grid-template-rows:minmax(2.7em,auto) auto auto} #bgp-sales .bi-ec-tools .bi-gt-button,#bgp-sales .bi-ec-excel>button{font-size:13px} #bgp-sales .bi-gt-fullscreen .bi-ec-people{display:none} #bgp-sales .bi-gt-cell{min-width:96px} #bgp-sales .bi-ec-kpis>div:only-child{grid-column:1/-1} @media(max-width:700px){ #bgp-sales .bi-ec-charts .bgp-subtitle,#bgp-sales .bi-ec-charts .bi-map-note,#bgp-sales .bi-ec-person-meta{display:none} #bgp-sales .bi-ec .xsel-ec-map{width:100%} #bgp-sales .bi-ec-search,#bgp-sales .bi-ec-search input,#bgp-sales .bi-ec-view select{width:100%} #bgp-sales .bi-cfo-kpis>[data-tip=debt],#bgp-sales .bi-cfo-kpis>[data-tip=margin]{grid-column:auto} #bgp-sales .bi-cfo-kpis>div:last-child:nth-child(odd){grid-column:1/-1} } /* ------------------------------------------------------------ 12. «Мои проекты» and «Мои проекты LEAD» */ #bgp-sales .bi-mp-scroll{min-height:0} #bgp-sales .bi-mp-excel [data-excel-export]{height:32px;min-height:0;padding:0 12px} #bgp-sales .bi-mp-excel:empty{display:none} @media(max-width:1099px){#bgp-sales .bi-mp{padding:4px 16px 24px}} @media(max-width:767px){ #bgp-sales .bi-mp-head .bgp-eyebrow,#bgp-sales .bi-mp-sub,#bgp-sales .bi-mp-notes{display:none} #bgp-sales .bi-mp-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} #bgp-sales .bi-mp-search{grid-column:1/-1;max-width:none} #bgp-sales .bi-mp-field .xsel{width:100%} } @media(max-width:640px){ #bgp-sales .bi-lead-report{padding:10px 14px 24px} #bgp-sales .bi-lead-report h1{font-size:20px;line-height:26px;margin:0 0 8px} #bgp-sales .bi-lead-report>p:first-of-type,#bgp-sales .bi-lead-report [data-lead-refresh]{display:none} #bgp-sales .bi-lead-report .bi-lead-search input{height:38px;min-height:38px;margin-top:4px;font-size:16px} #bgp-sales .bi-lead-report [data-lead-state]{margin:8px 0;font-size:12px;color:var(--secondary)} #bgp-sales .bi-lead-report .bi-negative-scroll{max-height:none;overflow:visible} #bgp-sales .bi-lead-report table{min-width:0;display:block} #bgp-sales .bi-lead-report thead{display:none} #bgp-sales .bi-lead-report tbody{display:block} #bgp-sales .bi-lead-report tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:8px 0;border-bottom:1px solid var(--line)} #bgp-sales .bi-lead-report td{display:block;padding:0;border:0;font-size:12px;color:var(--secondary)} #bgp-sales .bi-lead-report td:nth-child(1){grid-column:1/-1;font-size:14px;color:var(--text)} #bgp-sales .bi-lead-report td:nth-child(2),#bgp-sales .bi-lead-report td:nth-child(5){display:none} } @media(min-width:641px){ #bgp-sales .bi-lead-report{display:grid;grid-template-columns:minmax(0,420px) auto minmax(0,1fr);align-items:end;column-gap:8px;padding-inline:24px} #bgp-sales .bi-lead-report>h1,#bgp-sales .bi-lead-report>p,#bgp-sales .bi-lead-report>.bi-negative-scroll{grid-column:1/-1} #bgp-sales .bi-lead-report th button{min-height:0;padding:0;border:0;background:none;font:inherit;font-weight:600} } /* ------------------------------------------------------------ 13. «События» */ @media(max-width:767px){ #bgp-sales .bi-partner-events{padding:10px 14px 24px} #bgp-sales .bi-partner-events-heading .eyebrow,#bgp-sales .bi-partner-events-heading .field-note,#bgp-sales .bi-partner-events-footnote{display:none} #bgp-sales .bi-partner-events-heading{margin-bottom:8px;gap:8px} #bgp-sales .bi-partner-events-heading h1{font-size:20px;line-height:26px;margin:0} #bgp-sales .bi-partner-events-total{font-size:20px;padding-left:10px} #bgp-sales .bi-partner-events-type>.bi-partner-event-caption{display:none} #bgp-sales .bi-partner-events-controls{margin-bottom:0} #bgp-sales .bi-partner-events-controls>button{display:none} #bgp-sales .bi-partner-events-type{max-width:none} #bgp-sales .bi-partner-events-notice:empty{display:none} #bgp-sales .bi-partner-events-list{margin-top:10px} #bgp-sales .bi-partner-event{padding:12px 0 12px 16px;gap:8px} #bgp-sales .bi-partner-event:before{top:19px} #bgp-sales .bi-partner-event-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 10px;align-items:center} #bgp-sales .bi-partner-event-amount{grid-column:1;grid-row:1} #bgp-sales .bi-partner-event-meta time{grid-column:1;grid-row:2} #bgp-sales .bi-partner-event-meta button{grid-column:2;grid-row:1/3} } /* ------------------------------------------------------------ 14. The window of details, «Выручка по клиентам», the report of the journal: the tree on the first screen */ #bgp-sales .bi-detail-controls{align-items:end} #bgp-sales .bi-detail-field input{height:38px;min-height:38px;box-sizing:border-box} #bgp-sales .bi-detail-heading>span:empty{display:none} @media(max-width:700px){ #bgp-sales .bi-saved-presets,#bgp-sales .bi-detail-grouping-fields,#bgp-sales .bi-detail-grouping-note,#bgp-sales .bi-detail-debug-control,#bgp-sales .bi-detail-note,#bgp-sales .bi-ledger-measures{display:none!important} #bgp-sales .bi-detail-controls{margin-bottom:8px} #bgp-sales .bi-detail-field .xsel-t{height:34px;min-height:34px;font-size:13px} #bgp-sales .bi-detail-field input{height:34px;min-height:34px;font-size:16px} #bgp-sales .bi-detail-preset,#bgp-sales .bi-detail-preset .xsel{width:100%} } /* ------------------------------------------------------------ 15. The second pass: what the check of every screen found. The sections no longer rise on a change of view: the line stands still */ #bgp-sales .bi-native-viewer section.bgp-panel,#bgp-sales .bgp-charts-grid>section.bgp-panel,#bgp-sales section.bgp-kpis{animation:none} /* the pickers of a page: one width in every view, the labels whole */ @media(min-width:641px){ #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel-dynamics-view .xsel-t{min-width:164px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools .xsel-financial-view .xsel-t{min-width:142px} #bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bi-seller-total-row .bgp-seller-name{padding-left:40px} #bgp-sales .bgp-sellers-panel[data-kind="revenue"][data-row-view="compact"] .bi-seller-total-row .bgp-seller-name{padding-left:0} #bgp-sales .bgp-sellers-panel:not(.bi-debt-sellers)[data-row-view="compact"] .bgp-seller-row{grid-template-columns:minmax(0,clamp(150px,20%,240px)) minmax(0,1fr)} } @media(max-width:640px){#bgp-sales .bgp-sellers-panel:not(.bi-debt-sellers)[data-row-view="compact"] .bgp-seller-row{grid-template-columns:minmax(0,118px) minmax(0,1fr)}} @media(min-width:641px) and (max-width:767px),(min-width:1100px) and (max-width:1429px){ #bgp-sales .bgp-charts-grid>.bgp-sellers-panel:has(.xsel-map-group,.xsel-pie-group)>.bgp-sellers-head h2[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel:has(.xsel-map-group,.xsel-pie-group)>.bgp-sellers-head h2[data-short]::before{content:attr(data-short);content:attr(data-short) / "";min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:16px} } @media(min-width:1100px) and (max-width:1439px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools :is(.xsel-map-group,.xsel-pie-group) .xsel-t{max-width:140px}} @media(min-width:1440px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .xsel-map-group .xsel-t{width:100%;max-width:none}} @media(min-width:1100px) and (max-width:1279px){ #bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .xsel-financial-view .xsel-t{min-width:119px} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools :is(.xsel-map-group,.xsel-pie-group) .xsel-t{max-width:116px} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .lbl[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .lbl[data-short]::before{content:attr(data-short);font-size:13px} /* the footer on one line */ #bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-seller-footer{flex-wrap:nowrap;gap:8px} #bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-seller-footer>span:first-child{flex:1 1 auto;min-width:0;font-size:12px} #bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-seller-footer>button{flex:none} } @media(min-width:641px) and (max-width:1099px){ /* «Все ориджинаторы»: the names are whole */ #bgp-sales .bi-all-fact-row{grid-template-columns:minmax(150px,230px) minmax(40px,1fr) minmax(270px,1fr)} /* one left edge */ #bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-seller-toolbar{padding-inline:10px} #bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-seller-toolbar .bgp-seller-legend{padding:0} #bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-seller-footer{padding-inline:10px} #bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-seller-row,#bgp-sales .bgp-charts-grid .bgp-sellers-panel .bgp-row-head{padding-inline:10px} #bgp-sales .bgp-charts-grid .bi-financial-access-note{margin:0;padding:0 10px 6px} } /* the page has the room for the whole names of the views from 641 */ @media(min-width:641px) and (max-width:768px) and (min-height:501px){ #bgp-sales .bgp-charts-grid .xsel-t .lbl[data-short]{display:inline;font-size:inherit} #bgp-sales .bgp-charts-grid .xsel-t .lbl[data-short]::before{content:none} } @media(min-width:641px) and (max-width:768px){ #bgp-sales .bgp-seller-footer [data-all-originators]{padding:8px 12px;font-size:11px;min-height:32px;line-height:1.35} #bgp-sales .bgp-seller-toolbar>.bgp-subtitle,#bgp-sales .bgp-panel .bi-legend-info{display:none} } /* the computer: the legends of two neighbours on one line, the note of a partner on the line of the title, «Итого» of revenue in the columns of the rows, «₽» never alone */ @media(min-width:1100px){ #bgp-sales .bgp-charts-grid:not(.bi-adv-charts,.bd-financial-dashboard)>.bgp-sellers-panel>.bgp-sellers-head{min-height:60.5px} #bgp-sales .bgp-charts-grid:not(.bi-adv-charts,.bd-financial-dashboard)>.bgp-sellers-panel .bgp-seller-toolbar{padding-top:7.6px;padding-bottom:5.6px} #bgp-sales .bgp-charts-grid .bi-financial-access-note{margin:0;padding:0 18px 6px} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row{grid-template-columns:minmax(0,1fr) 180px!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row>.bgp-seller-info{grid-column:1/-1!important;grid-row:1!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row>.bgp-bars{grid-column:1!important;grid-row:2!important} #bgp-sales .bgp-charts-grid .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row>.bgp-seller-values{grid-column:2!important;grid-row:2!important} #bgp-sales .bgp-kpi-bottom>:first-child{white-space:nowrap;flex:none} } /* a low screen of a computer: the charts keep a working height, the page scrolls */ @media(min-width:1100px) and (max-height:940px){ body#bgp-sales:has(#sales-view>.bgp-content>.bgp-charts-grid){height:auto;min-height:calc(100dvh - 24px)} #bgp-sales #sales-view:has(>.bgp-content>.bgp-charts-grid){height:auto;flex:none} #bgp-sales #sales-view>.bgp-content:has(>.bgp-charts-grid){height:auto;min-height:calc(100dvh - 90px)} #bgp-sales #sales-view>.bgp-content>.bgp-charts-grid{flex:1 0 440px;min-height:440px} } /* the circle of a photo stays under the pointer; the bold «Год» does not touch the pill; the captions of the pie's left side stand beside their lines */ @media(hover:hover){#bgp-sales .bgp-seller-row:hover .bi-row-photo{background:var(--bg)}} #bgp-sales .bi-seller-total-row .bgp-progress-kind{font-weight:500} #bgp-sales .bgp-sellers-panel .bi-compact-head .bi-compact-head-label::after{font-size:10px!important} @media(min-width:768px){ #bgp-sales .bi-pie-callout.bi-pie-person[style*="left:"]{grid-template-columns:minmax(0,1fr) auto;text-align:right} #bgp-sales .bi-pie-callout.bi-pie-person[style*="left:"]>.bi-row-photo{grid-column:2;grid-row:1/span 4} #bgp-sales .bi-pie-callout.bi-pie-person[style*="left:"]>:not(.bi-row-photo){grid-column:1} } /* the window of a chart on a computer and a tablet: everything on the line of the title */ @media(min-width:1100px),(min-width:769px) and (min-height:501px){ #bgp-sales .bi-native-viewer .bgp-viewer-head{padding-inline:24px} #bgp-sales .bi-native-viewer .bgp-sellers-panel .bgp-seller-toolbar{padding-inline:24px} #bgp-sales .bi-native-viewer .bgp-sellers-panel .bgp-seller-toolbar .bgp-seller-legend{padding-inline:0} #bgp-sales .bi-native-viewer .bgp-sellers-panel .bgp-seller-row,#bgp-sales .bi-native-viewer .bgp-sellers-panel .bgp-row-head{padding-inline:24px} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row,#bgp-sales .bi-native-viewer .bgp-sellers-panel[data-row-view="full"] .bgp-row-head{padding-inline:24px!important} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-subtitle{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>.bgp-sellers-head>.bi-map-header-total{margin-right:0;max-width:none} } @media(min-width:769px) and (max-width:1099px) and (min-height:501px){ #bgp-sales .bi-native-viewer .bgp-dynamics-panel>.bgp-legend{padding-inline:24px} #bgp-sales .bi-native-viewer .bgp-dynamics-panel .source-line{margin-inline:24px!important} #bgp-sales .bi-native-viewer .bgp-dynamics-panel .bi-pivot-tools{padding:0} #bgp-sales .bi-native-viewer .bgp-dynamics-panel .bgp-plot-footer{padding-inline:24px} } @media(min-width:769px) and (max-width:900px){ #bgp-sales .bi-native-viewer .bgp-viewer-head>span,#bgp-sales .bi-native-viewer .bi-financial-year-control .bgp-dynamics-filter>span,#bgp-sales .bi-native-viewer .bi-financial-year-control>span,#bgp-sales .bi-native-viewer .bi-financial-year-control label>span:first-child{display:none} } /* revenue, «Полный», the window: the name beside the photo, over the bars */ @media(min-width:768px){ #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bgp-seller-row:has(.bgp-bars>.bi-row-photo) .bgp-seller-info{padding-left:60px} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bgp-bars>.bi-row-photo{top:calc(50% - 9px)} } /* the head of the columns of «Полный» stays over a long list */ #bgp-sales .bi-native-viewer .bgp-seller-list>.bi-full-head{position:sticky;top:0;z-index:3;background:var(--surface)} /* the phone and a phone on its side, the window */ @media(max-width:768px),(max-height:500px) and (max-width:1099px) and (orientation:landscape){ /* a notch: the reset does not go under the close, the title not under the notch; the footer, «Итого» and the months above the home line */ #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel{box-sizing:border-box;padding-inline:env(safe-area-inset-left,0px) env(safe-area-inset-right,0px)} #bgp-sales .bi-native-viewer .bgp-sellers-panel .bgp-seller-footer{padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))} #bgp-sales .bi-native-viewer .bi-pivot-scroll{margin-bottom:env(safe-area-inset-bottom,0px)} #bgp-sales .bi-native-viewer .bgp-dynamics-panel[data-dynamics-view="monthly"] .source-line{margin-bottom:env(safe-area-inset-bottom,0px)!important} /* the map takes the visible list, its legend and corrections scroll under it */ #bgp-sales .bi-native-viewer .bgp-sellers-panel:not(.bi-debt-sellers) .bgp-seller-list:has(.bi-project-map){overflow:auto;container-type:size} #bgp-sales .bi-native-viewer .bgp-sellers-panel:not(.bi-debt-sellers) .bi-project-map{height:auto;min-height:0} #bgp-sales .bi-native-viewer .bgp-sellers-panel:not(.bi-debt-sellers) .bi-project-map>.bi-map-canvas{flex:none} #bgp-sales .bi-native-viewer .bgp-sellers-panel:not(.bi-debt-sellers) .bi-project-map .bi-map-stage{flex:none;height:100cqh;min-height:200px} /* nothing explanatory, no empty footer of a partner */ #bgp-sales .bi-native-viewer .bgp-seller-toolbar>.bgp-subtitle,#bgp-sales .bi-pie-excluded .field-note{display:none} #bgp-sales .bi-native-viewer .bgp-seller-footer:not(:has(>[data-details]:not([hidden]),>[data-all-originators])){display:none} /* «Сводная» to the edges of the screen, the text on the line of the title */ #bgp-sales .bi-native-viewer .bgp-dynamics-panel[data-dynamics-view="pivot"] .source-line{margin:0!important} #bgp-sales .bi-native-viewer .bi-pivot-grid .bi-pivot-name{padding-left:10px} } @media(max-width:640px){#bgp-sales .bi-native-viewer .bgp-sellers-panel:not([data-row-view="compact"]) .bgp-bars>.bi-row-photo{top:calc(50% - 16px)}} @media(min-width:641px) and (max-width:767px){#bgp-sales .bi-native-viewer .bgp-sellers-panel:not([data-row-view="compact"]) .bgp-bars>.bi-row-photo{top:calc(50% - 7px)}} @media(min-width:641px) and (max-width:768px),(min-width:641px) and (max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row{grid-template-columns:minmax(0,1fr) 180px!important} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row>.bgp-seller-info{grid-column:1/-1!important;grid-row:1!important} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row>.bgp-bars{grid-column:1!important;grid-row:2!important} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-kind="revenue"][data-row-view="full"] .bi-seller-total-row>.bgp-seller-values{grid-column:2!important;grid-row:2!important} } /* the phone's page: the table of the window of a group fits its card, the map keeps the place while it loads */ @media(max-width:640px){ #bgp-sales .bgp-charts-grid .bi-financial-access-note{display:none} #bgp-sales .bgp-charts-grid .bgp-seller-list:has(.bi-project-map){min-height:457px} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel:has(.bi-all-fact-row)>.bgp-sellers-head>div:first-child{grid-column:1/3} #bgp-sales .bi-group-window{padding:8px} #bgp-sales .bi-group-card{width:100%;overflow-x:hidden} #bgp-sales .bi-group-card header{padding:12px 12px 10px} #bgp-sales .bi-group-body{padding:4px 8px 10px;overflow-x:auto} #bgp-sales .bi-group-table th,#bgp-sales .bi-group-table td{padding:6px 3px} #bgp-sales .bi-group-table .bi-group-name{gap:0} #bgp-sales .bi-group-table .bi-group-name .bi-row-photo{display:none} #bgp-sales .bi-group-table td:first-child{white-space:normal} #bgp-sales .bi-group-table .bgp-status{padding-inline:3px;min-width:0;width:auto} } @media(max-width:340px){ #bgp-sales .bi-group-body{padding-inline:10px} #bgp-sales .xsel-t .lbl[data-short]{min-width:0;overflow:hidden} #bgp-sales .xsel-t .lbl[data-short]::before{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px} #bgp-sales .bi-pivot-tools{gap:6px} #bgp-sales .bi-pivot-tools .bi-sales-unplanned,#bgp-sales .bi-pivot-sum{font-size:10px} } /* the bar of the app on a phone: the version under the mark, the title has the room */ @media(max-width:480px){ #bgp-sales>.top{padding-block:8px;gap:8px} #bgp-sales>.top .bi-brand-group{flex-direction:column;align-items:center;gap:2px} #bgp-sales>.top .bi-brand-group .bi-app-mark{width:30px;height:30px;font-size:19px;border-radius:8px} #bgp-sales>.top .bi-brand-group .bi-version{padding:0 4px;font-size:10px;line-height:14px} #bgp-sales>.top .bi-nav-back{margin-left:0} #bgp-sales>.top #page-title{flex:1 1 0;min-width:0;line-height:1.2;overflow-wrap:anywhere} } /* a phone on its side, the window and the page: nothing explanatory, no download, no second set of cards; the title and the filters on one line */ @media(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bgp-panel .bi-legend-info{display:none} #bgp-sales [data-excel-export],#bgp-sales [data-excel-export]+span[role="status"]{display:none!important} #bgp-sales .bgp-charts-grid :is(.bgp-forecast-note:not([data-ec-range-sum]),.bi-pie-note,.bi-map-note),#bgp-sales .bgp-charts-grid .bgp-panel :is(.bgp-subtitle,.bgp-year){display:none} #bgp-sales .bgp-charts-grid .bgp-dynamics-panel[data-dynamics-view="pivot"] .bgp-plot-footer,#bgp-sales .bgp-charts-grid .bgp-plot-footer:not(:has(.bgp-forecast-value:not(:empty))):not(.bi-ec-chart-footer){display:none} #bgp-sales .bgp-charts-grid .bgp-plot-footer{min-height:0;padding:6px 10px} #bgp-sales .bgp-footnote>:not(:nth-child(2)){display:none} #bgp-sales .bi-revenue-notice{display:none} #bgp-sales .bgp-page-head .bgp-eyebrow{display:none} #bgp-sales .bi-financial-title-row{display:flex;flex-wrap:nowrap;align-items:center;gap:10px;min-width:0} #bgp-sales .bi-financial-title-row h1{margin:0;font-size:20px;line-height:26px;flex:none} #bgp-sales .bi-financial-year-control{display:flex!important;flex:1 1 auto;min-width:0;flex-wrap:nowrap!important;align-items:center;gap:8px!important;width:auto!important} #bgp-sales .bi-financial-year-control .xsel-year{flex:none;width:84px} #bgp-sales .bi-financial-year-control>.bgp-dynamics-filter{display:flex;flex:1 1 auto;min-width:0;flex-wrap:nowrap;align-items:center;gap:6px;width:auto;margin:0;padding:0} #bgp-sales .bgp-dynamics-filter>*{grid-column:auto!important;grid-row:auto!important;margin:0} #bgp-sales .bi-financial-year-control :is(.xsel-revenue-cfo,.xsel-originator,.xsel-cfo){flex:0 1 180px;width:auto!important;min-width:90px;max-width:180px!important} #bgp-sales .bi-native-viewer .bgp-sellers-panel[data-row-view="full"] .bgp-seller-row,#bgp-sales .bi-native-viewer .bgp-sellers-panel[data-row-view="full"] .bgp-row-head{padding-inline:10px!important} } @media(max-height:500px) and (min-width:800px) and (max-width:1099px) and (orientation:landscape){#bgp-sales .bgp-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}} /* the receivables, second pass */ #bgp-sales .bi-debt-sellers:has(.xsel-pie-group [data-value="cfo"][aria-selected="true"]) .bgp-legend-item:has(.other){display:none} #bgp-sales .bi-debt .bd-rel-label{flex:none;white-space:nowrap} #bgp-sales .bi-debt-sellers .bgp-seller-toolbar{align-items:center} #bgp-sales .bi-debt-sellers .bgp-seller-toolbar>.bgp-subtitle{margin:0;padding:0} @media(max-width:1100px){ #bgp-sales .bi-debt .bd-head>div:first-child{flex:1 1 0} #bgp-sales .bi-debt .bd-head-meta{flex:1 1 100%} } @media(min-width:641px) and (max-width:1099px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools .xsel-pie-group{flex:none;width:160px!important;min-width:0} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools .xsel-financial-view{flex:none;width:146px!important;min-width:0} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bi-map-header-total{margin:0} } @media(min-width:641px) and (max-width:860px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head h2[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head h2[data-short]::before{content:attr(data-short);content:attr(data-short) / "";font-size:16px} } @media(min-width:1100px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools .xsel-financial-view .xsel-t{min-width:120px} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools .xsel-pie-group .xsel-t{min-width:94px} #bgp-sales .bi-debt .bgp-charts-grid>.bi-debt-dynamics>.bgp-legend{padding-top:0} } @media(min-width:1401px){#bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools .xsel-pie-group .xsel-t{min-width:156px}} @media(min-width:1100px) and (max-width:1700px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head h2[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head h2[data-short]::before{content:attr(data-short);content:attr(data-short) / "";font-size:16px} } @media(min-width:1100px) and (max-width:1400px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers .xsel-t .lbl[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid>.bi-debt-sellers .xsel-t .lbl[data-short]::before{content:attr(data-short);font-size:13px} } @media(min-width:1100px) and (max-width:1279px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head h2[data-short]::before{font-size:14px} #bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bi-map-header-total{font-size:14px} } @media(max-width:640px){ /* the panel of the dynamics has no view picker: its title takes the free columns */ #bgp-sales .bgp-charts-grid>.bi-debt-dynamics>.bgp-panel-head{grid-template-columns:minmax(0,1fr) 32px} #bgp-sales .bgp-charts-grid>.bi-debt-dynamics>.bgp-panel-head>.bgp-panel-tools>.bgp-expand{grid-column:2} #bgp-sales .bgp-charts-grid>.bi-debt-sellers .bgp-seller-row{padding-inline:10px} #bgp-sales .bgp-charts-grid>.bi-debt-sellers .bi-map-legend{padding-inline:10px} } @media(max-width:767px){ #bgp-sales .bi-debt .bd-eyebrow{display:none} #bgp-sales .bi-debt h1{font-size:20px;line-height:26px;margin:0} #bgp-sales .bi-debt .bd-head{margin-bottom:10px} #bgp-sales .bi-debt .bd-tabs{margin-bottom:10px} } @media(max-width:768px){ #bgp-sales .bi-debt-sellers[data-row-view=compact] .bi-seller-display-name{line-height:14px} #bgp-sales .bi-native-viewer .bi-debt-sellers[data-row-view=full] .bgp-seller-row{padding-inline:10px} } @media(max-width:768px),(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-list[data-financial-view=treemap]{display:flex;flex-direction:column;overflow:hidden} #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-list[data-financial-view=treemap]>div{flex:1 1 auto;display:flex;flex-direction:column;min-height:0} #bgp-sales .bi-native-viewer .bi-debt-sellers .bi-map-stage{flex:1 1 auto;height:auto;min-height:0;margin:0} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-dynamics>.bgp-panel-head{grid-template-columns:minmax(0,1fr)} } @media(max-width:340px){#bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-financial-view .xsel-t{padding:0 4px;gap:2px;font-size:11px}} @media(max-height:500px) and (max-width:1099px) and (min-width:769px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head{grid-template-columns:auto minmax(0,1fr) auto 170px 170px} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-pie-group{grid-column:4!important} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-financial-view{grid-column:5!important} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools:not(:has(.xsel-pie-group))>.xsel-financial-view{grid-column:5!important} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bi-map-header-total{grid-column:3;grid-row:1;margin:0;max-width:none;line-height:34px} #bgp-sales .bi-native-viewer .bi-debt-sellers .bgp-seller-toolbar{margin-top:-31px;padding:0 0 12px 94px;min-height:0;pointer-events:none;width:max-content} } /* the advances, second pass */ @media(max-width:640px){ #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-dynamics-panel>.bgp-panel-head{grid-template-columns:minmax(0,1fr)} #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-sellers-panel>.bgp-sellers-head{grid-template-columns:minmax(0,1fr) 52px 52px} #bgp-sales .bi-adv{padding-top:12px} #bgp-sales .bi-adv-gridhead{align-items:flex-start} #bgp-sales .bi-adv-groupbar{background:none} #bgp-sales .bi-adv-charts .bgp-sellers-panel[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,150px) minmax(0,1fr)} } @media(min-width:641px) and (max-width:1099px){ #bgp-sales .bi-adv{padding:12px 16px 24px} #bgp-sales .bi-adv-charts .bgp-sellers-panel[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,260px) minmax(0,1fr)} #bgp-sales #sales-view>.bi-adv>.bgp-charts-grid>.bgp-sellers-panel:not(:has(.bgp-seller-list[data-financial-view=pie])){height:auto;max-height:520px} } @media(min-width:701px) and (max-width:1099px){#bgp-sales .bi-adv-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(min-width:1100px){ #bgp-sales .bi-adv-charts .bgp-sellers-panel[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,clamp(170px,38%,260px)) minmax(0,1fr)} #bgp-sales .bi-adv-charts>.bgp-dynamics-panel>.bgp-legend{padding-top:0;min-height:0} #bgp-sales .bi-adv-charts>.bgp-sellers-panel>.bgp-seller-toolbar .bgp-seller-legend{min-height:0;padding-block:0} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv:has(>.bi-adv-filter:not([hidden])){grid-template-rows:auto auto minmax(0,1fr)} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv>.bi-adv-filter:not([hidden]){grid-column:1/-1;grid-row:2;min-width:0;margin:0} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv:has(>.bi-adv-filter:not([hidden]))>.bi-adv-scroll{grid-row:3} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv>.bi-adv-tools{flex-wrap:nowrap;align-items:center} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv .bi-adv-search{flex:1 1 auto;width:auto;min-width:0} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv .bi-adv-mine{flex:none;white-space:nowrap} } @media(min-width:1100px) and (max-width:1279px){ #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) h2{font-size:14px} #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-panel-tools .xsel-t{padding:0 6px;gap:4px;font-size:12px} #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .bgp-panel-tools .xsel-financial-view .xsel-t{min-width:108px} } @media(min-width:1100px) and (max-width:1365px){ #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv .bi-adv-group-hint{display:none} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv>.bi-adv-gridhead{flex-wrap:nowrap} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv .bi-adv-groupbar{flex:1 1 0;min-width:0} } /* «Клиенты в динамике», second pass */ #bgp-sales .bi-mk-year.is-collapsed .bi-mk-fold{position:static} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-more{align-self:center} @media(min-width:1100px){ #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-segments{grid-template-columns:auto repeat(10,minmax(min-content,1fr))} #bgp-sales .bi-mk.bi-gt-fullscreen .bi-mk-search{flex:1 1 180px} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-segments .bi-mk-segments-empty{grid-column:4/-1;align-self:end;line-height:38px} } @media(min-width:1392px){ #bgp-sales .bi-mk>.bi-mk-segments{display:grid;grid-template-columns:auto repeat(10,minmax(min-content,1fr))} #bgp-sales .bi-mk>.bi-mk-segments .bi-mk-field .xsel{width:100%} } @media(max-width:900px){#bgp-sales .bi-mk-grid thead .bi-mk-name button{white-space:normal;line-height:1.25}} @media(min-width:701px) and (max-width:1099px){#bgp-sales .bi-mk{padding-top:12px}} @media(min-width:701px) and (max-width:921px){ #bgp-sales .bi-mk-kpis{grid-template-columns:repeat(6,minmax(0,1fr))} #bgp-sales .bi-mk-kpi{grid-column:span 2} #bgp-sales .bi-mk-kpi:nth-child(-n+2){grid-column:span 3} #bgp-sales .bi-mk-segments{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))} #bgp-sales .bi-mk-segments-title{grid-column:1/-1;line-height:1.4} #bgp-sales .bi-mk-segments .bi-mk-field .xsel{width:100%} } @media(max-width:700px){ #bgp-sales .bi-mk.bi-gt-fullscreen.bi-gt-fullscreen{padding:calc(6px + max(var(--bi-banner-height,0px),env(safe-area-inset-top,0px))) 0 env(safe-area-inset-bottom,0px)} #bgp-sales .bi-mk-segments-empty{display:none} /* the ten lists are closed until asked for; an active filter keeps them open */ #bgp-sales .bi-mk-segments:not(.is-open)>.bi-mk-field{display:none} #bgp-sales .bi-mk-segments-title{cursor:pointer} #bgp-sales .bi-mk-segments-title::after{content:' ▾'} #bgp-sales .bi-mk-segments.is-open .bi-mk-segments-title::after{content:' ▴'} } @media(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-mk.bi-gt-fullscreen.bi-gt-fullscreen{padding:calc(6px + var(--bi-banner-height,0px)) 0 0;gap:6px} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-filters,#bgp-sales .bi-mk.bi-gt-fullscreen .bi-mk-state{display:none} #bgp-sales .bi-mk.bi-gt-fullscreen .bi-mk-actions>:not([data-mk-full]){display:none} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-tools{padding:0 8px} #bgp-sales .bi-mk.bi-gt-fullscreen>.bi-mk-scroll{border-width:1px 0 0;border-radius:0} } /* the cards, second pass */ #bgp-sales .bi-ec-scroll{min-height:0} #bgp-sales .bi-ec-tools .bi-ec-excel>button{height:32px;min-height:0;padding:0 12px} #bgp-sales .bi-cfo-tools .bi-ec-excel>button{height:38px;min-height:0;padding:0 12px} @media(min-width:641px){ #bgp-sales .bi-ec .bi-ec-charts>.bi-ec-map-panel>.bgp-sellers-head>.bgp-panel-tools .xsel-ec-map{flex:none;width:220px!important} #bgp-sales .bi-ec .bi-ec-charts>.bi-ec-map-panel>.bgp-sellers-head>.bgp-panel-tools .xsel-ec-map .xsel-t{width:100%;max-width:none} } @media(max-width:1099px){ #bgp-sales .bi-ec .bi-ec-charts>.bi-ec-map-panel{height:auto} #bgp-sales .bi-ec .bi-ec-charts>.bi-ec-map-panel>.bgp-seller-list{flex:none;overflow:visible} } @media(max-width:640px){ #bgp-sales .bi-ec .bi-ec-chart-footer{display:flex;flex-direction:column;align-items:stretch;gap:6px;min-width:0;padding:6px 10px} #bgp-sales .bi-ec .bi-ec-range{flex:1 1 auto;min-width:0;width:100%} #bgp-sales .bi-ec .bi-ec-range .xsel{flex:1 1 auto;width:auto;min-width:0} #bgp-sales .bi-ec .bi-ec-range .xsel-t{width:100%;min-width:0;height:32px;min-height:32px;padding:0 8px;font-size:12px} #bgp-sales .bi-ec .bi-ec-charts>.bgp-panel>.bgp-panel-head{padding:8px 10px} #bgp-sales .bi-ec .bi-ec-charts>.bi-ec-map-panel>.bgp-sellers-head{grid-template-columns:auto minmax(0,1fr)} #bgp-sales .bi-ec .bi-ec-charts>.bi-ec-map-panel>.bgp-sellers-head .xsel-ec-map{grid-column:2;grid-row:1;width:100%;min-width:0} #bgp-sales .bi-ec .bi-ec-charts>.bi-ec-map-panel>.bgp-seller-list{padding:4px 10px 8px} #bgp-sales .bi-ec .bi-ec-charts:not(.bi-ec-charts-single) .bi-ec-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 8px;padding:6px 10px 2px} } @media(max-width:700px){ #bgp-sales .bi-ec>.bi-ec-note:not([role=status]),#bgp-sales .bi-ec-note[data-ec-state],#bgp-sales .bi-cfo-hint{display:none} /* the grid opens on the sums */ #bgp-sales .bi-ec-grid thead tr:first-child th button{white-space:normal;line-height:1.2;padding:4px 6px} #bgp-sales .bi-ec-grid thead tr:first-child th{vertical-align:bottom} #bgp-sales .bi-ec-grid td{padding-inline:6px} #bgp-sales .bi-ec-grid td:not(.num){white-space:normal;max-width:none;line-height:1.25} #bgp-sales .bi-ec-grid tfoot td:not(.num){white-space:nowrap} #bgp-sales .bi-ec-grid tr:has(>td:nth-child(4)) td:nth-child(2):not(.num){min-width:calc(100vw - 240px)} #bgp-sales .bi-ec-grid tr.bi-ec-group td:first-child{white-space:normal} #bgp-sales .bi-ec-tabs{flex-wrap:wrap} #bgp-sales .bi-ec-tabs button{flex:none;white-space:nowrap} #bgp-sales .bi-ec-tools{column-gap:8px} #bgp-sales .bi-ec-view{flex:1 1 0;min-width:0} #bgp-sales .bi-ec-viewlabel{width:100%} #bgp-sales .bi-ec-view select{flex:1 1 auto;min-width:0} #bgp-sales .bi-ec-tools .bi-ec-excel{display:none} /* the grid on the whole screen, as a chart */ #bgp-sales .bi-ec-gt{display:inline-flex;flex:none} #bgp-sales .bi-ec-gt [data-gt-chooser],#bgp-sales .bi-ec-gt [data-gt-reset]{display:none} #bgp-sales .bi-ec-gt .bi-gt-full-button{display:inline-block} #bgp-sales .bi-ec.bi-gt-fullscreen.bi-gt-fullscreen{padding:calc(6px + var(--bi-banner-height,0px)) 0 0;gap:6px} #bgp-sales .bi-gt-fullscreen .bi-ec-head,#bgp-sales .bi-gt-fullscreen .bi-ec-search,#bgp-sales .bi-gt-fullscreen .bi-ec-view{display:none} #bgp-sales .bi-gt-fullscreen .bi-ec-tools{padding:0 8px;flex-wrap:nowrap;justify-content:space-between} #bgp-sales .bi-gt-fullscreen .bi-ec-tabs{flex-wrap:nowrap;overflow-x:auto;min-width:0} #bgp-sales .bi-gt-fullscreen .bi-ec-tabs button{padding:0 8px;font-size:12px} #bgp-sales .bi-gt-fullscreen .bi-gt-full-button{flex:none;padding:0 10px;font-size:12px} #bgp-sales .bi-gt-fullscreen .bi-ec-scroll{border-width:1px 0 0;border-radius:0} } @media(max-width:400px){#bgp-sales .bi-ec-kpis strong{font-size:clamp(13px,3.9vw,16px)}} @media(min-width:701px) and (max-width:937px){ #bgp-sales .bi-ec-kpis:not(.bi-cfo-kpis):has(>:nth-child(5):last-child){grid-template-columns:repeat(3,minmax(0,1fr))} #bgp-sales .bi-ec-kpis:not(.bi-cfo-kpis)>:nth-child(5):last-child{grid-column:span 2} } @media(min-width:701px) and (max-width:1181px){#bgp-sales .bi-ec-kpis:not(.bi-cfo-kpis):has(>:nth-child(6)){grid-template-columns:repeat(3,minmax(0,1fr))}} @media(min-width:760px) and (max-width:837px){#bgp-sales .bi-cfo .bi-cfo-kpis:has(>:nth-child(4):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}} @media(min-width:638px) and (max-width:759px){#bgp-sales .bi-cfo .bi-cfo-kpis:has(>:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}} @media(min-width:638px) and (max-width:1101px){ #bgp-sales .bi-cfo .bi-cfo-kpis:has(>:nth-child(5):last-child){grid-template-columns:repeat(3,minmax(0,1fr))} #bgp-sales .bi-cfo .bi-cfo-kpis>:nth-child(5):last-child{grid-column:span 2} } @media(min-width:638px) and (max-width:1301px){#bgp-sales .bi-cfo .bi-cfo-kpis:has(>:nth-child(6)){grid-template-columns:repeat(3,minmax(0,1fr))}} /* «Мои проекты» and LEAD, second pass */ @media(max-width:767px){ #bgp-sales .bi-mp-notes:has(.is-error){display:grid} #bgp-sales .bi-mp-note:not(.is-error){display:none} #bgp-sales .bi-mp-grid td[data-col=name]{white-space:normal;max-width:none;overflow-wrap:anywhere;line-height:1.25} #bgp-sales .bi-mp-grid thead tr:first-child th button{white-space:normal;line-height:1.2} #bgp-sales .bi-mp-grid thead tr:first-child th{vertical-align:bottom} #bgp-sales .bi-mp-grid td{padding-inline:6px} #bgp-sales [data-mp-columns]{display:inline-flex} #bgp-sales [data-mp-columns] [data-gt-chooser],#bgp-sales [data-mp-columns] [data-gt-reset]{display:none} #bgp-sales [data-mp-columns] .bi-gt-full-button{display:inline-block} #bgp-sales .bi-mp-actions{margin-left:auto} #bgp-sales .bi-mp.bi-gt-fullscreen.bi-gt-fullscreen{padding:calc(6px + var(--bi-banner-height,0px)) 0 0;gap:6px} #bgp-sales .bi-mp.bi-gt-fullscreen>.bi-mp-filters{display:none} #bgp-sales .bi-mp.bi-gt-fullscreen>.bi-mp-tools{padding:0 8px} #bgp-sales .bi-mp.bi-gt-fullscreen>.bi-mp-scroll{border-width:1px 0 0;border-radius:0} } @media(min-width:768px) and (max-width:879px){ #bgp-sales .bi-mp-filters{flex-wrap:nowrap;gap:12px} #bgp-sales .bi-mp-search{flex:1 1 200px;min-width:0} #bgp-sales .bi-mp-field{flex:0 1 220px} #bgp-sales .bi-mp-field .xsel{width:100%} } @media(min-width:641px){ #bgp-sales .bi-lead-report table{min-width:0} #bgp-sales .bi-lead-report th button{text-align:left} #bgp-sales .bi-lead-report .bi-lead-search input{height:40px;min-height:40px} #bgp-sales .bi-lead-report [data-lead-refresh]{height:40px;min-height:40px;padding-block:0} #bgp-sales .bi-lead-report [data-lead-more]{grid-column:1/-1;justify-self:start;margin-top:10px} } /* the start of a page: one left edge, one line under the bar, one size of the title */ @media(max-width:767px){ #bgp-sales .bi-ec,#bgp-sales .bi-mp,#bgp-sales .bi-lead-report,#bgp-sales .bi-partner-events{padding:8px 16px 24px} #bgp-sales .bi-ec-head h1,#bgp-sales .bi-mp-head h1,#bgp-sales .bi-lead-report>h1,#bgp-sales .bi-partner-events-heading h1{font-size:20px;line-height:26px;letter-spacing:0;margin:0} #bgp-sales .bi-cfo .bi-cfo-head h1{margin:4px 0} #bgp-sales .bi-ec-head h1{margin:2px 0 4px} } @media(min-width:768px){ #bgp-sales .bi-ec,#bgp-sales .bi-mp,#bgp-sales .bi-lead-report,#bgp-sales .bi-partner-events{max-width:none;margin-inline:0;padding:8px 24px 32px} #bgp-sales .bi-mp-head h1,#bgp-sales .bi-lead-report>h1,#bgp-sales .bi-partner-events-heading h1{font-size:28px;line-height:34px;letter-spacing:-.5px;margin:0 0 6px} #bgp-sales .bi-mp-grid td[data-col=name]{max-width:300px} } /* the window of details, the clients, the report of the journal, second pass */ @media(max-width:700px){ #bgp-sales .bi-detail-grid-head,#bgp-sales .bi-detail-grid-row,#bgp-sales .bi-detail-grid-total{grid-template-columns:minmax(200px,1fr) repeat(3,88px);min-width:508px;gap:8px;padding:8px 10px;font-size:11px} #bgp-sales .bi-detail-grid-expenses .bi-detail-grid-head,#bgp-sales .bi-detail-grid-expenses .bi-detail-grid-row,#bgp-sales .bi-detail-grid-expenses .bi-detail-grid-total{grid-template-columns:minmax(150px,1fr) 88px 44px;min-width:0} #bgp-sales .bi-detail-grid-together .bi-detail-grid-head,#bgp-sales .bi-detail-grid-together .bi-detail-grid-row,#bgp-sales .bi-detail-grid-together .bi-detail-grid-total{grid-template-columns:minmax(200px,1fr) repeat(5,92px);min-width:720px} #bgp-sales .bi-ledger-grid :is(.bi-detail-grid-head,.bi-detail-grid-row,.bi-detail-grid-total){grid-template-columns:minmax(200px,1fr) repeat(7,88px) 52px;min-width:952px} #bgp-sales .bi-ledger-grid[data-measures="1"] :is(.bi-detail-grid-head,.bi-detail-grid-row,.bi-detail-grid-total){grid-template-columns:minmax(200px,1fr) 96px 52px;min-width:384px} #bgp-sales .bi-ledger-grid[data-measures="2"] :is(.bi-detail-grid-head,.bi-detail-grid-row,.bi-detail-grid-total){grid-template-columns:minmax(200px,1fr) repeat(2,88px) 52px;min-width:472px} #bgp-sales .bi-ledger-grid[data-measures="3"] :is(.bi-detail-grid-head,.bi-detail-grid-row,.bi-detail-grid-total){grid-template-columns:minmax(200px,1fr) repeat(3,88px) 52px;min-width:568px} #bgp-sales .bi-ledger-grid[data-measures="4"] :is(.bi-detail-grid-head,.bi-detail-grid-row,.bi-detail-grid-total){grid-template-columns:minmax(200px,1fr) repeat(4,88px) 52px;min-width:664px} #bgp-sales .bi-ledger-grid[data-measures="5"] :is(.bi-detail-grid-head,.bi-detail-grid-row,.bi-detail-grid-total){grid-template-columns:minmax(200px,1fr) repeat(5,88px) 52px;min-width:760px} #bgp-sales .bi-ledger-grid[data-measures="6"] :is(.bi-detail-grid-head,.bi-detail-grid-row,.bi-detail-grid-total){grid-template-columns:minmax(200px,1fr) repeat(6,88px) 52px;min-width:856px} /* the names stay on the screen while the figures scroll: the whole height and the frame's edge, the colour of the row, on hover too, the leaf keeps its stripe */ #bgp-sales .bi-detail-grid-head>:first-child,#bgp-sales .bi-detail-grid-row>:first-child,#bgp-sales .bi-detail-grid-total>:first-child{position:sticky;left:0;z-index:1;align-self:stretch;box-sizing:border-box;margin:-8px 0 -8px -10px;padding:8px 0 8px 10px;background:var(--surface)} #bgp-sales .bi-detail-grid-row>:first-child{display:flex;align-items:center;gap:4px;min-width:0;background:var(--bg)} #bgp-sales .bi-detail-grid-row.bi-detail-leaf>:first-child{background:color-mix(in srgb,var(--actual) 8%,var(--surface));box-shadow:inset 3px 0 var(--actual)} #bgp-sales [data-detail-nodes] .bi-detail-grid-row:hover>:first-child,#bgp-sales [data-expense-nodes] .bi-detail-grid-row:hover>:first-child{background:var(--surface-hover)} #bgp-sales [data-detail-nodes] .bi-detail-grid-row.bi-detail-leaf:hover>:first-child,#bgp-sales [data-expense-nodes] .bi-detail-grid-row.bi-detail-leaf:hover>:first-child{background:color-mix(in srgb,var(--actual) 10%,var(--surface))} #bgp-sales .bi-detail-drill{padding-left:calc(var(--detail-level)*10px);gap:6px} /* the block of a line: in the width of the screen, whatever the figures do */ #bgp-sales .bi-detail-grid{container-type:inline-size} #bgp-sales [data-detail-nodes],#bgp-sales [data-expense-nodes]{width:min-content;min-width:100%} #bgp-sales .bi-detail-grid .bi-detail-audit,#bgp-sales .bi-detail-grid:not(.bi-detail-grid-expenses):not(.bi-detail-grid-together) .bi-detail-audit,#bgp-sales .bi-ledger-grid[data-measures] .bi-detail-audit{position:sticky;left:0;box-sizing:border-box;width:100cqw;min-width:0;padding:10px 10px 10px 12px;gap:4px 12px} /* the gear's menu stays on the screen */ #bgp-sales .bi-detail-gear-menu{left:0;right:auto;max-width:calc(100vw - 40px)} /* the tree on the first screen */ #bgp-sales .bi-detail-report{padding-top:8px} #bgp-sales .bi-detail-heading{gap:8px;margin-bottom:8px} #bgp-sales .bi-detail-heading>button{min-height:34px;padding:4px 10px;font-size:12px} #bgp-sales .bi-detail-heading h2{font-size:15px} #bgp-sales .bi-sales-detail-report .bi-detail-heading h2,#bgp-sales [data-ledger-caption]{display:none} #bgp-sales .bi-detail-controls{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px} #bgp-sales .bi-detail-controls>.bi-detail-field:last-child:nth-child(3n+2){grid-column:span 2} #bgp-sales .bi-detail-field{gap:2px} #bgp-sales .bi-detail-field>span{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #bgp-sales .bi-detail-report .bi-ledger-controls{grid-template-columns:repeat(6,minmax(0,1fr))} #bgp-sales .bi-ledger-controls>*{grid-column:span 2} #bgp-sales .bi-ledger-controls>.bi-ledger-month{grid-column:span 3} #bgp-sales .bi-detail-report .bi-ledger-controls>.bi-ledger-archive{grid-column:span 4;align-self:center;margin:14px 0 0;font-size:12px} #bgp-sales .bi-detail-report .bi-ledger-month input{height:34px;min-height:34px;font-size:13px} #bgp-sales .bi-detail-report .bi-detail-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px 12px;margin-bottom:8px} #bgp-sales .bi-detail-summary>span{display:flex;align-items:baseline;justify-content:space-between;gap:6px;min-width:0;font-size:11px;white-space:nowrap} #bgp-sales .bi-detail-summary strong{font-size:12px} #bgp-sales .bi-detail-grouping-panel{margin:0 0 8px;padding:8px} #bgp-sales .bi-detail-grouping-top{gap:6px;margin-bottom:0} #bgp-sales .bi-detail-preset{flex-wrap:nowrap;gap:8px;font-size:11px} #bgp-sales .bi-detail-preset .xsel{flex:1 1 0;width:auto;min-width:0} #bgp-sales .bi-detail-preset .xsel-t{width:100%;min-width:0;height:34px;min-height:34px;font-size:13px} #bgp-sales .bi-sales-detail-report .bi-detail-practice-tools{flex:1 1 100%;min-width:0;margin-left:0} #bgp-sales .bi-detail-practice-tools .bi-detail-field{display:flex;flex:1 1 100%;align-items:center;gap:8px} #bgp-sales .bi-detail-preset>span,#bgp-sales .bi-detail-view-switch>span,#bgp-sales .bi-detail-practice-tools .bi-detail-field>span{flex:none;width:80px;font-size:11px} #bgp-sales .bi-detail-preset>[data-filter],#bgp-sales .bi-detail-practice-tools .bi-detail-field>[data-filter]{flex:1 1 0;min-width:0} #bgp-sales .bi-detail-tree-actions{gap:6px} #bgp-sales .bi-detail-tree-actions button:not(.bi-detail-gear){height:34px;min-height:34px;padding:0 8px;font-size:11px} #bgp-sales .bi-detail-view-switch button{height:34px} #bgp-sales .bi-detail-expenses{margin-top:10px;padding-top:10px} #bgp-sales [data-together-note],#bgp-sales [data-detail-expense-note]{display:none} } /* the month fields follow the theme of the app, not of the phone */ #bgp-sales[data-theme^="dark"] .bi-ledger-report .bi-ledger-month input{color-scheme:dark} #bgp-sales[data-theme^="light"] .bi-ledger-report .bi-ledger-month input{color-scheme:light} @media(min-width:701px){ #bgp-sales .bi-sales-detail-report .bi-detail-practice-tools{flex-wrap:nowrap} #bgp-sales .bi-sales-detail-report .bi-detail-practice-tools .bi-detail-field{display:flex;flex:none;align-items:center;gap:10px} #bgp-sales .bi-sales-detail-report .bi-detail-practice-tools .bi-detail-field .xsel{width:120px!important} #bgp-sales .bi-sales-detail-report .bi-detail-debug-control{white-space:nowrap} } @media(min-width:641px) and (pointer:fine){#bgp-sales .bi-detail-drill>span:last-child{padding-top:2px}} @media(min-width:768px){#bgp-sales #desktop-caption{margin-right:auto}} /* ------------------------------------------------------------ 16. The third pass: what the second check found */ /* «Ориджинаторы», the page: the title whole beside a long group of the map; «Все ориджинаторы» stay in their panel */ @media(min-width:1440px) and (max-width:1669px){ #bgp-sales .bgp-charts-grid>.bgp-sellers-panel:has(.xsel-map-group)>.bgp-sellers-head h2[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel:has(.xsel-map-group)>.bgp-sellers-head h2[data-short]::before{content:attr(data-short);content:attr(data-short) / "";min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:15px} } @media(min-width:1100px) and (max-width:1119px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools :is(.xsel-map-group,.xsel-pie-group) .xsel-t{max-width:106px}} @media(min-width:641px) and (max-width:665px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools :is(.xsel-map-group,.xsel-pie-group) .xsel-t{max-width:236px}} #bgp-sales .bi-all-fact-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} @media(min-width:1100px) and (max-width:1439px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel .bi-all-fact-row{grid-template-columns:minmax(150px,1fr) minmax(0,.35fr) 270px}} @media(min-width:1100px) and (max-width:1279px){ #bgp-sales .bgp-charts-grid>.bgp-sellers-panel .bi-all-fact-row{grid-template-columns:minmax(150px,1fr) 264px;column-gap:6px} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel .bi-all-fact-row>:nth-child(2){display:none} } @media(min-width:1100px) and (max-width:1179px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel:has(.bi-all-fact-row)>.bgp-seller-footer>:first-child{display:none}} /* the phone's window: «Все ориджинаторы» take the column of the hidden picker; a number of a row is one word */ @media(max-width:640px){#bgp-sales .bi-native-viewer .bgp-slide>.bgp-sellers-panel:has(.bi-all-fact-row)>.bgp-sellers-head>div:first-child{grid-column:1/3}} #bgp-sales .bgp-seller-name>.bgp-seller-index{flex:none;white-space:nowrap} /* the map of revenue keeps the place while it loads and the same head as its other views */ @media(min-width:641px) and (max-width:1099px){ #bgp-sales .bgp-charts-grid .bgp-seller-list:has(.bi-project-map){min-height:444px} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel[data-kind="revenue"]:has(.xsel-map-group)>.bgp-sellers-head .bgp-subtitle{display:none} } /* a phone on its side: the second picker has the room for its whole name; no export; no notes of the clients */ @media(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-pivot-export,#bgp-sales [data-detail-expense-note],#bgp-sales .bi-detail-note{display:none} } @media(max-height:500px) and (min-width:667px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bgp-slide>.bgp-sellers-panel>.bgp-sellers-head>.bgp-panel-tools>:is(.xsel-map-group,.xsel-pie-group){flex:0 0 250px;width:250px!important;max-width:250px!important} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-sellers-panel>.bgp-sellers-head>.bgp-panel-tools>:is(.xsel-map-group,.xsel-pie-group) .xsel-t{width:100%;max-width:none} } @media(max-height:500px) and (max-width:619px) and (orientation:landscape){#bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head)>.bgp-panel-tools>:is(.xsel-pie-group,.xsel-map-group,.xsel-sort){width:150px!important}} @media(max-height:500px) and (max-width:799px) and (orientation:landscape){#bgp-sales .bi-financial-title-row h1{display:none}} /* an installed app under a notch: the bar covers the notch, the line of the window stands right under the bar */ @media(max-width:768px),(max-height:500px) and (max-width:1099px) and (orientation:landscape){ html.bi-test .bi-test-banner{height:calc(26px + env(safe-area-inset-top,0px));padding-top:calc(3px + env(safe-area-inset-top,0px))} html.bi-test{padding-top:calc(26px + env(safe-area-inset-top,0px))} body.bi-gt-lock:has(.bi-test-banner){--bi-banner-height:calc(26px + env(safe-area-inset-top,0px))} html.bi-test #bgp-sales .bi-debt.bd-chat-drawer{top:calc(26px + env(safe-area-inset-top,0px))} html.bi-test #bgp-sales .bi-native-viewer{top:calc(26px + env(safe-area-inset-top,0px));height:calc(100dvh - 26px - env(safe-area-inset-top,0px))} html.bi-test #bgp-sales .bi-native-viewer .bgp-viewer-head{top:4px} html.bi-test #bgp-sales .bi-native-viewer .bgp-slide>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){padding-top:4px} } /* the narrowest phones: the titles of a page whole; the switch «Без плана» does not push the page while it moves to the line of the year */ @media(max-width:340px){ #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){padding-right:8px} #bgp-sales .bi-group-body{padding-inline:6px} #bgp-sales .bi-group-table th,#bgp-sales .bi-group-table td{padding:6px 2px} #bgp-sales .bi-group-table .bgp-status{font-size:10px;padding-inline:2px} } @media(min-width:341px) and (max-width:346px){ #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head){grid-template-columns:minmax(0,1fr) 112px 32px 32px} #bgp-sales .bgp-charts-grid>.bgp-panel>:is(.bgp-panel-head,.bgp-sellers-head) .xsel-t .lbl[data-short]::before{font-size:11px} } @media(max-width:640px){#bgp-sales .bgp-page-head .bi-sales-unplanned-top:not(.bi-unplanned-on-year){position:absolute;visibility:hidden}} /* the receivables, third pass */ @media(min-width:1100px) and (max-width:1439px){#bgp-sales .bgp-charts-grid>.bi-debt-sellers[data-row-view=compact] .bi-compact-completion>.bgp-progress-kind{display:none}} @media(min-width:1100px) and (max-width:1279px){ #bgp-sales .bgp-charts-grid>.bi-debt-sellers[data-row-view=compact] .bgp-seller-row{grid-template-columns:minmax(0,150px) minmax(0,1fr)} #bgp-sales .bgp-charts-grid>.bi-debt-sellers[data-row-view=compact] .bi-compact-completion .bgp-status{min-width:58px} #bgp-sales .bgp-charts-grid>.bgp-sellers-panel.bi-debt-sellers:has(.xsel-map-group,.xsel-pie-group)>.bgp-sellers-head h2[data-short]::before{font-size:14px} #bgp-sales .bi-debt .bgp-charts-grid>.bi-debt-dynamics>.bgp-panel-head h2{font-size:14px} } @media(min-width:1401px){#bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools .xsel-financial-view .xsel-t{min-width:142px}} @media(min-width:769px) and (min-height:501px),(min-width:1100px){#bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-pie-group .xsel-t{min-width:157px}} @media(min-width:641px) and (max-width:768px){#bgp-sales .bgp-charts-grid>.bi-debt-sellers>.bgp-sellers-head .bgp-subtitle{display:none}} /* the advances, third pass */ @media(min-width:641px){#bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .xsel-pie-group .xsel-t{min-width:156px}} @media(min-width:1280px) and (max-width:1439px){ #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .lbl[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .lbl[data-short]::before{content:attr(data-short);font-size:13px} } @media(min-width:1100px) and (max-width:1439px){#bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .xsel-pie-group .xsel-t{min-width:140px}} @media(min-width:1100px) and (max-width:1279px){ #bgp-sales .bgp-charts-grid.bi-adv-charts>.bgp-sellers-panel>.bgp-sellers-head .bgp-panel-tools .xsel-pie-group .xsel-t{min-width:116px} #bgp-sales .bi-gt-fullscreen.bi-gt-fullscreen.bi-adv:has(.bi-adv-groupbar .bi-adv-chip):not(:has(.bi-adv-mine:not([hidden]))){grid-template-columns:auto minmax(220px,260px) minmax(0,1fr)} } /* «Клиенты в динамике», third pass */ @media(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-mk-head .bgp-eyebrow,#bgp-sales .bi-mk-sub,#bgp-sales .bi-mk-period,#bgp-sales .bi-mk-note,#bgp-sales [data-mk-years],#bgp-sales .bi-mk-columns{display:none} #bgp-sales .bi-mk:not(.bi-gt-fullscreen)>.bi-mk-scroll{max-height:none;height:auto} #bgp-sales .bi-mk.bi-gt-fullscreen.bi-gt-fullscreen{padding:calc(6px + var(--bi-banner-height,0px)) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)} } @media(max-width:700px){#bgp-sales .bi-mk-segments-title{display:block;flex:1 1 100%;grid-column:1/-1;box-sizing:content-box;margin:-12px;padding:12px}} /* the cards, «Мои проекты» and the trees, third pass */ @media(max-width:700px){ #bgp-sales .bi-ec-view{display:contents} #bgp-sales .bi-ec-viewlabel{flex:1 1 0;min-width:0;width:auto} #bgp-sales .bi-ec-viewactions{order:5;flex:1 1 100%;display:flex;gap:8px} #bgp-sales .bi-ec-viewactions[hidden]{display:none} #bgp-sales .bi-ec-viewactions button{flex:1 1 0;white-space:nowrap} #bgp-sales .bi-gt-fullscreen .bi-ec-viewlabel,#bgp-sales .bi-gt-fullscreen .bi-ec-viewactions{display:none} #bgp-sales .bi-detail-report .bi-ledger-controls>.bi-detail-field:has(+.bi-ledger-archive){grid-column:span 3} #bgp-sales .bi-detail-report .bi-ledger-controls>.bi-ledger-archive{grid-column:span 3} /* the line of the state does not push the tree; it stays for a screen reader */ #bgp-sales [data-expand-status]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} } @media(max-width:767px){#bgp-sales .bi-mp-actions .bi-mp-excel{display:none}} /* a tablet: the names of a wide tree stay on the screen while the figures scroll */ @media(min-width:701px) and (max-width:1099px){ #bgp-sales .bi-detail-grid-head>:first-child,#bgp-sales .bi-detail-grid-row>:first-child,#bgp-sales .bi-detail-grid-total>:first-child{position:sticky;left:0;z-index:1;align-self:stretch;box-sizing:border-box;margin:-10px 0 -10px -14px;padding:10px 0 10px 14px;background:var(--surface)} #bgp-sales .bi-detail-grid-row>:first-child{display:flex;align-items:center;gap:4px;min-width:0;background:var(--bg)} #bgp-sales .bi-detail-grid-row.bi-detail-leaf>:first-child{background:color-mix(in srgb,var(--actual) 8%,var(--surface));box-shadow:inset 3px 0 var(--actual)} #bgp-sales [data-detail-nodes] .bi-detail-grid-row:hover>:first-child,#bgp-sales [data-expense-nodes] .bi-detail-grid-row:hover>:first-child{background:var(--surface-hover)} #bgp-sales [data-detail-nodes] .bi-detail-grid-row.bi-detail-leaf:hover>:first-child,#bgp-sales [data-expense-nodes] .bi-detail-grid-row.bi-detail-leaf:hover>:first-child{background:color-mix(in srgb,var(--actual) 10%,var(--surface))} #bgp-sales [data-detail-nodes],#bgp-sales [data-expense-nodes]{width:min-content;min-width:100%} } /* ------------------------------------------------------------ 17. The last check before the release */ /* a small phone on its side: the switch «Без плана» does not lie on the filter; the filters share the line by what they show */ @media(max-height:500px) and (max-width:640px) and (orientation:landscape){ #bgp-sales .bi-financial-title-row:has(>.bi-unplanned-on-year){padding-right:118px;box-sizing:border-box} #bgp-sales .bi-financial-year-control>.bgp-dynamics-filter:has(.xsel-cfo)>:has(+.xsel-originator){display:none} } @media(max-height:500px) and (max-width:799px) and (orientation:landscape){ #bgp-sales .bi-financial-year-control>.bgp-dynamics-filter:not(:has(.xsel-cfo)) .xsel-originator{flex:0 1 180px} #bgp-sales .bi-financial-year-control .xsel-originator:has(~.xsel-cfo){flex:1 1 90px} #bgp-sales .bi-financial-year-control .xsel-cfo{flex:1 1 134px} } /* a phone on its side, the window: the sort takes the width of the group, the receivables keep the place for their total */ @media(max-height:500px) and (min-width:667px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bgp-slide>.bgp-sellers-panel>.bgp-sellers-head>.bgp-panel-tools>.xsel-sort{flex:0 0 250px;width:250px!important;max-width:250px!important} #bgp-sales .bi-native-viewer .bgp-slide>.bgp-sellers-panel>.bgp-sellers-head>.bgp-panel-tools>.xsel-sort .xsel-t{width:100%;max-width:none} } @media(max-height:500px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head>.bgp-panel-tools>.xsel-pie-group{flex:0 0 170px;width:170px!important;max-width:170px!important} /* a notch on the left or right of the page */ html body#bgp-sales{box-sizing:border-box;padding-left:env(safe-area-inset-left,0px)!important;padding-right:env(safe-area-inset-right,0px)!important} } /* «Все ориджинаторы»: a long name is whole beside the bars */ @media(min-width:1280px) and (max-width:1399px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel .bi-all-fact-row{grid-template-columns:216px minmax(0,1fr) 270px}} @media(min-width:1440px) and (max-width:1499px){#bgp-sales .bgp-charts-grid>.bgp-sellers-panel .bi-all-fact-row{grid-template-columns:minmax(118px,240px) minmax(40px,1fr) minmax(300px,1fr)}} /* the receivables: the head keeps its places on the map, the compact rows with a photo keep the names */ #bgp-sales .xsel-pie-group.bi-slot-hidden{visibility:hidden;pointer-events:none} @media(min-width:1100px) and (max-width:1279px){#bgp-sales .bgp-charts-grid>.bi-debt-sellers[data-row-view=compact]:has(.bi-row-photo) .bgp-seller-row{grid-template-columns:minmax(0,180px) minmax(0,1fr)}} @media(min-width:769px) and (max-width:799px) and (min-height:501px){ #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head h2[data-short]{display:flex;align-items:center;font-size:0} #bgp-sales .bi-native-viewer .bgp-slide>.bi-debt-sellers>.bgp-sellers-head h2[data-short]::before{content:attr(data-short);content:attr(data-short) / "";font-size:16px} } /* the advances, «Компактный» from 641: a long name on two lines, as on the phone */ @media(min-width:641px){#bgp-sales .bi-adv-charts .bgp-sellers-panel[data-row-view=compact] .bi-seller-display-name{white-space:normal;line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}} /* «Клиенты в динамике»: the sparkline stands by the real width of the trend; a phone on its side has the lists closed too */ #bgp-sales .bi-mk-spark-col{right:var(--mk-spark-right,calc(var(--mk-col) * 2))} @media(max-height:500px) and (min-width:701px) and (max-width:1099px) and (orientation:landscape){ #bgp-sales .bi-mk-segments:not(.is-open)>.bi-mk-field{display:none} #bgp-sales .bi-mk-segments-title{display:block;flex:1 1 100%;grid-column:1/-1;cursor:pointer;box-sizing:content-box;margin:-12px;padding:12px;line-height:1.4} #bgp-sales .bi-mk-segments-title::after{content:' ▾'} #bgp-sales .bi-mk-segments.is-open .bi-mk-segments-title::after{content:' ▴'} } /* the trees on a tablet: the open block of a line in the width of the screen */ @media(min-width:701px) and (max-width:1099px){ #bgp-sales .bi-detail-grid{container-type:inline-size} #bgp-sales .bi-detail-grid .bi-detail-audit,#bgp-sales .bi-detail-grid:not(.bi-detail-grid-expenses):not(.bi-detail-grid-together) .bi-detail-audit,#bgp-sales .bi-ledger-grid[data-measures] .bi-detail-audit{position:sticky;left:0;box-sizing:border-box;width:100cqw;min-width:0} } /* the cards: the button of the whole screen stays at the right edge on every tab; the total of the whole screen above the home line */ @media(max-width:700px){ #bgp-sales .bi-ec-tools .bi-ec-gt{margin-left:auto} #bgp-sales .bi-ec.bi-gt-fullscreen.bi-gt-fullscreen{padding-bottom:env(safe-area-inset-bottom,0px)} } @media(max-width:767px){#bgp-sales .bi-mp.bi-gt-fullscreen.bi-gt-fullscreen{padding-bottom:env(safe-area-inset-bottom,0px)}} /* the handle of the last column does not make a scrollbar of 2 px */ #bgp-sales .bi-gt-grid thead th:last-child .bi-gt-resize{right:0} /* 360: «Остановить» takes the place of «Свернуть всё» while the tree opens, the tree does not jump */ @media(max-width:374px){#bgp-sales .bi-detail-tree-actions:has([data-stop-expand]:not([hidden])) [data-collapse-all]{display:none}} /* ------------------------------------------------------------ 18. Task 414: «Прогноз поступлений» of the receivables — the columns by week, the facts under them */ #bgp-sales .bi-debt-receipts{margin-top:14px} #bgp-sales .bi-debt-receipts>.bgp-panel-head h2{margin:0;font-size:16px;line-height:20px} #bgp-sales .bi-debt-receipts>.bgp-legend{display:flex;flex-wrap:wrap;gap:6px 16px;padding:10px 24px 0} #bgp-sales .bi-receipts-swatch{flex:none;width:10px;height:10px;border-radius:3px;background:var(--own)} #bgp-sales .bi-receipts-swatch[data-swatch=pdpd],#bgp-sales .bi-dynamics-tooltip .bi-mtip-swatch[data-swatch=pdpd]{background:var(--plan)} #bgp-sales .bi-debt-receipts .bi-receipts-plot{height:280px} #bgp-sales .bi-debt-receipts .bi-receipts-plot>.bgp-plot{height:100%} #bgp-sales .bi-monthly-plot .bi-receipts-now{fill:color-mix(in srgb,var(--text) 4%,transparent)} #bgp-sales .bi-monthly-plot text.bi-receipts-now-label{fill:var(--text);font-weight:600} #bgp-sales .bi-receipts-empty{margin:8px 24px 0;color:var(--secondary);font-size:12px;line-height:1.4} #bgp-sales .bi-receipts-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px 24px 20px} #bgp-sales .bi-receipts-fact{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;min-height:0;margin:0;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:inherit;text-align:left} #bgp-sales button.bi-receipts-fact{cursor:pointer} #bgp-sales button.bi-receipts-fact:hover:not(:disabled){border-color:var(--actual)} #bgp-sales button.bi-receipts-fact:disabled{cursor:default;opacity:.6} #bgp-sales .bi-receipts-fact>span,#bgp-sales .bi-receipts-fact>small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--secondary);font-size:11px;line-height:15px} #bgp-sales .bi-receipts-fact>strong{font-size:16px;line-height:22px;font-variant-numeric:tabular-nums;white-space:nowrap} #bgp-sales .bi-receipts-fact[data-alert]>strong{color:var(--negative,#da7474)} #bgp-sales .bi-receipts-tooltip .bi-receipts-hint{margin:8px 0 0;color:var(--secondary);font-size:11px;line-height:1.35} @media(max-width:640px){ #bgp-sales .bi-debt-receipts>.bgp-legend{padding:8px 16px 0} #bgp-sales .bi-receipts-empty{margin-inline:16px} #bgp-sales .bi-debt-receipts .bi-receipts-plot{height:220px} #bgp-sales .bi-receipts-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px 10px 14px} #bgp-sales .bi-receipts-fact{padding:8px 10px} #bgp-sales .bi-receipts-fact>strong{font-size:15px} } /* the whole screen: the columns take the height left by the head, the legend and the facts */ #bgp-sales .bi-native-viewer .bi-debt-receipts .bi-receipts-plot{flex:1 1 auto;height:auto;min-height:180px} #bgp-sales .bi-native-viewer .bi-debt-receipts>.bgp-legend{padding-inline:30px} #bgp-sales .bi-debt-receipts [data-receipts-week]{cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent} #bgp-sales .bi-debt-receipts [data-receipts-week]:is(:hover,:focus-visible){fill:color-mix(in srgb,var(--text) 6%,transparent)} #bgp-sales .bi-debt-receipts [data-receipts-week]:focus-visible{stroke:var(--actual);stroke-width:1.5} /* 18. Task 419: a cell of «Сводная» opens its tip (the month, own / other, the projects, «Детали»); the details mark the month */ #bgp-sales .bi-pivot-grid tbody td[data-pivot-month]{cursor:pointer;-webkit-tap-highlight-color:transparent} #bgp-sales .bi-pivot-grid tbody td[data-pivot-month]:hover{box-shadow:inset 0 0 0 1px var(--actual)} #bgp-sales .bi-pivot-tooltip{width:min(320px,calc(100vw - 16px))} /* task 460: the figure of a revenue cell and, beside it, what the net revenue is made of (the rows of the tile «Чистая выручка») */ #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-net{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:0 0 8px} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-net .bi-pie-sector-total{flex:none;margin:0} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-net .bi-net-parts{flex:1 1 150px;max-width:none;font-size:12px} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-period{margin:0 0 2px;font-size:12px;color:var(--secondary)} #bgp-sales .bi-pivot-tooltip .bi-pie-practices{margin:0 0 8px} #bgp-sales .bi-pivot-tooltip .bi-pie-project-list{max-height:min(260px,40vh)} #bgp-sales .bi-pivot-tooltip .bi-pie-project-list>div>span{min-width:0} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-note{margin:8px 0 0;font-size:12px;color:var(--secondary)} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-link{padding:0;border:0;background:none;font:inherit;color:var(--text);text-decoration:underline;text-underline-offset:2px;cursor:pointer} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-link:focus-visible{outline:2px solid currentColor;outline-offset:2px} #bgp-sales .bi-pivot-tooltip [data-pivot-mismatch]{margin:0 0 8px;color:var(--bad)} #bgp-sales .bi-detail-focus>.bi-detail-grid-row{background:color-mix(in srgb,var(--actual) 18%,transparent);box-shadow:inset 3px 0 0 var(--actual)} #bgp-sales .bi-detail-focus>.bi-detail-grid-row>[role=gridcell]:first-child{background-image:linear-gradient(color-mix(in srgb,var(--actual) 18%,transparent),color-mix(in srgb,var(--actual) 18%,transparent))} #bgp-sales .bi-pivot-tooltip{max-height:calc(100dvh - 16px);overflow:auto;overscroll-behavior:contain} /* 19. Task 442 (owner 11.11.2026: «в строке все поставь кружок с фото и в нем буквы BGP, фон строки такой же, как и у других; строка с поиском выделена цветом и обведена тонкой границей»): the lists of CFOs and originators. «Все» carries the BGP mark and is no darker than its neighbours when chosen (the tick and the outlined amount say it); the search is a field — a fill and a hairline, the accent on focus. */ #bgp-sales .bi-picker-avatar .bi-bgp-mark{display:grid;place-items:center;width:100%;height:100%;background:#51c1b5;color:#0f1d1b;font-size:8px;font-weight:600;letter-spacing:.02em} #bgp-sales .bi-picker-menu .bi-picker-option[data-option-value=""]:has(>.xopt[aria-selected="true"]){background:transparent} #bgp-sales .xmenu>.xsearch{padding:14px 18px;border-bottom:0} #bgp-sales .xmenu>.xsearch::before{content:"";position:absolute;inset:6px 8px;z-index:-1;border:1px solid var(--line);border-radius:8px;background:var(--surface-hover);pointer-events:none} #bgp-sales .xmenu>.xsearch:focus-within::before{border-color:var(--actual)} #bgp-sales .xmenu .bi-originator-search-header .xsearch{box-sizing:border-box;min-height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface-hover)} #bgp-sales .xmenu .bi-originator-search-header .xsearch:focus-within{border-color:var(--actual)} /* 20. Task 454: the pill «С планом / Все» of the originator lists — the options without a plan are hidden while «С планом» is on (the menu may sit in while open) */ #bgp-sales .xmenu.bi-plan-only .bi-plan-unplanned{display:none!important} /* 21. Task 454: «Экспорт в Excel» of the pivot is for a computer only (the HTML export hides on a phone and in the window by `.bi-pivot-export`, this one on a tablet too) */ @media(max-width:1099px){ #bgp-sales .bi-pivot-excel{display:none} } /* 22. Task 460 «Сводная»: the first column resizes and the months share the rest of the chart (fixed layout, the widths come from the columns); the headers sort; the key of the sparkline */ #bgp-sales .bi-pivot-grid{table-layout:fixed} #bgp-sales .bi-pivot-grid .bi-pivot-col-total{width:76px} #bgp-sales .bi-pivot-grid .bi-pivot-col-spark{width:104px} #bgp-sales .bi-pivot-grid .bi-pivot-name{width:auto;overflow:hidden} #bgp-sales .bi-pivot-grid thead .bi-pivot-name{overflow:visible} #bgp-sales .bi-pivot-grid .bi-group-name>span:last-child{max-width:none;flex:1 1 auto;min-width:0} #bgp-sales .bi-pivot-grid .bi-pivot-total{right:104px} #bgp-sales .bi-pivot-grid .bi-pivot-spark{width:104px;min-width:104px} #bgp-sales .bi-pivot-grid .bi-pivot-head{display:flex;align-items:center;gap:4px;min-width:0} #bgp-sales .bi-pivot-grid th.num .bi-pivot-head{justify-content:flex-end} #bgp-sales .bi-pivot-grid th.bi-pivot-spark .bi-pivot-head{justify-content:center} #bgp-sales .bi-pivot-sort{display:inline-flex;align-items:center;gap:3px;min-width:0;padding:0;border:0;border-radius:4px;background:none;color:inherit;font:inherit;cursor:pointer;white-space:nowrap} #bgp-sales .bi-pivot-sort:hover{color:var(--text)} #bgp-sales .bi-pivot-sort:focus-visible{outline:2px solid var(--actual);outline-offset:2px} #bgp-sales .bi-pivot-grid th[aria-sort="ascending"],#bgp-sales .bi-pivot-grid th[aria-sort="descending"]{color:var(--text)} #bgp-sales .bi-pivot-arrow{flex:none;font-size:8px;line-height:1;color:var(--actual)} #bgp-sales .bi-pivot-grid th[aria-sort="ascending"] .bi-pivot-arrow::after{content:"▲"} #bgp-sales .bi-pivot-grid th[aria-sort="descending"] .bi-pivot-arrow::after{content:"▼"} #bgp-sales .bi-pivot-resize{position:absolute;top:0;right:-5px;bottom:0;z-index:5;width:10px;cursor:col-resize;touch-action:none} #bgp-sales .bi-pivot-resize::after{content:"";position:absolute;top:5px;bottom:5px;left:4px;width:2px;border-radius:1px;background:transparent} #bgp-sales .bi-pivot-resize:hover::after,#bgp-sales .bi-pivot-resize.is-active::after,#bgp-sales .bi-pivot-resize:focus-visible::after{background:var(--actual)} #bgp-sales .bi-pivot-resize:focus-visible{outline:none} #bgp-sales .bi-pivot-info{flex:none;display:inline-grid;place-items:center;width:16px;height:16px;padding:0;border:1px solid var(--line);border-radius:50%;background:none;color:var(--secondary);font:inherit;font-size:10px;line-height:1;cursor:pointer} #bgp-sales .bi-pivot-info::before{content:"?"} #bgp-sales .bi-pivot-info:hover{color:var(--text);border-color:var(--secondary)} #bgp-sales .bi-pivot-info:focus-visible{outline:2px solid var(--actual);outline-offset:2px} #bgp-sales .bi-spark-tooltip{width:min(340px,calc(100vw - 16px))} #bgp-sales .bi-spark-tooltip .bi-spark-key{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;margin:0 0 8px;font-size:12px} #bgp-sales .bi-spark-tooltip .bi-spark-key i{width:10px;height:10px;margin-top:3px;border-radius:50%;background:var(--faint)} #bgp-sales .bi-spark-tooltip .bi-spark-key i.is-up{background:var(--good)} #bgp-sales .bi-spark-tooltip .bi-spark-key i.is-flat{background:var(--warn)} #bgp-sales .bi-spark-tooltip .bi-spark-key i.is-down{background:var(--bad)} /* 23. Task 461 (owner 13.11.2026): the compact chart — the bar a little taller; the plan is a grey line a little below the middle (the end tick stays), the RunRate a dashed purple line a little above it with the same tick, the two close together in the middle of the bar; the dots of the tooltip say what a line is. The grey is the plan colour of the dynamics. */ #bgp-sales[data-theme="dark"]{--plan-line:#a7a8a9;--other-dot:#507d8d} #bgp-sales[data-theme="light"]{--plan-line:#76777a;--other-dot:#8fb3c0} #bgp-sales[data-theme="dark-mono"]{--plan-line:#a9a9a9;--other-dot:#8c8c8c} #bgp-sales[data-theme="light-mono"]{--plan-line:#808080;--other-dot:#b7b7b7} #bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bgp-bar-track{height:16px} @media(max-width:640px){#bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bgp-bar-track{height:14px}} #bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bi-plan-line{top:calc(50% + 2.5px);background:var(--plan-line)} #bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bi-plan-line::after{top:-8.75px;height:14px;background:var(--plan-line)} #bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bi-rr-line{position:absolute;left:0;top:calc(50% - 2.5px);height:1.5px;margin-top:-.75px;background:repeating-linear-gradient(90deg,var(--rr) 0 4px,transparent 4px 7px);pointer-events:none;z-index:1} #bgp-sales .bgp-sellers-panel[data-row-view="compact"] .bi-rr-line::after{content:"";position:absolute;right:-.75px;top:-5.25px;width:1.5px;height:14px;border-radius:1px;background:var(--rr)} #bgp-sales .bi-rr-line[hidden]{display:none} #bgp-sales .bi-row-reveal>.bgp-seller-row[data-entity]:not(.bi-row-in) .bi-rr-line{transform:scaleX(0);animation:none} #bgp-sales .bi-row-reveal>.bgp-seller-row.bi-row-in .bi-rr-line{transform-origin:left;animation:bgp-grow var(--bar-animation-ms,800ms) cubic-bezier(.22,1,.36,1) calc(var(--row-delay,0ms) + 500ms) both} #bgp-sales .bi-seller-bar-tooltip .bi-seller-tip-row>span:first-child{display:inline-flex;align-items:center;gap:6px} #bgp-sales .bi-seller-bar-tooltip .bi-tip-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--faint)} #bgp-sales .bi-seller-bar-tooltip .bi-tip-dot.is-own{background:var(--actual)} #bgp-sales .bi-seller-bar-tooltip .bi-tip-dot.is-other{background:var(--other-dot)} #bgp-sales .bi-seller-bar-tooltip .bi-tip-dot.is-plan{background:var(--plan-line)} #bgp-sales .bi-seller-bar-tooltip .bi-tip-dot.is-rr{background:var(--rr)} /* 24. Task 463 (owner 13.11.2026: «название ЦФО в тултипе поставь сразу после фото, а то много пустоты»): the head of the tip of a cell of «Сводной» — the photo and the name on one line (the name takes what is left, up to the close button) */ #bgp-sales .bi-pivot-tooltip .bi-pie-tip-head{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:10px;padding-right:40px} #bgp-sales .bi-pivot-tooltip .bi-pie-tip-head>.bi-row-photo{flex:none} #bgp-sales .bi-pivot-tooltip .bi-pie-tip-head strong{flex:1 1 auto;min-width:0} /* 25. Task 464 (owner 13.11.2026): the tip of a cell of «Сводной» — a skeleton while the projects and the net breakdown load (no jumping text, the width is the same from the first frame); a row of a project has a button to its card (a new window) */ #bgp-sales .bi-pivot-tooltip .bi-tip-skeleton{display:grid;gap:8px} #bgp-sales .bi-pivot-tooltip .bi-tip-skeleton>div{display:grid;gap:6px;padding-top:8px;border-top:1px solid var(--line)} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-name{display:block;height:12px;width:70%;border-radius:4px} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-sum{display:block;height:12px;width:36%;border-radius:4px} #bgp-sales .bi-pivot-tooltip .bi-tip-skeleton>div:nth-child(2n) .bi-tip-skel-name{width:55%} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-net{display:grid;gap:6px;margin:6px 0 8px} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-net>span{display:block;height:14px;border-radius:4px} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-net>span:nth-child(odd){width:100%} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-net>span:nth-child(even){width:80%} #bgp-sales .bi-pivot-tooltip .bi-pie-project-list>div>span.bi-pivot-proj{display:flex;align-items:center;gap:6px;min-width:0;overflow:visible} #bgp-sales .bi-pivot-tooltip .bi-pivot-proj-name{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;white-space:normal} #bgp-sales .bi-pivot-tooltip .bi-pivot-proj-card{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border:1px solid var(--line);border-radius:6px;color:var(--secondary);font-size:12px;line-height:1;text-decoration:none} #bgp-sales .bi-pivot-tooltip .bi-pivot-proj-card:hover{color:var(--text);border-color:var(--secondary);background:var(--surface-hover)} #bgp-sales .bi-pivot-tooltip .bi-pivot-proj-card:focus-visible{outline:2px solid var(--actual);outline-offset:2px} /* 26. Task 465 (owner 13.11.2026): the tip of a cell of «Сводной» — «Детали» on the right, on the line of the month; a project's amount on the right, on the line of its name; one line between the rows */ #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 4px} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-meta>.bi-pivot-tip-period{margin:0} #bgp-sales .bi-pivot-tooltip .bi-pivot-tip-meta>.bi-financial-details{flex:none;margin:0} #bgp-sales .bi-pivot-tooltip .bi-pie-project-list>div,#bgp-sales .bi-pivot-tooltip .bi-tip-skeleton>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--line);border-bottom:0} #bgp-sales .bi-pivot-tooltip .bi-pie-project-list,#bgp-sales .bi-pivot-tooltip .bi-tip-skeleton{gap:0} #bgp-sales .bi-pivot-tooltip .bi-pie-project-list>div>.bi-pivot-proj{flex:1 1 auto;min-width:0} #bgp-sales .bi-pivot-tooltip .bi-pie-project-list>div>strong{flex:none;padding:2px 6px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font-size:12px;line-height:1.3;white-space:nowrap} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-name{width:62%} #bgp-sales .bi-pivot-tooltip .bi-tip-skeleton>div:nth-child(2n) .bi-tip-skel-name{width:48%} #bgp-sales .bi-pivot-tooltip .bi-tip-skel-sum{width:18%}