*{box-sizing:border-box}html,body,#app{height:100%;margin:0;font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#151515}#app{height:100%;position:relative;overflow:hidden}#map{position:absolute;inset:0;background:#eef3f5}
#map-title{position:absolute;top:18px;left:74px;z-index:20;background:rgba(255,255,255,.94);border:1px solid #d6dde4;border-radius:14px;padding:10px 14px;box-shadow:0 4px 18px rgba(0,0,0,.14);backdrop-filter:blur(5px)}.title-main{font-size:24px;font-weight:900;color:#17495a;letter-spacing:.05em}.title-sub{font-size:12px;color:#60707b}
#tool-rail{position:absolute;left:16px;top:92px;z-index:30;display:flex;flex-direction:column;gap:8px}.tool-btn{width:44px;height:44px;border-radius:12px;border:1px solid #c8d2da;background:#fff;color:#17495a;font-size:20px;font-weight:800;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.16)}.tool-btn.active{background:#17495a;color:#fff}
.left-panel{position:absolute;left:72px;top:92px;bottom:18px;z-index:28;width:420px;max-width:calc(100vw - 110px);background:#fff;border:1px solid #d3dce4;border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.22);overflow:hidden;display:flex;flex-direction:column}.left-panel[hidden]{display:none}.panel-head{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 10px 0 14px;background:#17495a;color:#fff;flex:0 0 auto}.panel-head button,.detail-head button,.timeline-modal-head button{border:1px solid rgba(255,255,255,.55);background:transparent;color:#fff;border-radius:999px;min-width:30px;height:30px;cursor:pointer}.panel-section{padding:12px;overflow:auto}.panel-section[hidden]{display:none}
.filters-shell{height:100%;display:flex;flex-direction:column}.filters-scroll{flex:1 1 auto;overflow:auto;padding:0 2px 10px 0;min-height:0}.sql-summary{flex:0 0 170px;border-top:1px solid #d9e1e8;background:#f6fafb;padding:8px 8px 10px 8px}.sql-summary h3{margin-top:0}.sql-summary pre{height:88px;overflow:auto;background:#eef3f5;border:1px solid #d4dfe7;border-radius:8px;padding:7px;font-size:11px;white-space:pre-wrap;word-break:break-word;margin:4px 0}
h3{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:#17495a;margin:12px 0 7px}label{font-weight:600;font-size:13px}select,input,textarea{width:100%;padding:7px;border:1px solid #b7c2cc;border-radius:8px;margin:4px 0 9px;background:#fff}textarea{font-family:Consolas,monospace;font-size:12px}button{border:1px solid #b7c2cc;background:#fff;border-radius:8px;padding:7px 9px;cursor:pointer}button.primary{background:#17495a;color:#fff;border-color:#17495a;font-weight:700}.row,.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row input{width:auto}.spacer{flex:1}.compact-row{font-size:12px}.mode-box{display:flex;gap:12px;align-items:center;margin-bottom:8px}.mode-box input{width:auto}.tree{max-height:300px;overflow:auto;border:1px solid #e2e7eb;border-radius:8px;padding:6px}.tree ul{list-style:none;margin:3px 0 3px 18px;padding:0}.tree input,.check-list input{width:auto}.tree label,.check-list label{display:block;padding:3px 0;font-weight:400}.check-list{max-height:210px;overflow:auto;border:1px solid #e2e7eb;border-radius:8px;padding:8px}#result-count{font-weight:800;color:#276749}
.detail-panel{position:absolute;right:0;top:0;bottom:0;z-index:40;width:50vw;min-width:430px;max-width:82vw;background:#fff;border-left:1px solid #cbd5dd;box-shadow:-12px 0 32px rgba(0,0,0,.25);display:flex;flex-direction:column;transform:translateX(0);transition:transform .28s ease}.detail-panel[hidden]{display:flex;transform:translateX(105%);pointer-events:none}#detail-resize-handle{position:absolute;left:-5px;top:0;bottom:0;width:10px;cursor:ew-resize;background:transparent}#detail-resize-handle:hover{background:rgba(23,73,90,.18)}.detail-head{height:46px;display:flex;align-items:center;justify-content:space-between;background:#17495a;color:#fff;padding:0 12px 0 16px;flex:0 0 auto}.detail-actions{display:flex;gap:8px;align-items:center}.site-card{padding:16px 18px 28px 18px;overflow:auto;flex:1}.site-header{border-bottom:2px solid #222;padding-bottom:9px;margin-bottom:14px}.site-title{font-size:26px;font-weight:800}.site-meta{font-size:13px;color:#5f6670}.section-title{background:#eef3f5;border-left:5px solid #17495a;padding:4px 8px;margin:14px 0 7px;font-size:13px;font-weight:800;color:#123f4d;letter-spacing:1px;text-transform:uppercase}.field-label{font-weight:800;margin-top:6px}.value{line-height:1.42}
.timeline-wrap{overflow-x:auto;margin:2px 0 7px}.timeline{border-collapse:collapse;width:100%;table-layout:auto;font-size:11px;min-width:720px}.timeline td{border:1px solid #b8b8b8;padding:4px 5px;text-align:center;vertical-align:middle;min-width:58px}.tl-on{background:#f2c94c;color:#000;font-weight:800;border:2px solid #222!important}.tl-parent{background:#ffeaa0;color:#000;font-weight:700}.tl-off{background:#f7f7f7;color:#888}
.timeline-modal{position:fixed;inset:26px;z-index:60;background:rgba(0,0,0,.38);display:flex;align-items:center;justify-content:center}.timeline-modal[hidden]{display:none}.timeline-modal-inner{width:min(1200px,calc(100vw - 52px));height:min(70vh,760px);background:#fff;border-radius:14px;box-shadow:0 14px 46px rgba(0,0,0,.35);overflow:hidden;display:flex;flex-direction:column}.timeline-modal-head{height:44px;background:#17495a;color:#fff;padding:0 14px;display:flex;align-items:center;justify-content:space-between}#timeline-modal-body{padding:18px;overflow:auto}#timeline-modal-body .timeline{min-width:1100px;font-size:12px}#timeline-modal-body .timeline td{min-width:84px;padding:6px 8px}

/* STEP 1 - suggerimenti ricerca */
.suggestions{
  margin:6px 0 10px 0;
  border:1px solid #dce5ec;
  border-radius:8px;
  overflow:hidden;
  display:none;
  background:#fff;
  max-height:260px;
  overflow-y:auto;
}
.suggestions.visible{display:block}
.suggestion{
  padding:8px 9px;
  border-bottom:1px solid #eef3f5;
  cursor:pointer;
}
.suggestion:last-child{border-bottom:0}
.suggestion:hover{background:#eef6f8}
.suggestion b{display:block;color:#17495a}
.suggestion small{display:block;color:#65727d;margin-top:2px}


/* STEP 3 - tab scheda laterale */
.detail-tabs{
  display:flex;
  flex:0 0 auto;
  border-bottom:1px solid #d6dfe7;
  background:#f4f7f9;
}
.detail-tab{
  border:0;
  border-radius:0;
  background:transparent;
  padding:10px 14px;
  font-weight:700;
  color:#47606d;
  cursor:pointer;
}
.detail-tab.active{
  background:#fff;
  color:#17495a;
  border-bottom:3px solid #17495a;
}
.detail-tab-panel{
  display:none;
  overflow:auto;
  flex:1;
  min-height:0;
}
.detail-tab-panel.active{display:block}
.attributes-table{
  padding:14px 18px 28px;
}
.attr-row{
  display:grid;
  grid-template-columns:190px 1fr;
  gap:12px;
  border-bottom:1px solid #edf1f4;
  padding:6px 0;
}
.attr-key{
  font-weight:800;
  color:#17495a;
  word-break:break-word;
}
.attr-val{
  word-break:break-word;
  line-height:1.35;
}


/* STEP 4 - timeline compatta */
.detail-panel .timeline-wrap.timeline-compact{
  overflow:hidden;
  width:100%;
}
.detail-panel .timeline-wrap.timeline-compact .timeline{
  width:100%;
  min-width:0;
  table-layout:fixed;
  font-size:8.5px;
}
.detail-panel .timeline-wrap.timeline-compact .timeline td{
  min-width:0;
  padding:3px 2px;
  line-height:1.08;
  word-break:normal;
  overflow:hidden;
  text-overflow:clip;
}

#timeline-modal-body .timeline-wrap.timeline-full{
  overflow:auto;
  width:100%;
}
#timeline-modal-body .timeline-wrap.timeline-full .timeline{
  min-width:1100px;
  table-layout:auto;
  font-size:12px;
}
#timeline-modal-body .timeline-wrap.timeline-full .timeline td{
  min-width:84px;
  padding:6px 8px;
  line-height:1.2;
}


/* STEP 5 - filtri organizzati */
.filters-shell{
  height:100%;
  display:flex;
  flex-direction:column;
  min-height:0;
}
.filters-scroll{
  flex:1 1 auto;
  overflow:auto;
  min-height:0;
  padding:0 4px 8px 0;
}
.filter-section{
  border:1px solid #dce5ec;
  border-radius:10px;
  background:#fbfdfe;
  padding:9px;
  margin:0 0 10px;
}
.filter-section h3{
  margin-top:0;
  padding-bottom:5px;
  border-bottom:1px solid #e5edf2;
}
.muted-section{
  background:#f7fafb;
}
.section-note{
  color:#63737f;
  font-size:12px;
  line-height:1.35;
  margin:4px 0 8px;
}
.placeholder-box{
  border:1px dashed #cbd7df;
  border-radius:8px;
  padding:9px;
  background:#fff;
  color:#71818c;
  font-size:12px;
}
.filter-actions-fixed{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  border-top:1px solid #d9e1e8;
  background:#fff;
  padding:9px 2px;
  z-index:4;
}
.big-action{
  font-size:13px;
  font-weight:800;
  padding:9px;
}
.hidden-command{
  display:none!important;
}
.sql-summary{
  flex:0 0 165px;
}
.sql-summary pre{
  height:84px;
  overflow:auto;
}


/* STEP 6 - sottotipologie e query campi */
.subtype-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}
.subtype-row label{
  font-size:12px;
  color:#4d5c66;
  margin-bottom:2px;
  display:block;
}
.subtype-row select{
  margin-bottom:4px;
}
.search-focus-flash{
  animation: ramvePulse 1.1s ease 2;
}
@keyframes ramvePulse{
  0%{filter:drop-shadow(0 0 0 rgba(242,201,76,0))}
  50%{filter:drop-shadow(0 0 8px rgba(242,201,76,.95))}
  100%{filter:drop-shadow(0 0 0 rgba(242,201,76,0))}
}


/* MATERIALI MULTIVALORE */
.materials-list{
  max-height:190px;
}
.materials-list label{
  display:block;
  padding:3px 0;
  font-weight:400;
}
.materials-list input{
  width:auto;
}


#generic-materials-list[hidden]{
  display:none;
}


/* QUERY GENERALE CAMPI SPECIALI */
#generic-multivalue-list[hidden],
#generic-text[hidden],
#generic-value[hidden]{
  display:none;
}
#generic-multivalue-list{
  max-height:210px;
}
#generic-multivalue-list label{
  display:block;
  padding:3px 0;
  font-weight:400;
}
#generic-multivalue-list input{
  width:auto;
}


