/* =========================================================
   Name card designs (name page #capture, and small previews .cardmini in /admin)
   Chosen per domain in /admin > Tetapan > Kad nama. Plain colours only:
   the card is turned into an image by html2canvas (no gradients).
   ========================================================= */

.card-emas     { --c-frame:#c9a44c; --c-paper:#fbf6ea; --c-line:#c9a44c; --c-line2:#dcc48a; --orn:"❦    ✦    ❦"; --orn-c:#b8923a;
                 --c-name:#6b4e16; --c-jawi:#a8842f; --c-mean:#5b4a2e; --c-mark:rgba(91,74,46,.45);
                 --f-name:'Great Vibes'; --f-jawi:'Aref Ruqaa'; --f-mean:'Cormorant Garamond'; }
.card-bunga    { --c-frame:#f7c6d9; --c-paper:#fff5f9; --c-line:#f3a6c3; --c-bstyle:dashed; --orn:"✿   ❀   ✿"; --orn-c:#e9759f;
                 --c-name:#d0587e; --c-jawi:#b34d78; --c-mean:#7d5566; --c-mark:rgba(125,85,102,.5);
                 --f-name:'Dancing Script'; --f-jawi:'Amiri'; --f-mean:'Quicksand'; }
.card-comel    { --c-frame:#bfe3ff; --c-paper:#ffffff; --c-line:#8cc8f5; --c-bstyle:dotted; --orn:"☆   ★   ☆"; --orn-c:#f5b942;
                 --c-name:#3f8fd8; --c-jawi:#ef7fa8; --c-mean:#4d6a82; --c-mark:rgba(77,106,130,.5);
                 --f-name:'Pacifico'; --f-jawi:'Lalezar'; --f-mean:'Nunito'; --s-name:3.3em; }
.card-moden    { --c-frame:#ffffff; --c-paper:#ffffff; --c-line:#222222; --orn:"";  --orn-c:#222;
                 --c-name:#1c1c1c; --c-jawi:#6d6d6d; --c-mean:#555555; --c-mark:rgba(0,0,0,.4);
                 --f-name:'Parisienne'; --f-jawi:'Reem Kufi'; --f-mean:'Josefin Sans'; }
.card-malam    { --c-frame:#0f1a30; --c-paper:#1d2a44; --c-line:#c9a44c; --c-line2:rgba(201,164,76,.35); --orn:"✦   ☾   ✦"; --orn-c:#e8c872;
                 --c-name:#f1d58a; --c-jawi:#f7e8c0; --c-mean:#cfd6e4; --c-mark:rgba(255,255,255,.45);
                 --f-name:'Pinyon Script'; --f-jawi:'Amiri'; --f-mean:'Lora'; }
.card-zamrud   { --c-frame:#0b4a3f; --c-paper:#0f5b4d; --c-line:#d8b660; --c-line2:rgba(216,182,96,.45); --orn:"۞"; --orn-c:#d8b660;
                 --c-name:#f7e7b4; --c-jawi:#ffffff; --c-mean:#e5efe9; --c-mark:rgba(255,255,255,.45);
                 --f-name:'Alex Brush'; --f-jawi:'Aref Ruqaa'; --f-mean:'Cormorant Garamond'; }
.card-kraf     { --c-frame:#b58a5c; --c-paper:#e6cda8; --c-line:#8a6239; --c-bstyle:dashed; --orn:"❋   ❋   ❋"; --orn-c:#8a6239;
                 --c-name:#4a3220; --c-jawi:#5a3e28; --c-mean:#4a3220; --c-mark:rgba(74,50,32,.55);
                 --f-name:'Sacramento'; --f-jawi:'Noto Nastaliq Urdu'; --f-mean:'Special Elite'; --s-name:4.8em; }
.card-ungu     { --c-frame:#d9ccff; --c-paper:#faf7ff; --c-line:#cbb8ff; --orn:"❀   ✧   ❀"; --orn-c:#9b7fe6;
                 --c-name:#7657c9; --c-jawi:#8e6fd8; --c-mean:#6a5d8a; --c-mark:rgba(106,93,138,.5);
                 --f-name:'Allura'; --f-jawi:'Scheherazade New'; --f-mean:'Mulish'; }

