/* ================================ cntr -#1
  IMOT-U Governance Door (v4.4i)
  ================================ */

:root {
 --gov-bg: #0e1116;
 --gov-panel: #141922;
 --gov-gold: #d4af37;
 --gov-gold-soft: #e6c96b;
 --gov-text: #e9ecf1;
 --gov-muted: #a0a7b4;
 --gov-border: rgba(212, 175, 55, 0.4);
}
/* ~~~~~ */

/* ================================ cntr -#2
  Main Door Container (v4.4i)
  ================================ */
.api-door-modal {
 max-width: 720px;
 margin: 2.5rem auto;
 padding: 2rem;

 background: linear-gradient(
   160deg,
   #0e1116,
   #141922
 );

 border-radius: 16px;
 border: 1px solid var(--gov-border);

 box-shadow:
   0 0 25px rgba(0,0,0,0.6),
   inset 0 0 12px rgba(212,175,55,0.08);

 font-family: "Segoe UI", system-ui, sans-serif;
 color: var(--gov-text);
}

/* ================================ cntr -#3
  Title Bar (Gateway Header) (v4.4i)
  ================================ */
  .api-door-modal h2 {
	text-align: center;

	color: var(--gov-gold);
	font-weight: 600;
	letter-spacing: 1.5px;

	margin-bottom: 1.5rem;
	padding-bottom: 0.75rem;

	border-bottom: 1px solid var(--gov-border);

	font-size: 1.3rem;
  }

/* ITM Blending Cleanup */

	.imotu-surface {
		background:#f8fafc;
		color:#1f2937;

		border-radius:16px;

		padding:2rem;

		box-shadow:
			0 8px 30px rgba(0,0,0,.08);
	}
	
	.participant-status {
	 color:#93c5fd;      /* light blue */
	 font-weight:600;
	}

/* ======================================== cntr -#4
  Mnemonic Blocks (SCT-01/Sub/GOV) (v4.4i)
  ======================================== */
/*   .mnemonic-block {
	 background: rgba(255,255,255,0.03);

	 border-left: 3px solid var(--gov-gold);

	 padding: 0.9rem 1rem;
	 margin-bottom: 0.8rem;

	 border-radius: 6px;

	 font-size: 0.95rem;
	 line-height: 1.45;

	 color: var(--gov-text);
   }

   .mnemonic-block strong {
	 color: var(--gov-gold-soft);
	 font-weight: 600;
   } */
   
  .mnemonic-block{
	 background:rgba(255,255,255,.08);
	 border:1px solid rgba(255,255,255,.12);
	 border-left:4px solid #c8a74d;
	 border-radius:12px;
	 padding:1rem 1.15rem;
	 margin-bottom:1rem;
	 backdrop-filter:blur(6px);
	 color:#eef2f7;
	 transition:.25s;
	 }

	 .mnemonic-block:hover{
		background:rgba(255,255,255,.12);
	 }

	 .mnemonic-block strong{
	 color:#d4af37;
	 display:block;
	 font-size:1rem;
	 margin-bottom:.35rem;
	 }
	.mnemonic-block{
		background:#1f2937;
		color:#f3f4f6;
		padding:1rem;
		border-radius:12px;
		margin-bottom:1rem;
	}

	.mnemonic-block strong{
		color:#d4af37;
	}

/* ================================ cntr -#5
  Door Button (Open Modal) (v4.4i)
  ================================ */
  .door-btn {
	background: transparent;

	border: 1px solid var(--gov-gold);
	color: var(--gov-gold);

	padding: 10px 26px;
	border-radius: 28px;

	font-size: 0.95rem;
	font-weight: 500;
	letter-spacing: 1px;

	cursor: pointer;

	transition: all 0.25s ease;
  }

  .door-btn:hover {
	background: var(--gov-gold);
	color: #0e1116;

	box-shadow: 0 0 12px rgba(212,175,55,0.4);
  }


/* ================================ cntr -#6
  Modal Overlay (Not Black) (v4.4i)
  ================================ */
  .modal {
	position: fixed;
	inset: 0;

	background: rgba(10,14,20,0.82);

	display: flex;
	align-items: center;
	justify-content: center;

	z-index: 1000;
  }

  .hidden {
	display: none;
  }

/* ================================ cntr -#7
  Modal Box (v4.4i)
  ================================ */
  .modal-content {
	width: 90%;
	max-width: 520px;

	background: var(--gov-panel);

	border-radius: 14px;
	padding: 2rem;

	border: 1px solid var(--gov-border);

	box-shadow:
	  0 0 35px rgba(0,0,0,0.8),
	  inset 0 0 10px rgba(212,175,55,0.06);

	  color: var(--gov-text);
  } 

/* ================================ cntr -#8
  Contract Checkoxes (v4.4i)
  ================================ */
  .contract-check,
	 .email-check {
	   display: flex;
	   align-items: center;

	   margin: 1rem 0;

	   font-size: 0.9rem;
	   color: var(--gov-muted);
	 }

	 .contract-check input,
	 .email-check input {
	   margin-right: 10px;
	   accent-color: var(--gov-gold);
  }

/* ================================ cntr -#9
   Email Field (v4.4i)
  ================================ */
  email-check + input[type="email"] {
	width: 100%;

	margin-top: 0.5rem;
	padding: 8px 10px;

	border-radius: 6px;

	background: #0c0f14;
	border: 1px solid rgba(255,255,255,0.15);

	color: var(--gov-text);

	font-size: 0.9rem;
  }

  .email-check + input[type="email"]:focus {
	outline: none;
	border-color: var(--gov-gold);
  }

/* ================================ cntr -#9-IPG
      An IPG Modal Funtionality
 PJM -- optionql recommendations -- AI
    changes result in rieght-side  
      posistioning and font-size
           reduction...
  ================================ */
.modal-content {
        position: relative;
}

.modal-close {
   position: absolute;
   /* top: 12px; */
   top: 0.75rem; */
   /* right: 16px; */
   right: 1rem; 

   font-size: 1.8rem;
   font-weight: bold;
/*
   color: #d4af37;
   cursor: pointer; 

   line-height: 1;
   z-index: 1000; */

   color: #d4af37;
   font-size: 1.2rem;
   font-weight: bold;

   cursor: pointer;
   user-select: none;
}

.modal-close:hover {
   color: #ffffff;
}

/* ================================ cntr -#10
   Confirm Button (Primary Action)  (v4.4i)
  ================================ */

  #acceptBtn {
	width: 100%;

	margin-top: 1.2rem;
	padding: 10px;

	border-radius: 26px;

	border: none;

	background: var(--gov-gold);
	color: #0e1116;

	font-weight: 600;
	letter-spacing: 1px;

	cursor: pointer;

	transition: all 0.2s ease;
  }

  #acceptBtn:disabled {
	background: #444;
	color: #999;
	cursor: not-allowed;
  }

  #acceptBtn:hover:not(:disabled) {
	box-shadow: 0 0 15px rgba(212,175,55,0.5);
  }

/* ================================ cntr -#10
   Status Message (v4.4i)
  ================================ */

  .participant-status {
	margin-top: 1rem;

	font-size: 0.9rem;
	text-align: center;

	color: var(--gov-gold-soft);
  }