:root {
    --pro-dark: #0f1720;
    --pro-dark-2: #17212b;
    --pro-blue: #1d63ff;
    --pro-border: #dbe4ef;
    --pro-soft: #f7f9fc;
    --pro-text: #0f172a;
    --pro-muted: #64748b;
}

body {
    background: #0f1720 !important;
}

.sidebar {
    background: linear-gradient(180deg, #111b26 0%, #07111c 100%) !important;
    color: #fff !important;
    border-right: 1px solid rgba(255,255,255,.08) !important;
}

.sidebar-title,
.sidebar h2,
.sidebar h3 {
    color: #fff !important;
}

.sidebar p,
.sidebar label,
.sidebar .form-label {
    color: rgba(255,255,255,.68) !important;
}

.mode-buttons {
    gap: 10px !important;
}

.mode-btn,
.sidebar .btn {
    border-radius: 12px !important;
    min-height: 44px;
    font-weight: 700;
}

.mode-btn.active,
.mode-btn.btn-dark,
.sidebar .btn-dark {
    background: var(--pro-blue) !important;
    border-color: var(--pro-blue) !important;
    color: #fff !important;
}

.mode-btn.btn-outline-dark,
.mode-btn.btn-outline-primary,
.sidebar .btn-outline-dark,
.sidebar .btn-outline-secondary {
    background: rgba(255,255,255,.96) !important;
    border-color: rgba(255,255,255,.18) !important;
    color: #0f172a !important;
}

.mode-btn[data-mode="select"],
#rotate-label-btn {
    display: none !important;
}

#ai-draw-panel {
    background: #fff !important;
    border-radius: 18px !important;
    overflow: hidden;
    box-shadow: 0 18px 40px rgba(15,23,42,.16) !important;
}

#ai-draw-panel > .legend-accordion-toggle,
button[data-target="ai-draw-panel"] {
    background: #f8fafc !important;
    color: #0f172a !important;
    border-bottom: 1px solid #e5edf7 !important;
}

button[data-target="ai-draw-panel"] span:first-child {
    font-size: 0 !important;
}

button[data-target="ai-draw-panel"] span:first-child::after {
    content: "AI Mintia Copilot";
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .02em;
}

#ai-draw-panel label,
#ai-draw-panel .form-label,
#ai-draw-panel select,
#ai-draw-panel .form-select,
#ai-draw-prompt,
#ai-draw-preview-btn,
#ai-chat-send-btn,
#ai-draw-panel p,
#ai-draw-panel .small,
#ai-draw-panel .text-muted {
    display: none !important;
}

.ai-pro-header {
    display: flex;
    gap: 12px;
    align-items: center;
    margin: 14px 0 12px;
}

.ai-pro-avatar {
    width: 42px;
    height: 42px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #173b91, #2563eb);
    color: #fff;
    font-weight: 900;
    box-shadow: 0 8px 22px rgba(37,99,235,.28);
}

.ai-pro-title {
    font-weight: 900;
    color: var(--pro-text);
    font-size: 16px;
}

.ai-pro-subtitle {
    color: var(--pro-muted);
    font-size: 12px;
}

#ai-chat-input {
    display: block !important;
    width: 100%;
    min-height: 92px !important;
    border-radius: 16px !important;
    border: 1px solid var(--pro-border) !important;
    background: #fff !important;
    padding: 14px !important;
    font-size: 14px;
    resize: vertical;
}

#ai-chat-input:focus {
    border-color: var(--pro-blue) !important;
    box-shadow: 0 0 0 4px rgba(29,99,255,.14) !important;
}

#ai-chat-messages {
    display: flex !important;
    flex-direction: column;
    gap: 9px;
    max-height: 280px;
    overflow-y: auto;
    padding: 10px 2px;
    border: 0 !important;
    background: transparent !important;
}

.ai-msg-user {
    align-self: flex-end;
    background: #0f172a;
    color: #fff;
    border-radius: 16px 16px 4px 16px;
    padding: 10px 12px;
    max-width: 88%;
    font-size: 13px;
}

.ai-msg-assistant {
    align-self: flex-start;
    background: #eef2f7;
    color: #0f172a;
    border-radius: 16px 16px 16px 4px;
    padding: 10px 12px;
    max-width: 92%;
    font-size: 13px;
}

