/* v2.0 Mobile Choice & Date Sheet */
html[data-surface="staff"] #choice-sheet { position:fixed; inset:auto 0 0; margin:0 auto; width:100%; max-width:620px; max-height:80dvh; padding:0 0 max(16px,env(safe-area-inset-bottom)); border:0; border-radius:24px 24px 0 0; background:#fff; color:#17382e; overflow:hidden; box-shadow:0 -10px 40px rgba(23,56,46,0.14); }
#choice-sheet[open] { display:flex; flex-direction:column; }
html[data-surface="staff"] #choice-sheet::backdrop { background:rgba(15,38,30,0.45); backdrop-filter:blur(3px); }
.choice-handle { flex-shrink:0; width:36px; height:4px; margin:10px auto 4px; border-radius:999px; background:#dbe3dc; }
.choice-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 20px 14px; flex-shrink:0; border-bottom:1px solid #edf2ee; }
.choice-head h2 { margin:0; font-size:17px; font-weight:700; color:#17382e; overflow-wrap:anywhere; }
.choice-head-actions { display:flex; align-items:center; gap:8px; margin-left:auto; flex-shrink:0; }
html[data-surface="staff"] .choice-head button.choice-close-btn,
html[data-surface="staff"] .choice-head > button { display:grid; place-items:center; padding:0; width:34px !important; height:34px !important; min-height:34px !important; max-height:34px !important; min-width:34px !important; aspect-ratio:1/1 !important; border:0; background:#f0f4ef; border-radius:50% !important; flex-shrink:0; color:#2b4237; outline:none !important; box-shadow:none !important; }
html[data-surface="staff"] .choice-head button.choice-manage-btn { display:inline-flex; align-items:center; justify-content:center; width:auto !important; min-width:56px !important; height:32px !important; min-height:32px !important; max-height:32px !important; aspect-ratio:auto !important; padding:0 12px !important; border:0; border-radius:999px !important; background:#eaf3ee; color:#1f6a4a; font-size:13px !important; font-weight:600; outline:none !important; box-shadow:none !important; }
html[data-surface="staff"] .choice-head button.choice-manage-btn[hidden] { display:none !important; }
html[data-surface="staff"] .choice-head button.choice-manage-btn.is-active { background:#1f6a4a; color:#fff; }
.choice-manage-add { display:grid; gap:6px; padding:4px 0 8px; margin-bottom:4px; border-bottom:1px solid #edf2ee; }
html[data-surface="staff"] .choice-add-trigger { display:flex; align-items:center; justify-content:center; gap:6px; width:100%; min-height:42px; margin:0; padding:0 12px; border:1.5px dashed #285d45; border-radius:10px; background:#f4f9f6; color:#1f6a4a; font-size:14px; font-weight:600; }
.choice-inline-box { display:flex; align-items:center; gap:8px; width:100%; min-height:44px; }
.choice-member-inline-form { display:grid; gap:8px; padding:8px 10px; border-radius:12px; background:#f6faf7; border:1px solid #dce8e0; }
.choice-member-inline-form .choice-inline-input { width:100% !important; box-sizing:border-box; }
html[data-surface="staff"] .choice-inline-input { flex:1; min-width:0; width:0; height:40px !important; min-height:40px !important; margin:0 !important; padding:0 12px !important; border:1.5px solid #285d45 !important; border-radius:10px !important; background:#fff !important; color:#17382e !important; font-size:14px !important; outline:0 !important; }
html[data-surface="staff"] .choice-inline-save { flex:none; min-width:56px; height:40px !important; min-height:40px !important; margin:0; padding:0 12px; border:0; border-radius:10px; background:#285d45; color:#fff; font-size:13px; font-weight:600; }
html[data-surface="staff"] .choice-inline-cancel { flex:none; min-width:50px; height:40px !important; min-height:40px !important; margin:0; padding:0 10px; border:0; border-radius:10px; background:#eef3f0; color:#52685b; font-size:13px; font-weight:500; }
.choice-inline-error { margin:0; padding:2px 4px; color:#c93b2b; font-size:12px; }
.choice-manage-row { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; min-height:52px; padding:6px 4px; border-bottom:1px solid #edf2ee; box-sizing:border-box; }
.choice-manage-row strong { flex:1; min-width:0; font-size:14px; font-weight:500; color:#17382e; overflow-wrap:anywhere; }
.choice-manage-btns { display:flex; align-items:center; gap:8px; flex:none; }
html[data-surface="staff"] .choice-act-edit { display:inline-flex; align-items:center; justify-content:center; min-width:48px; height:30px !important; min-height:30px !important; margin:0; padding:0 10px; border:0; border-radius:8px; background:#eaf3ee; color:#1f6a4a; font-size:13px; font-weight:600; }
html[data-surface="staff"] .choice-act-del { display:inline-flex; align-items:center; justify-content:center; min-width:48px; height:30px !important; min-height:30px !important; margin:0; padding:0 10px; border:0; border-radius:8px; background:#fdf0ee; color:#c93b2b; font-size:13px; font-weight:600; }
.preset-manage-list { display:grid; gap:2px; padding-bottom:12px; }

.choice-search { padding:12px 18px 8px; flex-shrink:0; }
.choice-search[hidden] { display:none; }
.choice-search input { margin:0; width:100%; min-height:40px; font-size:14px; background:#f0f4f1; border:0; border-radius:10px; padding:0 12px; }

.choice-options { overflow-y:auto; overscroll-behavior:contain; touch-action:pan-y; padding:8px 16px; min-height:0; display:flex; flex-direction:column; gap:4px; }
html[data-surface="staff"] .choice-option { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:48px; padding:12px 14px; margin:0; background:transparent; border:0; border-radius:12px; color:#17382e; text-align:left; font-size:14px; font-weight:500; }
.choice-option span { flex:1; min-width:0; text-align:left; overflow-wrap:anywhere; }
html[data-surface="staff"] .choice-option[aria-pressed="true"] { background:#eef6f1; color:#285d45; font-weight:600; }
.choice-option .ui-icon { flex-shrink:0; width:18px; height:18px; color:#285d45; }
.choice-empty { text-align:center; padding:24px 16px; color:#718477; font-size:13px; }

.choice-actions[hidden] { display:none; }
.choice-actions { padding:8px 16px 4px; flex-shrink:0; }
html[data-surface="staff"] #choice-new-flow { display:flex; align-items:center; justify-content:center; gap:6px; width:100%; min-height:42px; padding:0 12px; border:1.5px dashed #285d45; border-radius:10px; background:#f4f9f6; color:#1f6a4a; font-size:14px; font-weight:600; }

/* Date Choices */
#choice-sheet.date-choices .choice-actions { display:flex; align-items:center; justify-content:flex-start; padding:10px 20px 2px; }
#choice-sheet.date-choices .date-selection { font-size:18px; font-weight:700; color:#17382e; font-variant-numeric:tabular-nums; }
#choice-sheet.date-choices .date-done { display:none !important; }

.date-month { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; padding:4px 0; }
.date-month strong { font-size:15px; font-weight:700; color:#17382e; }
html[data-surface="staff"] .date-month button { display:grid; place-items:center; width:36px !important; height:36px !important; min-height:36px !important; max-height:36px !important; min-width:36px !important; aspect-ratio:1/1 !important; padding:0; border:0; background:#f0f4ef; border-radius:50% !important; color:#2b4237; }
.date-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; text-align:center; }
.date-grid > span { font-size:12px; font-weight:600; color:#718477; padding:6px 0; }
html[data-surface="staff"] .date-grid button { display:grid; place-items:center; width:38px !important; height:38px !important; min-height:38px !important; max-height:38px !important; min-width:38px !important; max-width:38px !important; aspect-ratio:1/1 !important; margin:0 auto; padding:0; border:0; border-radius:50% !important; background:transparent; font-size:15px; font-weight:500; color:#17382e; font-variant-numeric:tabular-nums; line-height:1; }
html[data-surface="staff"] .date-grid button[aria-pressed="true"] { background:#285d45 !important; color:#fff !important; font-weight:700 !important; }
.date-grid button:disabled { opacity:.25; }

.date-shortcuts { display:flex; justify-content:space-between; padding:10px 4px 0; }
.date-shortcuts button { min-height:36px; padding:0 10px; background:transparent; border:0; color:#285d45; font-size:13px; font-weight:600; }

