/* CorePath Phase 11E — Stable PE-style Modal Engine
   Purpose: fixed large shell, no width/height jump after content loads. */

body.corepath-modal-open{
  overflow:hidden;
}

.corepath-modal[aria-hidden="true"]{
  display:none;
}

.corepath-modal[aria-hidden="false"]{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(18px, 3vw, 46px);
}

.corepath-modal-backdrop{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 10%, rgba(86,195,215,.22), transparent 34%),
    radial-gradient(circle at 12% 88%, rgba(128,117,198,.16), transparent 30%),
    linear-gradient(135deg, rgba(8,55,47,.78), rgba(12,19,26,.82));
  backdrop-filter:blur(12px) saturate(112%);
  -webkit-backdrop-filter:blur(12px) saturate(112%);
}

.corepath-modal-dialog{
  position:relative;
  z-index:2;

width:min(1420px, 96vw);
max-width:1420px;
min-height:min(760px, 84vh);
max-height:92vh;

  display:flex;
  flex-direction:column;
  overflow:hidden;

  background:
    linear-gradient(180deg, rgba(255,255,255,.99), rgba(247,250,251,.99));
  border:1px solid rgba(255,255,255,.68);
  border-radius:30px;
  box-shadow:
    0 48px 150px rgba(0,0,0,.42),
    0 0 0 1px rgba(32,43,54,.06) inset;

  transform:translateY(0) scale(1);
  animation:corepathModalIn .24s ease both;
}

@keyframes corepathModalIn{
  from{ opacity:0; transform:translateY(14px) scale(.985); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

.corepath-modal-dialog::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:8px;
  background:linear-gradient(90deg, var(--cyan, #56c3d7), var(--green, #5bb46c), var(--orange, #ecaf69), var(--purple, #8075c6));
  z-index:3;
}

.corepath-modal-close{
  position:absolute;
  right:24px;
  top:22px;
  z-index:6;
  width:50px;
  height:50px;
  border:1px solid rgba(32,43,54,.10);
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:#202b36;
  font-size:31px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 12px 34px rgba(32,43,54,.14);
  transition:transform .22s ease, background .22s ease, color .22s ease;
}

.corepath-modal-close:hover{
  transform:rotate(90deg) scale(1.04);
  background:var(--red, #ff6260);
  color:#fff;
}

.corepath-modal-body{
  flex:1 1 auto;
  width:100%;
  min-height:0;
  max-height:88vh;
  overflow:auto;
  padding:clamp(42px, 5.2vw, 78px);
  padding-right:clamp(44px, 5.8vw, 90px);
  color:#211c1b;
  scrollbar-width:thin;
}

.corepath-modal-body::-webkit-scrollbar{
  width:10px;
}

.corepath-modal-body::-webkit-scrollbar-thumb{
  background:rgba(32,43,54,.18);
  border-radius:999px;
}

.corepath-modal-loading{
  min-height:min(520px, 70vh);
  display:grid;
  place-items:center;
  color:#202b36;
  font-family:'Outfit', 'Helvetica Neue', Arial, sans-serif;
  font-size:1.45rem;
  letter-spacing:-.03em;
}

.corepath-modal.is-loading .corepath-modal-dialog{
  min-height:min(640px, 82vh);
}

.corepath-modal.is-ready .corepath-modal-dialog{
  min-height:min(640px, 82vh);
}

/* Make PE/content-manager HTML feel native inside CorePath modal */
.corepath-modal-body h1,
.corepath-modal-body h2,
.corepath-modal-body h3{
  font-family:'Outfit', 'Helvetica Neue', Arial, sans-serif;
  color:#202b36;
  letter-spacing:-.045em;
  line-height:1;
  margin-top:0;
}

.corepath-modal-body h1{
  font-size:clamp(3rem, 5vw, 6rem);
  font-weight:200;
  max-width:980px;
}

.corepath-modal-body h2{
  font-size:clamp(2.15rem, 3.6vw, 3.8rem);
  font-weight:250;
}

.corepath-modal-body p,
.corepath-modal-body li{
  font-size:1rem;
  line-height:1.85;
}

.corepath-modal-body img{
  max-width:100%;
  height:auto;
  border-radius:18px;
}

.corepath-modal-body table{
  width:100%;
  border-collapse:collapse;
  margin:24px 0;
  background:#fff;
}

.corepath-modal-body th,
.corepath-modal-body td{
  border:1px solid rgba(32,43,54,.10);
  padding:14px 16px;
  text-align:left;
}

.corepath-modal-body input,
.corepath-modal-body select,
.corepath-modal-body textarea{
  max-width:100%;
}

@media (max-width:980px){
  .corepath-modal[aria-hidden="false"]{
    padding:14px;
    align-items:flex-end;
  }

  .corepath-modal-dialog{
    width:100%;
    max-width:100%;
    min-height:min(620px, 88vh);
    max-height:92vh;
    border-radius:26px 26px 0 0;
  }

  .corepath-modal-body{
    max-height:92vh;
    padding:38px 22px 46px;
  }

  .corepath-modal-close{
    right:16px;
    top:16px;
  }
}

@media (max-width:620px){
  .corepath-modal-dialog{
    min-height:82vh;
  }

  .corepath-modal-body h1{
    font-size:2.4rem;
  }
}