.ai-pro-context {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 12px 0;
}

.ai-pro-pill {
    background: #f8fafc;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    padding: 9px 10px;
    font-size: 12px;
    color: #334155;
}

.ai-pro-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 10px 0 14px;
}

.ai-pro-action {
    border: 1px solid #dbe4ef;
    background: #fff;
    color: #0f172a;
    border-radius: 13px;
    padding: 10px;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.ai-pro-action.primary {
    background: var(--pro-blue);
    color: #fff;
    border-color: var(--pro-blue);
}

.ai-doc-card {
    border-top: 1px solid #e5edf7;
    padding-top: 14px;
    margin-top: 14px;
}

.ai-doc-title {
    font-size: 14px;
    font-weight: 900;
    color: #0f172a;
    margin-bottom: 9px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ai-info-dot {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    display: grid;
    place-items: center;
    color: #334155;
    font-size: 12px;
    cursor: help;
}

.ai-doc-drop {
    border: 1px dashed #b8c7da;
    border-radius: 18px;
    background: linear-gradient(180deg, #fff, #f8fafc);
    padding: 18px;
    text-align: center;
}

.ai-doc-drop input {
    display: none;
}

.ai-doc-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 9px 16px;
    font-weight: 800;
    color: #1d4ed8;
    cursor: pointer;
    margin-top: 8px;
}

.ai-doc-help {
    color: #64748b;
    font-size: 11px;
    margin-top: 10px;
}

.ai-doc-result {
    margin-top: 10px;
    background: #f8fafc;
    border: 1px solid #e5edf7;
    border-radius: 14px;
    padding: 10px;
    font-size: 12px;
    color: #0f172a;
    white-space: pre-wrap;
}

.ai-typing {
    align-self: flex-start;
    display: inline-flex;
    gap: 4px;
    align-items: center;
    padding: 9px 11px;
    border-radius: 14px;
    background: #eef2f7;
}

.ai-typing span {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #64748b;
    animation: aiBounce 1s infinite ease-in-out;
}

.ai-typing span:nth-child(2) { animation-delay: .15s; }
.ai-typing span:nth-child(3) { animation-delay: .3s; }

@keyframes aiBounce {
    0%, 80%, 100% { transform: translateY(0); opacity: .45; }
    40% { transform: translateY(-5px); opacity: 1; }
}

.openseadragon-container img[alt="Zoom in"],
.openseadragon-container img[alt="Zoom out"],
.openseadragon-container img[title="Zoom in"],
.openseadragon-container img[title="Zoom out"] {
    display: none !important;
}

/* UI PRO 2A - app layout closer to professional GIS/editor */
.sidebar {
    width: 230px !important;
    min-width: 230px !important;
    max-width: 230px !important;
    padding: 16px 14px !important;
}

.sidebar-inner {
    padding: 0 !important;
}

.sidebar-title,
.sidebar > h2,
.sidebar p,
.sidebar .sidebar-description {
    display: none !important;
}

.mode-buttons {
    margin-top: 8px !important;
}

.mode-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    margin-bottom: 10px;
    box-shadow: 0 8px 18px rgba(0,0,0,.16);
}

.mode-btn[data-mode="add"]::before { content: "+"; font-size: 22px; line-height: 1; }
.mode-btn[data-mode="move"]::before { content: "↔"; font-size: 17px; }
.mode-btn[data-mode="move-label"]::before { content: "▣"; font-size: 15px; }
.mode-btn[data-mode="ai-draw"]::before { content: "✦"; font-size: 17px; }

#ai-draw-panel {
    position: fixed !important;
    top: 54px !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 430px !important;
    max-width: 430px !important;
    border-radius: 0 !important;
    border-left: 1px solid #dbe4ef !important;
    z-index: 50 !important;
    overflow-y: auto !important;
    box-shadow: -18px 0 45px rgba(15,23,42,.18) !important;
}

#ai-draw-panel .legend-accordion-content,
#ai-draw-panel .accordion-body,
#ai-draw-panel > div:not(.legend-accordion-toggle) {
    padding-left: 22px !important;
    padding-right: 22px !important;
}

#map,
#viewer,
.openseadragon-container {
    border-radius: 0 !important;
}

