/* ── external_css.css — ATIP 2026 aligned ────────────────────────────── */

/* ── Buttons global margin ── */
.btn {
    margin-bottom: 5px;
}

/* ── Autocomplete widget (JS-injected DOM) ── */
.autocomplete {
  position: relative;
  display: inline-block;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid var(--border);
  border-bottom: none;
  border-top: none;
  z-index: 99;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 50vh;
  overflow-y: scroll;
}

.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: var(--bg-card);
  border-bottom: 1px solid var(--border);
  color: var(--t1);
  font-size: 13px;
}

.autocomplete-items div:hover {
  background-color: var(--hover);
}

.autocomplete-active {
  background-color: var(--acn) !important;
  color: #ffffff;
}

/* ── Description rich-text container ── */
.description_custom {
    height: 60vh;
    overflow: auto;
    padding: 10px;
}
.description_custom img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
}
.description_custom h1 { font-size: 2rem; }
.description_custom h2 { font-size: 1.5rem; }
.description_custom h3 { font-size: 1.25rem; }

/* ── Badge variants ── */
.large_badge {
    padding: 0.6em 0.6em;
    font-size: 100%;
}

/* ── Scrollable card containers ── */
.custom_card_box_view_one       { max-height: 60vh; overflow: auto; padding: 10px; }
.custom_card_box_maps_view_one  { height: 50vh; overflow: auto; padding: 10px; }
.custom_card_box_graph_view_one { height: 50vh; overflow: auto; padding: 10px; }
.custom_card_box_ttps_view_one  { height: 55vh; overflow: auto; padding: 10px; }
.dashboard_chart                { height: 60vh; overflow: auto; padding: 10px; }

/* ── Text truncation utilities ── */
.truncate {
    margin-bottom: 5px;
    display: -webkit-box;
    max-width: fit-content;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.truncate_dashboard {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.truncate_one_line {
    display: -webkit-box;
    max-width: fit-content;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.truncate_one_line_node_graph {
    display: -webkit-box;
    max-width: 50vh;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── Table utilities ── */
.fixed       { table-layout: fixed; }
.td-responsive {
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: anywhere;
}
.line_through { text-decoration: line-through; }

/* ── Select2 multi-choice wrapping ── */
.select2-container .select2-selection--multiple .select2-selection__choice {
  max-width: 100%;
  box-sizing: border-box;
  white-space: normal;
  word-wrap: break-word;
}

/* ── Misc ── */
.ellipsis {
    max-width: 100px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.logo_img {
    height: 50px;
    width: auto;
}

/* ── Responsive layout helpers ── */
@media screen and (min-device-width: 990px) and (-webkit-min-device-pixel-ratio: 1) {
  .messages_custom      { max-height: 40vh; overflow: auto; padding: 10px; }
  .node_graph_table     { height: 60vh; overflow: auto; padding: 10px; }
  .dashboard_custom     { height: 15vh; padding: 10px; }
  .graph_custom         { height: 50vh; padding: 5px; }
  .description_custom   { height: 60vh; overflow: auto; padding: 10px; }
  .intelligence_objects_custom { height: 20vh; overflow: auto; padding: 10px; }
  .sub_plat             { height: 50vh; overflow: auto; padding: 10px; }
  .ext                  { height: 50vh; overflow: auto; padding: 10px; }
  .max_node_number      { position: relative; left: 650px; top: 2px; }
  .warnCardDiv1 {
    position: absolute; right: 0; top: 0; bottom: 0; height: 50vh;
    background: rgba(0,0,0,.65); box-sizing: border-box; padding: 1em;
    color: #fff; overflow: auto; z-index: 1;
    transition: opacity 250ms ease-out;
  }
}

@media screen and (min-device-width: 1601px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) {
  .description_custom { height: 50vh; overflow: auto; padding: 10px; }
  .node_graph_table   { height: 60vh; overflow: auto; padding: 10px; }
  .messages_custom    { max-height: 40vh; overflow: auto; padding: 10px; }
  .dashboard_custom   { height: 12vh; padding: 10px; }
  .graph_custom       { height: 50vh; padding: 5px; }
  .sub_plat           { height: 50vh; overflow: auto; padding: 10px; }
  .ext                { height: 50vh; overflow: auto; padding: 10px; }
  .max_node_number    { position: relative; left: 650px; top: 2px; }
  .warnCardDiv1 {
    position: absolute; right: 0; top: 0; bottom: 0; height: 31vh;
    background: rgba(0,0,0,.65); box-sizing: border-box; padding: 1em;
    color: #fff; overflow: auto; z-index: 1;
    transition: opacity 250ms ease-out;
  }
}

@media screen and (min-width: 1900px) {
  .description_custom { height: 50vh; overflow: auto; padding: 10px; }
  .node_graph_table   { height: 60vh; overflow: auto; padding: 10px; }
  .messages_custom    { max-height: 40vh; overflow: auto; padding: 10px; }
  .dashboard_custom   { height: 12vh; padding: 10px; }
  .graph_custom       { height: 50vh; padding: 5px; }
  .sub_plat           { height: 50vh; overflow: auto; padding: 10px; }
  .ext                { height: 50vh; overflow: auto; padding: 10px; }
  .max_node_number    { position: relative; left: 1250px; top: 2px; }
  .warnCardDiv1 {
    position: absolute; right: 0; top: 0; bottom: 0; height: 51vh;
    background: rgba(0,0,0,.65); box-sizing: border-box; padding: 1em;
    color: #fff; overflow: auto; z-index: 1;
    transition: opacity 250ms ease-out;
  }
}