/* Mandatory UI standard D19: self-hosted Vazirmatn for all demos + catalog */
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/vazirmatn/Vazirmatn-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/vazirmatn/Vazirmatn-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/vazirmatn/Vazirmatn-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/vazirmatn/Vazirmatn-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/vazirmatn/Vazirmatn-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-fa: "Vazirmatn", Tahoma, sans-serif;
}

html, body {
  font-family: var(--font-fa);
}

/* Jalali datepicker shell */
.jdp-wrap { position: relative; display: inline-block; width: 100%; }
.jdp-wrap input[data-jdp] { width: 100%; direction: ltr; text-align: right; }
.jdp-pop {
  position: absolute; z-index: 50; top: calc(100% + 4px); right: 0;
  background: #fff; border: 1px solid #c9d4e0; border-radius: 10px;
  box-shadow: 0 12px 28px rgba(0,0,0,.12); padding: 10px; min-width: 260px;
  color: #172235;
}
.jdp-pop[hidden] { display: none !important; }
.jdp-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.jdp-head button { border: 0; background: #eef3f8; border-radius: 6px; padding: 4px 10px; cursor: pointer; }
.jdp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; font-size: .78rem; }
.jdp-grid .dow { color: #6b7c90; font-weight: 600; padding: 4px 0; }
.jdp-grid button {
  border: 0; background: transparent; border-radius: 6px; padding: 7px 0; cursor: pointer; color: inherit;
}
.jdp-grid button:hover { background: #e8f4fb; }
.jdp-grid button.today { outline: 1px solid #2ec4ff; }
.jdp-grid button.selected { background: #0b1f3a; color: #fff; }
.jdp-grid button.out { opacity: .35; }