#ai-chat-input {
    min-height: 108px !important;
}

.ai-pro-actions {
    grid-template-columns: 1fr 1fr !important;
}

.ai-doc-card {
    margin-top: 18px !important;
    padding-top: 18px !important;
}

.ai-doc-drop {
    padding: 24px 18px !important;
}

@media (max-width: 1300px) {
    #ai-draw-panel {
        width: 380px !important;
        max-width: 380px !important;
    }

    .sidebar {
        width: 210px !important;
        min-width: 210px !important;
        max-width: 210px !important;
    }
}

/* UI PRO 2B - final polish toward GIS/CAD interface */
body {
    overflow: hidden !important;
}

.navbar,
header,
.topbar {
    height: 54px !important;
    background: linear-gradient(90deg, #07111c, #101923) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

.sidebar {
    position: fixed !important;
    top: 54px !important;
    left: 0 !important;
    bottom: 34px !important;
    width: 250px !important;
    min-width: 250px !important;
    max-width: 250px !important;
    padding: 18px 18px !important;
    overflow-y: auto !important;
    z-index: 40 !important;
    background: linear-gradient(180deg, #111b26 0%, #06111d 100%) !important;
}

.sidebar::before {
    content: "AI DRAW";
    display: block;
    color: rgba(255,255,255,.72);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    margin: 4px 0 14px;
}

.mode-btn {
    justify-content: flex-start !important;
    padding: 0 18px !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    color: #0f172a !important;
    border: 0 !important;
    box-shadow: 0 10px 22px rgba(0,0,0,.22) !important;
}

.mode-btn.active {
    background: #1d63ff !important;
    color: #fff !important;
}

.mode-btn[data-mode="ai-draw"] {
    margin-bottom: 24px !important;
}

.mode-btn[data-mode="ai-draw"]::after {
    content: "";
    display: block;
    height: 1px;
    background: rgba(255,255,255,.14);
    position: absolute;
}

button[data-target="search-panel"],
button[data-target="filters-panel"],
button[data-target="new-object-panel"],
button[data-target="selected-object-panel"] {
    background: transparent !important;
    color: rgba(255,255,255,.92) !important;
    border: 0 !important;
    border-top: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 14px 0 !important;
    font-weight: 900 !important;
}

button[data-target="search-panel"]::after,
button[data-target="filters-panel"]::after,
button[data-target="new-object-panel"]::after,
button[data-target="selected-object-panel"]::after {
    content: "+";
    margin-left: auto;
    font-size: 18px;
    color: rgba(255,255,255,.8);
}

#ai-draw-panel {
    top: 54px !important;
    right: 0 !important;
    bottom: 34px !important;
    width: 450px !important;
    max-width: 450px !important;
    padding-top: 0 !important;
}

#ai-draw-panel > button,
button[data-target="ai-draw-panel"] {
    display: none !important;
}

#ai-draw-panel .legend-accordion-content,
#ai-draw-panel .accordion-body,
#ai-draw-panel > div:not(.legend-accordion-toggle) {
    padding: 28px 28px !important;
}

.ai-pro-header {
    margin-top: 0 !important;
}

.ai-pro-title {
    font-size: 17px !important;
}

.ai-pro-subtitle {
    font-size: 12px !important;
}

#ai-chat-input {
    min-height: 116px !important;
    border-radius: 17px !important;
    padding: 16px 48px 16px 16px !important;
}

.ai-pro-actions {
    gap: 10px !important;
}

.ai-pro-action {
    min-height: 42px;
    font-size: 13px !important;
    border-radius: 13px !important;
}

.ai-doc-title {
    font-size: 15px !important;
}

.ai-doc-drop {
    min-height: 160px;
    display: grid;
    place-items: center;
}

.ai-doc-button {
    min-width: 128px;
}

/* map visible area: sidebar left + AI panel right + status bar bottom */
#map {
    margin-left: 250px !important;
    margin-right: 450px !important;
    height: calc(100vh - 88px) !important;
}

.openseadragon-container {
    margin-left: 250px !important;
    margin-right: 450px !important;
    height: calc(100vh - 88px) !important;
}

