
body .ho-customers:has(.cl-details) :is(.ho-cus-head,.ho-cus-directory-area>.ho-cus-area-heading,.ho-cus-directory-area>.ho-cus-kpis,.ho-cus-list-card){display:none!important}
body .ho-customers:has(.cl-details) .ho-cus-layout-grid{display:block!important}
body .cl-details{display:grid;gap:16px;color:var(--text);width:100%;min-width:0}
body .cl-details *{box-sizing:border-box}body .cl-details h3,body .cl-details h4,body .cl-details p{margin:0}body .cl-details h3{font-size:27px!important;line-height:1.3}body .cl-details h4{font-size:17px!important;line-height:1.4}body .cl-details small{font-size:12px;color:var(--muted);line-height:1.5}
body .cl-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}body .cl-heading h3{margin-top:5px}body .cl-actions{display:flex;gap:8px;align-items:center}
body .cl-details .cl-actions :is(a,button,summary){display:inline-flex;align-items:center;justify-content:center;padding:7px 12px!important;min-height:34px!important;width:auto!important;font-size:12px!important;font-weight:500!important;line-height:1.4!important;background:var(--surface)!important;color:var(--text)!important;border:1px solid var(--line)!important;border-radius:7px!important;text-decoration:none;cursor:pointer}
body .cl-more{position:relative}body .cl-more form{position:absolute;right:0;top:40px;z-index:5;padding:8px;background:var(--surface);border:1px solid var(--line);border-radius:8px;white-space:nowrap}
body .cl-identity,body .cl-panel,body .cl-metrics>div{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px}
body .cl-identity{display:flex;align-items:center;gap:16px;flex-wrap:wrap}body .cl-avatar{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--surface-soft);font-size:24px;color:var(--muted);border:1px solid var(--line)}body .cl-name>div{display:flex;gap:10px;align-items:center;flex-wrap:wrap}body .cl-name h4{font-size:21px!important}body .cl-name>small{display:block;margin-top:5px}body .cl-contact{display:flex;gap:24px;margin-left:auto;flex-wrap:wrap;min-width:0}body .cl-contact span{display:flex;gap:9px;align-items:center;font-size:13px;overflow-wrap:anywhere}body .cl-contact .icon{width:18px;height:18px;color:var(--muted)}
body .cl-badge{display:inline-flex;gap:5px;align-items:center;padding:4px 10px;border:1px solid var(--line);border-radius:99px;font-size:11px;font-weight:600;line-height:1.4;white-space:nowrap;background:var(--surface-soft);color:var(--muted)}body .cl-badge.is-returning{color:#7bb9fa;border-color:#38618c;background:#32639b18}body .cl-badge.is-regular{color:#6fd6a7;border-color:#326f57;background:#39936b18}body .cl-badge.is-vip{color:#e9c46c;border-color:#8d7438;background:#a5832918}
body .cl-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}body .cl-metrics>div{display:grid;gap:5px;padding:16px 18px}body .cl-metrics strong{font-size:23px;line-height:1.3;overflow-wrap:anywhere}body .cl-metrics span{font-size:12px;color:var(--muted)}
body .cl-main{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:16px;align-items:start}body .cl-panel{min-width:0}body .cl-table-wrap{overflow:auto;margin-top:12px;max-height:420px}body .cl-details table{width:100%;border-collapse:collapse;min-width:500px}body .cl-details th,body .cl-details td{padding:12px 9px!important;text-align:left!important;border-bottom:1px solid var(--line)!important;font-size:12px!important;background:transparent!important;color:var(--text)!important}body .cl-details th{font-size:11px!important;color:var(--muted)!important}body .cl-details td:last-child{text-align:right!important;white-space:nowrap}body .cl-details td small{display:block;font-size:10px;margin-top:3px}body .cl-details td a{color:var(--text)}
body .cl-order-state{display:inline-flex;padding:4px 8px;font-size:10px;border-radius:99px;background:var(--surface-soft);color:var(--muted);white-space:nowrap}body .cl-order-state.is-completed{background:#258b641c;color:#74d8af}body .cl-order-state.is-cancelled{color:#ee9292}body .cl-order-state.is-new,body .cl-order-state.is-accepted{color:#e0c47d}
body .cl-status-head{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}body .cl-loyalty>p{margin:20px 0 10px;font-size:14px}body .cl-loyalty>small{display:block;margin-top:10px}body .cl-details progress{width:100%;height:12px;appearance:none;border:0;border-radius:99px;overflow:hidden;background:var(--surface-soft)}body .cl-details progress::-webkit-progress-bar{background:var(--surface-soft)}body .cl-details progress::-webkit-progress-value{background:#438bd0;border-radius:99px}body .cl-details progress::-moz-progress-bar{background:#438bd0;border-radius:99px}
body .cl-milestones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:24px 0 14px}body .cl-milestones>div{display:grid;justify-items:center;gap:7px;text-align:center}body .cl-milestones b{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line);border-radius:50%;color:var(--muted)}body .cl-milestones .is-reached b{border-color:#438bd0;color:#7bb9fa}body .cl-milestones>div:last-child b{border-color:#8d7438;color:#e9c46c}body .cl-milestones small{font-size:9px;overflow-wrap:anywhere}body .cl-activity{display:inline-flex;font-size:10px;padding:4px 8px;border:1px solid var(--line);border-radius:7px;color:var(--muted)}
body .cl-note p,body .cl-guide p{font-size:12px;color:var(--muted);line-height:1.6;margin-top:8px}body .cl-badge-guide{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}body .cl-details .cl-caption{font-size:11px;color:var(--muted);margin-top:12px;line-height:1.5}
body .cl-details .ho-cus-edit{margin-top:0!important}body .cl-details .ho-cus-edit summary{font-size:12px!important;padding:10px!important}
@media(max-width:1150px){body .cl-main{grid-template-columns:minmax(0,1fr)}body .cl-contact{margin-left:0}body .cl-metrics strong{font-size:20px}}
@media(max-width:650px){body .cl-details{gap:12px}body .cl-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}body .cl-metrics>div,body .cl-panel,body .cl-identity{padding:13px}body .cl-contact{gap:10px;flex-direction:column;width:100%}body .cl-name h4{font-size:18px!important}body .cl-heading h3{font-size:23px!important}}