/* STEP 8 - sottotipologie contestuali */
#subtype-section[hidden]{
  display:none;
}
.subtype-row[hidden]{
  display:none;
}


/* QUERY GENERALE MULTIPLA */
.generic-query-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:4px 0 8px;
  padding:6px;
  border:1px solid #dce5ec;
  border-radius:8px;
  background:#f6fafb;
}
.generic-query-toolbar input{
  width:auto;
}
#generic-add{
  margin-left:auto;
  width:32px;
  height:30px;
  padding:0;
  font-size:18px;
  font-weight:900;
  background:#17495a;
  color:#fff;
  border-color:#17495a;
}
.generic-extra-block{
  border-top:1px dashed #cbd7df;
  margin-top:10px;
  padding-top:9px;
  position:relative;
}
.generic-extra-remove{
  position:absolute;
  right:0;
  top:7px;
  width:28px;
  height:28px;
  padding:0;
  border-radius:999px;
}


/* UI FILTRI MIGLIORATA */
.filters-layout{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:8px;
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
}
.filters-nav{
  overflow:auto;
  padding:2px 0;
  border-right:1px solid #c6d4dd;
}
.filters-nav button{
  display:block;
  width:100%;
  margin:0 0 6px;
  padding:7px 6px;
  border-radius:8px;
  border:1px solid #b9c7d0;
  background:#e3edf3;
  color:#173f4d;
  font-size:11px;
  font-weight:800;
  text-align:left;
}
.filters-nav button:hover{
  background:#d2e2eb;
}
.filter-section{
  background:#eaf1f5;
  border:1px solid #b9c9d4;
  box-shadow:0 1px 0 rgba(0,0,0,.04);
}
.filter-section > h3{
  background:#17495a;
  color:#fff;
  margin:-9px -9px 9px -9px;
  padding:8px 10px;
  border-radius:9px 9px 0 0;
  border-bottom:0;
}
.filters-scroll{
  scroll-behavior:smooth;
}