/* floating top map toolbar mock/pro controls */
body::before {
    content: "⌖   ◉   □   ╱   T   🗑   ✋";
    position: fixed;
    top: 72px;
    left: 282px;
    z-index: 80;
    background: rgba(255,255,255,.94);
    border: 1px solid #dbe4ef;
    border-radius: 15px;
    padding: 12px 20px;
    font-size: 22px;
    letter-spacing: 18px;
    color: #0f172a;
    box-shadow: 0 18px 40px rgba(15,23,42,.18);
    backdrop-filter: blur(10px);
}

/* bottom status bar */
body::after {
    content: "Lat: 45.82923    Lng: 23.12345                                      Selectat: -                                      Grid: OFF        Snap: ON        Zoom: scroll";
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 34px;
    z-index: 90;
    background: rgba(255,255,255,.97);
    border-top: 1px solid #dbe4ef;
    color: #334155;
    display: flex;
    align-items: center;
    padding: 8px 22px;
    font-size: 13px;
    box-shadow: 0 -10px 24px rgba(15,23,42,.08);
}

@media (max-width: 1450px) {
    #ai-draw-panel {
        width: 410px !important;
        max-width: 410px !important;
    }

    #map,
    .openseadragon-container {
        margin-right: 410px !important;
    }

    .sidebar {
        width: 230px !important;
        min-width: 230px !important;
        max-width: 230px !important;
    }

    #map,
    .openseadragon-container {
        margin-left: 230px !important;
    }

    body::before {
        left: 260px;
    }
}

/* UI PRO 2C - cleanup + left visual layer panel */
body::before {
    display: none !important;
    content: none !important;
}

.sidebar .legend-accordion-content:not(#ai-draw-panel),
.sidebar .accordion-body {
    background: transparent !important;
    color: #fff !important;
}

.sidebar .legend-accordion-toggle {
    min-height: 42px !important;
}

.pro-layer-panel {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.14);
}

.pro-layer-title {
    color: rgba(255,255,255,.72);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    margin-bottom: 10px;
}

.pro-layer-select {
    width: 100%;
    height: 48px;
    border-radius: 13px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.06);
    color: #fff;
    padding: 0 14px;
    font-weight: 800;
}

.pro-layer-select option {
    color: #0f172a;
}

.pro-visual-panel {
    margin-top: 20px;
}

.pro-zoom-grid {
    display: grid;
    grid-template-columns: 56px 1fr 56px;
    gap: 10px;
    align-items: center;
}

.pro-zoom-btn,
.pro-fit-btn {
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.06);
    color: #fff;
    border-radius: 13px;
    min-height: 48px;
    font-weight: 900;
    cursor: pointer;
}

.pro-zoom-value {
    color: #fff;
    text-align: center;
    font-weight: 900;
}

.pro-fit-btn {
    width: 100%;
    margin-top: 10px;
}

.pro-map-toolbar {
    position: fixed;
    top: 72px;
    left: 282px;
    z-index: 80;
    background: rgba(255,255,255,.96);
    border: 1px solid #dbe4ef;
    border-radius: 15px;
    padding: 8px;
    display: flex;
    gap: 6px;
    box-shadow: 0 18px 40px rgba(15,23,42,.18);
    backdrop-filter: blur(10px);
}

.pro-map-tool {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #0f172a;
    font-size: 18px;
    cursor: pointer;
}

.pro-map-tool.active,
.pro-map-tool:hover {
    background: #eaf1ff;
    outline: 2px solid rgba(37,99,235,.25);
}

.pro-map-toast {
    position: fixed;
    left: 290px;
    bottom: 56px;
    z-index: 85;
    background: rgba(255,255,255,.96);
    border: 1px solid #dbe4ef;
    color: #0f172a;
    border-radius: 14px;
    padding: 14px 18px;
    box-shadow: 0 18px 40px rgba(15,23,42,.16);
    font-size: 14px;
    max-width: 420px;
}

#map {
    background: #111827 !important;
}

/* hide empty white leftovers in left sidebar */
.sidebar .legend-accordion-toggle:empty,
.sidebar .btn:empty {
    display: none !important;
}

@media (max-width: 1450px) {
    .pro-map-toolbar {
        left: 260px;
    }
}

