/* Outreach – shared styles, ported from the approved prototype (outreach-ui/screens). */
body{margin:0;background:#fff;color:#1d2228;font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:14px;line-height:1.45}
a{color:#1f5fbf;text-decoration:none}a:hover{color:#174a96;text-decoration:underline}
.app{display:flex;min-height:100vh}
.side{width:220px;flex:none;border-right:1px solid #dfe3e8;padding:16px 12px;box-sizing:border-box}
.brand{font-weight:600;font-size:16px;padding:4px 10px 16px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-radius:4px;color:#1d2228}
.nav a:hover{background:#f3f5f7;text-decoration:none;color:#1d2228}
.nav a.on{background:#eaf0fa;color:#1f5fbf;font-weight:600}
.count{background:#1f5fbf;color:#fff;border-radius:10px;padding:0 7px;font-size:12px;font-weight:600}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{height:56px;border-bottom:1px solid #dfe3e8;display:flex;align-items:center;justify-content:space-between;padding:0 24px;flex:none}
.top h1{font-size:18px;margin:0;font-weight:600}
.topr{display:flex;align-items:center;gap:20px}
.stop{display:flex;align-items:center;gap:8px;background:none;border:0;font:inherit;color:#a4161a;font-weight:600;cursor:pointer;padding:6px 0}
.sw{width:34px;height:20px;border-radius:10px;background:#c9ced4;position:relative;display:inline-block}
.sw i{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff}
.sw.on{background:#c62828}.sw.on i{left:16px}
.banner{background:#fbe4e4;color:#a4161a;border-bottom:1px solid #f0c4c4;padding:10px 24px;font-weight:600}
.banner.grey{background:#eceef1;color:#48505a;border-bottom-color:#dfe3e8}
.usermenu{position:relative}
.usermenu > button{background:none;border:0;font:inherit;color:inherit;cursor:pointer;padding:6px 0}
.usermenu .menu{position:absolute;right:0;top:100%;background:#fff;border:1px solid #dfe3e8;border-radius:4px;min-width:140px;z-index:20;padding:4px 0;display:none}
.usermenu.open .menu{display:block}
.usermenu .menu button{display:block;width:100%;text-align:left;background:none;border:0;font:inherit;padding:8px 12px;cursor:pointer;color:#1d2228}
.usermenu .menu button:hover{background:#f3f5f7}
.content{padding:24px;display:flex;flex-direction:column;gap:24px}
.box{border:1px solid #dfe3e8;border-radius:6px;background:#fff}
.boxh{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #dfe3e8}
h2{font-size:15px;margin:0;font-weight:600}
h3{font-size:13px;margin:0;font-weight:600;color:#5b636d;text-transform:uppercase;letter-spacing:.04em}
.tr{display:grid;align-items:center;column-gap:16px;padding:0 16px;border-bottom:1px solid #eceef1;min-height:44px}
.tr:last-child{border-bottom:0}
.tr > div{padding:8px 0;min-width:0}
.th{background:#f8f9fa;font-size:12px;font-weight:600;color:#5b636d;min-height:34px;border-bottom:1px solid #dfe3e8}
.num{text-align:right;font-variant-numeric:tabular-nums}
.badge{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;font-weight:600;white-space:nowrap}
.g{background:#e3f3e8;color:#1b6a35}.y{background:#fbf0cc;color:#6f5300}.r{background:#fbe4e4;color:#a4161a}.n{background:#eceef1;color:#48505a}
.btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:4px;border:1px solid #c9ced4;background:#fff;color:#1d2228;font:inherit;font-weight:500;cursor:pointer;box-sizing:border-box;white-space:nowrap}
.btn:hover{background:#f3f5f7;text-decoration:none;color:#1d2228}
.btn:disabled,.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn svg{width:14px;height:14px}
.btn.on{border-color:#1f5fbf;background:#eef3fb;color:#1f5fbf;font-weight:600}
.pri{background:#1f5fbf;border-color:#1f5fbf;color:#fff}.pri:hover{background:#174a96;color:#fff}
.sm{height:28px;padding:0 10px;font-size:13px}
.big{height:44px;padding:0 24px;font-size:15px;font-weight:600}
.danger{color:#a4161a}
.muted{color:#5b636d}
.small{font-size:12px}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:13px}
.empty{padding:48px 16px;display:flex;flex-direction:column;align-items:center;gap:12px;color:#5b636d}
.bar{height:8px;background:#eceef1;border-radius:4px;overflow:hidden;flex:1}
.bar > div{height:100%;background:#1f5fbf}
label{font-weight:500;font-size:13px}
input,select,textarea{font:inherit;color:inherit;border:1px solid #c9ced4;border-radius:4px;padding:7px 10px;background:#fff;box-sizing:border-box}
input:focus,select:focus,textarea:focus{outline:2px solid #1f5fbf;outline-offset:-1px;border-color:#1f5fbf}
input[readonly]{background:#f6f7f9;color:#48505a}
input[type=checkbox],input[type=radio]{width:16px;height:16px;margin:0}
.field{display:flex;flex-direction:column;gap:6px}
.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.foot{display:flex;justify-content:space-between;align-items:center;gap:8px}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:#1f5fbf;cursor:pointer;text-align:left}
.linkbtn:hover{text-decoration:underline}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.chk{display:flex;align-items:center;gap:8px;font-weight:400;font-size:14px}
.err{color:#a4161a;font-size:13px}
.warn{color:#6f5300;font-size:13px}
.ok{color:#1b6a35;font-size:13px}
/* tabs */
.tabs{display:flex;gap:4px;border-bottom:1px solid #dfe3e8}
.tab{background:none;border:0;border-bottom:2px solid transparent;padding:10px 14px;font:inherit;font-weight:500;color:#5b636d;cursor:pointer;margin-bottom:-1px}
.tab:hover{text-decoration:none;color:#1d2228}
.tab.on{border-bottom-color:#1f5fbf;color:#1f5fbf;font-weight:600}
/* wizard steps */
.steps{display:flex;gap:8px;list-style:none;margin:0;padding:0}
.steps li{flex:1;display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid #dfe3e8;border-radius:4px;color:#5b636d}
.steps li.done{color:#1d2228}
.steps li.cur{border-color:#1f5fbf;color:#1f5fbf;font-weight:600}
.dot{width:22px;height:22px;border-radius:50%;border:1px solid currentColor;display:inline-flex;align-items:center;justify-content:center;font-size:12px;flex:none}
/* dialogs */
.overlay{position:fixed;inset:0;background:rgba(20,24,28,.35);display:flex;align-items:flex-start;justify-content:center;padding-top:100px;z-index:10;overflow:auto}
.dialog{width:440px;background:#fff;border:1px solid #c9ced4;border-radius:6px;padding:20px;display:flex;flex-direction:column;gap:16px;margin-bottom:40px}
.dialog.wide{width:580px}
.dialog h2{font-size:16px}
/* paging */
.pager{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-top:1px solid #dfe3e8}
.htmx-indicator{display:none}.htmx-request .htmx-indicator,.htmx-request.htmx-indicator{display:inline}
.htmx-request .hide-on-req{display:none}