/* REFINEMENT - indice filtri più leggero e pannello più largo */
.left-panel{
  width:430px;
  max-width:48vw;
}
.filters-layout{
  grid-template-columns:76px minmax(0,1fr);
  gap:6px;
}
.filters-nav{
  border-right:1px solid #d6e1e8;
  padding:1px 4px 1px 0;
}
.filters-nav button{
  margin:0 0 4px;
  padding:5px 5px;
  border-radius:6px;
  border:1px solid #cfdae2;
  background:#f1f6f8;
  color:#315565;
  font-size:10.5px;
  font-weight:700;
  line-height:1.15;
  text-align:center;
  letter-spacing:-0.1px;
  white-space:normal;
}
.filters-nav button:hover{
  background:#e5eef3;
}
.generic-query-toolbar{
  justify-content:flex-start;
}
#generic-add{
  margin-left:0;
  margin-right:6px;
  flex:0 0 32px;
}





/* CLEAN LEFT PANEL WIDTH - no resize */
.left-panel{
  width:520px;
  max-width:55vw;
  min-width:430px;
  overflow:hidden;
}


/* FINAL TOOLS / BASEMAP / BADGE */
.filter-tool{
  position:relative;
}
#filter-badge{
  position:absolute;
  right:-8px;
  top:-6px;
  min-width:28px;
  padding:2px 5px;
  border-radius:999px;
  background:#c0392b;
  color:#fff;
  font-size:10px;
  font-weight:800;
  line-height:1;
  box-shadow:0 1px 4px rgba(0,0,0,.25);
}
.basemap-options{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:8px 2px;
}
.basemap-options label{
  display:flex;
  align-items:center;
  gap:7px;
  padding:8px;
  border:1px solid #d6e1e8;
  border-radius:8px;
  background:#f7fafb;
}
.basemap-options input{
  width:auto;
}
.site-card .timeline-wrap{
  cursor:pointer;
}
.site-card .timeline-wrap::after{
  content:"clicca per aprire la timeline completa";
  display:block;
  margin-top:4px;
  font-size:11px;
  color:#58727e;
}


