#dialog-content .ops-appointment-identity{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin:0 0 12px}
#dialog-content .ops-appointment-identity:empty{display:none}
#dialog-content .ops-appointment-identity .ops-client-profile-photo{width:76px;height:76px;object-fit:cover;border-radius:50%;margin:0;flex-shrink:0}
#dialog-content .ops-appointment-identity .appointment-reminder-badges{margin:0 0 0 auto;max-width:calc(100% - 92px)}
#dialog-content .ops-appointment-identity .reminder-badge-list{justify-content:flex-end;gap:6px}
#dialog-content .ops-customer-contact{margin:0 0 12px;padding:0;border-top:0}
#dialog-content .ops-customer-contact .ops-compact-details{margin:0}
#dialog-content .ops-visit-overview-compact{padding:14px 16px}
#dialog-content .ops-visit-overview-compact .ops-visit-time-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;padding:0;border:0}
#dialog-content .ops-visit-time-details{display:block;min-width:0}
#dialog-content .ops-visit-time-details>strong{display:block;font-size:20px;line-height:1.25;margin:0}
#dialog-content .ops-visit-time-details>p{font-size:14px;line-height:1.4;margin:4px 0 0}
#dialog-content .ops-visit-time-row .ops-change-appointment-time{width:auto;flex:0 0 auto;max-width:145px;min-height:40px;font-size:13px;line-height:1.3;margin:0;padding:9px 12px;background:#171918;color:#fff;border-color:#171918}
#dialog-content .ops-loyalty-panel:has(.ops-loyalty-compact){padding:12px 15px;gap:0}
#dialog-content .ops-loyalty-compact>summary{cursor:pointer;min-height:40px}
#dialog-content .ops-loyalty-compact>summary>span{display:inline-flex;flex-direction:column;gap:3px;vertical-align:middle}
#dialog-content .ops-loyalty-compact>summary strong{font-size:1rem;color:#242724}
#dialog-content .ops-loyalty-expanded{padding-top:14px}
#dialog-content .ops-loyalty-expanded .ops-loyalty-recent{margin:12px 0}
#dialog-content .ops-visit-overview-compact>[hidden]{display:none}
@media(max-width:420px){#dialog-content .ops-visit-time-details>strong{font-size:17px}#dialog-content .ops-visit-time-row .ops-change-appointment-time{max-width:112px;padding:8px}#dialog-content .ops-visit-overview-compact{padding:12px}}

/* Compact panel refinement; preserve every existing service and action node. */
#dialog-content.ops-compact-appointment-panel { min-width:0; }
#dialog-content .ops-priority-client-notes,
#dialog-content .ops-priority-request-notes { margin:10px 0; padding:12px; border:1px solid #d8dfd4; border-left:3px solid #647955; border-radius:10px; background:#f8faf5; }
#dialog-content .ops-priority-client-notes textarea { min-height:60px; }
#dialog-content .ops-priority-request-notes p { margin:8px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; }
#dialog-content .ops-visit-summary-meta { display:flex; flex-wrap:wrap; gap:5px 10px; font-size:12px; }
#dialog-content.ops-compact-appointment-panel .ops-visit-service { padding:12px; margin:8px 0; min-width:0; }
#dialog-content.ops-compact-appointment-panel .ops-visit-service-heading { gap:10px; align-items:flex-start; }
#dialog-content.ops-compact-appointment-panel .ops-visit-service-heading > div:first-child { min-width:0; flex:1; overflow-wrap:anywhere; }
#dialog-content.ops-compact-appointment-panel .ops-visit-service-heading p { margin:4px 0; }
#dialog-content.ops-compact-appointment-panel .ops-item-price-actions { flex-shrink:0; }
#dialog-content.ops-compact-appointment-panel .ops-visit-service time { display:block; margin-top:4px; font-size:13px; }
#dialog-content.ops-compact-appointment-panel .ops-inline-edit { margin-top:8px; }
#dialog-content .ops-panel-secondary { margin:12px 0; padding:12px; border:1px solid #d8dfd4; border-radius:10px; }
#dialog-content .ops-panel-secondary > summary { cursor:pointer; font-size:14px; font-weight:600; min-height:28px; }
#dialog-content .ops-panel-secondary[open] > summary { margin-bottom:12px; }
#dialog-content .ops-panel-secondary:focus-within { outline-offset:3px; }
@media(max-width:420px){#dialog-content.ops-compact-appointment-panel .ops-visit-service-heading { flex-wrap:wrap; }#dialog-content .ops-visit-time-row { flex-wrap:wrap; }#dialog-content .ops-visit-time-row .ops-change-appointment-time { max-width:none; }}

/* Scan-first refinement of the original compact design, presentation only. */
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-title-row{flex-wrap:wrap;align-items:center;gap:4px 10px}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-title-row > div:first-child{flex:1 1 180px}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-title-row #dialog-header-actions{flex:0 1 auto;flex-wrap:wrap;margin:0;gap:5px}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-topbar:has(> .ops-dialog-close:only-child){min-height:36px;padding:2px 12px;justify-content:flex-end;border-bottom:0}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-topbar:has(> .ops-dialog-close:only-child) + .ops-dialog-body{padding-top:0}
#dialog-content .ops-card-compact{padding:6px 10px!important;margin:6px 0!important;border-radius:6px!important}
#dialog-content .ops-card-disclosure > summary{cursor:pointer;min-height:32px;font-size:13px}
#dialog-content .ops-card-disclosure > summary h3{display:inline;font-size:13px}
#dialog-content .ops-card-disclosure > summary [role="status"]{margin:3px 0;font-size:12px;line-height:1.4;overflow-wrap:anywhere}
#dialog-content .ops-card-disclosure[open] > summary{margin-bottom:6px}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-topbar{min-height:48px;padding:6px 16px;gap:8px}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-body{padding:12px 16px 20px}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-title-row{margin-bottom:8px;gap:8px}
.ops-dialog-panel:has(#dialog-content .ops-visit-overview) .ops-dialog-customer-name{overflow-wrap:anywhere}
#dialog-content.ops-compact-appointment-panel{font-size:14px;line-height:1.4}
#dialog-content.ops-compact-appointment-panel > section{margin-top:8px;margin-bottom:8px}
#dialog-content.ops-compact-appointment-panel h3{font-size:14px;margin:0 0 5px;line-height:1.3}
#dialog-content .ops-priority-client-notes,#dialog-content .ops-priority-request-notes{padding:8px 10px;border-radius:6px;margin:8px 0}
#dialog-content .ops-priority-request-notes{background:#fffcf2;border-color:#e3d9b6;border-left-color:#a38a45}
#dialog-content .ops-priority-request-notes .ops-request-note{padding:0;background:transparent;font-size:13px;margin:4px 0 0}
#dialog-content .ops-priority-client-notes .ops-client-note{padding:6px 0}
#dialog-content .ops-priority-client-notes .ops-client-note p{font-size:13px;line-height:1.45;margin:4px 0;overflow-wrap:anywhere}
#dialog-content .ops-note-heading{gap:6px;flex-wrap:wrap;font-size:11px}
#dialog-content .ops-add-note-disclosure{margin-top:4px}
#dialog-content .ops-add-note-disclosure > summary,#dialog-content .ops-service-allocation-details > summary{cursor:pointer;color:#36533e;font-size:12px;font-weight:500;padding:6px 0;overflow-wrap:anywhere}
#dialog-content .ops-add-note-disclosure > summary{list-style:none}
#dialog-content .ops-add-note-disclosure[open] > summary{margin-bottom:4px}
#dialog-content .ops-visit-overview-compact{padding:8px 10px;border-radius:6px}
#dialog-content .ops-visit-time-details > strong{font-size:17px}
#dialog-content .ops-visit-time-details > p{font-size:13px;margin-top:2px}
#dialog-content .ops-visit-summary-meta{padding:5px 0 0;margin-top:5px}
#dialog-content.ops-compact-appointment-panel .ops-complete-visit{padding-top:10px;border-top:1px solid #e2e7e1}
#dialog-content.ops-compact-appointment-panel .ops-visit-list{counter-reset:compact-service}
#dialog-content.ops-compact-appointment-panel .ops-visit-service{position:relative;counter-increment:compact-service;margin:0;padding:10px 0 10px 28px;border-radius:0}
#dialog-content.ops-compact-appointment-panel .ops-visit-service::before{content:counter(compact-service);position:absolute;left:0;top:10px;width:21px;height:21px;border-radius:50%;background:#edf2ec;color:#3e5743;text-align:center;line-height:21px;font-size:11px;font-weight:600}
#dialog-content.ops-compact-appointment-panel .ops-visit-service-heading{gap:6px;flex-wrap:nowrap}
#dialog-content.ops-compact-appointment-panel .ops-visit-service-heading p{margin:2px 0;font-size:12px}
#dialog-content.ops-compact-appointment-panel .ops-visit-service time{font-size:12px;margin:2px 0}
#dialog-content.ops-compact-appointment-panel .ops-visit-service-heading strong{font-size:14px}
#dialog-content.ops-compact-appointment-panel .ops-inline-edit{margin:2px 0;min-height:28px;padding:4px 6px;font-size:12px;background:transparent;color:#31513b;border:0;text-decoration:underline;text-underline-offset:3px}
#dialog-content.ops-compact-appointment-panel .ops-complete-visit > button,
#dialog-content.ops-compact-appointment-panel .ops-section-title-row > button,
#dialog-content.ops-compact-appointment-panel .ops-change-appointment-time,
#dialog-content.ops-compact-appointment-panel .ops-note-form > button{min-height:30px;padding:5px 9px;font-size:12px;font-weight:500;border:1px solid #b6c4b7;border-radius:6px;background:#fff;color:#31513b;margin:2px 0}
#dialog-content.ops-compact-appointment-panel .ops-item-price-actions button{min-height:28px;padding:3px 5px;border:0;background:transparent;color:#9b3434;font-size:11px;text-decoration:underline;text-underline-offset:3px}
#dialog-content .ops-panel-secondary{margin:6px 0;padding:6px 10px;border-radius:6px}
#dialog-content .ops-panel-secondary > summary{min-height:28px;line-height:28px;font-size:13px}
#dialog-content .ops-panel-secondary[open] > summary{margin-bottom:6px}
#dialog-content .ops-panel-secondary .ops-customer-preferences{margin:0;padding:6px;border:0;background:transparent}
#dialog-content .ops-loyalty-panel:has(.ops-loyalty-compact){padding:6px 10px;border-radius:6px}
#dialog-content .ops-loyalty-compact > summary{min-height:30px;font-size:13px}
#dialog-content .ops-visit-totals{margin:8px 0;gap:4px}
#dialog-content .ops-visit-checkout-action{margin-top:6px}
#dialog-content .ops-service-allocation-details .ops-visible-allocation{display:grid;gap:4px;padding:6px 0;font-size:12px}
#dialog-content .ops-service-allocation-details .ops-visible-allocation > span{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:baseline}
#dialog-content .ops-service-allocation-details .ops-visible-allocation strong{overflow-wrap:anywhere;font-size:12px}
#dialog-content .ops-component-readonly{border-top:1px solid #e2e7e1;padding-top:4px}
#dialog-content .ops-component-readonly p{display:grid;gap:2px;margin:5px 0;font-size:12px;overflow-wrap:anywhere}
#dialog-content .ops-component-readonly strong{font-size:12px;text-transform:capitalize}
#dialog-content.ops-compact-appointment-panel [aria-label="Card on file"] button{background:#fff;color:#31513b;border:1px solid #b6c4b7;border-radius:6px;padding:5px 10px;font-size:12px}
#dialog-content :is(button,summary,a):focus-visible{outline:2px solid #315e43;outline-offset:3px}
@media(max-width:700px){#dialog-content.ops-compact-appointment-panel :is(button,summary){min-height:44px}#dialog-content.ops-compact-appointment-panel .ops-item-price-actions{max-width:38%}#dialog-content.ops-compact-appointment-panel .ops-visible-allocation{flex-wrap:wrap}}
