/* hrai — اختيار التاريخ (hrai-date.js) */
.dp { --dp-ink: var(--k-111111); --dp-mute: var(--k-8a8a8a); --dp-line: var(--k-e4e4e4); --dp-soft: var(--k-f4f4f4); --dp-bg: var(--k-fafafa); --dp-card: var(--k-ffffff); position: relative; font-family: 'Tajawal', sans-serif; }
.dp-label { display: block; font-size: 13px; font-weight: 700; color: var(--k-333333); margin-bottom: 8px; }
.dp-desc { display: block; font-size: 11.5px; color: var(--dp-mute); margin-top: 6px; }
.dp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.dp-anchor { position: relative; }
.dp-trigger { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--dp-line); background: var(--dp-bg); color: var(--dp-ink); font: 500 14px 'Tajawal', sans-serif; text-align: start; cursor: pointer; outline: none; transition: border-color .25s, background .25s, box-shadow .25s; }
.dp-trigger > svg { flex: none; color: var(--dp-mute); }
.dp-trigger:hover { border-color: var(--k-cfcfcf); }
.dp-trigger:focus-visible, .dp-open .dp-trigger { border-color: var(--dp-ink); background: var(--dp-card); }
.dp-trigger:focus-visible { box-shadow: 0 0 0 3px rgba(17, 17, 17, .08); }
.dp-trigger:disabled { opacity: .5; cursor: not-allowed; }
.dp-valuetext { position: relative; flex: 1; min-width: 0; display: grid; overflow: hidden; height: 1.45em; line-height: 1.45em; }
.dp-valuetext > * { grid-area: 1 / 1; white-space: nowrap; }
.dp-ph { color: var(--dp-mute); }
.dp-parts { display: inline-flex; }
.dp-part { position: relative; display: inline-grid; white-space: pre; }
.dp-pv { grid-area: 1 / 1; white-space: pre; font-variant-numeric: tabular-nums; }
.dp-chev { display: grid; color: var(--dp-mute); transition: transform .38s var(--hf-snappy, cubic-bezier(.3, 1.3, .5, 1)); }
.dp-open .dp-chev { transform: rotate(180deg); }

.dp-pop { position: absolute; z-index: 60; top: calc(100% + 8px); inset-inline-start: 0; width: 304px; max-width: calc(100vw - 32px); padding: 12px; border-radius: 16px; background: var(--dp-card); color: var(--dp-ink); box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 18px 44px -12px rgba(0, 0, 0, .25); transform-origin: top; }
.dp-pop.dp-up { top: auto; bottom: calc(100% + 8px); transform-origin: bottom; }
.form-row .form-group:last-child .dp-pop { inset-inline-start: auto; inset-inline-end: 0; }
.dp-head { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.dp-nav { display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 9px; background: none; color: var(--dp-ink); cursor: pointer; }
.dp-nav:hover { background: var(--dp-soft); }
html[dir="rtl"] .dp-prev svg { transform: scaleX(-1); }
html[dir="ltr"] .dp-next svg { transform: scaleX(-1); }
.dp-title { position: relative; flex: 1; display: grid; place-items: center; height: 32px; border: 0; border-radius: 9px; background: none; color: var(--dp-ink); font: 800 14px 'Tajawal', sans-serif; cursor: pointer; overflow: hidden; }
.dp-title > * { grid-area: 1 / 1; white-space: nowrap; }
.dp-title:hover { background: var(--dp-soft); }
.dp-sw { display: inline-block; }
.dp-gridwrap { position: relative; display: grid; }
.dp-gridwrap > .dp-grid { grid-area: 1 / 1; }
.dp-wd { display: grid; grid-template-columns: repeat(7, 1fr); margin-bottom: 2px; }
.dp-wd span { text-align: center; font-size: 11px; font-weight: 700; color: var(--dp-mute); padding: 4px 0; }
.dp-days { position: relative; display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.dp-day { position: relative; z-index: 1; height: 36px; border: 0; border-radius: 10px; background: none; color: var(--dp-ink); font: 600 13.5px 'Tajawal', sans-serif; font-variant-numeric: tabular-nums; cursor: pointer; outline: none; transition: color .2s, background .15s; }
.dp-day:hover:not(.dp-on):not(:disabled) { background: var(--dp-soft); }
.dp-day:focus-visible { box-shadow: inset 0 0 0 2px var(--dp-ink); }
.dp-day.dp-outside { color: var(--k-c4c4c4); }
.dp-day.dp-is-today:not(.dp-on)::after { content: ""; position: absolute; bottom: 5px; left: 50%; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--dp-ink); }
.dp-day.dp-on { color: var(--k-ffffff); }
.dp-day:disabled { color: var(--k-d0d0d0); cursor: not-allowed; text-decoration: line-through; }
.dp-sel { position: absolute; z-index: 0; top: 0; left: 0; border-radius: 10px; background: var(--dp-ink); opacity: 0; pointer-events: none; }
.dp-v-months, .dp-v-years { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 4px 0; }
.dp-cell { height: 46px; border: 0; border-radius: 10px; background: none; color: var(--dp-ink); font: 700 13.5px 'Tajawal', sans-serif; font-variant-numeric: tabular-nums; cursor: pointer; outline: none; }
.dp-cell:hover:not(.dp-on):not(:disabled) { background: var(--dp-soft); }
.dp-cell:focus-visible { box-shadow: inset 0 0 0 2px var(--dp-ink); }
.dp-cell.dp-on { background: var(--dp-ink); color: var(--k-ffffff); }
.dp-cell:disabled { color: var(--k-d0d0d0); cursor: not-allowed; }
.dp-foot { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--k-f0f0f0); }
.dp-clear, .dp-today { height: 30px; padding: 0 12px; border: 0; border-radius: 999px; background: var(--dp-soft); color: var(--dp-ink); font: 700 12.5px 'Tajawal', sans-serif; cursor: pointer; }
.dp-clear:disabled { opacity: .4; cursor: not-allowed; }
.dp-status { position: relative; flex: 1; display: grid; min-width: 0; overflow: hidden; height: 1.5em; font-size: 12px; color: var(--dp-mute); }
.dp-status > * { grid-area: 1 / 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-nav:focus-visible, .dp-title:focus-visible, .dp-clear:focus-visible, .dp-today:focus-visible { outline: 2px solid var(--dp-ink); outline-offset: 1px; }
@media (max-width: 480px) { .dp-pop { width: min(320px, calc(100vw - 32px)); } }
@media (prefers-reduced-motion: reduce) { .dp-chev { transition: none; } }
/* داخل أدوات السيرة: نفس شكل حقولها */
.cv-fld .dp-trigger { background: var(--k-ffffff); border-color: var(--k-e3e3e3); border-radius: var(--rs, 10px); padding: 10px 12px; font-size: 14px; font-weight: 400; }
.cv-fld .dp-trigger:focus-visible, .cv-fld .dp-open .dp-trigger { box-shadow: 0 0 0 3px rgba(0, 0, 0, .05); }
.cv-grid .cv-fld:nth-child(even) .dp-pop { inset-inline-start: auto; inset-inline-end: 0; }