body .cl-details .cl-identity{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:12px 14px;align-items:center;padding:18px}
body .cl-details .cl-avatar{width:46px;height:46px;font-size:20px}
body .cl-details .cl-name{min-width:0}body .cl-details .cl-name h4{margin:0;font-size:19px!important;line-height:1.3}
body .cl-details .cl-name>div{gap:8px}body .cl-details .cl-name>small{font-size:12px;line-height:1.5;margin-top:5px;color:var(--muted)}
body .cl-details .cl-contact{display:flex;gap:22px;margin:0;min-width:0}
body .cl-details .cl-contact>span{display:flex;align-items:center;gap:10px;min-width:0;font-size:13px}
body .cl-details .cl-contact .icon{flex:0 0 18px;width:18px;height:18px}
body .cl-details .cl-contact .cl-contact-copy{display:block;line-height:1.5;min-width:0;overflow-wrap:anywhere}
body .cl-details .cl-contact-copy small{display:block;font-size:11px;color:var(--muted);margin-bottom:2px}
@media(max-width:1100px){body .cl-details .cl-identity{grid-template-columns:46px minmax(0,1fr)}body .cl-details .cl-contact{grid-column:1/-1;border-top:1px solid var(--line);padding-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}}
@media(max-width:480px){body .cl-details .cl-identity{padding:14px}body .cl-details .cl-contact{grid-template-columns:minmax(0,1fr);gap:12px}body .cl-details .cl-name h4{font-size:18px!important}}

body .cl-details .cl-actions{display:flex!important;align-items:center!important;gap:8px!important}
body .cl-details .cl-actions>a,body .cl-details .cl-actions>button,body .cl-details .cl-more>summary{display:inline-flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;height:38px!important;min-height:38px!important;margin:0!important;padding:8px 12px!important;line-height:1.2!important;font-size:12px!important;vertical-align:middle!important}
body .cl-details .cl-actions>.cl-more{display:block!important;align-self:center!important;margin:0!important;padding:0!important;height:38px!important;line-height:1!important}
body .cl-details .cl-more>summary{width:38px!important;padding:0!important;list-style:none!important}
body .cl-details .cl-more>summary::-webkit-details-marker{display:none!important}

body .cl-details .cl-history>h4,body .cl-details .cl-history>h4 small,body .cl-details .cl-history td:first-child>a,body .cl-details .cl-name h4{font-weight:700!important}
body .cl-details .cl-order-state{font-weight:600!important;padding:5px 10px!important;border-radius:99px!important;border:1px solid transparent!important;line-height:1.4!important}
body .cl-details .cl-order-state.is-new{background:rgba(45,202,143,.24)!important;color:#95e5c6!important;border-color:#2dca8f40!important}
body .cl-details .cl-order-state.is-accepted{background:rgba(92,168,242,.24)!important;color:#b1d5fa!important;border-color:#5ca8f240!important}
body .cl-details .cl-order-state.is-ready{background:rgba(235,163,78,.24)!important;color:#eac18a!important;border-color:#eba34e40!important}
body .cl-details .cl-order-state.is-pickup_ready{background:rgba(122,96,214,.24)!important;color:#d2c8ff!important;border-color:#9b7cf640!important}
body .cl-details .cl-order-state.is-completed{background:rgba(45,202,143,.24)!important;color:#95e5c6!important;border-color:#2dca8f40!important}
body .cl-details .cl-order-state.is-cancelled{background:rgba(240,91,112,.24)!important;color:#ffacba!important;border-color:#f05b7040!important}
body.theme-light .cl-details .cl-order-state.is-new,body.theme-light .cl-details .cl-order-state.is-completed{color:#176443!important}
body.theme-light .cl-details .cl-order-state.is-accepted{color:#245b93!important}body.theme-light .cl-details .cl-order-state.is-ready{color:#885016!important}body.theme-light .cl-details .cl-order-state.is-pickup_ready{color:#6249b5!important}body.theme-light .cl-details .cl-order-state.is-cancelled{color:#a42a40!important}
