/* DronCity v1.0.21.1 · Responsive PC / móvil
   Mantiene el layout de escritorio y aplica una composición específica en tablet/móvil. */
:root{
  --dc-mobile-gap:10px;
  --dc-safe-top:env(safe-area-inset-top,0px);
  --dc-safe-right:env(safe-area-inset-right,0px);
  --dc-safe-bottom:env(safe-area-inset-bottom,0px);
  --dc-safe-left:env(safe-area-inset-left,0px);
  --dc-vh:1vh;
}
html{width:100%;max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{width:100%;max-width:100%;overflow-x:hidden}
main,.wrap,.dc-op-workspace,.dc-command-workspace,.dc-portal-workspace,.dc-uas-work,.portal-main{min-width:0;max-width:100%}
img,video,canvas,svg{max-width:100%}
input,select,textarea,button{min-width:0;max-width:100%}
pre,code,.mono,.box,.token{overflow-wrap:anywhere;word-break:break-word}
iframe{max-width:100%}
.leaflet-container{max-width:100%;touch-action:pan-x pan-y}

/* Las tablas no fuerzan el ancho de la página: se desplazan dentro de su propio contenedor. */
.dc-table-scroll{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;border-radius:12px}
.dc-table-scroll>table{min-width:680px;margin:0}
.uas-table-wrap,.timeline,.viewer360-list,.marker360-list,.uas-tower-list,.uas-map-side,.photos{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}

/* Cabecera general de páginas renderizadas por View.php. */
.dc-mobile-menu-toggle{display:none;border:1px solid #ffffff32;background:#ffffff12;color:#fff;box-shadow:none;padding:9px 12px;border-radius:10px;font-size:13px;font-weight:900}

/* Evita que grids locales con columnas mínimas rompan la pantalla. */
.command-grid,.viewer360-layout,.air-layout,.eop-grid,.uas-map-wrap,.uas-hero-grid,.org-middle,.map-body{min-width:0}
.command-grid>* ,.viewer360-layout>* ,.air-layout>* ,.eop-grid>* ,.uas-map-wrap>* ,.uas-hero-grid>* ,.org-middle>* ,.map-body>*{min-width:0}

@media (max-width:1100px){
  .wrap{margin:16px auto!important;padding-left:12px!important;padding-right:12px!important}
  .dc-op-shell{grid-template-columns:164px minmax(0,1fr);gap:12px}
  .dc-command-shell{grid-template-columns:150px minmax(0,1fr);gap:10px}
  .dc-portal-shell{grid-template-columns:164px minmax(0,1fr);gap:12px}
  .uas-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .uas-map-wrap,.uas-hero-grid{grid-template-columns:1fr!important}
  .uas-map-side{max-height:none!important}
  .org-middle{grid-template-columns:1fr!important}
}

@media (max-width:900px){
  body{font-size:15px}
  body>header:not(.dc-portal-hero):not(.portal-head):not(.top){padding:11px 12px;gap:8px;align-items:center;position:sticky;top:0;z-index:5000}
  body>header:not(.dc-portal-hero):not(.portal-head):not(.top)>strong{font-size:18px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .dc-mobile-menu-toggle{display:inline-flex;margin-left:auto;flex:0 0 auto}
  body>header nav{display:none!important;position:absolute;left:8px;right:8px;top:calc(100% + 6px);padding:9px;background:#0f2840;border:1px solid #ffffff2c;border-radius:14px;box-shadow:0 18px 42px #06182455;max-height:min(72vh,520px);overflow:auto}
  body>header.dc-nav-open nav{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important}
  body>header.dc-nav-open nav a,body>header.dc-nav-open nav .madrid-clock{width:100%;justify-content:flex-start;margin:0}

  .wrap,.dc-portal-wrap,.portal-wrap{width:100%!important;max-width:100%!important;margin:0!important;padding:10px!important}
  .card{padding:16px!important;margin-bottom:10px!important;border-radius:15px!important}
  h1{font-size:24px} h2{font-size:20px} h3{font-size:16px}

  /* Menús laterales: escritorio = columna; móvil = carril horizontal compacto. */
  .dc-op-shell,.dc-command-shell,.dc-portal-shell,.dc-uas-shell,.portal-shell{display:block!important}
  .dc-op-sidebar,.dc-command-side,.dc-portal-side,.dc-uas-rail,.portal-nav{position:sticky!important;top:0!important;z-index:1800!important;width:100%!important;max-width:100%!important;margin:0 0 9px!important;border-radius:13px!important;overflow:hidden}
  .dc-op-sidebar .em-tabs,.dc-command-shell .command-nav,.dc-portal-side .tabs,.dc-uas-rail,.portal-nav{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:5px!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap!important;padding:6px!important;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .dc-op-sidebar .em-tabs a,.dc-command-shell .command-nav a,.dc-portal-side .tabs button,.dc-uas-rail a,.portal-nav a{flex:0 0 auto!important;width:auto!important;min-width:max-content!important;min-height:42px!important;margin:0!important;padding:8px 10px!important;text-align:center!important;white-space:nowrap!important;scroll-snap-align:start}
  .dc-nav-mark,.dc-uas-rail .mark{display:none!important}
  .dc-op-workspace,.dc-command-workspace,.dc-portal-workspace,.dc-uas-work,.portal-main{width:100%!important;max-width:100%!important;min-width:0!important}

  /* Formularios, KPIs y tarjetas pasan a una columna o dos si caben. */
  .grid,.grid3,.formgrid,.objective-form,.air-form .grid,.command-mini-grid,.viewer360-form,.uas-form-grid,.uas-form-grid.two,.uas-card-grid,.info,.command-strip,.alert-actions,.objective-actions,.oct-row,.weathergrid,.steps,.eop-kpis,.kpis{grid-template-columns:1fr 1fr!important}
  .full,.objective-wide,.viewer360-form .wide,.comms-compose .wide{grid-column:1/-1!important}
  .em-work,.sector-grid,.uas-grid-2,.uas-grid-3,.uas-resource-grid,.uas-telemetry-grid,.viewer360-layout,.command-grid,.air-layout,.eop-grid{grid-template-columns:1fr!important}

  /* UAS / mapas */
  .uas-map{height:58svh!important;min-height:380px!important;max-height:700px}
  #ops-map{height:58svh!important;min-height:380px!important}
  #ops-sector-map{height:50svh!important;min-height:340px!important}
  .uas-fullbar{flex-wrap:wrap!important;align-items:flex-start!important;padding:8px!important}
  .uas-fullbar>div{min-width:0;max-width:100%}
  .uas-fullbar .full-actions{width:100%;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}
  .uas-fullbar .full-actions>*{flex:0 0 auto}
  .map-body{grid-template-columns:1fr!important}
  .map-side{display:none!important}

  /* Modal cartográfico y overlays */
  .uas-modal{padding:6px!important;align-items:stretch!important}
  .uas-modal-dialog{width:calc(100vw - 12px)!important;height:calc((var(--dc-vh) * 100) - 12px)!important;max-width:none!important;max-height:none!important;border-radius:14px!important;margin:auto}
  .uas-modal-dialog header,.uas-modal-dialog footer{padding:9px 10px!important}
  .uas-picker-map{min-height:300px!important}

  /* Cabeceras de portales */
  .dc-portal-hero,.portal-head,.top{position:relative!important;padding:12px!important}
  .dc-portal-hero h1,.portal-head h1{font-size:19px!important;line-height:1.15}
  .top{flex-direction:column!important;align-items:flex-start!important}
  .top>div{max-width:100%}
  .hero{padding:17px!important;border-radius:16px!important}.hero h1{font-size:24px!important}

  /* Organigrama */
  .org-chart{padding:9px!important}
  .org-banner{flex-direction:column!important}.org-banner h2{font-size:18px!important}
  .org-pma,.org-middle{margin-top:16px!important;margin-bottom:24px!important;max-width:100%!important}
  .org-pma,.org-operations,.org-uas{padding:13px!important}
  .org-kv,.org-operations .org-kv,.org-uas .org-kv,.org-line{grid-template-columns:1fr!important;gap:2px!important}
  .org-sectors{grid-template-columns:1fr!important;gap:12px!important}

  /* Visor 360 */
  .viewer360-stage{height:58svh!important;min-height:360px!important}
  .viewer360-list{max-height:220px!important}
  .viewer360-meta{grid-template-columns:1fr 1fr!important}

  /* Tablas: solo su contenedor hace scroll. */
  .dc-table-scroll{margin:3px 0 8px}
  table{font-size:12px}
  th,td{padding:8px!important}

  /* Botones de acción no desbordan */
  .uas-actions,.flight-actions,.em-links,.org-toolbar,.sector-map-tools,.viewer360-actions,.viewer360-toolbar,.marker360-actions,.topmeta,.comms-head{max-width:100%;gap:6px!important}
}

@media (max-width:600px){
  body{font-size:14px}
  .wrap,.dc-portal-wrap,.portal-wrap{padding:7px!important}
  .card{padding:13px!important;border-radius:13px!important}
  .dc-emergency-screen .em-head{padding:16px!important;border-radius:14px!important}
  .dc-emergency-screen .em-head h1{font-size:22px!important;overflow-wrap:anywhere}
  .dc-emergency-screen .em-head p{font-size:13px!important}

  .grid,.grid3,.formgrid,.objective-form,.air-form .grid,.command-mini-grid,.viewer360-form,.viewer360-meta,.uas-form-grid,.uas-form-grid.two,.uas-card-grid,.uas-status-panel,.uas-kpis,.info,.command-strip,.alert-actions,.objective-actions,.oct-row,.weathergrid,.steps,.eop-kpis,.kpis{grid-template-columns:1fr!important}
  .full,.objective-wide,.viewer360-form .wide,.comms-compose .wide{grid-column:auto!important}

  input,select,textarea{font-size:16px!important;min-height:44px}
  button,.btn{min-height:42px}
  textarea{min-height:90px}

  .uas-kpi{padding:11px!important}.uas-kpi strong{font-size:21px!important}
  .uas-flight-strip{grid-template-columns:1fr!important}
  .uas-map{height:56svh!important;min-height:340px!important}
  #ops-map{height:55svh!important;min-height:340px!important}
  #ops-sector-map{height:48svh!important;min-height:300px!important}
  .viewer360-stage{height:54svh!important;min-height:320px!important}

  /* Acciones principales en formularios ocupan el ancho; acciones compactas siguen ajustadas. */
  form>button:not(.dc-compact),form>.btn:not(.dc-compact){width:100%}
  .uas-actions button,.uas-actions .btn,.em-links .btn,.sector-map-tools button,.viewer360-actions .btn,.marker360-actions button{width:auto!important;max-width:100%}

  .photos img{height:84px;max-width:125px}
  .comms-msg{max-width:98%!important}
  .comms-compose{grid-template-columns:1fr!important}
  .timeline-row{grid-template-columns:1fr!important}

  .uas-modal-dialog header,.uas-modal-dialog footer{flex-direction:column!important;align-items:stretch!important}
  .uas-modal-dialog footer button{width:100%!important}
  .uas-fullbar h1{font-size:15px!important}

  /* Evita que badges/códigos largos rompan tarjetas. */
  .badge,.uas-badge,.status,.phase,.flighttabs a{max-width:100%;white-space:normal;overflow-wrap:anywhere}
}

@media (max-width:390px){
  .dc-op-sidebar .em-tabs a,.dc-command-shell .command-nav a,.dc-portal-side .tabs button,.dc-uas-rail a,.portal-nav a{font-size:11px!important;padding:7px 8px!important}
  .card{padding:11px!important}
  .dc-portal-hero h1,.portal-head h1{font-size:17px!important}
}

@media (orientation:landscape) and (max-height:520px){
  .uas-map,#ops-map{height:72svh!important;min-height:280px!important}
  .uas-modal-dialog{height:98svh!important}
  .dc-op-sidebar,.dc-command-side,.dc-portal-side,.dc-uas-rail,.portal-nav{position:static!important}
}

/* Módulos de Emergencias y Logística no cubiertos por el layout base */
@media (max-width:900px){
  .em-grid,.ec-grid,.esp-grid,.sector-layout,.map-wrap,.dashboard-top{grid-template-columns:1fr!important}
  .em-tools{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .em-kpis,.ec-kpis,.log-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .flight-data,.sector-meta,.log-grid3,.resource-add,.ai-sources{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .log-grid,.log-form-grid,.choice-grid,.review,.ec-directory,.limit-grid{grid-template-columns:1fr!important}
  .log-layout{display:block!important}
  .log-layout>aside,.log-layout>.log-nav{position:static!important;width:100%!important;display:flex!important;overflow-x:auto!important;gap:5px!important;margin-bottom:9px!important;-webkit-overflow-scrolling:touch}
  .log-layout>aside a,.log-layout>.log-nav a{flex:0 0 auto!important;white-space:nowrap!important}
  .log-stock-row{grid-template-columns:minmax(140px,1fr) 72px 72px 68px!important;min-width:440px}
  .oct-sectors{grid-template-columns:1fr!important}.oct-network{grid-template-columns:1fr!important}
  .small-alert-banner-grid{grid-template-columns:1fr repeat(2,minmax(100px,1fr))!important}
  .cmd-situation{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .cmd-strip-inner{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .cmd-status-main{grid-column:1/-1}
  .cmd-grid{grid-template-columns:1fr!important}.cmd-grid>[class*="cmd-span-"]{grid-column:auto!important}
  .cmd-weather-values,.cmd-kpi-grid,.cmd-resource-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cmd-resource{grid-template-columns:1fr!important}
}
@media (max-width:600px){
  .em-tools,.em-kpis,.ec-kpis,.log-kpis,.flight-data,.sector-meta,.log-grid3,.resource-add,.ai-sources,.cmd-situation,.cmd-strip-inner,.cmd-weather-values,.cmd-kpi-grid,.cmd-resource-stats,.small-alert-banner-grid{grid-template-columns:1fr!important}
  .log-stock-row{min-width:420px}
}
