/* Shared surfaces and controls; operational status colours stay data-driven. */
:root {
    --nd-page: #edf1f6;
    --nd-surface: #fff;
    --nd-ink: #172c4b;
    --nd-border: #d6deea;
    --nd-accent: #2463a6;
    --nd-space: 12px;
    --nd-radius: 10px;
    --nd-control: 40px;
    --mobile-border: var(--nd-border);
    --mobile-ink: var(--nd-ink);
}
body { color: var(--nd-ink); background-color: var(--nd-page); font-family: Arial, sans-serif; }
body button, body input[type="button"], body input[type="submit"] {
    box-sizing: border-box;
    min-height: var(--nd-control);
    height: auto;
    padding: 8px 12px;
    border: 1px solid var(--nd-border);
    border-radius: 7px;
    background-color: var(--nd-surface);
    color: var(--nd-ink);
    font: 600 14px Arial, sans-serif;
    line-height: 20px;
    vertical-align: middle;
    box-shadow: 0 1px 2px #172c4b0a;
}
body button:hover { background-color: #e7eef8; border-color: #91aaca; filter: none; }
body button:disabled { opacity: .5; }
body .global_btn_save, body #main_btn_save_eibar { background: #176a43; color: white; border-color: #176a43; }
body .global_btn_delete { background: #fff3f3; color: #a42331; border-color: #e9bfc5; }
body .global_btn_copy { background: #edf4ff; color: #24578e; }
body button[class*="~"] {
    min-width: var(--nd-control);
    width: var(--nd-control);
    height: var(--nd-control);
    padding: 8px;
    background-image: none !important;
    filter: none;
    text-align: center;
}
button[class*="~"]::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 17px;
    line-height: 20px;
    display: inline-block;
}
body #main_btn_showActiveUser { padding: 8px !important; width: auto !important; }
#main_btn_showActiveUser::before { margin-right: 5px; }
button[class*="~logout"]::before { content: "\f2f5"; }
button[class*="~user"]::before { content: "\f007"; }
button[class*="~maphome"]::before { content: "\f015"; }
button[class*="~close"]::before { content: "\f00d"; }
button[class*="~reload"]::before { content: "\f2f1"; }
button[class*="~maps"]::before { content: "\f5a0"; }
button[class*="~search"]::before { content: "\f002"; }
button[class*="~delete"]::before { content: "\f2ed"; }
button[class*="~zinfo"]::before { content: "\f05a"; }
button[class*="~returntrip"]::before { content: "\f3e5"; }
button[class*="~copy"]::before { content: "\f0c5"; }
button[class*="~template"]::before { content: "\f15b"; }
button[class*="~repair"]::before { content: "\f0ad"; }
button[class*="~fullscreen"]::before { content: "\f065"; }
button[class*="~zoomIn"]::before { content: "\f00e"; }
button[class*="~zoomOut"]::before { content: "\f010"; }
button[class*="~zoomReset"]::before { content: "\f1ce"; }
button[class*="~radio"]::before { content: "\f519"; }
button[class*="~showDispatched"]::before { display:none; }
button[class*="~showPreDispatched"]::before { content: "\f024"; }
body .global_div_nav {
    height: 56px;
    box-sizing: border-box;
    padding: 8px;
    gap: 6px;
    background: var(--nd-surface);
    border-bottom: 1px solid var(--nd-border);
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
}
body .global_div_nav button { flex-shrink: 0; margin: 0; background-color: #f5f7fb; }
body .global_div_nav { align-items: center; }
body .global_div_nav button { height: var(--nd-control); min-height: var(--nd-control); font-family: Arial, Helvetica, sans-serif; }
@media (min-width:901px) {
    body .global_div_nav { --nd-control: 28px; height: 44px; padding: 6px 8px; }
    body .global_div_nav button { padding: 4px 7px; font-size: 12px; line-height: 18px; }
    body .global_div_nav button[class*="~"] { padding: 4px; }
    .datamanagement_div_change { top: 44px; }
}
body .global_btn_status { width: var(--nd-control); height: var(--nd-control); }
body input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]), body select, body textarea {
    box-sizing: border-box;
    min-height: var(--nd-control);
    padding: 8px;
    border: 1px solid #bccadc;
    border-radius: 7px;
    background-color: var(--nd-surface);
    color: var(--nd-ink);
}
body .global_txt_search { background-image: none; padding-left: 12px; }
body #map_txt_search { background-image: none; padding-left: 12px; }
body .table_status button { min-width: var(--nd-control); }
body #main_btn_selectMode { width: var(--nd-control); height: var(--nd-control); }
body .global_div_window { border: 1px solid var(--nd-border); border-radius: var(--nd-radius); box-shadow: 0 12px 44px #172c4b33; }
body .global_btn_close_window, body .global_btn_max_window { min-width: var(--nd-control); min-height: var(--nd-control); }
body .main_div_map_nav button { min-height: var(--nd-control); margin: 0; }
.update-panel { max-width: 900px; margin: 80px auto 24px; padding: 24px; background: var(--nd-surface); border: 1px solid var(--nd-border); border-radius: var(--nd-radius); }
.update-panel label { display: block; margin: 16px 0 8px; }
.update-panel pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.update-panel button { margin: 8px 8px 8px 0; }
.map-mission-label { position: absolute; top: 0; left: 32px; background: white; border: 1px solid var(--nd-border); border-radius: 5px; padding: 3px 6px; white-space: nowrap; color: var(--nd-ink); font: 600 12px Arial; }
.map-collision-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 700; }
.map-marker-roster { position: absolute; right: 8px; top: 64px; bottom: 32px; width: min(240px, 65%); overflow: auto; padding: 6px; background: #fffffff2; border: 1px solid var(--nd-border); border-radius: 8px; z-index: 750; }
.map-marker-roster button { display: block; width: 100%; text-align: left; margin-bottom: 4px; }
.olPopup { z-index: 900 !important; }
.map-popup-body { overflow-wrap: anywhere; }
.olPopup .map_popup { min-width: 0; }
@media (max-width: 900px) {
    #map .olPopup { left: 8px !important; top: 104px !important; width: calc(100vw - 64px) !important; height: auto !important; }
    #map .olPopup .map_popup { width: auto !important; height: auto !important; max-width: none; max-height: 230px; padding: 12px 28px 12px 12px; }
}
@media (min-width: 901px) {
    .div_main_container { position: relative; inset: auto; width: auto; height: auto; margin: 56px 0 0; padding: 12px; }
    .table_main { border-collapse: separate; border-spacing: 10px; table-layout: fixed; height: auto; }
    .table_main > tbody > tr > td { padding: 14px; border: 1px solid var(--nd-border); border-radius: var(--nd-radius); background: var(--nd-surface); }
    .td_main_eibar, .td_main_missions, .td_main_events { width: 48%; }
    .td_main_map, .td_main_unitmonitor, .td_main_unitData { width: 52%; }
    .main_div_eibar_content { display: grid; grid-template-columns: 104px minmax(0,1fr) 40px 40px 20px; gap: 8px 6px; align-items: center; }
    .main_div_eibar_content > br { display: none; }
    .main_div_eibar_content > label { grid-column: 1; width: auto; padding: 0; }
    .main_div_eibar_content > input { grid-column: 2; width: 100%; margin: 0; }
    .main_div_eibar_content > .main_txt_eibar_input_first, .main_div_eibar_content > .main_txt_eibar_input_remark { grid-column: 2 / -1; width: 100% !important; }
    .main_div_eibar_content > button { margin: 0; }
    .main_div_eibar_content > .main_img_image { width: 20px; height: 20px; padding: 0; margin: 0; }
    .main_div_eibar_h_right { float: none; width: auto; margin-bottom: 10px; line-height: 2.8; }
    .main_div_eibar_h_right input, .main_div_eibar_h_right select { max-width: 190px; }
    .main_div_eibar_assignedUnits { min-height: 100px; max-height: 180px; box-shadow: none; border-radius: 8px; }
    .main_div_eibar_buttons { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; margin: 10px 0; }
    .main_div_eibar_buttons { flex-direction: row-reverse; }
    .main_div_eibar_buttons button { margin: 0; }
    .main_lbl_h { display: inline-block; font-size: 18px; color: var(--nd-ink); margin-bottom: 10px; }
    .td_main_map { min-height: 500px; }
    .td_main_unitmonitor #table_units { width: 100%; table-layout: fixed; }
    .main_div_unitmonitor { min-width: 0; display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 8px; }
    .main_div_unitmonitor #table_status { width: 90px; float: none; }
    .main_div_unitmonitor #table_status button { min-width: 40px; padding: 6px; }
    .td_main_unitmonitor #table_units > tr, .td_main_unitmonitor #table_units > tbody > tr { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 6px; }
    .td_main_unitmonitor #table_units td { display: block; width: auto; min-width: 0; }
    .div_unit { padding: 7px; min-height: 32px; box-sizing: border-box; overflow-wrap: anywhere; border-radius: 6px; }
    .table_missions { width: 100%; table-layout: fixed; }
    .table_missions[style*="block"] { display: table !important; }
    .main_div_missions { clear: both; width: 100%; height: auto; max-height: 55vh; }
    .main_div_missions_pre { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
    .main_div_missions_pre input, .main_div_missions_pre label { float: none !important; }
    .main_div_missions_pre .main_lbl_h { order: -1; margin-right: auto; }
    .table_missions thead { display: table-header-group; }
    .table_missions tbody { display: table-row-group; }
    .table_missions th:nth-child(n), .table_missions td:nth-child(n) { min-width: 0; max-width: none; }
    .table_missions td { min-width: 0 !important; overflow-wrap: anywhere; }
    .table_missions td:nth-child(4) { width: auto; }
    .table_missions th:nth-child(1), .table_missions td:nth-child(1) { width: 70px; }
    .table_missions th:nth-child(2), .table_missions td:nth-child(2) { width: 95px; }
    .table_missions th:nth-child(3), .table_missions td:nth-child(3) { width: 26%; }
    .table_missions th:nth-child(4), .table_missions td:nth-child(4) { width: auto; }
    .div_main_additionalInfos { top: 56px; height: calc(100% - 56px); }
    .main_iframe_assignedUnit { top: 56px; }
    .datamanagement_div_change { top: 44px; height: calc(50% - 103px); }
    .global_div_buttons { top: calc(50% - 50px); height: 50px; }
}
@media (max-width: 900px) {
    :root { --nd-control: 44px; }
    body .global_div_nav { padding: 6px 8px; }
    body .main_div_eibar_content button, body .main_div_eibar_buttons button, body .main_div_map_nav button { min-height: 44px; }
    body .main_div_eibar_content button[class*="~"], body .main_div_eibar_buttons button[class*="~"] { width: 44px; height: 44px; padding: 8px; }
    body .div_main_container input, body .div_main_container select { font-size: 16px !important; }
    body .td_main_map #map_txt_search { padding-left: 12px; background-image: none; }
    .update-panel { margin: 72px 8px 16px; padding: 16px; }
}
/* Desktop dispatch console: the six work areas share the available viewport. */
@media (min-width: 901px) {
    body:has(.table_main) { overflow: hidden; --nd-control: 32px; }
    .div_main_container { position: fixed; inset: 56px 0 0; margin: 0; padding: 8px; height: auto; box-sizing: border-box; }
    .table_main { display: grid; height: 100%; grid-template-columns: minmax(0,48fr) minmax(0,52fr); grid-template-rows: minmax(0,56fr) minmax(0,28fr) minmax(0,16fr); gap: 8px; }
    .table_main > tbody, .table_main > tbody > tr { display: contents; }
    .table_main > tbody > tr > td { display: flex; flex-direction: column; min-width: 0; min-height: 0; width: auto; overflow: hidden; padding: 8px; box-sizing: border-box; }
    #workspace-editor { overflow: auto; }
    .main_lbl_h { font-size: 15px; margin-bottom: 6px; }
    .main_div_eibar_h_right { margin-bottom: 5px; padding: 0; line-height: 2; }
    .main_div_eibar_content { grid-template-columns: 88px minmax(0,1fr) 32px 32px 20px; gap: 4px; }
    body:has(.table_main) input:not([type=checkbox]):not([type=radio]), body:has(.table_main) select { padding: 4px 6px; }
    body:has(.table_main) button { padding: 4px 7px; }
    body:has(.table_main) button[class*="~"] { padding: 5px; }
    .main_div_eibar_buttons { gap: 4px; margin: 6px 0; }
    #main_div_eibar > br { display: none; }
    .main_div_eibar_assignedUnits { min-height: 40px; max-height: 80px; }
    #workspace-map { padding: 0; }
    .main_div_map_nav { position: static; display: flex; flex-wrap: wrap; flex: 0 0 auto; gap: 4px; padding: 5px; width: auto; box-sizing: border-box; }
    .main_div_map { position: relative; inset: auto; flex: 1 1 0; min-height: 0; width: 100%; height: auto; }
    .main_div_missions_pre { flex: 0 0 auto; gap: 5px; padding: 0 0 5px; }
    .main_div_missions_pre .main_lbl_h { margin-bottom: 0; }
    .main_div_missions { flex: 1 1 0; min-height: 0; max-height: none; overflow: auto; overscroll-behavior: contain; }
    .main_div_unitmonitor { flex: 1 1 0; min-height: 0; overflow: auto; grid-template-columns: 68px minmax(0,1fr); align-items: start; overscroll-behavior: contain; }
    .main_div_unitmonitor #table_status { width: 68px; }
    .main_div_unitmonitor #table_status button { min-width: 30px; width: 30px; padding: 3px; }
    .td_main_unitmonitor #table_units > tr, .td_main_unitmonitor #table_units > tbody > tr { grid-template-columns: repeat(3,minmax(0,1fr)); align-items: start; gap: 4px; }
    .main_div_events { flex: 1 1 0; min-height: 0; height: auto; overflow: auto; overscroll-behavior: contain; }
    .td_main_unitData { overflow: auto !important; }
    .td_main_unitData > hr { display: none; }
    .table_unitData { font-size: 12px; }
    .table_unitData td { height: auto !important; }
}
.table_units { float: none; margin: 0; height: auto; }
.td_main_unitmonitor #table_units td { height: auto; min-height: 20px; padding: 0; }
.div_unit { min-width: 0; max-width: none; min-height: 26px; margin: 0 0 3px; padding: 4px 6px; box-shadow: none; }
.div_unit.noborder { display: none; }
.div_unit.is-dragging { opacity: .45; }
.table_units td.drop-target { outline: 2px dashed var(--nd-accent); outline-offset: -2px; background: #edf4ff; }
.table_missions td { padding: 6px 5px; border-bottom: 1px solid #e8edf4; }
.table_missions thead { position: sticky; top: 0; z-index: 1; background: #edf2f8; }
.table_missions tbody tr:hover { background-color: #edf4ff; }
.table_events { width: 100%; border-collapse: collapse; }
.table_events td { padding: 5px 7px; border-bottom: 1px solid #e8edf4; overflow-wrap: anywhere; }
.table_events tr:hover { background-color: #edf4ff; }
@media (min-width: 901px) {
    .td_main_map .main_div_map { top: auto; height: auto; }
    .main_div_events { position: relative; width: 100%; scrollbar-width: thin; }
    .main_div_events::-webkit-scrollbar { display: initial; width: 7px; }
}
.table_events td:first-child, .table_events td:last-child { border: 0; }
.table_events button { width: 100%; background: #ffffffc9; color: #172c4b; border-color: #172c4b30; }
.table_events td:first-child, .table_events td:last-child { min-width: 96px; width: 96px !important; }
.table_events button { white-space: nowrap; }
@media (min-width: 901px) {
    .div_unit .dropdown-content { position: fixed; left: var(--unit-menu-x, 50%); top: var(--unit-menu-y, 64px); width: 280px; max-height: calc(100dvh - 80px); overflow: auto; border: 1px solid var(--nd-border); border-radius: 8px; padding: 5px; }
    .div_unit .dropdown-content a { padding: 6px 8px; }
}
@media (max-width: 900px) { .div_unit:not(.noborder) { min-height: 44px; padding: 8px 6px; } }

/* Keep all shared button variants legible, including input buttons. */
body button:hover, body input[type="button"]:hover, body input[type="submit"]:hover,
body input[type="button"]:focus-visible, body input[type="submit"]:focus-visible {
    animation:none; background-color:#e7eef8; color:#172c4b; border-color:#91aaca;
}
body .global_btn_save:hover, body #main_btn_save_eibar:hover { background-color:#125536; color:#fff; }
body .global_btn_delete:hover { background-color:#fbe3e5; color:#891b28; }
body .global_div_window input:focus-visible, body .global_div_window select:focus-visible,
body .global_div_window textarea:focus-visible { outline:2px solid #3979c6; outline-offset:-2px; }

@media(min-width:901px) {
    body { --nd-control:28px; }
    body button, body input[type=button], body input[type=submit] { padding:4px 7px; font-size:12px; line-height:18px; }
}
body .main_div_eibar input:focus-visible, body .main_div_eibar select:focus-visible,
body .main_div_eibar_content input.field-confirmed:focus { outline:2px solid #3979c6; outline-offset:-2px; }
#gm_div_user { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; padding:12px; box-sizing:border-box; }
.missiongroup-user { display:flex; gap:10px; align-items:center; padding:10px; background:#f5f7fb; border:1px solid #d6deea; border-radius:7px; }
.missiongroup-user:has(input:checked) { background:#edf4ff; border-color:#91aaca; }
.missiongroup-user label { flex:1; cursor:pointer; margin:0; }
.missiongroup-user input { flex:none; width:20px; height:20px; }
.div_unit .dropdown-content { color:#172c4b; background:#fff; }
.unit-status-menu summary { color:#172c4b!important; background:#edf2f8; border-radius:6px; }
.dropdown-content a > i { display:inline-block; width:22px; text-align:center; margin-right:6px; }

body .div_main_additionalInfos { box-sizing:border-box; padding:16px; background:#fff; color:#172c4b; border-left:1px solid #d6deea; box-shadow:-8px 0 24px #172c4b20; overflow:auto; }
.div_main_additionalInfos > h2 { font:600 18px Arial,sans-serif; margin:8px 0 16px; }
.div_main_additionalInfos > br { display:none; }
body .div_additionalInfos_tabs { height:auto; }
body .div_additionalInfos_tabs_nav { display:flex; flex-wrap:wrap; gap:6px; padding:8px 0; }
body .div_additionalInfos_tabs_nav button.aI_tab_active { background:#2463a6; color:white; border-color:#2463a6; }
body .div_additionalInfos_tab_content:not(.hidden) { width:100%; height:auto; box-sizing:border-box; padding:12px 0; border-color:#d6deea; }
body .div_additionalInfos_tab_table { height:auto; max-height:50dvh; overflow:auto; margin-top:12px; }
.div_main_additionalInfos table { width:100%; border-collapse:collapse; font:13px/1.45 Arial,sans-serif; }
.div_main_additionalInfos th { background:#edf2f8; color:#52647a; position:sticky; top:0; }
.div_main_additionalInfos th, .div_main_additionalInfos td { padding:8px; border-bottom:1px solid #e4eaf2; text-align:left; overflow-wrap:anywhere; }
.div_main_additionalInfos tbody tr:hover { background:#edf4ff; }
body .div_main_additionalInfos input, body .div_main_additionalInfos textarea, body .div_main_additionalInfos select { max-width:100%; }
body .div_main_additionalInfos textarea { width:100%; min-height:100px; resize:vertical; }

/* Focus stays inside the allocated control box at every application zoom. */
body button:focus, body button:focus-visible, body input:focus, body select:focus, body textarea:focus { outline:2px solid #3979c6!important; outline-offset:-2px!important; box-shadow:none!important; }
body button:hover { outline-offset:-2px!important; }
body .div_main_additionalInfos { top:0!important; bottom:0!important; height:auto!important; max-height:100%; padding-top:20px; }
body .div_main_additionalInfos h2 { line-height:1.4; margin-top:12px; }
body .div_additionalInfos_tab_content { overflow-x:auto; }
body .div_main_additionalInfos input, body .div_main_additionalInfos textarea { box-sizing:border-box; }
body .olControlLayerSwitcher .layersDiv { background:#fff!important; color:#172c4b!important; opacity:1!important; }
body .olControlLayerSwitcher .layersDiv label, body .olControlLayerSwitcher .layersDiv span, body .olControlLayerSwitcher .layersDiv div { color:#172c4b!important; font:inherit; }
@media(max-width:900px) {
 body .div_unit .dropdown-content { top:12px!important; bottom:auto!important; max-height:calc(100% - 24px)!important; overflow:auto!important; overscroll-behavior:contain; }
 body .table_main .td_main_unitData { display:block!important; height:auto!important; min-height:130px; overflow:visible!important; }
}

body .div_main_additionalInfos { height:var(--viewport-height,100dvh)!important; max-height:var(--viewport-height,100dvh)!important; }

/* Shared map pin, also used by the object editor preview. */
.nd-fa-marker { position:relative; display:block; width:24px!important; height:25px!important; margin:0!important; padding:0!important; border:0; background:transparent; }
.nd-fa-marker::before { content:''; position:absolute; inset:0; background:center/24px 25px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 25'%3E%3Cpath fill='%23009fee' d='M12 0C6.9 0 3 4 3 9c0 6 9 16 9 16s9-10 9-16c0-5-3.9-9-9-9Z'/%3E%3C/svg%3E"); }
.nd-fa-marker > i { position:absolute; display:flex; align-items:center; justify-content:center; left:4px; top:3px; width:16px; height:12px; margin:0!important; padding:0!important; font-size:10px; line-height:12px; color:#fff; transform:none; }


.remember-panel { box-sizing:border-box; width:calc(100% - 24px); max-width:460px; margin:6vh auto; padding:20px; background:white; border:1px solid #d6deea; border-radius:10px; }
.remember-panel h1 { font-size:22px; line-height:1.3; }
.remember-actions { display:flex; flex-direction:column; gap:8px; }
body .remember-actions button { width:100%; white-space:nowrap; min-width:0; font-size:14px; }

button[class*="~clipboard"]::before { content:"\f328"; }