/* PORTAL WEB AC v1.0.0 · Pantalla premium de càrrega del mapa + cache de sessió */

body.map-cache-loading{overflow:hidden;}

.map-cache-loader{
  position:fixed;
  inset:0;
  z-index:120000;
  display:grid;
  place-items:center;
  padding:clamp(20px,4vw,56px);
  color:#203755;
  background:
    radial-gradient(circle at 18% 14%,rgba(15,77,129,.16),transparent 33rem),
    radial-gradient(circle at 82% 80%,rgba(1,72,129,.13),transparent 34rem),
    linear-gradient(145deg,#f7fafe 0%,#edf3f9 52%,#f8fbfe 100%);
  overflow:hidden;
  opacity:1;
  visibility:visible;
  transition:opacity .48s ease,visibility .48s ease;
}
.map-cache-loader.is-active{display:grid;}
.map-cache-loader[hidden]{display:none!important;}
.map-cache-loader.is-leaving{opacity:0;visibility:hidden;pointer-events:none;}

.map-cache-loader::before,
.map-cache-loader::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  filter:blur(1px);
  opacity:.7;
}
.map-cache-loader::before{
  width:min(58vw,760px);
  aspect-ratio:1;
  left:-20vw;
  top:-34vw;
  border:1px solid rgba(32,55,85,.08);
  box-shadow:0 0 0 70px rgba(1,72,129,.018),0 0 0 150px rgba(1,72,129,.012);
}
.map-cache-loader::after{
  width:min(44vw,620px);
  aspect-ratio:1;
  right:-16vw;
  bottom:-24vw;
  border:1px solid rgba(32,55,85,.07);
  box-shadow:0 0 0 80px rgba(1,72,129,.016);
}

.map-cache-loader__card{
  position:relative;
  width:min(760px,100%);
  padding:clamp(30px,5vw,56px);
  border:1px solid rgba(255,255,255,.72);
  border-radius:32px;
  background:rgba(255,255,255,.80);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  backdrop-filter:blur(24px) saturate(140%);
  box-shadow:0 34px 90px rgba(19,44,73,.16),inset 0 1px 0 rgba(255,255,255,.82);
  overflow:hidden;
}
.map-cache-loader__card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.48),transparent 32%,transparent 70%,rgba(15,77,129,.04));
}

.map-cache-loader__brand{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:clamp(28px,4vw,42px);
}
.map-cache-loader__brand img{width:min(230px,52vw);height:auto;display:block;}
.map-cache-loader__badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:8px 12px;
  border:1px solid rgba(1,72,129,.15);
  border-radius:999px;
  background:rgba(244,247,251,.92);
  color:#33516f;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}
.map-cache-loader__badge::before{
  content:"";
  width:8px;height:8px;border-radius:50%;
  background:#0f4d81;
  box-shadow:0 0 0 5px rgba(15,77,129,.10);
}

.map-cache-loader__content{position:relative;z-index:1;}
.map-cache-loader__eyebrow{
  margin:0 0 10px;
  color:#0f4d81;
  font-size:12px;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.map-cache-loader__title{
  margin:0;
  max-width:15ch;
  color:#203755;
  font-size:clamp(34px,6vw,64px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:800;
}
.map-cache-loader__status{
  min-height:48px;
  margin:20px 0 0;
  max-width:60ch;
  color:#5c6c7e;
  font-size:clamp(14px,1.8vw,17px);
  line-height:1.55;
  font-weight:500;
}

.map-cache-loader__progress-wrap{position:relative;z-index:1;margin-top:28px;}
.map-cache-loader__progress-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:10px;
  color:#40576f;
  font-size:12px;
  font-weight:700;
}
.map-cache-loader__progress{
  position:relative;
  height:10px;
  overflow:hidden;
  border-radius:999px;
  background:#dce6f0;
  box-shadow:inset 0 1px 2px rgba(32,55,85,.09);
}
.map-cache-loader__progress-bar{
  position:absolute;
  inset:0 auto 0 0;
  width:5%;
  border-radius:inherit;
  background:linear-gradient(90deg,#203755,#014881 58%,#35a5de);
  box-shadow:0 0 20px rgba(1,72,129,.26);
  transition:width .42s cubic-bezier(.2,.8,.2,1);
}
.map-cache-loader__progress-bar::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.54) 50%,transparent 72%);
  transform:translateX(-110%);
  animation:acCacheSweep 1.7s ease-in-out infinite;
}
@keyframes acCacheSweep{to{transform:translateX(110%)}}

.map-cache-loader__meta{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  align-items:center;
  margin-top:20px;
  color:#6b7888;
  font-size:12px;
  font-weight:600;
}
.map-cache-loader__meta span{display:inline-flex;align-items:center;gap:7px;}
.map-cache-loader__meta span::before{
  content:"";
  width:6px;height:6px;border-radius:50%;background:#82a4c1;
}
.map-cache-loader__meta .is-hot::before{background:#14845d;box-shadow:0 0 0 4px rgba(20,132,93,.10);}

.map-cache-loader.is-error .map-cache-loader__badge::before{background:#bd5b2f;box-shadow:0 0 0 5px rgba(189,91,47,.10);}
.map-cache-loader.is-error .map-cache-loader__progress-bar{background:linear-gradient(90deg,#8e4829,#bd5b2f);}

@media (max-width:640px){
  .map-cache-loader{padding:16px;}
  .map-cache-loader__card{padding:26px 22px;border-radius:26px;}
  .map-cache-loader__brand{align-items:flex-start;flex-direction:column;margin-bottom:28px;}
  .map-cache-loader__badge{font-size:10px;}
  .map-cache-loader__title{font-size:clamp(38px,12vw,54px);}
  .map-cache-loader__status{min-height:66px;}
}

@media (prefers-reduced-motion:reduce){
  .map-cache-loader,
  .map-cache-loader__progress-bar{transition:none;}
  .map-cache-loader__progress-bar::after{animation:none;}
}
