.af-date-field { display:flex; align-items:stretch; gap:6px; min-width:0; width:100%; }
.af-date-field input { flex:1; min-width:0; width:0; }
.af-date-field > button { flex:0 0 auto; width:auto; padding:8px 12px; font-size:14px; }
.af-calendar { direction:rtl; width:360px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); overflow:auto; border:1px solid #bac9c3; border-radius:8px; padding:16px; background:#fff; color:#142b23; box-sizing:border-box; }
.af-calendar::backdrop { background:rgb(0 0 0 / 40%); }
.af-calendar header,.af-calendar footer,.af-calendar-controls { display:flex; align-items:center; gap:8px; }
.af-calendar header { justify-content:space-between; margin-bottom:16px; }
.af-calendar strong { font-size:18px; }
.af-calendar button,.af-calendar select { font:inherit; font-size:14px; border:1px solid #c5d2cc; border-radius:4px; background:#f5f8f7; color:#142b23; padding:8px; width:auto; margin:0; }
.af-calendar-controls select { flex:1; min-width:0; }
.af-calendar-week,.af-calendar-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; margin-top:12px; text-align:center; }
.af-calendar-week span { font-size:13px; color:#536c62; }
.af-calendar-days button { height:36px; padding:0; }
.af-calendar-days .is-today { border:2px solid #196449; }
.af-calendar-days [aria-pressed="true"] { background:#196449; color:#fff; }
.af-calendar button:focus-visible,.af-calendar select:focus-visible { outline:2px solid #b27b00; outline-offset:2px; }
.af-calendar footer { margin-top:16px; flex-wrap:wrap; }
.af-calendar [hidden] { display:none !important; }
@media print { .af-calendar,.af-date-field > button { display:none !important; } }