/* FILTER FUNNEL ICON */
.filter-icon-svg{
  width:23px;
  height:23px;
  display:block;
  color:#111;
}
.tool-btn.active .filter-icon-svg,
.filter-tool:has(#filter-badge:not([hidden])) .filter-icon-svg{
  color:#17495a;
}

/* BASEMAP WIDGET - bottom left, Google Maps style */
.basemap-widget{
  position:absolute;
  left:14px;
  bottom:22px;
  z-index:1000;
  font-family:"Segoe UI", Arial, sans-serif;
}
.basemap-current{
  width:94px;
  height:68px;
  padding:0;
  border:2px solid #fff;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.30);
  cursor:pointer;
  position:relative;
}
.basemap-current-label{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:4px 5px;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-size:12px;
  font-weight:800;
  text-align:left;
}
.basemap-picker{
  position:absolute;
  left:0;
  bottom:78px;
  display:flex;
  gap:8px;
  padding:8px;
  border-radius:12px;
  background:rgba(255,255,255,.96);
  box-shadow:0 3px 16px rgba(0,0,0,.25);
}
.basemap-card{
  width:92px;
  height:72px;
  padding:0;
  border:2px solid transparent;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  cursor:pointer;
  position:relative;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
}
.basemap-card.active{
  border-color:#17495a;
}
.basemap-card span:last-child{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:4px 5px;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-size:12px;
  font-weight:800;
  text-align:left;
}
.basemap-thumb{
  display:block;
  width:100%;
  height:100%;
}
.thumb-osm{
  background:
    linear-gradient(30deg, rgba(255,255,255,.55), rgba(255,255,255,0)),
    linear-gradient(90deg, #cfd8c7 0 22%, #f5f2df 22% 44%, #b7d7b4 44% 66%, #e7e2c9 66% 100%);
  position:relative;
}
.thumb-osm::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(25deg, transparent 45%, #d56b6b 46%, #d56b6b 50%, transparent 51%),
    linear-gradient(115deg, transparent 42%, #7f9fc7 43%, #7f9fc7 47%, transparent 48%),
    linear-gradient(0deg, transparent 48%, rgba(255,255,255,.65) 49%, rgba(255,255,255,.65) 51%, transparent 52%);
}
.thumb-sat{
  background:
    radial-gradient(circle at 25% 25%, #6e8e4d 0 18%, transparent 19%),
    radial-gradient(circle at 70% 40%, #3d642f 0 22%, transparent 23%),
    linear-gradient(135deg, #6b7f3f, #263d28 48%, #6f6b45 49%, #3a4b2d);
}
.thumb-veneto{
  background:
    linear-gradient(35deg, rgba(210,220,160,.9), rgba(120,150,80,.9)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.18) 0 2px, transparent 2px 7px),
    repeating-linear-gradient(0deg, rgba(0,0,0,.08) 0 1px, transparent 1px 6px);
}


/* FIX BASEMAP CARDS + FILTER ICON */
.basemap-widget{
  z-index:350; /* sotto tool e pannelli */
}
.basemap-picker[hidden]{
  display:none!important;
}
.basemap-picker{
  left:104px;
  bottom:0;
  flex-direction:row;
}
#tool-rail,
.left-panel,
.detail-panel,
.modal-backdrop{
  z-index:1000;
}
.tool-btn.active .filter-icon-svg{
  color:#fff;
}
.filter-tool:has(#filter-badge:not([hidden])):not(.active) .filter-icon-svg{
  color:#17495a;
}
.filter-tool.active:has(#filter-badge:not([hidden])) .filter-icon-svg{
  color:#fff;
}


/* FIX TIMELINE FULLSCREEN ABOVE EVERYTHING */
.modal-backdrop,
#timeline-modal{
  z-index:10000!important;
}
.timeline-modal,
#timeline-modal .modal,
#timeline-modal-body{
  z-index:10001!important;
}
.detail-panel{
  z-index:900!important;
}
.left-panel,
#tool-rail{
  z-index:1000!important;
}
.basemap-widget{
  z-index:350!important;
}


/* LOGIN SCREEN */
.login-screen{
  position:fixed;
  inset:0;
  z-index:30000;
  background:linear-gradient(135deg,#123945,#1d5a68);
  display:flex;
  align-items:center;
  justify-content:center;
}
.login-screen[hidden]{
  display:none!important;
}
.login-card{
  width:min(360px,92vw);
  background:#fff;
  border-radius:16px;
  box-shadow:0 12px 35px rgba(0,0,0,.35);
  padding:24px;
  display:flex;
  flex-direction:column;
  gap:9px;
}
.login-card h1{
  margin:0;
  color:#17495a;
  letter-spacing:.05em;
}
.login-card p{
  margin:0 0 8px;
  color:#60757d;
}
.login-card input{
  width:100%;
  box-sizing:border-box;
}
.login-error{
  background:#fdecea;
  color:#a83226;
  border:1px solid #f5b7b1;
  border-radius:8px;
  padding:8px;
  font-size:13px;
}
#logout-btn{
  position:absolute;
  right:10px;
  top:10px;
  font-size:12px;
  padding:5px 8px;
  border-radius:7px;
  background:rgba(255,255,255,.92);
}


/* LOADING INDICATOR */
.loading-indicator{
  position:absolute;
  left:50%;
  top:14px;
  transform:translateX(-50%);
  z-index:5000;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:#17495a;
  box-shadow:0 2px 10px rgba(0,0,0,.22);
  font-size:13px;
  font-weight:800;
}
.loading-indicator[hidden]{display:none!important;}
.spinner{
  width:15px;
  height:15px;
  border:3px solid #cfe0e8;
  border-top-color:#17495a;
  border-radius:50%;
  animation:ramve-spin .75s linear infinite;
}
@keyframes ramve-spin{to{transform:rotate(360deg);}}


/* LOADING INDICATOR - FIX visibile sopra tutto */
.loading-indicator{
  position:fixed!important;
  left:50%!important;
  top:18px!important;
  transform:translateX(-50%)!important;
  z-index:50000!important;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.98);
  color:#17495a;
  box-shadow:0 3px 18px rgba(0,0,0,.30);
  font-size:13px;
  font-weight:900;
  pointer-events:none;
}
.loading-indicator[hidden]{
  display:none!important;
}
.spinner{
  width:16px;
  height:16px;
  border:3px solid #cfe0e8;
  border-top-color:#17495a;
  border-radius:50%;
  animation:ramve-spin .75s linear infinite;
}
@keyframes ramve-spin{
  to{transform:rotate(360deg);}
}


