/* SpainCat V210: Tráfico SCT. Estilos aislados del resto del dashboard. */ #sc-trafico{box-sizing:border-box;grid-column:1/-1;min-width:0;width:100%;margin:12px 0 18px;background:linear-gradient(155deg,#0b1e38 0%,#07162c 60%,#061123 100%);border:1px solid #1763af;border-radius:16px;box-shadow:0 0 0 1px #0b4286,0 0 24px #035be32e;overflow:hidden;color:#eaf4ff;scroll-margin-top:90px} #sc-trafico *{box-sizing:border-box} #sc-trafico .sc-traffic-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid #1966a9;background:linear-gradient(100deg,#09203d,#092b54 55%,#081a37)} #sc-trafico .sc-traffic-kicker{font-size:10px;letter-spacing:2px;color:#7bd3ff;font-weight:800} #sc-trafico h2{font-size:clamp(18px,2.1vw,25px);margin:5px 0;color:#dff5ff;line-height:1.25;text-shadow:0 0 12px #168cff38} #sc-trafico .sc-traffic-v{font-size:10px;letter-spacing:.8px;color:#9dbce2;vertical-align:middle;white-space:nowrap} #sc-trafico p{margin:5px 0;color:#bad6f1;font-size:12px} #sc-trafico .sc-traffic-head-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px} #sc-trafico .sc-traffic-state{display:inline-flex;border:1px solid #188cff;border-radius:99px;background:#07365e;color:#a6e2ff;padding:7px 12px;font-size:12px;font-weight:700;max-width:100%} #sc-trafico .sc-traffic-state.error{color:#ffd3d4;border-color:#ff6e79;background:#391a2a} #sc-trafico .sc-traffic-state.ok{color:#b5ffcb;border-color:#2bbd80;background:#0c443c} #sc-trafico .sc-traffic-back{border:1px solid #1978c1;border-radius:9px;padding:7px 12px;color:#dbf3ff;background:#0c2c52;font-size:12px} #sc-trafico .sc-traffic-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px 16px} #sc-trafico .sc-traffic-stats>div{border:1px solid #164f8c;background:#0a2546;border-radius:10px;padding:10px 13px;display:flex;flex-direction:column;min-width:0;gap:4px} #sc-trafico .sc-traffic-stats span{font-size:11px;color:#a9c9e5} #sc-trafico .sc-traffic-stats strong{font-size:26px;color:#74d6ff;line-height:1.15;font-variant-numeric:tabular-nums} #sc-trafico #sc-traffic-critical{color:#ff8092}#sc-trafico #sc-traffic-jams{color:#ffca6a} #sc-trafico .sc-traffic-body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:12px;padding:0 16px 16px} #sc-trafico .sc-traffic-map-panel,#sc-trafico .sc-traffic-list-panel{min-width:0;border:1px solid #195c9d;border-radius:12px;background:#071b36;overflow:hidden} #sc-trafico .sc-traffic-panel-head{display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap;padding:11px 13px;background:#10365b;border-bottom:1px solid #23649d;color:#e2f6ff} #sc-trafico .sc-traffic-panel-head span{font-size:11px;color:#a2c7e8} #sc-trafico .sc-traffic-map-frame{position:relative;height:445px;background:#102c42;overflow:hidden} #sc-trafico #sc-traffic-map{height:100%;width:100%;z-index:0} #sc-trafico .sc-traffic-mapnote{position:absolute;left:10px;bottom:10px;z-index:400;max-width:calc(100% - 20px);padding:6px 9px;border-radius:8px;border:1px solid #286ba1;background:#071b36e8;color:#d6e8ff;font-size:11px;line-height:1.4;pointer-events:none} #sc-trafico .sc-traffic-mapnote:empty{display:none} #sc-trafico .sc-traffic-maptouch{display:none;position:absolute;top:10px;right:10px;z-index:402;padding:6px 10px;background:#0b315fe6;border:1px solid #2599e8;border-radius:7px;font-size:11px;color:#effbff} #sc-trafico .sc-traffic-map-foot,#sc-trafico .sc-traffic-list-foot{padding:9px 12px;border-top:1px solid #144773;color:#a6c5e3;font-size:11px;line-height:1.45} #sc-trafico .sc-traffic-source{display:flex;gap:12px;flex-wrap:wrap;padding:8px 12px 13px} #sc-trafico .sc-traffic-source a{color:#69d5ff;font-size:12px;text-decoration:underline;text-underline-offset:2px} #sc-trafico .sc-traffic-filterbar{display:flex;align-items:flex-end;flex-wrap:wrap;gap:8px;padding:11px 12px} #sc-trafico .sc-traffic-filterbar label{display:flex;flex-direction:column;gap:4px;color:#accdea;font-size:11px;flex:1 1 120px;min-width:0} #sc-trafico .sc-traffic-filterbar select,#sc-trafico .sc-traffic-filterbar button{min-height:36px;color:#eef8ff;border:1px solid #258bd1;background:#0c2e54;border-radius:8px;padding:6px 8px;font-size:12px;max-width:100%} #sc-trafico .sc-traffic-filterbar button{flex:0 0 auto;background:#0e4074;color:#b8ebff} #sc-trafico .sc-traffic-list{max-height:430px;min-height:260px;overflow-y:auto;padding:0 10px 9px;overscroll-behavior:contain} #sc-trafico .sc-traffic-placeholder{margin:16px 6px!important;color:#b4d5ec!important;font-size:13px!important} #sc-trafico .sc-traffic-incident{display:block;width:100%;text-align:left;margin:8px 0;padding:11px 12px;border:1px solid #145c9b;border-left:4px solid #479bd9;border-radius:10px;background:#0e2b4c;box-shadow:inset 0 1px #ffffff08;color:#e4f2ff;font-size:12px;white-space:normal;overflow-wrap:anywhere;cursor:pointer} #sc-trafico .sc-traffic-incident:hover{background:#174064;border-color:#48a3e7} #sc-trafico .sc-traffic-incident.critical{border-left-color:#ff6b80} #sc-trafico .sc-traffic-incident.jams{border-left-color:#ffb853} #sc-trafico .sc-traffic-incident.works{border-left-color:#e7d84c} #sc-trafico .sc-traffic-incident .sc-traffic-inc-head{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px} #sc-trafico .sc-traffic-incident strong{font-size:13px;line-height:1.3} #sc-trafico .sc-traffic-incident .sc-traffic-tag{border-radius:6px;background:#123f69;color:#84d9ff;padding:3px 7px;font-size:10px;flex-shrink:0} #sc-trafico .sc-traffic-incident.critical .sc-traffic-tag{color:#ffc3cc;background:#5b2537} #sc-trafico .sc-traffic-incident.jams .sc-traffic-tag{color:#ffe0a1;background:#503923} #sc-trafico .sc-traffic-incident.works .sc-traffic-tag{color:#fff5aa;background:#464426} #sc-trafico .sc-traffic-incident .sc-traffic-desc{display:block;color:#c7d8e9;line-height:1.45} #sc-trafico .sc-traffic-incident .sc-traffic-date{display:block;margin-top:7px;color:#8fb3d0;font-size:10px} #sc-trafico .leaflet-container{background:#07283a;color:#151515} #sc-trafico .leaflet-control-attribution{font-size:9px!important;line-height:1.2!important;max-width:100%!important;white-space:normal!important;color:#203a50!important} #sc-trafico .leaflet-control-attribution a{color:#17537e!important} #sc-trafico .sc-traffic-marker{border:2px solid #c7f2ff;background:#ffbd4d;border-radius:50%;width:16px;height:16px;box-shadow:0 0 0 4px #ffcf5433,0 0 12px #1b8fe9} @media(max-width:1030px){#sc-trafico .sc-traffic-body{grid-template-columns:1fr}#sc-trafico .sc-traffic-map-frame{height:390px}#sc-trafico .sc-traffic-list{max-height:390px}} @media(max-width:630px){#sc-trafico{margin:10px 0 14px;border-radius:12px}#sc-trafico .sc-traffic-top{padding:12px}#sc-trafico .sc-traffic-stats{grid-template-columns:1fr 1fr;gap:7px;padding:9px}#sc-trafico .sc-traffic-stats>div{padding:8px}#sc-trafico .sc-traffic-stats strong{font-size:22px}#sc-trafico .sc-traffic-body{padding:0 9px 9px;gap:10px}#sc-trafico .sc-traffic-map-frame{height:310px}#sc-trafico .sc-traffic-maptouch{display:block}#sc-trafico .sc-traffic-list{max-height:365px}#sc-trafico .sc-traffic-filterbar{padding:9px}#sc-trafico .sc-traffic-source{gap:9px}} /* V210: soporte Leaflet local cuando la hoja externa no carga. Solo el mapa de tráfico. */ #sc-traffic-map.leaflet-container {position:relative!important;overflow:hidden!important;outline:none;touch-action:pan-x pan-y;isolation:isolate} #sc-traffic-map .leaflet-pane, #sc-traffic-map .leaflet-tile, #sc-traffic-map .leaflet-marker-icon, #sc-traffic-map .leaflet-marker-shadow, #sc-traffic-map .leaflet-tile-container, #sc-traffic-map .leaflet-pane > svg, #sc-traffic-map .leaflet-pane > canvas, #sc-traffic-map .leaflet-image-layer, #sc-traffic-map .leaflet-layer, #sc-traffic-map .leaflet-zoom-box {position:absolute!important;left:0;top:0} #sc-traffic-map .leaflet-tile {visibility:hidden;max-width:none!important;max-height:none!important;width:256px;height:256px;border:0;object-fit:unset} #sc-traffic-map .leaflet-tile-loaded {visibility:inherit} #sc-traffic-map .leaflet-zoom-animated {transform-origin:0 0} #sc-traffic-map .leaflet-pane {z-index:400} #sc-traffic-map .leaflet-tile-pane {z-index:200} #sc-traffic-map .leaflet-overlay-pane {z-index:400} #sc-traffic-map .leaflet-shadow-pane {z-index:500} #sc-traffic-map .leaflet-marker-pane {z-index:600} #sc-traffic-map .leaflet-tooltip-pane {z-index:650} #sc-traffic-map .leaflet-popup-pane {z-index:700} #sc-traffic-map .leaflet-control {position:relative;z-index:800;pointer-events:auto} #sc-traffic-map .leaflet-top,#sc-traffic-map .leaflet-bottom {position:absolute;z-index:1000;pointer-events:none} #sc-traffic-map .leaflet-top {top:0}#sc-traffic-map .leaflet-bottom {bottom:0} #sc-traffic-map .leaflet-left {left:0}#sc-traffic-map .leaflet-right {right:0} #sc-traffic-map .leaflet-left .leaflet-control {float:left;clear:both;margin-left:10px} #sc-traffic-map .leaflet-right .leaflet-control {float:right;clear:both;margin-right:10px} #sc-traffic-map .leaflet-top .leaflet-control {margin-top:10px}#sc-traffic-map .leaflet-bottom .leaflet-control {margin-bottom:10px} #sc-traffic-map .leaflet-bar {box-shadow:0 2px 8px #0008;border:1px solid #2c73ad;border-radius:7px;overflow:hidden;background:#fff} #sc-traffic-map .leaflet-bar a {display:block;width:30px;height:30px;line-height:30px;text-align:center;text-decoration:none;color:#20384e;background:white;font:bold 19px Arial;border-bottom:1px solid #bbc6cf;box-sizing:content-box;padding:0;cursor:pointer} #sc-traffic-map .leaflet-bar a:last-child {border-bottom:0} #sc-traffic-map .leaflet-control-attribution {background:#ffffffe6!important;padding:2px 5px!important;line-height:1.2!important;color:#385269!important;font-size:9px!important} #sc-traffic-map .leaflet-control-attribution a {color:#10598c!important} #sc-traffic-map .leaflet-marker-icon,#sc-traffic-map .leaflet-marker-shadow {display:block} #sc-traffic-map .leaflet-popup {position:absolute;text-align:center;margin-bottom:20px} #sc-traffic-map .leaflet-popup-content-wrapper {padding:1px;text-align:left;box-shadow:0 3px 14px #0006;background:#10243f;color:#e8f3ff;border:1px solid #446b96;border-radius:10px} #sc-traffic-map .leaflet-popup-content {margin:12px 16px;line-height:1.35;font-size:12px;max-width:230px;overflow-wrap:anywhere} #sc-traffic-map .leaflet-popup-tip-container {width:40px;height:20px;position:absolute;left:50%;margin-left:-20px;overflow:hidden;pointer-events:none} #sc-traffic-map .leaflet-popup-tip {width:17px;height:17px;padding:1px;margin:-10px auto 0;transform:rotate(45deg);box-shadow:0 3px 14px #0006;background:#10243f} #sc-traffic-map .leaflet-popup-close-button {position:absolute;top:0;right:0;padding:4px 4px 0 0;z-index:1;font:20px Arial;color:#e8f3ff} #sc-traffic-map .leaflet-pane > svg {overflow:visible} #sc-traffic-map .leaflet-overlay-pane svg path {pointer-events:visiblePainted} #sc-trafico .sc-traffic-stale-note {margin:0 16px 12px;padding:7px 10px;border:1px solid #8d723b;border-radius:7px;background:#382b15;color:#f3d7a3;font-size:11px} /* V210: vista general de Cataluña, contadores independientes y causa/afectación */ #sc-trafico .sc-traffic-stats{grid-template-columns:repeat(5,minmax(0,1fr))} #sc-trafico #sc-traffic-cuts{color:#ffb4a2} #sc-trafico .sc-traffic-overview{position:absolute;z-index:700;top:10px;right:10px;background:#0b315fe8;border:1px solid #40a5ef;color:#e2f6ff;font-size:11px;font-weight:700;border-radius:7px;padding:8px 10px;cursor:pointer} #sc-trafico .sc-traffic-overview:hover{background:#145e91} #sc-trafico .sc-traffic-inc-head{align-items:flex-start} #sc-trafico .sc-traffic-tags{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end;max-width:45%;flex:0 0 auto} #sc-trafico .sc-traffic-affect{font-size:10px;padding:3px 6px;border-radius:6px;background:#1d4468;color:#e6f4ff} #sc-trafico .sc-traffic-affect.cut{background:#66263b;color:#ffd5dc} #sc-trafico .sc-traffic-affect.jam{background:#513922;color:#ffe2a5} #sc-trafico .sc-traffic-affect.restricted{background:#2a4b58;color:#d3f5ff} #sc-trafico .sc-traffic-old{display:block;margin-top:4px;color:#efd09b;font-size:10px} @media(max-width:820px){#sc-trafico .sc-traffic-stats{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:630px){#sc-trafico .sc-traffic-stats{grid-template-columns:repeat(2,minmax(0,1fr))}#sc-trafico .sc-traffic-overview{top:50px;right:10px}#sc-trafico .sc-traffic-tags{max-width:53%}} /* V211: rojo reservado exclusivamente para accidentes, conexión mapa–avisos */ #sc-trafico #sc-traffic-cuts{color:#ffe09b} #sc-trafico .sc-traffic-affect.cut{background:#66501c;color:#ffe4a0} #sc-trafico .sc-traffic-incident.sc-traffic-focused{outline:3px solid #54e1ff;outline-offset:-3px;border-color:#85efff;box-shadow:0 0 18px #10b8ff55;background:#123b5a} #sc-trafico .sc-traffic-selected{margin:0 10px 10px;padding:10px 12px;border:2px solid #4fc9ff;border-radius:10px;background:#0b3659;display:flex;flex-direction:column;gap:7px;box-shadow:0 0 12px #00baff33} #sc-trafico .sc-traffic-selected[hidden]{display:none!important} #sc-trafico .sc-traffic-selected-head{display:flex;justify-content:space-between;align-items:center;gap:8px;color:#8ce7ff;font-size:12px} #sc-trafico .sc-traffic-selected-head button{background:#10395d;border:1px solid #4696bd;border-radius:7px;color:#f6fbff;padding:3px 9px;cursor:pointer;font-size:14px} #sc-trafico .sc-traffic-selected-title{font-size:13px;color:#fff;line-height:1.4} #sc-trafico .sc-traffic-selected-detail{font-size:11px;color:#c1e8fa;line-height:1.5} #sc-trafico .sc-traffic-attribution{font-size:10px;line-height:1.5;padding:0 12px 13px;color:#9fc4dc} #sc-trafico .sc-traffic-source{padding-bottom:7px} /* V212 · Selección luminosa y sincronizada; colores por tipo/afectación conocida. */ #sc-trafico .sc-traffic-selected{margin:2px 10px 13px!important;padding:15px 16px!important;border:3px solid #cfabff!important;border-radius:12px!important;background:linear-gradient(120deg,#352052,#18294f)!important;box-shadow:0 0 0 2px #9266e74d,0 0 26px #b57dff66!important;gap:10px!important} #sc-trafico .sc-traffic-selected-head{font-size:14px!important;color:#e4caff!important;font-weight:900!important;letter-spacing:.4px;line-height:1.35} #sc-trafico .sc-traffic-selected-head button{background:#6d3d9c!important;border:2px solid #d8bdff!important;color:#fff!important;font-size:19px!important;min-width:36px;min-height:35px;padding:2px 8px!important;flex-shrink:0} #sc-trafico .sc-traffic-selected-head button:hover{background:#9253c6!important} #sc-trafico .sc-traffic-selected-title{font-size:clamp(16px,1.4vw,19px)!important;font-weight:850!important;color:#fff!important;line-height:1.42!important;letter-spacing:.1px} #sc-trafico .sc-traffic-selected-detail{font-size:13px!important;color:#e5e4ff!important;line-height:1.6!important} #sc-trafico .sc-traffic-incident.sc-traffic-focused{outline:3px solid #d5afff!important;outline-offset:-3px;box-shadow:0 0 20px #a86eff80!important;background:#302a58!important} #sc-trafico .sc-traffic-legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px 15px;padding:10px 12px 8px;background:#0a2544;border-top:1px solid #24547b;font-size:11px;color:#d2e9fd} #sc-trafico .sc-traffic-legend span{display:inline-flex;gap:6px;align-items:center;white-space:nowrap} #sc-trafico .sc-traffic-dot{display:inline-block;width:11px;height:11px;flex:0 0 11px;border-radius:50%;border:1px solid #f5f9ff;box-shadow:0 0 0 2px #ffffff15} #sc-trafico .sc-traffic-dot.accident{background:#ff526a} #sc-trafico .sc-traffic-dot.cut{background:#ffe06b} #sc-trafico .sc-traffic-dot.jam{background:#ff9e45} #sc-trafico .sc-traffic-dot.works{background:#4d9fff} #sc-trafico .sc-traffic-dot.restricted{background:#38e0bd} #sc-trafico .sc-traffic-dot.unknown{background:#a6bad1} #sc-trafico .sc-traffic-incident.works:not(.impact-cut){border-left-color:#4d9fff} #sc-trafico .sc-traffic-incident.works .sc-traffic-tag{background:#193b63;color:#b3dbff} #sc-trafico .sc-traffic-incident.impact-cut:not(.critical){border-left-color:#ffe06b} #sc-trafico .sc-traffic-incident.other.impact-restricted{border-left-color:#38e0bd} #sc-trafico .sc-traffic-popup-title{background:transparent!important;border:0!important;color:#fff!important;font-size:13px!important;font-weight:800!important;text-align:left!important;padding:0!important;cursor:pointer!important;width:100%} #sc-trafico .sc-traffic-popup-title:hover{text-decoration:underline} #sc-trafico .sc-traffic-popup-impact{font-size:11px;color:#cde7fd;margin-top:4px} #sc-trafico .sc-traffic-popup-hint{font-size:10px;color:#8ac5e4;margin-top:6px} @media(max-width:630px){#sc-trafico .sc-traffic-selected{padding:12px!important}#sc-trafico .sc-traffic-selected-head{font-size:12px!important}#sc-trafico .sc-traffic-selected-title{font-size:17px!important}#sc-trafico .sc-traffic-legend{gap:7px 11px}} /* V213: la información detallada se obtiene de campos reales del GML. */ #sc-trafico .sc-traffic-selected-detail{display:grid!important;gap:7px!important;margin-top:4px!important} #sc-trafico .sc-traffic-detailrow{display:grid;grid-template-columns:minmax(105px,.36fr) minmax(0,1fr);align-items:start;gap:9px;padding:6px 9px;border-radius:6px;background:#0b234263;border:1px solid #8265ad40;font-size:13px;line-height:1.4;overflow-wrap:anywhere} #sc-trafico .sc-traffic-detailrow strong{font-weight:800;color:#e4c7ff} #sc-trafico .sc-traffic-detailrow span{color:#f7f1ff} #sc-trafico .sc-traffic-provenance{font-size:11px;color:#dacbed;border-top:1px solid #8c6cb266;padding-top:8px} #sc-trafico .sc-traffic-detail-link{color:#95e0ff;font-size:12px;text-decoration:underline} #sc-trafico .sc-traffic-selected{max-height:none;overflow:visible} #sc-trafico .sc-traffic-mapnote{font-size:12px} @media(max-width:600px){#sc-trafico .sc-traffic-detailrow{grid-template-columns:1fr;gap:3px;font-size:12px}} /* V214 · El panel derecho NO aumenta su altura al seleccionar un punto. El mapa dicta la altura de la fila. El contenido derecho fluye por dentro de un contenedor absoluto, por lo que nunca desplaza los módulos siguientes. */ #sc-trafico .sc-traffic-body{align-items:stretch} #sc-trafico .sc-traffic-list-panel{position:relative;min-height:0;align-self:stretch;overflow:hidden} #sc-trafico .sc-traffic-sidebar-stack{position:absolute;inset:0;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden} #sc-trafico .sc-traffic-sidebar-stack>.sc-traffic-panel-head, #sc-trafico .sc-traffic-sidebar-stack>.sc-traffic-filterbar, #sc-trafico .sc-traffic-sidebar-stack>.sc-traffic-list-foot{flex:0 0 auto} #sc-trafico .sc-traffic-list{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain} #sc-trafico .sc-traffic-list[hidden]{display:none!important} #sc-trafico .sc-traffic-selected{flex:1 1 auto;min-height:0;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;margin:2px 11px 10px!important; padding:14px 16px!important;border:2px solid #39caff!important;border-radius:12px!important; background:linear-gradient(145deg,#094d85,#09305c 66%,#0b2449)!important; box-shadow:inset 0 0 0 1px #8ceaff6a,0 0 17px #05a6ff70!important;gap:10px!important; scrollbar-color:#37adf6 #0b2b52} #sc-trafico .sc-traffic-selected-head{color:#9deaff!important} #sc-trafico .sc-traffic-selected-head button{background:#1169a6!important;border:2px solid #8edfff!important;color:#fff!important} #sc-trafico .sc-traffic-selected-head button:hover{background:#1788d6!important} #sc-trafico .sc-traffic-selected-title{color:#fff!important} #sc-trafico .sc-traffic-detailrow{background:#062e55c9;border:1px solid #64caff45} #sc-trafico .sc-traffic-detailrow strong{color:#b4eaff} #sc-trafico .sc-traffic-detailrow span{color:#f7fcff} #sc-trafico .sc-traffic-provenance{color:#cde8fb;border-top:1px solid #4cc5ff66} #sc-trafico .sc-traffic-incident.sc-traffic-focused{outline:3px solid #71d9ff!important;box-shadow:0 0 20px #1684ff80!important;background:#0f426b!important} @media(max-width:1030px){ #sc-trafico .sc-traffic-list-panel{height:500px;min-height:0} } @media(max-width:630px){ #sc-trafico .sc-traffic-list-panel{height:520px} #sc-trafico .sc-traffic-selected{padding:12px!important;margin:1px 8px 8px!important} #sc-trafico .sc-traffic-detailrow{font-size:12px} } /* V215: lectura cómoda y fichas RSS seleccionables sin alterar la altura del módulo */ #sc-trafico .sc-traffic-incident{font-size:14px;line-height:1.5;padding:12px 14px;transition:background-color .12s,border-color .12s} #sc-trafico .sc-traffic-incident strong{font-size:15px;line-height:1.4;color:#f4faff} #sc-trafico .sc-traffic-incident .sc-traffic-desc{font-size:14px;line-height:1.55;color:#e1f0ff} #sc-trafico .sc-traffic-incident .sc-traffic-date{font-size:12px;line-height:1.5;color:#b8d5eb} #sc-trafico .sc-traffic-incident .sc-traffic-tag,#sc-trafico .sc-traffic-incident .sc-traffic-affect{font-size:11px} #sc-trafico .sc-traffic-incident a{font-size:13px;line-height:1.5} #sc-trafico .sc-traffic-incident:focus-visible{outline:2px solid #7ddeff;outline-offset:2px;background:#17486a} @media(max-width:630px){#sc-trafico .sc-traffic-incident{padding:11px 12px;font-size:13px}#sc-trafico .sc-traffic-incident .sc-traffic-desc{font-size:13px}#sc-trafico .sc-traffic-incident strong{font-size:14px}#sc-trafico .sc-traffic-incident .sc-traffic-date{font-size:12px}} /* V216 · Meteorología SCT, base de carreteras y mapa sin secuestrar la rueda */ #sc-trafico .sc-traffic-stats{grid-template-columns:repeat(6,minmax(0,1fr))} #sc-trafico #sc-traffic-weather{color:#c5a3ff} #sc-trafico .sc-traffic-dot.weather{background:#b98dff} #sc-trafico .sc-traffic-incident.weather{border-left-color:#b98dff} #sc-trafico .sc-traffic-incident.weather .sc-traffic-tag{background:#433066;color:#f1dfff} #sc-trafico .sc-traffic-basemap{position:absolute;right:10px;top:49px;z-index:850;max-width:135px;background:#0b3156;color:#f2fbff;border:1px solid #64bfe9;border-radius:6px;padding:7px 9px;cursor:pointer;font-size:12px;font-weight:800;box-shadow:0 2px 6px #0006} #sc-trafico .sc-traffic-basemap:hover{background:#155b86} #sc-trafico .sc-traffic-basemap:focus-visible{outline:2px solid #a4eeff} @media(max-width:1100px){#sc-trafico .sc-traffic-stats{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:550px){#sc-trafico .sc-traffic-stats{grid-template-columns:repeat(2,minmax(0,1fr))}} /* V218 - control de etiquetas del mapa vial (mantiene el mapa a tamaño fijo) */ #sc-trafico .sc-traffic-labels{position:absolute;right:10px;top:89px;z-index:851; background:#082b4f;color:#f3faff;border:1px solid #58a9de;border-radius:6px; padding:7px 9px;font:800 12px/1.2 system-ui,Arial;cursor:pointer; box-shadow:0 2px 6px #0007;min-width:111px} #sc-trafico .sc-traffic-labels[aria-pressed="false"]{background:#293446;color:#b3c5d4} #sc-trafico .sc-traffic-labels:hover{background:#146189} #sc-trafico .sc-traffic-labels:focus-visible{outline:2px solid #a7eeff} #sc-trafico .sc-traffic-labels:disabled{cursor:not-allowed;opacity:.5} /* V219 · Google Maps. Se activa a demanda para evitar cargas de pago. */ #sc-trafico .sc-traffic-google-activate{position:absolute;inset:0;z-index:500;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;padding:35px; font-size:20px;font-weight:850;color:#ecfaff;background:linear-gradient(120deg,#103152,#124b6c);border:0;border-radius:0;box-shadow:inset 0 0 0 2px #35759a;} #sc-trafico .sc-traffic-google-activate small{font-size:13px;font-weight:500;color:#bdefff;max-width:400px} #sc-trafico .sc-traffic-google-activate:hover{background:linear-gradient(120deg,#154469,#14618a)} #sc-trafico .sc-traffic-google-activate[hidden]{display:none!important} #sc-trafico .sc-traffic-google-activate:disabled{cursor:progress;opacity:.9} #sc-trafico .sc-traffic-map-frame:has(.sc-traffic-google-activate:not([hidden])) .sc-traffic-mapnote{z-index:550} #sc-trafico .sc-traffic-map-frame:has(.sc-traffic-google-activate:not([hidden])) .sc-traffic-basemap, #sc-trafico .sc-traffic-map-frame:has(.sc-traffic-google-activate:not([hidden])) .sc-traffic-labels, #sc-trafico .sc-traffic-map-frame:has(.sc-traffic-google-activate:not([hidden])) .sc-traffic-overview{visibility:hidden} #sc-trafico .gm-style .sc-traffic-popup{color:#0f2f50} #sc-trafico .sc-traffic-popup-title{color:#10466e!important} #sc-trafico .sc-traffic-popup-impact,#sc-trafico .sc-traffic-popup-hint{color:#46677a} #sc-trafico .sc-traffic-mapnote{pointer-events:none} /* V220 · dos controles compactos iguales, etiquetas siempre visibles en Google Maps. */ #sc-trafico .sc-traffic-map-frame .sc-traffic-overview, #sc-trafico .sc-traffic-map-frame .sc-traffic-basemap{ position:absolute!important;right:10px!important;z-index:850!important; width:146px!important;min-width:146px!important;max-width:146px!important; height:37px!important;padding:5px 8px!important; display:flex;align-items:center;justify-content:center; background:#193d5f!important;border:2px solid #f1d25a!important; color:#ffffff!important;font-size:12px!important;font-weight:800!important; border-radius:8px!important;box-shadow:0 2px 7px #00182a88!important; line-height:1.1!important;cursor:pointer; } #sc-trafico .sc-traffic-map-frame .sc-traffic-overview{top:10px!important} #sc-trafico .sc-traffic-map-frame .sc-traffic-basemap{top:54px!important} #sc-trafico .sc-traffic-map-frame .sc-traffic-overview:hover, #sc-trafico .sc-traffic-map-frame .sc-traffic-basemap:hover{background:#28577b!important;border-color:#ffe892!important} #sc-trafico .sc-traffic-map-frame .sc-traffic-overview:focus-visible, #sc-trafico .sc-traffic-map-frame .sc-traffic-basemap:focus-visible{outline:2px solid white;outline-offset:2px} #sc-trafico .sc-traffic-map-frame:has(.sc-traffic-google-activate:not([hidden])) .sc-traffic-overview, #sc-trafico .sc-traffic-map-frame:has(.sc-traffic-google-activate:not([hidden])) .sc-traffic-basemap{visibility:hidden} /* Selector múltiple que ocupa el mismo espacio que el selector simple anterior. */ #sc-trafico .sc-traffic-filterbar .sc-traffic-type-filter{position:relative;display:flex;flex-direction:column;flex:1 1 145px;min-width:0;gap:4px} #sc-trafico .sc-traffic-filter-caption{font-size:11px;color:#accdea} #sc-trafico .sc-traffic-kind-menu{position:relative;min-width:0;max-width:100%} #sc-trafico .sc-traffic-kind-menu summary{display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer; min-height:36px;background:#0c2e54;border:1px solid #258bd1;border-radius:8px;padding:7px 9px; color:#eef8ff;font-size:12px;line-height:1.35;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;list-style:none} #sc-trafico .sc-traffic-kind-menu summary::-webkit-details-marker{display:none} #sc-trafico .sc-traffic-kind-menu summary::after{content:'▾';font-size:14px;flex-shrink:0;color:#b8e7ff} #sc-trafico .sc-traffic-kind-menu[open] summary::after{content:'▴'} #sc-trafico .sc-traffic-kind-menu[data-filtered="true"] summary{border-color:#efca48;box-shadow:inset 0 0 0 1px #b29038} #sc-trafico .sc-traffic-kind-menu summary:focus-visible{outline:2px solid #ffee9b;outline-offset:2px} #sc-trafico .sc-traffic-kind-options{position:absolute;z-index:1300;top:calc(100% + 5px);left:0;right:0;min-width:max(225px,100%); background:#0a2747;border:1px solid #5daae2;border-radius:10px;padding:7px;box-shadow:0 9px 24px #000b; max-height:275px;overflow:auto} #sc-trafico .sc-traffic-kind-options label{display:flex!important;align-items:center;flex-direction:row!important; gap:10px;min-width:0;padding:8px 10px;border-radius:6px;font-size:13px;color:#edf7ff;cursor:pointer;white-space:nowrap} #sc-trafico .sc-traffic-kind-options label:hover{background:#16476c} #sc-trafico .sc-traffic-kind-options .sc-traffic-kind-all{border-bottom:1px solid #416787;border-radius:0;color:#ffea96;font-weight:700} #sc-trafico .sc-traffic-kind-options input[type=checkbox]{appearance:auto!important;accent-color:#edc94a!important;width:17px;height:17px;margin:0;flex:0 0 auto;cursor:pointer} #sc-trafico .sc-traffic-kind-options small{display:block;color:#aacfe4;font-size:11px;line-height:1.4;padding:8px 10px 5px} @media(max-width:630px){ #sc-trafico .sc-traffic-map-frame .sc-traffic-overview{top:10px!important} #sc-trafico .sc-traffic-map-frame .sc-traffic-basemap{top:54px!important} #sc-trafico .sc-traffic-kind-options{right:0;left:auto;min-width:min(260px,84vw)} } /* SpainCat V227. Colores de ficha ampliada: TODO el panel, las filas, borde, tipografia, controles y scrollbar siguen la categoria SCT. La ficha y el alto de los monitores no cambian. */ #sc-trafico .sc-traffic-selected{ --sc-detail-accent:#abc0d1; --sc-detail-base:#243442; --sc-detail-base-end:#1b2a38; --sc-detail-row:#344655; --sc-detail-row-border:#627a8b; --sc-detail-heading:#eff7ff; --sc-detail-glow:#a9c2cf35; background:linear-gradient(155deg,var(--sc-detail-base),var(--sc-detail-base-end))!important; border:3px solid var(--sc-detail-accent)!important; box-shadow:0 0 0 1px var(--sc-detail-accent),0 0 15px var(--sc-detail-glow)!important; scrollbar-color:var(--sc-detail-accent) var(--sc-detail-base-end)!important; } #sc-trafico .sc-traffic-selected[data-category="accident"]{ --sc-detail-accent:#ff637c;--sc-detail-base:#5a2533;--sc-detail-base-end:#351c28; --sc-detail-row:#652d3d;--sc-detail-row-border:#b45c71; --sc-detail-heading:#ffcfda;--sc-detail-glow:#ff637c44; } #sc-trafico .sc-traffic-selected[data-category="cut"]{ --sc-detail-accent:#ffe074;--sc-detail-base:#574821;--sc-detail-base-end:#3b321c; --sc-detail-row:#66532a;--sc-detail-row-border:#bb9c44; --sc-detail-heading:#fff0b2;--sc-detail-glow:#ffc94a44; } #sc-trafico .sc-traffic-selected[data-category="jam"]{ --sc-detail-accent:#ffa44f;--sc-detail-base:#57351f;--sc-detail-base-end:#392619; --sc-detail-row:#66412a;--sc-detail-row-border:#b47743; --sc-detail-heading:#ffddb6;--sc-detail-glow:#ff9a4848; } #sc-trafico .sc-traffic-selected[data-category="weather"]{ --sc-detail-accent:#c79cff;--sc-detail-base:#493263;--sc-detail-base-end:#2b2346; --sc-detail-row:#563c72;--sc-detail-row-border:#9572bf; --sc-detail-heading:#ead9ff;--sc-detail-glow:#bb83ff44; } #sc-trafico .sc-traffic-selected[data-category="works"]{ --sc-detail-accent:#6ebcff;--sc-detail-base:#194c73;--sc-detail-base-end:#11344f; --sc-detail-row:#245b83;--sc-detail-row-border:#4c90c2; --sc-detail-heading:#d7efff;--sc-detail-glow:#55b3ff44; } #sc-trafico .sc-traffic-selected[data-category="restricted"]{ --sc-detail-accent:#43e3bb;--sc-detail-base:#195247;--sc-detail-base-end:#103c34; --sc-detail-row:#236255;--sc-detail-row-border:#439e8a; --sc-detail-heading:#bbffec;--sc-detail-glow:#38e0b044; } #sc-trafico .sc-traffic-selected[data-category="unknown"]{ --sc-detail-accent:#b0bfce;--sc-detail-base:#324353;--sc-detail-base-end:#23313e; --sc-detail-row:#425567;--sc-detail-row-border:#7a92a5; --sc-detail-heading:#eff7ff;--sc-detail-glow:#b1c9df44; } #sc-trafico .sc-traffic-selected .sc-traffic-detailrow{ background:var(--sc-detail-row)!important; border:1px solid var(--sc-detail-row-border)!important; box-shadow:inset 0 1px 0 #ffffff10!important; } #sc-trafico .sc-traffic-selected .sc-traffic-detailrow strong{ color:#ffffff!important;font-weight:850!important; } #sc-trafico .sc-traffic-selected .sc-traffic-detailrow span{ color:#fffdf7!important; } #sc-trafico .sc-traffic-selected .sc-traffic-selected-head, #sc-trafico .sc-traffic-selected .sc-traffic-selected-head strong{ color:var(--sc-detail-heading)!important; } #sc-trafico .sc-traffic-selected .sc-traffic-selected-title{ color:#fff!important;text-shadow:0 1px 2px #0009!important; } #sc-trafico .sc-traffic-selected .sc-traffic-selected-head button{ border-color:var(--sc-detail-accent)!important; background:var(--sc-detail-base)!important; color:#fff!important; } #sc-trafico .sc-traffic-selected .sc-traffic-selected-head button:hover{ background:var(--sc-detail-row)!important; } #sc-trafico .sc-traffic-selected .sc-traffic-provenance{ border-top:1px solid var(--sc-detail-row-border)!important; color:#f7f7f7!important; } #sc-trafico .sc-traffic-selected .sc-traffic-detail-link, #sc-trafico .sc-traffic-selected .sc-traffic-selected-detail a{ color:#fff3c6!important;text-decoration:underline!important; } /* SpainCat V230: resumen de tráfico como acceso rápido a filtros. */ #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter]{cursor:pointer;position:relative;transition:border-color .12s,transform .12s,background .12s;min-height:64px;} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter]:hover{border-color:#78cfff;background:#123e6b;transform:translateY(-1px)} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter]:focus-visible{outline:3px solid #fce18c;outline-offset:2px} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter][aria-pressed="true"]{border:2px solid #6bdcff;box-shadow:inset 0 0 0 1px #a8eeff54,0 0 10px #32affb35} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter="critical"][aria-pressed="true"]{border-color:#ff647b;box-shadow:0 0 12px #f54a6650} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter="cuts"][aria-pressed="true"]{border-color:#ffe17c;box-shadow:0 0 12px #e8c74945} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter="jams"][aria-pressed="true"]{border-color:#ffa55b;box-shadow:0 0 12px #f88b3a50} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter="weather"][aria-pressed="true"]{border-color:#c99cff;box-shadow:0 0 12px #a775dc50} #sc-trafico .sc-traffic-stats>[data-sc-traffic-filter="works-other"][aria-pressed="true"]{border-color:#67baff;box-shadow:0 0 12px #469efb50} @media(max-width:630px){#sc-trafico .sc-traffic-stats>[data-sc-traffic-filter]{min-height:67px}} /* V241 · Aviso Ctrl + rueda igual que en los mapas de Bombers y Sismos. */ #sc-trafico .sc-traffic-map-frame .sc-v241-traffic-ctrl-tip{ position:absolute!important;z-index:2000!important;left:50%!important;bottom:12px!important; transform:translateX(-50%) translateY(4px)!important;max-width:calc(100% - 28px); width:max-content;box-sizing:border-box;padding:9px 13px!important; background:rgba(6,26,50,.95)!important;color:#fff!important; border:2px solid #78d8ff!important;border-radius:9px!important; box-shadow:0 3px 12px #000c!important;font-size:14px!important;line-height:1.4!important; font-weight:760!important;text-shadow:0 1px 2px #000!important; text-align:center!important;pointer-events:none!important;opacity:0!important;visibility:hidden!important; transition:opacity .18s ease,visibility .18s ease!important; } #sc-trafico .sc-traffic-map-frame:hover .sc-v241-traffic-ctrl-tip{ opacity:1!important;visibility:visible!important;transform:translateX(-50%)!important; } #sc-trafico .sc-v241-traffic-ctrl-tip strong{color:#ffe37d!important;font-size:15px!important;} #sc-trafico .sc-traffic-map-frame:has(.sc-traffic-google-activate:not([hidden])) .sc-v241-traffic-ctrl-tip{display:none!important;} @media(hover:none){#sc-trafico .sc-v241-traffic-ctrl-tip{display:none!important;}}