/* Cura brand layer: Roobert Arabic everywhere + right-to-left fixes for the original LTR templates */
@font-face { font-family: "Roobert Arabic"; src: url("../fonts/RoobertArabic-TRIAL-Light.ttf") format("truetype"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Roobert Arabic"; src: url("../fonts/RoobertArabic-TRIAL-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Roobert Arabic"; src: url("../fonts/RoobertArabic-TRIAL-Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Roobert Arabic"; src: url("../fonts/RoobertArabic-TRIAL-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Roobert Arabic"; src: url("../fonts/RoobertArabic-TRIAL-Bold.ttf") format("truetype"); font-weight: 700 900; font-display: swap; }

html, body, input, select, textarea, button, h1, h2, h3, h4, h5, h6, p, a, span, label, td, th, li {
  font-family: "Roobert Arabic", system-ui, sans-serif !important;
}
.fa, .fas, .far, .fab, [class^="fa-"], [class*=" fa-"] { font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands" !important; }
.fab { font-family: "Font Awesome 6 Brands" !important; }

/* RTL: mirror the most common physical-direction utilities used in the templates */
[dir="rtl"] .text-left { text-align: right; }
[dir="rtl"] .text-right { text-align: left; }
[dir="rtl"] .left-0 { left: auto; right: 0; }
[dir="rtl"] .right-0 { right: auto; left: 0; }
[dir="rtl"] .pl-3 { padding-left: 0; padding-right: .75rem; }
[dir="rtl"] .pl-10 { padding-left: .75rem; padding-right: 2.5rem; }
[dir="rtl"] .pr-3.pl-10 { padding-left: .75rem; }
[dir="rtl"] .pr-10 { padding-right: .75rem; padding-left: 2.5rem; }
[dir="rtl"] .ml-1 { margin-left: 0; margin-right: .25rem; }
[dir="rtl"] .ml-2 { margin-left: 0; margin-right: .5rem; }
[dir="rtl"] .ml-3 { margin-left: 0; margin-right: .75rem; }
[dir="rtl"] .ml-4 { margin-left: 0; margin-right: 1rem; }
[dir="rtl"] .mr-1 { margin-right: 0; margin-left: .25rem; }
[dir="rtl"] .mr-2 { margin-right: 0; margin-left: .5rem; }
[dir="rtl"] .mr-3 { margin-right: 0; margin-left: .75rem; }
[dir="rtl"] .mr-4 { margin-right: 0; margin-left: 1rem; }
[dir="rtl"] .ml-auto { margin-left: 0; margin-right: auto; }
[dir="rtl"] .mr-auto { margin-right: 0; margin-left: auto; }
[dir="rtl"] .space-x-2 > :not([hidden]) ~ :not([hidden]),
[dir="rtl"] .space-x-3 > :not([hidden]) ~ :not([hidden]),
[dir="rtl"] .space-x-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 1; }
[dir="rtl"] main .fa-arrow-left:not(.no-flip) { transform: scaleX(-1); }

/* Branch badge */
.cura-branch { display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .7rem; border-radius:999px; background:#f5e9e0; color:#6e473c; font-size:.8rem; font-weight:500; }
.dark .cura-branch { background:#553731; color:#f5e9e0; }
[dir="rtl"] .-translate-x-full { --tw-translate-x: 100%; }
[dir="rtl"] .border-r { border-right-width: 0; border-left-width: 1px; }
[dir="rtl"] .right-4 { right: auto; left: 1rem; }
[dir="rtl"] .right-5 { right: auto; left: 1.25rem; }

/* ---------- Cura app shell ---------- */
.cura-nav { display:flex; align-items:center; gap:.75rem; padding:.65rem .85rem; border-radius:.6rem; color:#665650; font-weight:500; }
.cura-nav i { width:1.1rem; text-align:center; color:#a8968a; }
.cura-nav:hover { background:#f5e9e0; color:#3f2a26; }
.cura-nav.is-active { background:#f5e9e0; color:#6e473c; }
.cura-nav.is-active i { color:#9d6c59; }
.dark .cura-nav { color:#cfc0b4; } .dark .cura-nav:hover, .dark .cura-nav.is-active { background:#4d403c; color:#fff; }

.cura-card { background:#fff; border:1px solid #e6dbd2; border-radius:1rem; }
.dark .cura-card { background:#251d1b; border-color:#4d403c; }
.cura-input { width:100%; border:1px solid #e6dbd2; border-radius:.65rem; padding:.6rem .8rem; background:#fff; color:#251d1b; }
.cura-input:focus { outline:none; border-color:#9d6c59; box-shadow:0 0 0 3px rgba(157,108,89,.15); }
.dark .cura-input { background:#352b28; border-color:#4d403c; color:#f3ece6; }
.cura-label { display:block; font-size:.8rem; font-weight:600; color:#665650; margin-bottom:.35rem; }
.dark .cura-label { color:#cfc0b4; }
.cura-btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.6rem 1.1rem; border-radius:.65rem; font-weight:600; font-size:.9rem; }
.cura-btn-primary { background:#9d6c59; color:#fff; } .cura-btn-primary:hover { background:#87594a; }
.cura-btn-ghost { background:#f5e9e0; color:#6e473c; } .cura-btn-ghost:hover { background:#ead2c2; }
.dark .cura-btn-ghost { background:#4d403c; color:#f3ece6; }
.cura-chip { display:inline-flex; align-items:center; padding:.35rem .8rem; border-radius:999px; border:1px solid #e6dbd2; font-size:.85rem; font-weight:500; color:#4d403c; background:#fff; cursor:pointer; }
.cura-chip.is-on, .cura-chip:has(input:checked) { background:#3f2a26; border-color:#3f2a26; color:#fff; }
.dark .cura-chip { background:#352b28; border-color:#4d403c; color:#f3ece6; }
.cura-chip input { position:absolute; opacity:0; pointer-events:none; }
.cura-tag { display:inline-block; padding:.1rem .55rem; border-radius:999px; font-size:.75rem; font-weight:600; background:#f3ece6; color:#4d403c; }
.cura-tag.cash { background:#e8f1e4; color:#2f5a23; }
.cura-tag.insurance { background:#e5edf6; color:#284e78; }
.cura-tag.bank { background:#f2e8f5; color:#5d2f6e; }
.cura-tag.done { background:#e8f1e4; color:#2f5a23; }

/* ---------- iOS-style date & time picker ---------- */
.ios-cal { user-select:none; }
.ios-cal .grid7 { display:grid; grid-template-columns:repeat(7,1fr); gap:.15rem; text-align:center; }
.ios-cal .dow { font-size:.7rem; font-weight:600; color:#a8968a; padding:.3rem 0; }
.ios-cal button.day { aspect-ratio:1; border-radius:999px; font-size:.95rem; color:#251d1b; position:relative; }
.dark .ios-cal button.day { color:#f3ece6; }
.ios-cal button.day:hover { background:#f5e9e0; }
.ios-cal button.day.is-today { color:#c0392b; font-weight:700; }
.ios-cal button.day.is-sel { background:#c0392b; color:#fff; font-weight:700; }
.ios-cal button.day.is-past { color:#cfc0b4; }
.ios-cal button.day .dot { position:absolute; bottom:12%; left:50%; width:4px; height:4px; margin-left:-2px; border-radius:999px; background:#9d6c59; }
.ios-cal button.day.is-sel .dot { background:#fff; }

.ios-wheel { position:relative; display:flex; justify-content:center; gap:.25rem; height:220px; overflow:hidden; direction:ltr;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 70%,transparent); mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 70%,transparent); }
.ios-wheel .band { position:absolute; left:0; right:0; top:50%; height:44px; margin-top:-22px; border-radius:.7rem; background:#f3ece6; pointer-events:none; transition:background .2s; }
.dark .ios-wheel .band { background:#352b28; }
.ios-wheel .col { position:relative; z-index:1; width:4.5rem; height:100%; overflow-y:scroll; scroll-snap-type:y mandatory; scrollbar-width:none; padding:88px 0; }
.ios-wheel .col::-webkit-scrollbar { display:none; }
.ios-wheel .col div { height:44px; line-height:44px; text-align:center; font-size:1.55rem; scroll-snap-align:center; color:#a8968a; font-variant-numeric:tabular-nums; cursor:pointer; }
.ios-wheel .col div.is-sel { color:#251d1b; font-weight:600; }
.dark .ios-wheel .col div.is-sel { color:#fff; }
.ios-wheel .colon { z-index:1; align-self:center; font-size:1.55rem; font-weight:600; color:#251d1b; }
.ios-wheel.is-conflict .band { background:#fde2df; }
.ios-wheel.is-conflict .col div.is-sel, .ios-wheel.is-conflict .colon { color:#c0392b; }
.time-readout { font-variant-numeric:tabular-nums; }
.time-readout.is-conflict { color:#c0392b; }
.conflict-note { border:1px solid #f5c2bc; background:#fdecea; color:#8e2a1f; border-radius:.75rem; padding:.7rem .9rem; font-size:.85rem; }
.day-strip .blk { position:absolute; top:0; bottom:0; border-radius:.3rem; background:#ead2c2; }
.day-strip .blk.mine { background:#9d6c59; }
.day-strip .blk.mine.bad { background:#c0392b; }

@media (min-width:1024px){ #sideNav { transform:none !important; } }
