/* Styled alert / confirm / prompt (cc-dialog.js): CoreCraftia frame, wooden sign title, 3D buttons. */

.cc-dialog-overlay{
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 14px;
  background:
    radial-gradient(circle at 20% 0%, rgba(73, 168, 255, 0.18), transparent 28%),
    rgba(2, 10, 18, 0.74);
  font-family: Georgia, "Times New Roman", serif;
}
.cc-dialog-card{
  --cd-wood: linear-gradient(180deg, #d79a58 0%, #b87438 52%, #8d5226 100%);
  --cd-grain: repeating-linear-gradient(92deg, rgba(60, 28, 6, 0) 0 22px, rgba(60, 28, 6, 0.16) 22px 24px);
  position: relative;
  box-sizing: border-box;
  width: min(420px, 100%);
  padding: 40px 20px 18px;
  border: 4px solid #2f93ff;
  border-radius: 20px;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(90, 170, 255, 0.22), transparent 60%),
    linear-gradient(180deg, #123c72 0%, #0b2750 52%, #081b38 100%);
  box-shadow: 0 0 0 2px #082f66, 0 18px 44px rgba(0, 0, 0, 0.6), inset 0 0 0 1px rgba(150, 210, 255, 0.35), inset 0 3px 0 rgba(255, 255, 255, 0.08);
  color: #fff;
  text-align: center;
}
.cc-dialog-sign{
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
  max-width: calc(100% - 24px);
  padding: 5px 28px 7px;
  border: 3px solid #4a2a10;
  border-radius: 12px;
  background: var(--cd-grain), var(--cd-wood);
  box-shadow: 0 4px 0 #2a1608, 0 6px 10px rgba(0, 0, 0, 0.45), inset 0 2px 0 rgba(255, 224, 170, 0.5);
  white-space: nowrap;
}
.cc-dialog-title{
  overflow: hidden;
  text-overflow: ellipsis;
  color: #fff;
  font: 900 clamp(17px, 2.4vw, 22px)/1.1 Georgia, "Times New Roman", serif;
  letter-spacing: 0.04em;
  -webkit-text-stroke: 5px #0a1c3c;
  paint-order: stroke fill;
  text-shadow: 0 3px 0 rgba(10, 28, 60, 0.9);
}
.cc-dialog-message{
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 3px solid rgba(120, 190, 255, 0.45);
  border-radius: 14px;
  background: linear-gradient(180deg, #0c2144, #081a38);
  box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.4);
  color: #e3f1ff;
  font: 800 15px/1.4 Georgia, serif;
  text-shadow: 0 2px 0 rgba(0, 0, 0, 0.55);
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.cc-dialog-input{
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 14px;
  padding: 11px 14px;
  border: 3px solid #4aa8ff;
  border-radius: 14px;
  background: #06142c;
  box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.5);
  color: #fff;
  font: 800 16px/1.2 Georgia, serif;
  outline: none;
}
.cc-dialog-input:focus{ border-color: #ffe27a; box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.5), 0 0 0 2px rgba(255, 226, 122, 0.4); }
.cc-dialog-actions{ display: flex; justify-content: center; gap: 12px; }
.cc-dialog-btn{
  flex: 1 1 0;
  max-width: 170px;
  min-height: 44px;
  padding: 8px 16px;
  border: 3px solid #0b2c5e;
  border-radius: 14px;
  background: linear-gradient(180deg, #1b5fb8 0%, #123f86 52%, #0c2c62 100%);
  box-shadow: 0 4px 0 #061a38, inset 0 3px 0 rgba(255, 255, 255, 0.3);
  color: #fff;
  font: 900 16px/1 Georgia, serif;
  letter-spacing: 0.03em;
  text-shadow: 0 2px 0 rgba(0, 20, 60, 0.85);
  cursor: pointer;
  transition: filter 120ms ease, transform 120ms ease;
}
.cc-dialog-ok{
  background: linear-gradient(180deg, #7ddc5a 0%, #3fae2f 52%, #25801f 100%);
  border-color: #124a12;
  box-shadow: 0 4px 0 #0c3a0c, inset 0 3px 0 rgba(255, 255, 255, 0.4);
  text-shadow: 0 2px 0 rgba(8, 50, 8, 0.85);
}
.cc-dialog-card.is-danger .cc-dialog-ok{
  background: linear-gradient(180deg, #ff6a5c 0%, #d3201a 52%, #a31410 100%);
  border-color: #5a1210;
  box-shadow: 0 4px 0 #3a0a08, inset 0 3px 0 rgba(255, 255, 255, 0.4);
  text-shadow: 0 2px 0 rgba(90, 8, 4, 0.9);
}
.cc-dialog-btn:hover{ filter: brightness(1.12); transform: translateY(-1px); }
.cc-dialog-btn:active{ transform: translateY(3px); box-shadow: 0 1px 0 #061a38; }
.cc-dialog-btn:focus-visible{ outline: 3px solid #ffe27a; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce){ .cc-dialog-btn{ transition: none; } }