input[data-english-date]:not([data-english-date="time"]):not([type="hidden"]) {
  padding-right:28px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23717d8b' stroke-width='1.7'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 11h18'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 6px center;
  cursor:pointer;
}
.english-calendar {
  box-sizing:border-box;
  position:fixed;
  inset:auto;
  z-index:1000;
  width:316px;
  max-width:calc(100vw - 32px);
  max-height:none;
  margin:0;
  padding:16px;
  overflow:visible;
  border:1px solid rgba(241,189,91,.58);
  border-radius:20px;
  background:linear-gradient(155deg,#fff 0%,#f5f0e8 100%);
  color:#111827;
  box-shadow:0 26px 70px rgba(0,0,0,.45);
  font:14px/1.4 "DM Sans",Arial,sans-serif;
  transform-origin:50% 100%;
}
.english-calendar::backdrop { background:transparent; }
.english-calendar[data-calendar-visible] { animation:royalCalendarReveal .28s cubic-bezier(.2,.8,.2,1) both; }
.english-calendar[data-placement="below"] { transform-origin:50% 0; }
.english-calendar::after { content:""; position:absolute; left:var(--calendar-arrow,50%); bottom:-7px; width:13px; height:13px; background:#f5f0e8; border-right:1px solid rgba(241,189,91,.58); border-bottom:1px solid rgba(241,189,91,.58); transform:translateX(-50%) rotate(45deg); }
.english-calendar[data-placement="below"]::after { top:-7px; bottom:auto; background:#fff; border:0; border-left:1px solid rgba(241,189,91,.58); border-top:1px solid rgba(241,189,91,.58); }
.english-calendar[data-mobile] { width:calc(100vw - 32px); max-width:360px; transform-origin:50% 100%; }
.english-calendar[data-mobile]::after { display:none; }
.english-calendar[data-mobile][data-calendar-visible] { animation-name:royalCalendarMobile; }
.english-calendar-content { max-height:calc(var(--calendar-space,100dvh) - 66px); overflow:auto; scrollbar-width:thin; }
.english-calendar [hidden] { display:none!important; }
.english-calendar h2 { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; margin:0; padding:0; }
.english-calendar button { box-sizing:border-box; padding:7px; border:0; border-radius:10px; background:transparent; color:#263141; font:inherit; cursor:pointer; transition:background .18s,color .18s,transform .18s; }
.english-calendar button:hover:not(:disabled) { background:#e8dfd1; }
.english-calendar button:focus-visible,.english-calendar select:focus-visible,.english-calendar input:focus-visible { outline:2px solid #bd853c; outline-offset:2px; }
.english-calendar button:disabled { color:#c4c7cc; cursor:not-allowed; }
.english-calendar nav { display:grid; grid-template-columns:35px minmax(0,1fr) 35px; align-items:center; margin-bottom:13px; }
.english-calendar nav>button:not([data-calendar-period]) { width:33px; height:33px; padding:0; border-radius:50%; background:#e9e2d8; color:#172033; font-size:25px; line-height:1; }
.english-calendar nav>button:hover:not(:disabled) { background:#0c1a2d; color:#f2bd5d; transform:scale(1.08); }
.english-calendar nav>button:disabled { opacity:.25; }
.english-calendar nav [data-calendar-period] { min-width:0; padding:4px 0; background:transparent; }
.english-calendar nav [data-calendar-period]:hover { background:transparent; color:#9b6822; transform:none; }
.english-calendar nav strong { color:inherit; font:600 18px/1.3 "Playfair Display",Georgia,serif; }
.english-calendar-weekdays,.english-calendar-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; }
.english-calendar-weekdays { margin-bottom:6px; color:#9a7a48; text-align:center; font-size:9px; font-weight:700; text-transform:uppercase; }
.english-calendar-days>span { height:34px; }
.english-calendar-days button { position:relative; min-width:0; height:34px; padding:0; font-size:11px; font-weight:700; animation:royalDayIn .28s ease backwards; animation-delay:calc(var(--i,1) * 8ms); }
.english-calendar-days button:hover:not(:disabled) { transform:translateY(-2px); }
.english-calendar-days button[aria-current="date"]::after { content:""; position:absolute; left:50%; bottom:3px; width:4px; height:4px; border-radius:50%; background:#d99b3a; transform:translateX(-50%); }
.english-calendar-days button[aria-pressed="true"],.english-calendar-months button[aria-pressed="true"] { background:linear-gradient(135deg,#f7cc79,#d99b3a); color:#0c1420; box-shadow:0 5px 15px rgba(217,155,56,.38); }
.english-calendar-days button[aria-pressed="true"] { animation:royalDayIn .28s ease backwards,royalSelectedGlow 1.8s ease-in-out infinite; animation-delay:calc(var(--i,1) * 8ms),0s; }
.english-calendar-period { animation:royalDayIn .24s ease both; }
.english-calendar-period>label { display:flex; align-items:center; justify-content:center; gap:10px; margin:4px 0 14px; color:#7d6a50; font-size:12px; }
.english-calendar-period input { box-sizing:border-box; width:100px; height:34px; padding:0 9px; border:1px solid #d8c7ae; border-radius:8px; background:#fff; color:#172033; font:600 14px "DM Sans",Arial,sans-serif; }
.english-calendar-months { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.english-calendar-months button { height:36px; font-size:12px; }
.english-calendar-time { display:flex; align-items:end; gap:8px; margin-top:16px; padding-top:12px; border-top:1px solid #e4dcd0; }
.english-calendar-time>span { margin-right:auto; padding-bottom:9px; color:#7d6a50; font-size:11px; }
.english-calendar-time label { color:#7d6a50; font-size:10px; }
.english-calendar-time select { display:block; height:34px; padding:0 6px; border:1px solid #d8c7ae; border-radius:6px; background:#fff; color:#172033; font:13px Arial,sans-serif; }
.english-calendar-time b { padding-bottom:8px; }
.english-calendar-error { margin:8px 0; color:#b04e43; font-size:12px; }
.english-calendar-error:empty { display:none; }
.english-calendar footer { display:flex; align-items:center; justify-content:flex-end; gap:4px; margin-top:12px; padding-top:8px; border-top:1px solid #e4dcd0; }
.english-calendar footer button { padding:5px 7px; color:#82663e; font-size:10px; }
.english-calendar footer [data-calendar-today] { margin-right:auto; }
.english-calendar footer [data-calendar-apply] { background:linear-gradient(135deg,#f7cc79,#d99b3a); color:#172033; font-weight:700; }
.attendance-calendar { box-sizing:border-box; padding:16px; border:1px solid rgba(241,189,91,.58); border-radius:20px; background:linear-gradient(155deg,#fff,#f5f0e8); box-shadow:0 14px 35px #07101e14; animation:royalCalendarReveal .28s cubic-bezier(.2,.8,.2,1) both; }
.attendance-calendar .attendance-calendar-head { display:grid; grid-template-columns:35px minmax(0,1fr) 35px; align-items:center; gap:0; margin-bottom:13px; }
.attendance-calendar .attendance-calendar-head strong { color:#172033; text-align:center; font:600 18px/1.3 "Playfair Display",Georgia,serif; }
.attendance-calendar .attendance-calendar-head button { width:33px; height:33px; padding:0; border:0; border-radius:50%; background:#e9e2d8; color:#172033; font-size:25px; cursor:pointer; transition:background .18s,color .18s,transform .18s; }
.attendance-calendar .attendance-calendar-head button:hover { background:#0c1a2d; color:#f2bd5d; transform:scale(1.08); }
.attendance-calendar .attendance-weekdays span { color:#9a7a48; text-align:center; font-size:9px; font-weight:700; }
.attendance-calendar .attendance-day { border-radius:10px; animation:royalDayIn .28s ease backwards; animation-delay:calc(var(--i,1) * 8ms); }
.attendance-calendar .attendance-day:not(.worked) { border-color:#e4dcd0; background:#fff6; }
@keyframes royalCalendarReveal { from { opacity:0; transform:translateY(10px) scale(.94); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes royalCalendarMobile { from { opacity:0; transform:translateY(18px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes royalDayIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@keyframes royalSelectedGlow { 50% { box-shadow:0 7px 22px rgba(217,155,56,.6); } }
@media(prefers-reduced-motion:reduce) { .english-calendar,.english-calendar *,.attendance-calendar,.attendance-calendar * { animation:none!important; transition:none!important; } }
