/* ============================================================
   GEOINFOWORLD WEBGIS
   UI Convergence R1
   ============================================================ */


/* ------------------------------------------------------------
   FULL SCREEN APPLICATION MODE
   Completely isolates Maps from Location_base enterprise shell.
   ------------------------------------------------------------ */

body.giw-app-mode {
  overflow: hidden !important;
}


.giw-app-shell {
  position: fixed !important;

  inset: 0 !important;

  z-index: 2147480000 !important;

  width: 100vw !important;
  height: 100dvh !important;

  display: grid !important;

  grid-template-rows:
    auto
    auto
    minmax(0, 1fr);

  overflow: hidden !important;

  color: #edf6ff;

  background:
    #06101c;

  isolation: isolate;
}


/* ------------------------------------------------------------
   TOP BRAND BAR
   ------------------------------------------------------------ */

.giw-app-shell > .giw-header {
  position: relative !important;

  width: 100% !important;

  min-height: 64px !important;

  margin: 0 !important;

  padding: 10px 18px !important;

  border-radius: 0 !important;

  background:
    linear-gradient(
      115deg,
      #050b14 0%,
      #081627 55%,
      #0b1e32 100%
    ) !important;
}


.giw-app-shell > .giw-header h1 {
  font-size: 1.55rem !important;
}


.giw-app-shell > .giw-header p {
  margin-top: 2px !important;
}


.giw-app-shell > .giw-toolbar {
  width: 100% !important;

  min-height: 48px !important;

  margin: 0 !important;

  border-radius: 0 !important;
}


/* ------------------------------------------------------------
   PRIMARY WEBGIS WORKSPACE
   ------------------------------------------------------------ */

.giw-app-shell > .giw-layout {
  position: relative !important;

  width: 100% !important;
  height: 100% !important;

  min-width: 0 !important;
  min-height: 0 !important;

  margin: 0 !important;

  display: grid !important;

  grid-template-columns:
    340px
    minmax(0, 1fr) !important;

  overflow: hidden !important;
}


/* ------------------------------------------------------------
   REAL LAYER SIDEBAR
   ------------------------------------------------------------ */

.giw-app-shell .giw-sidebar {
  position: relative !important;

  display: block !important;

  width: 340px !important;
  height: 100% !important;

  min-height: 0 !important;

  overflow-y: auto !important;

  border-right:
    1px solid rgba(180,210,240,.11) !important;

  background:
    linear-gradient(
      180deg,
      #071321 0%,
      #06101c 100%
    ) !important;
}


/* No legacy/prototype header blocks */
.giw-app-shell
.giw-sidebar
> *:not(
  .giw-sidebar-head,
  .giw-knowledge-nav,
  .giw-semantic-browser,
  .giw-active-browser
) {
  display: none !important;
}


/* ------------------------------------------------------------
   MAP
   ------------------------------------------------------------ */

.giw-app-shell .giw-map-column {
  position: relative !important;

  width: 100% !important;
  height: 100% !important;

  min-width: 0 !important;
  min-height: 0 !important;

  overflow: hidden !important;
}


.giw-app-shell .giw-map-panel {
  position: absolute !important;

  inset: 0 !important;

  width: 100% !important;
  height: 100% !important;

  min-width: 200px !important;
  min-height: 300px !important;

  overflow: hidden !important;
}


.giw-app-shell #giw-map {
  position: absolute !important;

  inset: 0 !important;

  width: 100% !important;
  height: 100% !important;

  min-width: 200px !important;
  min-height: 300px !important;
}


/* ------------------------------------------------------------
   CONTEXTUAL INTELLIGENCE DRAWER
   Closed unless explicitly needed.
   ------------------------------------------------------------ */

.giw-app-shell .giw-inspector {
  position: absolute !important;

  top: 14px !important;
  right: 14px !important;
  bottom: 14px !important;

  z-index: 80 !important;

  width: 360px !important;

  display: none !important;

  overflow-y: auto !important;

  padding: 14px !important;

  border:
    1px solid rgba(170,215,240,.16) !important;

  border-radius:
    18px !important;

  color: #eaf5ff !important;

  background:
    rgba(7,20,34,.94) !important;

  backdrop-filter:
    blur(20px)
    saturate(130%);

  box-shadow:
    0 30px 90px
    rgba(0,0,0,.42);
}


.giw-app-shell .giw-inspector.is-open {
  display: block !important;
}


/* Hide prototype inspector cards. */
.giw-app-shell
.giw-inspector
> * {
  display: none !important;
}


.giw-app-shell
.giw-inspector
> .giw-layer-intelligence,
.giw-app-shell
.giw-inspector
> .giw-context-panel {
  display: block !important;
}


.giw-context-panel {
  padding: 2px;
}


.giw-context-head {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 10px;

  margin-bottom: 14px;
}


.giw-context-eyebrow {
  color: #49d8ff;

  font-size: .62rem;
  font-weight: 750;

  letter-spacing: .15em;

  text-transform: uppercase;
}


.giw-context-title {
  margin: 4px 0 0;

  font-size: 1.05rem;

  color: #f3f9ff;
}


.giw-context-close {
  width: 30px;
  height: 30px;

  cursor: pointer;

  border:
    1px solid rgba(180,210,240,.12);

  border-radius: 8px;

  color: #94aabd;

  background:
    rgba(255,255,255,.025);
}


.giw-context-message {
  padding: 10px;

  border:
    1px solid rgba(180,210,240,.09);

  border-radius: 9px;

  color: #9db1c3;

  background:
    rgba(255,255,255,.02);

  font-size: .74rem;

  line-height: 1.5;
}