/* LOADING INDICATOR - stable token-based */
.loading-indicator{
  position:fixed!important;
  left:50%!important;
  top:18px!important;
  transform:translateX(-50%)!important;
  z-index:50000!important;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.98);
  color:#17495a;
  box-shadow:0 3px 18px rgba(0,0,0,.30);
  font-size:13px;
  font-weight:900;
  pointer-events:none;
}
.loading-indicator[hidden]{
  display:none!important;
}
.spinner{
  width:16px;
  height:16px;
  border:3px solid #cfe0e8;
  border-top-color:#17495a;
  border-radius:50%;
  animation:ramve-spin .75s linear infinite;
}
@keyframes ramve-spin{
  to{transform:rotate(360deg);}
}


/* COUNT WORKING DOTS */
.result-count-row{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:18px;
}
.count-working{
  display:inline-flex;
  gap:3px;
  align-items:center;
}
.count-working[hidden]{
  display:none!important;
}
.count-working i{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#17495a;
  opacity:.25;
  animation:count-dot 1s infinite ease-in-out;
}
.count-working i:nth-child(2){animation-delay:.15s;}
.count-working i:nth-child(3){animation-delay:.30s;}
@keyframes count-dot{
  0%,80%,100%{opacity:.25; transform:translateY(0);}
  40%{opacity:1; transform:translateY(-2px);}
}
.timeline-loading{
  padding:8px;
  border:1px dashed #c5d3db;
  border-radius:8px;
  color:#60757d;
  background:#f6fafb;
  font-size:12px;
}


