/* EMS Calendar Styles — Day / Week / Month */

.ems-cal-wrap { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; max-width: 1200px; margin: 0 auto; color: #222; }
.ems-cal-wrap *, .ems-cal-wrap *::before, .ems-cal-wrap *::after { box-sizing: border-box; }

/* Toolbar */
.ems-toolbar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:12px 0 16px; border-bottom:2px solid #e0e0e0; margin-bottom:16px; }
.ems-view-tabs { display:flex; gap:4px; background:#f0f0f0; border-radius:8px; padding:3px; }
.ems-tab { padding:6px 16px; border-radius:6px; text-decoration:none; font-size:.875rem; font-weight:500; color:#555; transition:background .15s,color .15s; }
.ems-tab.active,.ems-tab:hover { background:#1a6fc4; color:#fff; }
.ems-nav { display:flex; align-items:center; gap:8px; flex:1; justify-content:center; }
.ems-nav-btn { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:#f0f0f0; color:#333; text-decoration:none; font-size:1.3rem; font-weight:300; transition:background .15s; }
.ems-nav-btn:hover { background:#1a6fc4; color:#fff; }
.ems-nav-label { font-size:1rem; font-weight:600; color:#1a1a1a; min-width:200px; text-align:center; }
.ems-today-btn { padding:6px 14px; border-radius:6px; background:#fff; border:1px solid #ccc; color:#333; text-decoration:none; font-size:.875rem; font-weight:500; transition:border-color .15s,color .15s; }
.ems-today-btn:hover { border-color:#1a6fc4; color:#1a6fc4; }

/* Day View */
.ems-day-view { display:flex; flex-direction:column; gap:10px; }
.ems-day-title { font-size:1.15rem; font-weight:700; color:#1a3a5c; padding:6px 0; border-bottom:1px solid #e0e0e0; margin-bottom:4px; }
.ems-unit-row { display:flex; align-items:stretch; border:1px solid #e0e0e0; border-radius:8px; overflow:hidden; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.ems-unit-label { writing-mode:vertical-lr; transform:rotate(180deg); padding:14px 10px; font-weight:700; font-size:.85rem; letter-spacing:.04em; min-width:46px; display:flex; align-items:center; justify-content:center; text-align:center; flex-shrink:0; }
.ems-unit-slots { display:flex; flex:1; gap:8px; padding:10px; flex-wrap:wrap; align-items:flex-start; }

/* Slot Cards */
.ems-slot { border-radius:6px; padding:8px 10px; min-width:130px; flex:1; display:flex; flex-direction:column; gap:4px; border:1.5px solid transparent; transition:box-shadow .15s; }
.ems-slot:hover { box-shadow:0 2px 8px rgba(0,0,0,.12); }
.ems-slot.slot-open { background:#fff8e1; border-color:#ffcc02; }
.ems-slot.slot-mine { background:#e3f2fd; border-color:#1a6fc4; }
.ems-slot.slot-filled { background:#f1f8e9; border-color:#81c784; }
.ems-slot.slot-past { opacity:.55; pointer-events:none; }
.ems-slot-time { font-size:.78rem; font-weight:700; letter-spacing:.02em; color:#555; }
.ems-slot-person { font-size:.88rem; font-weight:600; color:#222; }
.ems-slot-person.open { color:#b08900; font-style:italic; font-weight:500; }

/* Compact slot (week) */
.ems-slot.slot-compact { min-width:unset; padding:5px 6px; gap:2px; }
.ems-slot-compact-name { font-size:.78rem; font-weight:600; color:#222; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ems-slot-compact-name.open { color:#b08900; font-style:italic; }
.ems-slot .ems-btn { margin-top:4px; padding:4px 10px; font-size:.78rem; }

/* Week View */
.ems-week-view { display:flex; flex-direction:column; border:1px solid #e0e0e0; border-radius:8px; overflow:hidden; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.07); }
.ems-week-header { display:grid; grid-template-columns:90px repeat(7,1fr); background:#f5f7fa; border-bottom:2px solid #dde3ea; }
.ems-week-unit-col { padding:8px 10px; font-size:.78rem; font-weight:600; color:#888; text-transform:uppercase; letter-spacing:.04em; border-right:1px solid #e0e0e0; display:flex; align-items:center; }
.ems-week-day-col { display:flex; flex-direction:column; align-items:center; padding:6px 4px; border-right:1px solid #e0e0e0; gap:2px; }
.ems-week-day-col:last-child { border-right:none; }
.ems-week-day-col.today { background:#e8f0fe; }
.ems-week-dow { font-size:.75rem; font-weight:600; color:#888; text-transform:uppercase; }
.ems-week-dnum { font-size:1.05rem; font-weight:700; color:#222; width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:50%; }
.ems-week-day-col.today .ems-week-dnum { background:#1a6fc4; color:#fff; }
.ems-week-row { display:grid; grid-template-columns:90px repeat(7,1fr); border-top:1px solid #e0e0e0; min-height:80px; }
.ems-week-unit-label { padding:8px 6px; font-size:.78rem; font-weight:700; display:flex; align-items:center; justify-content:center; text-align:center; border-right:1px solid rgba(255,255,255,.2); line-height:1.2; }
.ems-week-cell { display:flex; flex-direction:column; gap:3px; padding:4px 3px; border-right:1px solid #e0e0e0; }
.ems-week-cell:last-child { border-right:none; }

/* Month View */
.ems-month-view { border:1px solid #e0e0e0; border-radius:8px; overflow:hidden; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.07); }
.ems-month-dow-row { display:grid; grid-template-columns:repeat(7,1fr); background:#f5f7fa; border-bottom:2px solid #dde3ea; }
.ems-month-dow { padding:8px 0; text-align:center; font-size:.78rem; font-weight:700; color:#888; text-transform:uppercase; letter-spacing:.04em; }
.ems-month-week { display:grid; grid-template-columns:repeat(7,1fr); border-top:1px solid #e0e0e0; }
.ems-month-day { min-height:120px; padding:6px 5px 4px; border-right:1px solid #e0e0e0; display:flex; flex-direction:column; gap:3px; }
.ems-month-day:last-child { border-right:none; }
.ems-month-day.other-month { background:#fafafa; }
.ems-month-day.today { background:#f0f7ff; }
.ems-month-day-num { font-size:.88rem; font-weight:700; color:#333; width:24px; height:24px; display:flex; align-items:center; justify-content:center; border-radius:50%; flex-shrink:0; }
.ems-month-day.today .ems-month-day-num { background:#1a6fc4; color:#fff; }
.ems-month-day.other-month .ems-month-day-num { color:#bbb; }
.ems-month-pill { display:flex; align-items:center; justify-content:space-between; border-radius:4px; padding:2px 5px; font-size:.7rem; font-weight:600; color:#fff; line-height:1.2; }
.ems-pill-unit { font-size:.68rem; }
.ems-pill-fill { font-size:.68rem; opacity:.85; }
.ems-month-detail-link { font-size:.7rem; color:#1a6fc4; text-decoration:none; text-align:center; margin-top:auto; padding-top:2px; display:block; }
.ems-month-detail-link:hover { text-decoration:underline; }

/* Modal */
.ems-modal { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:99999; display:flex; align-items:center; justify-content:center; }
.ems-modal-inner { background:#fff; border-radius:10px; padding:28px; max-width:460px; width:90%; box-shadow:0 8px 32px rgba(0,0,0,.2); }
.ems-modal-inner h3 { margin:0 0 12px; font-size:1.1rem; }
.ems-modal-inner select, .ems-modal-inner textarea { width:100%; margin-bottom:12px; padding:8px 10px; border:1px solid #ccc; border-radius:6px; font-size:.9rem; font-family:inherit; }
.ems-modal-inner textarea { resize:vertical; min-height:70px; }
.ems-modal-actions { display:flex; gap:10px; margin-top:8px; }

/* Buttons */
.ems-btn { padding:6px 12px; border:none; border-radius:5px; cursor:pointer; font-size:.82rem; font-weight:500; transition:opacity .15s,transform .1s; white-space:nowrap; }
.ems-btn:hover { opacity:.85; }
.ems-btn:active { transform:scale(.97); }
.ems-btn-pickup { background:#1a6fc4; color:#fff; }
.ems-btn-drop { background:#e65100; color:#fff; }
.ems-btn-swap { background:#7b1fa2; color:#fff; }
.ems-btn-primary { background:#1a6fc4; color:#fff; }
.ems-btn-cancel { background:#9e9e9e; color:#fff; }

/* Responsive */
@media (max-width:768px) {
    .ems-week-view { overflow-x:auto; }
    .ems-week-header, .ems-week-row { grid-template-columns:60px repeat(7,minmax(80px,1fr)); min-width:620px; }
    .ems-week-unit-label { font-size:.7rem; padding:6px 4px; }
    .ems-month-day { min-height:90px; }
    .ems-unit-label { writing-mode:horizontal-tb; transform:none; font-size:.78rem; min-width:unset; padding:8px 10px; }
    .ems-unit-row { flex-direction:column; }
    .ems-nav-label { min-width:140px; font-size:.9rem; }
}
@media (max-width:480px) {
    .ems-month-day { min-height:70px; }
    .ems-month-dow { font-size:.68rem; }
    .ems-pill-fill { display:none; }
}