/* EVOST REPORT DETAIL LOCATION READABLE V2 */

.status-cctv-tile.has-report-detail-location,
.status-card.has-report-detail-location,
.status-dense-card.has-report-detail-location {
    position: relative !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.status-cctv-tile.has-report-detail-location {
    padding-bottom: 20px !important;
}

.status-card.has-report-detail-location,
.status-dense-card.has-report-detail-location {
    padding-bottom: 27px !important;
}

.evost-report-detail-location {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    height: 20px;
    min-width: 0;
    padding: 0 7px;
    box-sizing: border-box;

    display: block;

    background: #0C352F;
    color: #FFFFFF;
    border-top: 1px solid rgba(255,255,255,0.18);

    font-size: 10px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.02em;
    text-align: center;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    pointer-events: none;
    user-select: none;
    z-index: 30;
}

.status-card
.evost-report-detail-location,
.status-dense-card
.evost-report-detail-location {
    height: 25px;
    padding: 0 9px;
    font-size: 12px;
    line-height: 25px;
}

/* 2~3열 */
.status-cctv-tile.cctv-mode-2.has-report-detail-location,
.status-cctv-tile.cctv-mode-3.has-report-detail-location {
    padding-bottom: 23px !important;
}

.cctv-mode-2
.evost-report-detail-location,
.cctv-mode-3
.evost-report-detail-location {
    height: 23px;
    font-size: 12px;
    line-height: 23px;
}

/* 6열 */
.status-cctv-tile.cctv-mode-6.has-report-detail-location {
    padding-bottom: 20px !important;
}

.cctv-mode-6
.evost-report-detail-location {
    height: 20px;
    padding: 0 6px;
    font-size: 10px;
    line-height: 20px;
}

/* 8~12열 */
.status-cctv-tile.cctv-mode-8.has-report-detail-location,
.status-cctv-tile.cctv-mode-10.has-report-detail-location,
.status-cctv-tile.cctv-mode-12.has-report-detail-location {
    padding-bottom: 18px !important;
}

.cctv-mode-8
.evost-report-detail-location,
.cctv-mode-10
.evost-report-detail-location,
.cctv-mode-12
.evost-report-detail-location {
    height: 18px;
    padding: 0 4px;
    font-size: 8px;
    line-height: 18px;
}

/* 16열 */
.status-cctv-tile.cctv-mode-16.has-report-detail-location {
    padding-bottom: 16px !important;
}

.cctv-mode-16
.evost-report-detail-location {
    height: 16px;
    padding: 0 3px;
    font-size: 7px;
    line-height: 16px;
}

/* EVOST DETAIL LOCATION AUTOFIT V4 */

.status-cctv-tile.has-report-detail-location {
    padding-bottom: 22px !important;
}

.status-cctv-tile
.evost-report-detail-location {
    height: 22px !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
    font-size: 17px !important;
    line-height: 22px !important;
}

.status-cctv-tile.cctv-mode-6.has-report-detail-location {
    padding-bottom: 22px !important;
}

.cctv-mode-6
.evost-report-detail-location {
    height: 22px !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
    font-size: 17px !important;
    line-height: 22px !important;
}

/* EVOST DETAIL LOCATION AUTOFIT V4 END */

/* EVOST_M_CARD_HEIGHT_V8: location bar no longer overlaps elapsed time. */
.status-screen-block-monitor .status-cctv-tile {
  height: 116px !important;
  min-height: 116px !important;
  padding-bottom: 26px !important;
}

/* EVOST_M_RESPONSIVE_CARD_LAYOUT_V13_BEGIN
 * Keep each CSS grid track exactly as tall as its charger card.
 * The footer size also follows the effective CCTV column mode.
 */
.status-screen-block-monitor .status-cctv-tile {
  box-sizing: border-box !important;
  position: relative !important;
}

.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-2 {
  grid-auto-rows: 156px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-4 {
  grid-auto-rows: 136px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-6 {
  grid-auto-rows: 120px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-8 {
  grid-auto-rows: 108px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-10 {
  grid-auto-rows: 100px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-12 {
  grid-auto-rows: 94px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-16 {
  grid-auto-rows: 86px !important;
}

.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-2 > .status-cctv-tile {
  height: 156px !important; min-height: 156px !important; max-height: 156px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-4 > .status-cctv-tile {
  height: 136px !important; min-height: 136px !important; max-height: 136px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-6 > .status-cctv-tile {
  height: 120px !important; min-height: 120px !important; max-height: 120px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-8 > .status-cctv-tile {
  height: 108px !important; min-height: 108px !important; max-height: 108px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-10 > .status-cctv-tile {
  height: 100px !important; min-height: 100px !important; max-height: 100px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-12 > .status-cctv-tile {
  height: 94px !important; min-height: 94px !important; max-height: 94px !important;
}
.app-shell.app-shell-1920 .status-grid.status-grid-dense.cctv-cols-16 > .status-cctv-tile {
  height: 86px !important; min-height: 86px !important; max-height: 86px !important;
}

.status-screen-block-monitor .status-cctv-tile.cctv-mode-2,
.status-screen-block-monitor .status-cctv-tile.cctv-mode-4,
.status-screen-block-monitor .status-cctv-tile.cctv-mode-6 {
  padding-bottom: 28px !important;
}
.status-screen-block-monitor .status-cctv-tile.cctv-mode-8 {
  padding-bottom: 26px !important;
}
.status-screen-block-monitor .status-cctv-tile.cctv-mode-10 {
  padding-bottom: 25px !important;
}
.status-screen-block-monitor .status-cctv-tile.cctv-mode-12 {
  padding-bottom: 24px !important;
}
.status-screen-block-monitor .status-cctv-tile.cctv-mode-16 {
  padding-bottom: 23px !important;
}

.status-screen-block-monitor .status-cctv-tile .evost-report-detail-location {
  box-sizing: border-box !important;
  position: absolute !important;
  z-index: 4 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  font-weight: 700 !important;
}

.status-screen-block-monitor .cctv-mode-2 .evost-report-detail-location,
.status-screen-block-monitor .cctv-mode-4 .evost-report-detail-location,
.status-screen-block-monitor .cctv-mode-6 .evost-report-detail-location {
  height: 23px !important; min-height: 23px !important; line-height: 23px !important;
  padding: 0 6px !important; font-size: 13px !important;
}
.status-screen-block-monitor .cctv-mode-8 .evost-report-detail-location {
  height: 21px !important; min-height: 21px !important; line-height: 21px !important;
  padding: 0 5px !important; font-size: 12px !important;
}
.status-screen-block-monitor .cctv-mode-10 .evost-report-detail-location {
  height: 20px !important; min-height: 20px !important; line-height: 20px !important;
  padding: 0 4px !important; font-size: 12px !important;
}
.status-screen-block-monitor .cctv-mode-12 .evost-report-detail-location {
  height: 19px !important; min-height: 19px !important; line-height: 19px !important;
  padding: 0 4px !important; font-size: 11px !important;
}
.status-screen-block-monitor .cctv-mode-16 .evost-report-detail-location {
  height: 18px !important; min-height: 18px !important; line-height: 18px !important;
  padding: 0 3px !important; font-size: 10px !important;
}
/* EVOST_M_RESPONSIVE_CARD_LAYOUT_V13_END */