/* LAYER PANEL */
.panel-hint{
  margin:0 0 10px;
  color:#60757d;
  font-size:12px;
}
.layer-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.layer-row{
  background:#f7fafb;
  border:1px solid #d6e1e8;
  border-radius:10px;
  padding:8px;
}
.layer-toggle{
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
}
.layer-toggle input{
  width:auto;
}
.layer-toggle strong{
  display:block;
  font-size:13px;
}
.layer-toggle small{
  display:block;
  color:#60757d;
  font-size:11px;
  margin-top:1px;
}
.layer-opacity{
  width:100%;
  margin-top:7px;
}
.small-muted{
  color:#60757d;
  font-size:12px;
  padding:8px;
}


/* FLOATING LAYERS BUTTON */
.layers-floating{
  position:absolute;
  left:14px;
  bottom:100px;
  z-index:450;
  height:30px;
  padding:0 10px;
  border:1px solid rgba(23,73,90,.25);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#17495a;
  font-size:12px;
  font-weight:800;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
  cursor:pointer;
}
.layers-floating:hover,
.layers-floating.active{
  background:#17495a;
  color:#fff;
}


/* STEP 6 - Layer button as basemap-sized card */
.layers-floating{
  left:14px!important;
  bottom:100px!important;
  width:94px!important;
  height:68px!important;
  padding:0!important;
  border:2px solid #fff!important;
  border-radius:10px!important;
  overflow:hidden!important;
  background:#fff!important;
  color:#fff!important;
  box-shadow:0 2px 10px rgba(0,0,0,.30)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
}
.layers-floating .layer-button-icon{
  flex:1;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#17495a;
  background:
    linear-gradient(135deg,#eaf1f4,#cfe0e8),
    repeating-linear-gradient(45deg,rgba(23,73,90,.15) 0 4px,transparent 4px 8px);
  font-size:28px;
}
.layers-floating .layer-button-label{
  width:100%;
  padding:4px 5px;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-size:12px;
  font-weight:800;
  text-align:left;
  box-sizing:border-box;
}
.layers-floating:hover .layer-button-icon,
.layers-floating.active .layer-button-icon{
  background:#17495a;
  color:#fff;
}

/* STEP 6 - refined layer rows */
.layer-row-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.layer-zoom{
  flex:0 0 30px;
  width:30px;
  height:30px;
  border-radius:8px;
  border:1px solid #cbd9e0;
  background:#fff;
  color:#17495a;
  cursor:pointer;
  font-weight:900;
}
.layer-zoom:hover{
  background:#17495a;
  color:#fff;
}
.layer-row-bottom{
  display:grid;
  grid-template-columns:54px 1fr;
  align-items:center;
  gap:8px;
  margin-top:8px;
  color:#60757d;
  font-size:11px;
}
.layer-row-bottom .layer-opacity{
  margin:0;
}


/* ADMIN LAYERS */
.admin-layer-open{
  width:100%;
  margin:0 0 10px;
  padding:8px 10px;
  border-radius:9px;
  border:1px solid #cbd9e0;
  background:#fff;
  color:#17495a;
  font-weight:800;
  cursor:pointer;
}
.admin-layer-open:hover{
  background:#eaf1f4;
}
.admin-layer-list{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin-bottom:12px;
}
.admin-layer-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:8px;
  border:1px solid #d6e1e8;
  border-radius:9px;
  background:#f7fafb;
}
.admin-layer-item strong{
  display:block;
  font-size:13px;
}
.admin-layer-item small{
  display:block;
  color:#60757d;
  font-size:11px;
  margin-top:2px;
}
.admin-layer-buttons{
  display:flex;
  gap:5px;
}
.admin-layer-buttons button,
.admin-actions button{
  border:1px solid #cbd9e0;
  border-radius:8px;
  background:#fff;
  color:#17495a;
  padding:6px 8px;
  font-weight:800;
  cursor:pointer;
  font-size:12px;
}
.admin-layer-buttons button:hover,
.admin-actions button:hover{
  background:#17495a;
  color:#fff;
}
.admin-layer-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.admin-layer-form label{
  display:flex;
  flex-direction:column;
  gap:3px;
  font-size:11px;
  color:#60757d;
  font-weight:700;
}
.admin-layer-form input,
.admin-layer-form select{
  width:100%;
  box-sizing:border-box;
}
.admin-check{
  flex-direction:row!important;
  align-items:center;
  color:#17495a!important;
}
.admin-check input{
  width:auto;
}
.admin-actions,
#admin-layer-status{
  grid-column:1 / -1;
}
.admin-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}


