/* ========== 플로팅 정보 카드 ========== */
.floating {position: absolute; transform: translate(-50%, -100%); pointer-events: auto; z-index: 2; width: 420px;    max-width: 90%;}
.floating.hidden {display: none;}
.floating .floating-body {background: rgba(42, 42, 42, 0.8);    border-radius: 12px;    color: #fff;    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.5);    overflow: hidden;    display: flex;    flex-direction: column;}
.floating .floating-header {width: 100%;    display: flex;    justify-content: space-between;    align-items: center;    padding: 16px 20px;    background: #000;}
.floating .f-title {font-size: 16px;    font-weight: 700;    color: #fff;    text-align: left;}
.floating .f-close {background: none;    border: none;    color: #fff;    font-size: 24px;    font-weight: 400;    cursor: pointer;    line-height: 1;    padding: 0;    width: 24px;    height: 24px;    display: flex;    align-items: center;    justify-content: center;    transition: 0.2s;}
.floating .f-close:hover {opacity: 0.7;}
.floating .f-thumb-wrapper {position: relative;    width: 100%;    height: 0;    padding-bottom: 50%;    margin-top: 12px;    background: transparent;    overflow: hidden;}
.floating .f-thumb {position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background-size: contain;    background-repeat: no-repeat;    background-position: center;    background-color: transparent;}
.floating .slide-btn {position: absolute;    top: 50%;    transform: translateY(-50%);    width: 34px;    height: 34px;    border: none;    border-radius: 50%;    background: rgba(255, 255, 255);    color: #000;    font-size: 18px;    font-weight: 700;    cursor: pointer;    z-index: 2;    transition: 0.2s;    display: flex;    align-items: center;    justify-content: center;}
.floating .slide-btn:hover {background: rgba(253, 234, 234, 0.8);}
.floating .slide-btn.prev {left: 12px;}
.floating .slide-btn.next {right: 12px;}
.floating .f-text {width: 100%;    padding: 20px;    display: flex;    flex-direction: column;    gap: 12px;}
.floating .f-info-table {width: 100%;    background: #000000;    border: 1px solid rgba(42, 42, 42, 0.8);    border-radius: 8px;   padding: 16px;    color: #fff;    display: flex;    flex-direction: column;    gap: 12px;}
.floating .f-info-row {display: flex;    justify-content: flex-start;    align-items: flex-start;    font-size: 14px;    line-height: 1.6;}
.floating .f-info-row .label {font-weight: 400;    color: #999;    min-width: 100px;    flex-shrink: 0;}
.floating .f-info-row .value {color: #fff;    font-weight: 400;    flex: 1;    word-break: break-word;}
.floating .arrow {width: 0;    height: 0;    border-left: 10px solid transparent;    border-right: 10px solid transparent;    border-top: 12px solid #1a1a1a;    position: absolute;    left: 50%;    transform: translateX(-50%);    bottom: -12px;    filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.3));}

/* ===== 에어커멘드 상세 플로팅 카드(길찾기, 거리뷰, 연관검색) ===== */
.floating-link {position: absolute;transform: translate(-50%, -100%);pointer-events: auto;z-index: 2500;width: 200px;background: rgba(42, 42, 42, 0.8);border-radius: 12px;color: #fff;box-shadow: 0 8px 22px rgba(0, 0, 0, 0.3);text-align: center;}
.floating-link.hidden { display: none; }
.floating-link .floating-body {padding: 12px;display: flex;flex-direction: column;align-items: center;}
.floating-link .floating-header {width: 100%;display: flex;justify-content: space-between;align-items: center;margin-bottom: 10px;}
.floating-link .f-title {font-size: 15px;font-weight: 700;color: #fff;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.floating-link .f-close {background: none;border: none;color: #fff;font-size: 22px;font-weight: 700;cursor: pointer;line-height: 1;transition: 0.2s;}
.floating-link .f-close:hover { transform: scale(1.1); color: #ffdfdf; }
.map-icons {background: #fff;border-radius: 10px;padding: 8px 20px;display: flex;justify-content: center;align-items: center;gap: 10px;margin-bottom: 10px;}
.map-icon {width: 38px;height: 38px;cursor: pointer;transition: transform 0.2s ease;}
.map-icon:hover { transform: scale(1.2); }
.btn-close-floating {background: #2a7df7;border: none;color: #fff;padding: 6px 18px;border-radius: 6px;cursor: pointer;font-weight: 600;font-size: 13px;transition: background 0.2s ease;}
.btn-close-floating:hover { background: #1f5fd4; }
.floating-link .arrow {width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-top: 12px solid var(--color-floating-bg);position: absolute;left: 50%;transform: translateX(-50%);bottom: -12px;filter: drop-shadow(0 3px 4px rgba(0,0,0,0.2));}

/* ========== 접힘 상태 숨김 처리 ========== */
.left-panel.collapsed .left-header .title,.left-panel.collapsed .left-header .tab-group,.left-panel.collapsed .filters,.left-panel.collapsed .award-header,.left-panel.collapsed .cards {display:none!important;}

/* ========== 반응형 ========== */
@media screen and (max-width: 1200px) {
    .floating { position: fixed !important;  top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; z-index: 100000 !important; width: 90%; max-width: 90%; height: auto; max-height: 90vh; overflow-y: auto; box-shadow: 0 0 0 100vh rgba(0, 0, 0, 0.5); }
    .floating .floating-body { border-radius: 12px; height: auto; }
    .floating .f-thumb-wrapper { padding-bottom: 40%; }
    .floating .f-text { padding: 16px; }
    .floating .f-info-table { padding: 12px; }
    .floating .f-info-row { font-size: 13px; }
    .floating .f-info-row .label { min-width: 80px; }
    .modal-back.in { z-index: 1; }
    .floating { z-index: 2; }
}

/* ========== 인쇄 스타일 ========== */
@media print{.topbar,.bottombar,.toggle,.left-panel{display:none;}.map-area{position:static;}}

/* =======   에어커맨드 (Air Command) == */
.air-command {  --size: 200px;  --thickness: 55px;  --c-light-blue: #a8c9f5;  --c-blue: #7da8f0;  --c-green: #6dd4a8;  --c-yellow: #ffc976; --color-bg-darker: #444443;  position: absolute;  width: var(--size);  height: var(--size);  pointer-events: none;  display: none;  z-index: 2;}
.air-command.active {  display: block;  animation: airCommandFadeIn 0.25s ease-out;}
@keyframes airCommandFadeIn {  from {    opacity: 0;    transform: scale(0.85);  }  to {    opacity: 1;    transform: scale(1);  }}
.air-command-center {  position: absolute;  top: 50%;  left: 50%;  width: 25%;  height: 25%;  transform: translate(-50%, -50%);  border-radius: 50%;  background: linear-gradient(180deg, #fff 0%, #f7f7f7 100%);  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);  opacity: 0.9;  display: flex;  align-items: center;  justify-content: center;  overflow: hidden;  cursor: pointer;  pointer-events: auto;  z-index: 5;}
.air-command-center img {  width: 100%;  height: 100%;  object-fit: contain; background-repeat: no-repeat;}
.air-command-button {  position: absolute;  inset: 0;  width: 100%;  height: 100%;  border: none;  padding: 0;  border-radius: 50%;  background: var(--color);  opacity: 0.9;  -webkit-mask: radial-gradient(    circle at 50% 50%,    transparent calc(50% - var(--thickness)),    #000 calc(50% - var(--thickness))  );  mask: radial-gradient(    circle at 50% 50%,    transparent calc(50% - var(--thickness)),    #000 calc(50% - var(--thickness))  );  cursor: pointer;  pointer-events: auto;  transition: transform 0.2s ease, filter 0.2s ease;  z-index: 1;}
.air-command-button:hover {  transform: scale(1.03);  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.35));}
.air-command-button-label {  position: absolute;  left: 50%;  top: 50%;  --r: calc(var(--size) / 2 - var(--thickness) / 2 - 8px);  transform:    translate(-50%, -50%)    rotate(var(--angle))    translate(var(--r))    rotate(calc(var(--angle) * -1));  color: #fff;  font-size: 11px;  font-weight: 700;  white-space: nowrap;  text-shadow: 0 0 4px rgba(0, 0, 0, 0.35);}
.air-command-button[data-action="detail"] {  --start: 180deg;  --sweep: 45deg;  --angle: 200deg;  --color: var(--c-light-blue);  clip-path: polygon(    50% 50%,    0% 50%,   6.7% 6.7%   );}
.air-command-button[data-action="drone"] {  --start: 225deg;  --sweep: 45deg;  --angle: 245deg;  --color: var(--c-blue);  clip-path: polygon(    50% 50%,    6.7% 6.7%,    50% 0%   );}
.air-command-button[data-action="route"] {  --start: 270deg;  --sweep: 45deg;  --angle: 295deg;  --color: var(--c-green);  clip-path: polygon(    50% 50%,    50% 0%,    93.3% 6.7%  );}
.air-command-button[data-action="street"] {  --start: 315deg;  --sweep: 45deg;  --angle: 340deg;  --color: var(--c-yellow);  clip-path: polygon(    50% 50%,    93.3% 6.7%,    100% 50%  );}
.air-command-button[data-action="search"] {  --start: 0deg;  --sweep: 90deg;  --angle: 380deg;  --color: var(--color-bg-darker);  clip-path: polygon(    50% 50%,    100% 50%,    100% 100%);}
/*.air-command-button[data-action="disabled"] {  --start: 0deg;  --sweep: 90deg;  --angle: 45deg;  --color: #d0d0d0;  clip-path: polygon(    50% 50%,    100% 50%,    100% 100%,    50% 100%  );  pointer-events: none;  cursor: default;}*/
.air-command-button[data-action="disabled"]:hover {  transform: scale(1);  filter: none;}


/* 에어커맨드 모바일 화면 초기에 안나오도록 조절 2026.02.10 정용욱 */
@media (max-width: 1200px) {
    .krds-modal[class*=context-in] {
        visibility: hidden;
    }
}
