.xmc-screen {
	width:100%; display:flex; justify-content:center; padding:30px 16px;
	background: radial-gradient(1250px circle at 0% 0%, rgba(14,165,233,0.10), transparent 35%),
							radial-gradient(1250px circle at 100% 0%, rgba(59,130,246,0.10), transparent 35%);
	box-sizing: border-box;
}

.xmc-card { max-width:860px; width:100%; background:rgba(255,255,255,0.9); border-radius:16px; box-shadow:0 12px 30px rgba(0,0,0,0.08); border:1px solid rgba(255,255,255,0.6); overflow:hidden; }
.xmc-header { padding:20px 20px 0; }
.xmc-header-row { display:flex; align-items:center; gap:10px; }
.xmc-emoji { font-size:22px; }
.xmc-title { font-size:20px; margin:0; font-weight:800; letter-spacing:.2px; color:#0f172a; }
.xmc-desc { color:#475569; margin:10px 0 16px; }
.xmc-link { color:#0ea5e9; text-decoration:none; }
.xmc-link:hover { text-decoration:underline; }

.xmc-body { padding:16px 20px 20px; }
.xmc-form { display:flex; flex-direction:column; gap:14px; }
.xmc-card .xmc-form > div { margin-top: 0 !important; margin-bottom: 0; }
.xmc-grid { display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:768px){ .xmc-grid { grid-template-columns: repeat(2,1fr); } }

/* Ensure fields in the same grid row align from the top */
.xmc-grid .xmc-field { align-self: start; }

.xmc-card .xmc-field { display:flex; flex-direction:column; gap:6px; }
.xmc-card .xmc-field.x-full { grid-column:1 / -1; }
.xmc-card .xmc-field.x-sm { max-width:240px; }
.xmc-label { font-weight:600; color:#334155; font-size:13px; }

.xmc-input { width:100%; padding:12px; border:1px solid #e3e3e3; border-radius:10px; box-sizing:border-box; background:#f7f7f8; color:#0f172a; transition: box-shadow .2s, border-color .2s, background .2s; min-height:44px; line-height:1.3; }
.xmc-input:focus { outline:none; border-color:#93c5fd; box-shadow:0 0 0 3px rgba(147,197,253,.35); background:#fff; }

/* Make date inputs match text inputs' height/padding across browsers */
input[type="date"].xmc-input { padding-top:10px; padding-bottom:10px; }
/* Normalize WebKit date input internals to avoid top offset */
input[type="date"].xmc-input::-webkit-datetime-edit { padding: 0; line-height: 1.3; }
input[type="date"].xmc-input::-webkit-inner-spin-button,
input[type="date"].xmc-input::-webkit-calendar-picker-indicator { margin: 0; }

/* Combo list (select) tidy styling: remove native arrow and add custom chevron */
select.xmc-input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #f7f7f8;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2357636b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px 16px;
  padding-right: 40px; /* space for chevron */
  line-height: 1.3;
}
select.xmc-input:focus { background-color:#fff; }
/* Hide legacy IE arrow if any */
select.xmc-input::-ms-expand { display:none; }

.xactions { display:flex; gap:10px; justify-content:flex-end; margin-top:8px; flex-wrap:wrap; }
.xactions.x-center { justify-content: center; }
.xbtn { padding:12px 16px; border-radius:10px; border:1px solid transparent; cursor:pointer; font-weight:600; }
.xbtn.x-secondary { background:#eef2ff; color:#3730a3; border-color:#e0e7ff; }
.xbtn.x-secondary:hover { background:#e0e7ff; }
.xbtn.x-primary { background:#0ea5e9; color:#fff; }
.xbtn.x-primary:hover { background:#0284c7; }

.xmc-funds .xfund { display:grid; grid-template-columns: 1fr; gap:12px; }
@media (min-width:640px){ .xmc-funds .xfund{ grid-template-columns: 1fr 220px; align-items:end; } }

.xremove-fund { padding:8px 10px; border-radius:8px; border:1px solid #e5e7eb; background:#fff; color:#334155; cursor:pointer; }
.xremove-fund:hover { background:#f8fafc; }

.xmc-result { margin-top:12px; }
.xmc-result-title { margin:0 0 10px; font-size:16px; font-weight:700; color:#0f172a; }
.xmc-result-box { background:#ffffff; border:1px solid #e5e7eb; border-radius:12px; padding:14px; box-shadow:0 4px 14px rgba(0,0,0,.05); }
.xmc-result-sub { color:#475569; font-size:13px; margin-bottom:4px; }
.xmc-result-value { font-size:20px; font-weight:800; color:#111827; }
.xmc-funds-details { margin-top:10px; }
.xmc-funds-details ul { margin:8px 0 0; padding-left:18px; }
.xmc-funds-details li { padding:4px 0; color:#334155; }
.xmc-note { margin-top:10px; font-size:12px; color:#64748b; }
.xmc-note a { color:#0ea5e9; text-decoration:none; }
.xmc-note a:hover { text-decoration:underline; }

/* Modal */
.xmc-modal { position: fixed; inset: 0; display:none; align-items:center; justify-content:center; z-index: 999999; }
.xmc-modal[aria-hidden="false"] { display:flex; }
.xmc-modal-backdrop { position:absolute; inset:0; background: rgba(15,23,42,0.48); }
.xmc-modal-dialog { 
  position:relative; max-width:640px; width:92%; max-height:90vh; 
  background:#fff; border-radius:14px; box-shadow: 0 18px 44px rgba(0,0,0,.18); 
  padding:18px; border:1px solid #e5e7eb; 
  overflow-y: auto; 
  margin: auto;
}
@media (max-width: 768px) {
  .xmc-modal { align-items: flex-start; padding: 20px 0; }
  .xmc-modal-dialog { 
    max-height: calc(100vh - 40px); 
    margin-top: 20px; 
    width: 95%; 
  }
}
.xmc-modal-title { margin:0 0 8px; font-size:18px; font-weight:800; color:#0f172a; }
.xmc-modal-content { color:#334155; }
.xmc-modal-content ul { margin:8px 0 0; padding-left:18px; }
.xmc-modal-close { position:absolute; top:8px; right:10px; background:transparent; border:none; font-size:22px; line-height:1; cursor:pointer; color:#475569; }

#xpurification-form .xmc-field{
        margin-top:0px !important;
}

.xmc-modal[aria-hidden="false"] {
    z-index: 2147483647 !important;
    position: fixed !important;
    display: flex !important;
}