.giw-identify-feature {
  margin-top: 8px;

  padding: 10px;

  border:
    1px solid rgba(180,210,240,.09);

  border-radius: 9px;

  background:
    rgba(255,255,255,.02);
}


.giw-identify-feature strong {
  color: #bcefff;
}


.giw-identify-table {
  width: 100%;

  margin-top: 7px;

  border-collapse: collapse;

  font-size: .66rem;
}


.giw-identify-table td {
  padding: 4px 3px;

  vertical-align: top;

  border-bottom:
    1px solid rgba(180,210,240,.06);

  word-break: break-word;
}


.giw-identify-table td:first-child {
  width: 38%;

  color: #738ba0;
}


/* ------------------------------------------------------------
   FLOATING MAP CONTROLS
   ------------------------------------------------------------ */

.giw-shell-controls {
  display: none !important;
}


.giw-map-commandbar {
  position: absolute;

  top: 14px;
  left: 14px;

  z-index: 70;

  display: flex;

  gap: 6px;
}


.giw-map-command {
  min-height: 34px;

  padding: 6px 10px;

  cursor: pointer;

  border:
    1px solid rgba(190,220,240,.16);

  border-radius: 9px;

  color: #c4d7e6;

  background:
    rgba(5,16,28,.80);

  backdrop-filter:
    blur(14px);

  box-shadow:
    0 8px 24px rgba(0,0,0,.18);
}


.giw-map-command:hover {
  color: #fff;

  border-color:
    rgba(69,212,255,.35);

  background:
    rgba(14,45,65,.92);
}


/* ------------------------------------------------------------
   RESULTS PANEL
   ------------------------------------------------------------ */

.giw-app-shell > .giw-utility-panel {
  position: absolute !important;

  left: 355px !important;
  right: 14px !important;
  bottom: 14px !important;

  z-index: 90 !important;

  display: none !important;

  max-height: 300px !important;
}


.giw-app-shell
> .giw-utility-panel.is-open {
  display: block !important;
}


/* ------------------------------------------------------------
   SIDEBAR COLLAPSE
   ------------------------------------------------------------ */

.giw-app-shell.is-sidebar-hidden
> .giw-layout {
  grid-template-columns:
    0 minmax(0,1fr) !important;
}


.giw-app-shell.is-sidebar-hidden
.giw-sidebar {
  display: none !important;
}


/* ------------------------------------------------------------
   TOOL ACTIVE
   ------------------------------------------------------------ */

.giw-toolbar
[data-giw-tool].is-active {
  color: #c6f3ff !important;

  border-color:
    rgba(69,212,255,.50) !important;

  background:
    rgba(69,212,255,.12) !important;

  box-shadow:
    inset 0 0 18px
    rgba(69,212,255,.06);
}


/* ------------------------------------------------------------
   MEASUREMENT
   ------------------------------------------------------------ */

.giw-measure-tooltip {
  padding: 5px 8px;

  color: #07111c;

  font-size: .7rem;
  font-weight: 650;

  border-radius: 7px;

  background:
    rgba(235,248,255,.94);

  box-shadow:
    0 6px 18px rgba(0,0,0,.18);
}


/* ------------------------------------------------------------
   PRINT
   ------------------------------------------------------------ */

@media print {

  body * {
    visibility: hidden !important;
  }

  .giw-app-shell,
  .giw-app-shell * {
    visibility: visible !important;
  }

  .giw-app-shell {
    position: absolute !important;

    inset: 0 !important;
  }

  .giw-toolbar,
  .giw-sidebar,
  .giw-inspector,
  .giw-map-commandbar {
    display: none !important;
  }

  .giw-app-shell
  > .giw-layout {
    grid-template-columns:
      1fr !important;
  }

}


/* ------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------ */

@media (max-width: 850px) {

  .giw-app-shell
  > .giw-layout {
    grid-template-columns:
      290px
      minmax(0,1fr) !important;
  }

  .giw-app-shell
  .giw-sidebar {
    width: 290px !important;
  }

}


@media (max-width: 650px) {

  .giw-app-shell
  > .giw-layout {
    grid-template-columns:
      1fr !important;
  }

  .giw-app-shell
  .giw-sidebar {
    position: absolute !important;

    z-index: 100 !important;

    width: min(88vw,330px) !important;
  }

}

/* ============================================================
   GEOINFOWORLD LAYER BROWSER SAFETY R2
   ============================================================ */

.giw-sidebar-head {
  position: sticky !important;
  top: 0;
}

.giw-sidebar-close {
  position: absolute;

  top: 12px;
  right: 12px;

  z-index: 15;

  width: 30px;
  height: 30px;

  display: grid;
  place-items: center;

  padding: 0;

  cursor: pointer;

  border:
    1px solid rgba(180,210,240,.12);

  border-radius: 8px;

  color: #8ba2b5;

  background:
    rgba(255,255,255,.025);

  font-size: 18px;
  line-height: 1;

  transition:
    .15s ease;
}

.giw-sidebar-close:hover {
  color: #ffffff;

  border-color:
    rgba(69,212,255,.34);

  background:
    rgba(69,212,255,.09);
}


/*
 * Layer browser owns its own layout.
 * Layer selection cannot collapse it.
 */

.giw-app-shell:not(.is-sidebar-hidden)
.giw-sidebar {
  display: block !important;

  visibility: visible !important;

  opacity: 1 !important;

  pointer-events: auto !important;
}


/*
 * When explicitly closed, map always consumes
 * the available space.
 */

.giw-app-shell.is-sidebar-hidden
> .giw-layout {
  grid-template-columns:
    minmax(0,1fr) !important;
}

.giw-app-shell.is-sidebar-hidden
.giw-map-column {
  width: 100% !important;
  height: 100% !important;
}