.card-plain    { --c-frame:#eeeaf2; --c-paper:#ffffff; --c-line:#e3dde8; --orn:""; --orn-c:#999;
                 --c-name:#645555; --c-jawi:#645555; --c-mean:#7a6f75; --c-mark:rgba(0,0,0,.35);
                 --f-name:'Clicker Script'; --f-jawi:'Noto Nastaliq Urdu'; --f-mean:'Quicksand'; }   /* /admin preview of the original card */

/* ---------- shared layout ---------- */
body :is(#capture, .cardmini)[class*="card-"] {
	background: var(--c-frame) !important;
	padding: 12px !important;
	border: 0 !important;
	border-radius: 26px;
	box-shadow: 0 14px 34px rgba(0,0,0,0.10);
	overflow: hidden;
}
body .card-moden:is(#capture, .cardmini) { border: 1px solid #222 !important; padding: 10px !important; }
body :is(#capture, .cardmini)[class*="card-"] > .namebox {
	position: relative;
	font-size: 16px;
	margin: 0;
	max-width: none;
	padding: 1.8em 1.3em 1.3em;
	background: var(--c-paper);
	border: 2px var(--c-bstyle, solid) var(--c-line);
	outline: 0;
	border-radius: 18px;
	text-align: center;
}
body :is(#capture, .cardmini)[class*="card-"] > .namebox::before {        /* ornament on top */
	content: var(--orn);
	display: block;
	color: var(--orn-c);
	font-size: 1.25em;
	line-height: 1;
	letter-spacing: .15em;
	margin-bottom: .5em;
	white-space: pre;
}
body :is(#capture, .cardmini)[class*="card-"] > .namebox::after {         /* thin inner frame line */
	content: "";
	position: absolute;
	top: .55em; left: .55em; right: .55em; bottom: .55em;
	border: 1px solid var(--c-line2, transparent);
	border-radius: 12px;
	pointer-events: none;
}
body :is(#capture, .cardmini)[class*="card-"] .namescript {
	font-family: var(--f-name), 'Clicker Script', cursive;
	font-size: var(--s-name, 4.2em);
	line-height: 1.15;
	font-weight: 400;
	margin: .05em 0 .25em;
	color: var(--c-name) !important;
	text-shadow: none;
	word-break: normal;
}
body :is(#capture, .cardmini)[class*="card-"] .namajawi {
	font-family: var(--f-jawi), 'Scheherazade New', 'Amiri', serif;
	font-size: 2em;
	line-height: 1.8;
	margin: 0 0 .3em;
	color: var(--c-jawi);
	direction: rtl;
}
body :is(#capture, .cardmini)[class*="card-"] .namemean {
	font-family: var(--f-mean), sans-serif;
	font-size: 1em;
	line-height: 1.6;
	color: var(--c-mean);
}
body :is(#capture, .cardmini)[class*="card-"] .cardmark {
	margin-top: 1.2em;
	font-size: .75em;
	letter-spacing: .12em;
	color: var(--c-mark);
}

/* ---------- details per design ---------- */
body .card-emas .namemean, body .card-zamrud .namemean { font-style: italic; font-size: 1.12em; }
body .card-moden .namemean { text-transform: uppercase; letter-spacing: .14em; font-size: .8em; }
body .card-moden > .namebox { border-width: 0 !important; }
body .card-moden .namescript { font-size: 4em; }
body .card-comel > .namebox { border-width: 3px; }
body .card-kraf .namemean { font-size: .95em; }

/* phones: a little smaller so long two-part names stay on one or two lines */
@media (max-width: 480px) {
	body #capture[class*="card-"] > .namebox { font-size: 12.5px; }
}

/* small previews in /admin */
.cardmini { width: 100%; box-sizing: border-box; box-shadow: none !important; padding: 6px !important; border-radius: 14px !important; }
body .cardmini[class*="card-"] > .namebox { font-size: 7.5px; border-radius: 10px; }