/* CRM 2.4.7 — global UX polish. Loaded after screen-specific and mobile CSS. */
:root{
  --ux-shadow-card:0 4px 14px rgba(23,42,75,.045);
  --ux-shadow-hover:0 10px 26px rgba(23,42,75,.08);
  --ux-focus:0 0 0 3px rgba(49,91,200,.16);
}

@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* Accessible, consistent interactive states */
a,button,input,select,textarea,summary{outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{box-shadow:var(--ux-focus);outline:2px solid transparent}
.btn{min-height:39px;transition:transform .12s ease,box-shadow .12s ease,background .12s ease,border-color .12s ease;box-shadow:0 1px 1px rgba(16,24,40,.02)}
.btn:hover{transform:translateY(-1px);box-shadow:0 5px 13px rgba(20,45,95,.09)}
.btn:active{transform:translateY(0);box-shadow:none}
.btn.secondary:hover{background:#f8fafc;border-color:#c5d1e1}
.btn.danger:hover{background:#9f2017}

/* Cleaner surfaces and information hierarchy */
.card,.tablewrap,.formcard{box-shadow:var(--ux-shadow-card)}
.card{transition:border-color .15s ease,box-shadow .15s ease}
.pagehead h1,.hero h1{letter-spacing:-.025em}
.pagehead p,.hero p{max-width:780px;line-height:1.45}
.badge{display:inline-flex;align-items:center;justify-content:center;min-height:23px;line-height:1.15;text-align:center;font-weight:700}
.muted{line-height:1.4}
.empty,.org-empty,.ss-empty,.sd-empty{line-height:1.45}

/* Forms feel like one system */
.field input,.field select,.field textarea,.searchbar input,.searchbar select,
.sl-filter input,.sl-filter select{transition:border-color .12s ease,box-shadow .12s ease,background .12s ease}
.field input:hover,.field select:hover,.field textarea:hover,.searchbar input:hover,.searchbar select:hover,
.sl-filter input:hover,.sl-filter select:hover{border-color:#b9c7da}
.field input:focus,.field select:focus,.field textarea:focus,.searchbar input:focus,.searchbar select:focus,
.sl-filter input:focus,.sl-filter select:focus{border-color:#7799df;box-shadow:var(--ux-focus);outline:none}
.field label{color:#33435c}
.field .help{margin-top:4px;line-height:1.35}
.formactions{padding-top:3px}

/* Desktop tables: easier scanning without making them noisy */
@media(min-width:801px){
  .tablewrap tbody tr,.org-table-wrap tbody tr,.sl-table tbody tr{transition:background .1s ease}
  .tablewrap tbody tr:hover,.org-table-wrap tbody tr:hover,.sl-table tbody tr:hover{background:#f9fbfe}
  td a.title{text-underline-offset:2px}
  td a.title:hover{text-decoration:underline}
}

/* Feedback messages are visible but do not dominate the page. */
.messages{display:grid;gap:7px}.flash{position:relative;margin:0;padding-right:42px;box-shadow:0 5px 16px rgba(20,44,78,.05)}
.ux-flash-close{position:absolute;right:8px;top:50%;width:27px;height:27px;transform:translateY(-50%);display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:currentColor;opacity:.65;cursor:pointer;font:800 16px/1 system-ui}
.ux-flash-close:hover{background:rgba(255,255,255,.55);opacity:1}
.flash.ux-flash-leaving{opacity:0;transform:translateY(-4px);transition:opacity .18s ease,transform .18s ease}

/* Global search shortcut hint on desktop */
@media(min-width:801px){.app-global-search:after{content:"Ctrl K";margin-right:7px;padding:3px 5px;border:1px solid #33435a;border-radius:5px;color:#7f8da1;font-size:8px;font-weight:800;letter-spacing:.02em;white-space:nowrap}.app-global-search:focus-within:after{display:none}}

/* Sales filter layout can grow without becoming a single gigantic row. */
@media(min-width:1301px){
  .sl-filters{grid-template-columns:minmax(280px,2fr) repeat(4,minmax(125px,1fr));}
  .sl-filter-actions{align-self:end}
}
.sl-customer-chip{background:#eef4ff!important;border-color:#cbd9f5!important}.sl-customer-chip a{color:#3157ac;text-decoration:none;font-weight:800}.sl-customer-chip a:hover{text-decoration:underline}.sl-alert-chip{background:#fff4ed!important;border-color:#f0cfba!important;color:#9d4a18!important}.sl-alert-chip strong{color:#9d4a18!important}

/* Organization list benefits from a little more room, while mobile cardification stays intact. */
@media(min-width:801px){.ux-searchbar{max-width:820px}.ux-searchbar .btn{min-width:92px}.tablewrap table th{white-space:nowrap}}

/* Prevent accidental double submissions while retaining named submit values. */
form.ux-submitting [type="submit"]{pointer-events:none;opacity:.72;cursor:wait}
form.ux-submitting [type="submit"]:after{content:"…"}

@media(max-width:800px){
  main{padding-top:16px}
  .pagehead{margin-bottom:14px;gap:11px}.pagehead h1,.hero h1{font-size:clamp(25px,7vw,30px)}
  .card,.formcard{border-radius:14px}
  .messages{margin-left:-1px;margin-right:-1px}.flash{font-size:12px;padding-top:10px;padding-bottom:10px}
  .app-global-search:after{display:none}
  .sl-customer-chip{max-width:88vw}.sl-customer-chip a{max-width:58vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

@media(max-width:520px){
  .btn{min-height:42px}
  .btn.small{min-height:36px}
  .pagehead p{font-size:12px}
  .archive-toggle{margin-bottom:10px}
}