/* UI PRO CLEAN LEFT + MAP FIX */
.sidebar .legend-accordion-toggle.is-card-toggle:not([data-target="ai-draw-panel"]),
.sidebar .legend-accordion-toggle:not([data-target="ai-draw-panel"]):not(.pro-keep),
.sidebar #search-panel,
.sidebar #filters-panel,
.sidebar #new-object-panel,
.sidebar #selected-object-panel {
    display: none !important;
}

.sidebar button:empty,
.sidebar .btn:empty,
.sidebar .legend-accordion-toggle:empty {
    display: none !important;
}

.sidebar {
    width: 250px !important;
    min-width: 250px !important;
    max-width: 250px !important;
}

#map {
    position: fixed !important;
    top: 54px !important;
    left: 250px !important;
    right: 450px !important;
    bottom: 34px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    background: #111827 !important;
    overflow: hidden !important;
}

#map .openseadragon-container,
.openseadragon-container {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
}

.pro-layer-panel,
.pro-visual-panel,
.pro-sidebar-section {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.14);
}

.pro-sidebar-row {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: rgba(255,255,255,.92);
    font-weight: 900;
    font-size: 13px;
    border-bottom: 1px solid rgba(255,255,255,.12);
    cursor: pointer;
}

.pro-sidebar-row span:last-child {
    color: rgba(255,255,255,.75);
    font-size: 18px;
}

.pro-map-toolbar {
    left: 280px !important;
}

.pro-map-toast {
    left: 280px !important;
}

@media (max-width: 1450px) {
    #map {
        left: 230px !important;
        right: 410px !important;
    }

    .pro-map-toolbar,
    .pro-map-toast {
        left: 260px !important;
    }
}

#maplibre-real-satellite {
    position: fixed;
    top: 54px;
    left: 250px;
    right: 450px;
    bottom: 34px;
    z-index: 12;
    background: #111827;
    display: none;
}

body.maplibre-active #maplibre-real-satellite {
    display: block;
}

body.maplibre-active #map {
    visibility: hidden !important;
}

.maplibregl-ctrl-bottom-left,
.maplibregl-ctrl-bottom-right {
    display: none !important;
}


/* FIX FULLSCREEN MAP */
#map {
    width: 100% !important;
    height: 100% !important;
    background: #000;
}

.maplibregl-canvas-container,
.maplibregl-canvas {
    width: 100% !important;
    height: 100% !important;
}

/* === FORCE REAL AI PRO PANEL VISIBILITY === */
body:not(.ai-draw-open) .ai-pro-panel,
body:not(.ai-draw-open) .ai-pro-shell,
body:not(.ai-draw-open) .ai-pro-card,
body:not(.ai-draw-open) .ai-pro-header,
body:not(.ai-draw-open) .ai-doc-card {
    display: none !important;
}

body.ai-draw-open .ai-pro-panel,
body.ai-draw-open .ai-pro-shell,
body.ai-draw-open .ai-pro-card,
body.ai-draw-open .ai-pro-header,
body.ai-draw-open .ai-doc-card {
    display: block !important;
}
/* === FIX MAP WIDTH WITH AI PANEL === */

.main-content,
.map-container,
#map,
.openseadragon-container {
    width: 100% !important;
    height: 100% !important;
}

body.ai-draw-open .map-container,
body.ai-draw-open #map {
    width: calc(100% - 420px) !important; /* latimea panelului AI */
}

body.ai-draw-open .ai-copilot-panel,
body.ai-draw-open #ai-draw-panel {
    width: 420px !important;
    right: 0;
    position: absolute;
    top: 0;
    height: 100%;
}


/* === DMS AI MINIMIZE CONTROL START === */
.dms-ai-minimize-host{
  position: relative !important;
}

.dms-ai-min-btn{
  position:absolute;
  top:10px;
  right:10px;
  z-index:9999;
  width:28px;
  height:28px;
  border-radius:8px;
  border:1px solid rgba(108,168,255,.30);
  background:rgba(7,22,45,.92);
  color:#9ec9ff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(0,0,0,.28);
  transition:all .16s ease;
}

.dms-ai-min-btn:hover{
  background:#153b6d;
  color:#ffffff;
  border-color:#4a97ff;
  transform:translateY(-1px);
}

.dms-ai-min-btn:active{
  transform:translateY(0);
}

.dms-ai-panel-minimized{
  display:none !important;
}
/* === DMS AI MINIMIZE CONTROL END === */
