/* تصميمات الكارنيه (مقاس الكارت البنكي 85.6 × 54 مم) — اللون الأساسي من المتغير --c */
.idc { --c: #1f4e5a; width: 85.6mm; height: 54mm; background: #fff; color: #17242a; border-radius: 3mm; overflow: hidden; position: relative; display: flex; flex-direction: column;
  font-family: "Segoe UI", Tahoma, "Noto Sans Arabic", Arial, sans-serif; box-shadow: 0 0 0 .25mm #c9d3d1; break-inside: avoid; page-break-inside: avoid;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; direction: rtl; flex: none; }
.idc .hd { display: flex; align-items: center; gap: 2mm; padding: 1.6mm 2.6mm; background: var(--c); color: #fff; }
.idc .hd .lg { width: 8mm; height: 8mm; object-fit: contain; background: #fff; border-radius: 1.5mm; padding: .4mm; }
.idc .hd div { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; flex: 1; }
.idc .hd b { font-size: 7.4pt; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.idc .hd span { font-size: 6.4pt; opacity: .9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.idc .hd em { font-style: normal; font-size: 6pt; background: #ffffff2e; padding: .5mm 1.6mm; border-radius: 9mm; white-space: nowrap; }
.idc .bd { flex: 1; display: flex; align-items: center; gap: 2mm; padding: 1.8mm 2.6mm; min-height: 0; }
.idc .ph { width: 19mm; height: 23mm; border-radius: 1.5mm; overflow: hidden; background: #eef2f1; flex: none; display: grid; place-items: center; border: .3mm solid #d5dddb; }
.idc .ph img { width: 100%; height: 100%; object-fit: cover; }
.idc .ph span { font-size: 6pt; color: #9aa9a6; }
.idc .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .5mm; font-size: 6.6pt; line-height: 1.3; }
.idc .tx .nm { font-size: 8.6pt; font-weight: 800; color: var(--c); line-height: 1.25; margin-bottom: .6mm; }
.idc .tx i { font-style: normal; color: #6b7c80; }
.idc .qr { width: 21mm; flex: none; display: flex; flex-direction: column; align-items: center; gap: .3mm; }
.idc .qr svg { width: 21mm; height: 21mm; display: block; }
.idc .qr small { font-family: Consolas, monospace; font-size: 5.4pt; color: #6b7c80; }
.idc .ft { font-size: 5.8pt; text-align: center; padding: .7mm; background: color-mix(in srgb, var(--c) 12%, #fff); color: var(--c); }

/* حديث: رأس أبيض مع شكل ملوّن مائل وصورة دائرية */
.idc.d-modern .hd { background: linear-gradient(115deg, var(--c) 0 58%, color-mix(in srgb, var(--c) 70%, #fff) 58% 64%, #fff 64%); color: #fff; }
.idc.d-modern .hd em { background: var(--c); }
.idc.d-modern .ph { border-radius: 50%; width: 20mm; height: 20mm; border: .6mm solid var(--c); }
.idc.d-modern::after { content: ""; position: absolute; left: -8mm; bottom: -8mm; width: 22mm; height: 22mm; border-radius: 50%; background: color-mix(in srgb, var(--c) 10%, #fff); z-index: 0; }
.idc.d-modern .bd, .idc.d-modern .ft { position: relative; z-index: 1; }

/* رأسي */
.idc.d-vertical { width: 54mm; height: 85.6mm; }
.idc.d-vertical .hd { flex-direction: column; text-align: center; gap: .8mm; padding: 2mm; }
.idc.d-vertical .hd div { align-items: center; }
.idc.d-vertical .bd { flex-direction: column; text-align: center; gap: 1.2mm; padding: 2mm; }
.idc.d-vertical .ph { width: 20mm; height: 24mm; }
.idc.d-vertical .tx { align-items: center; }
.idc.d-vertical .qr svg { width: 18mm; height: 18mm; }

/* بسيط */
.idc.d-minimal .hd { background: #fff; color: var(--c); border-bottom: .5mm solid var(--c); }
.idc.d-minimal .hd em { background: color-mix(in srgb, var(--c) 12%, #fff); color: var(--c); }
.idc.d-minimal .hd .lg { background: none; }

/* شريط جانبي */
.idc.d-band { flex-direction: row; }
.idc.d-band .hd { flex-direction: column; justify-content: center; text-align: center; width: 20mm; gap: 1.2mm; padding: 2mm 1mm; }
.idc.d-band .hd div { align-items: center; }
.idc.d-band .hd b, .idc.d-band .hd span { white-space: normal; font-size: 6pt; }
.idc.d-band .hd em { font-size: 5.4pt; padding: .4mm 1mm; }
.idc.d-band .bd { padding: 2mm; }
.idc.d-band .ph { width: 16mm; height: 20mm; }
.idc.d-band .ft { position: absolute; bottom: 0; left: 0; right: 20mm; }

/* لوجوهين في الرأس */
.idc .hd .lg + .lg { margin-inline-start: -.6mm; }

/* تصميم الجامعة الخاص: صورة الكارنيه خلفية، والخانات فوقها في أماكن بيحددها الأدمن بالسحب */
.idc.d-custom { display: block; background: #fff center / 100% 100% no-repeat; color: var(--t); }
.idc.d-custom.vert { width: 54mm; height: 85.6mm; }
.idc.d-custom .el { position: absolute; line-height: 1.25; }
.idc.d-custom .ph { aspect-ratio: 19 / 23; height: auto; border-radius: 1.2mm; }
.idc.d-custom .nm { font-weight: 800; max-width: 60%; color: var(--t); }
.idc.d-custom .tx { display: flex; flex-direction: column; gap: .3mm; max-width: 60%; }
.idc.d-custom .tx i { font-style: normal; opacity: .75; }
.idc.d-custom .qr svg { width: 100%; height: auto; display: block; background: #fff; border-radius: .6mm; }
.idc.d-custom .qr .qph { width: 100%; display: grid; place-items: center; aspect-ratio: 1; background: #fff; border: .3mm dashed #999; font-size: 7pt; color: #888; }
.idc.d-custom .cd { font-family: Consolas, monospace; }
.card-edit .idc.d-custom .el { cursor: grab; outline: 1px dashed rgba(0,120,255,.55); outline-offset: 1px; touch-action: none; }
.card-edit .idc.d-custom .el.sel { outline: 2px solid #0a7cff; }

/* صفحة الطباعة: A4 فيها 10 كارنيهات */
body.cards-print { margin: 0; background: #e9eef0; font-family: "Segoe UI", Tahoma, Arial, sans-serif; }
.cards-print .bar { position: sticky; top: 0; display: flex; gap: 12px; align-items: center; background: #17363d; color: #fff; padding: 10px 16px; flex-wrap: wrap; z-index: 2; }
.cards-print .bar button { background: #fff; color: #17363d; border: 0; border-radius: 8px; padding: 9px 16px; font: inherit; font-weight: 700; cursor: pointer; }
.cards-print .sheet { display: grid; grid-template-columns: repeat(2, max-content); gap: 5mm; justify-content: center; padding: 10mm; background: #fff; width: 210mm; margin: 12px auto; box-sizing: border-box; }
@media print {
  @page { size: A4; margin: 10mm; }
  body.cards-print { background: #fff; }
  .cards-print .bar { display: none; }
  .cards-print .sheet { margin: 0; padding: 0; width: auto; }
}

/* مرونة التصميم: حجم الاسم والبيانات، صورة دايرية، حجم الكود */
.idc .tx .nm { font-size: var(--ns, 8.6pt); }
.idc .tx { font-size: var(--is, 6.6pt); }
.idc.d-custom .nm { font-size: var(--ns, 9pt); }
.idc.d-custom .tx { font-size: var(--is, 6.6pt); }
.idc.round .ph { border-radius: 50% !important; aspect-ratio: 1; height: auto; }
.idc:not(.d-custom).round .ph { width: 20mm; height: 20mm; }
.idc.qr-s .qr { width: 16mm; } .idc.qr-s .qr svg { width: 16mm; height: 16mm; }
.idc.qr-l .qr { width: 25mm; } .idc.qr-l .qr svg { width: 25mm; height: 25mm; }