/* ADMIN WMS FIELDS */
.admin-wms-field[hidden],
.admin-postgis-field[hidden]{
  display:none!important;
}
.admin-wms-field{
  grid-column:auto;
}


/* ADMIN SLD STYLE */
.admin-style-box{
  grid-column:1 / -1;
  border:1px solid #d6e1e8;
  border-radius:10px;
  background:#f7fafb;
  padding:9px;
}
.admin-style-box h4{
  margin:0 0 7px;
  color:#17495a;
  font-size:13px;
}
.admin-style-box input[type="file"]{
  width:100%;
  margin:7px 0;
}
.admin-style-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.admin-style-actions button{
  border:1px solid #cbd9e0;
  border-radius:8px;
  background:#fff;
  color:#17495a;
  padding:6px 8px;
  font-weight:800;
  cursor:pointer;
  font-size:12px;
}
.admin-style-actions button:hover{
  background:#17495a;
  color:#fff;
}


/* POSTGIS IMPORT */
.admin-import-box{
  border:1px solid #d6e1e8;
  border-radius:10px;
  background:#f7fafb;
  padding:9px;
  margin-bottom:12px;
}
.admin-import-box > button,
.admin-import-actions button{
  width:100%;
  border:1px solid #cbd9e0;
  border-radius:8px;
  background:#fff;
  color:#17495a;
  padding:7px 9px;
  font-weight:800;
  cursor:pointer;
  font-size:12px;
}
.admin-import-box > button:hover,
.admin-import-actions button:hover{
  background:#17495a;
  color:#fff;
}
.admin-postgis-scan-list{
  max-height:260px;
  overflow:auto;
  margin-top:9px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.admin-scan-row{
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px;
  border:1px solid #d6e1e8;
  border-radius:8px;
  background:#fff;
  cursor:pointer;
}
.admin-scan-row input{
  width:auto;
}
.admin-scan-row strong{
  display:block;
  font-size:12px;
}
.admin-scan-row small{
  display:block;
  color:#60757d;
  font-size:10.5px;
}
.admin-scan-row:has(input:disabled){
  opacity:.55;
  cursor:not-allowed;
}
.admin-import-actions{
  margin-top:8px;
}


/* LAYER PUBLISH FILTER */
.admin-filter-box{
  grid-column:1 / -1;
  border:1px solid #d6e1e8;
  border-radius:10px;
  background:#f7fafb;
  padding:9px;
}
.admin-filter-box h4{
  margin:0 0 7px;
  color:#17495a;
  font-size:13px;
}
.admin-filter-box textarea{
  width:100%;
  box-sizing:border-box;
  resize:vertical;
  min-height:72px;
  font-family:Consolas, "Courier New", monospace;
  font-size:12px;
}


/* ACCOUNT WIDGET */
.account-widget{position:absolute;right:14px;top:14px;z-index:6000}
.account-btn{width:38px;height:38px;border-radius:50%;border:2px solid #fff;background:#17495a;color:#fff;font-weight:900;box-shadow:0 2px 10px rgba(0,0,0,.25);cursor:pointer}
.account-menu{position:absolute;right:0;top:46px;width:190px;background:#fff;border:1px solid #d6e1e8;border-radius:12px;box-shadow:0 6px 22px rgba(0,0,0,.24);padding:10px;color:#17495a}
.account-label{font-size:11px;color:#60757d;font-weight:800;text-transform:uppercase}
.account-name{font-size:13px;font-weight:900;margin:4px 0 10px;word-break:break-word}
.account-menu button{width:100%;border:1px solid #cbd9e0;border-radius:8px;background:#fff;color:#17495a;padding:7px 9px;font-weight:800;cursor:pointer}
.account-menu button:hover{background:#17495a;color:#fff}
.admin-wmts-field[hidden]{display:none!important}


/* ACCOUNT WIDGET - username + silhouette */
.account-btn{
  min-width:42px!important;
  width:auto!important;
  height:38px!important;
  border-radius:999px!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:0 10px!important;
}
.account-icon{
  font-size:17px;
  line-height:1;
}
.account-btn-name{
  max-width:150px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:900;
}


/* ACCOUNT FIX - icon only, below panels */
.account-widget{
  z-index:420!important;
}
.account-btn{
  width:38px!important;
  min-width:38px!important;
  height:38px!important;
  padding:0!important;
  justify-content:center!important;
}
.account-btn-name{
  display:none!important;
}
.account-menu{
  z-index:421!important;
}


/* GLOBAL SEARCH */
.filter-help{
  margin:0 0 8px;
  color:#60757d;
  font-size:12px;
  line-height:1.35;
}
.filter-help code{
  background:#eef5f7;
  border:1px solid #d6e1e8;
  border-radius:5px;
  padding:1px 4px;
  color:#17495a;
}
#global-search{
  width:100%;
  box-sizing:border-box;
  resize:vertical;
  min-height:72px;
  font-family:Consolas, "Courier New", monospace;
  font-size:12px;
}


/* FILTERS LOADING OVERLAY */
.filters-shell{
  position:relative;
}
.filters-loading-overlay{
  position:absolute;
  inset:0;
  z-index:50;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.58);
  backdrop-filter:blur(1px);
  border-radius:12px;
}
.filters-loading-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-radius:12px;
  background:#fff;
  border:1px solid #d6e1e8;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  color:#17495a;
  font-weight:900;
}
.filters-is-loading .filters-scroll,
.filters-is-loading .filters-nav,
.filters-is-loading .filter-actions-fixed,
.filters-is-loading .sql-summary{
  opacity:.45;
  pointer-events:none;
  user-select:none;
}
.filters-loading-card .spinner{
  width:18px;
  height:18px;
}


/* FILTERS LOADING FINAL FIX */
.filters-loading-overlay[hidden]{
  display:none!important;
}
.filters-is-loading .filters-scroll,
.filters-is-loading .filters-nav,
.filters-is-loading .filter-actions-fixed,
.filters-is-loading .sql-summary{
  opacity:.45;
  pointer-events:none;
  user-select:none;
}


/* ADMIN VISIBILITY */
#layer-admin-open[hidden]{display:none!important;}