/* style.css — meeting screen base (patched for unified pills/chips) */

/* Brand palette */
:root{
  --blue:#021c40;
  --blue-light:#0b4d9e;
  --bg:#f5f7fb;
  --text:#102438;
  --table-alt:#e9eff7;
}

/* Base */
*{box-sizing:border-box}
body{
  margin:0;
  font-family:'Inter',Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  display:flex;
  height:100vh;
}

/* Left rail */
#nav{
  width:220px;
  background:var(--blue);
  padding:24px 20px;
  display:flex;
  flex-direction:column;
  gap:22px;
}
#nav img{width:145px;margin:0 auto}
.nav-btn{all:unset;cursor:pointer;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;font-size:15px;color:#c6d6ec}
.nav-btn svg{fill:currentColor;flex:0 0 16px}
.nav-btn:hover{background:rgba(255,255,255,.08)}
.nav-btn.active{background:rgba(11,77,158,.25);color:#fff}

/* Canvas */
#canvas{flex:1;overflow:auto;padding:32px 44px 40px}
h2{margin:0 0 18px;font-size:23px;font-weight:600}

/* Form controls */
input,select,textarea,.choices__inner{
  width:100%;
  font:14px/1.4 'Inter',Arial,sans-serif;
  padding:6px 8px;
  background:#fff;
  border:1px solid #cdd8e8;
  border-radius:4px;
}
.inp:focus,.choices__inner.is-focused{border-color:var(--blue-light);box-shadow:0 0 0 2px rgba(11,77,158,.2);outline:none}
input::placeholder,textarea::placeholder,select option[value=""],.choices__placeholder{color:#8999b2;opacity:1}
.choices__input{background:#fff!important}
.choices{margin-bottom:4px!important}

textarea{resize:vertical;min-height:38px}
.autogrow{overflow:hidden}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:6px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.row{margin-bottom:8px}

/* Cards */
.card{background:#fff;padding:22px;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.05);margin-bottom:26px}
.card h3{margin:0 0 14px;font-size:16px;font-weight:600}
.sub{margin:0 0 8px;font-size:14px;color:#384d66}

/* Tables */
table{width:100%;border-collapse:collapse;font-size:14px}
th{background:#d3e2fa;padding:8px;text-align:left;font-weight:600}
td{padding:8px;border-bottom:1px solid #e6ecf3}
tr:nth-child(even){background:var(--table-alt)}
tr:hover td{background:rgba(11,77,158,.08)}

/* Tier grid */
#tier-grid{table-layout:fixed}
#tier-grid th:first-child,#tier-grid td:first-child{width:160px;text-align:left}
#tier-grid th,#tier-grid td{width:80px;text-align:center;border-right:1px solid #d5dde9}
#tier-grid th:last-child,#tier-grid td:last-child{border-right:none}

/* helper check-boxes */
.helper-checks{display:flex;gap:18px;font-size:12px;margin:8px 0}
.helper-checks input{width:16px;height:16px;margin:0;cursor:pointer}
.helper-checks label{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}

/* NR check-boxes */
#tier-grid input[type="checkbox"]{width:16px;height:16px;margin:0}

/* OLD pill styling (neutralized) */
.pill-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.pill{background:#edf1f9;color:#102438;padding:4px 8px;border-radius:12px;font-size:13px;cursor:pointer}
.pill.active{background:var(--blue);color:#fff}  /* ensure dark blue */

/* Follow-up rows */
#follow-wrap .row textarea,#follow-wrap .row select,#follow-wrap .row input{background:transparent}

/* Pipeline table */
#pipeTbl select,#pipeTbl input{margin:0;font:inherit;border:1px solid #cdd8e8;border-radius:4px;padding:4px 6px;height:32px;min-width:110px}
#pipeTbl .blank td{background:#f9fbfe}
#pipeTbl th.link-col,#pipeTbl td.link-col{width:42px;text-align:center}
#pipeTbl input.linkChk{transform:scale(.83);transform-origin:top left;width:20px;height:20px;margin:0;cursor:pointer}

/* Buttons & toast */
.btn{background:var(--blue-light);color:#fff;border:none;padding:10px 18px;border-radius:6px;cursor:pointer}
.btn-outline{background:none;border:1px solid var(--blue-light);color:var(--blue-light);padding:8px 14px;border-radius:6px;cursor:pointer}
.btn:hover,.btn-outline:hover{filter:brightness(1.08)}
.btn-row{display:flex;gap:14px;margin-top:32px}
.toast{margin-left:18px;font-size:14px;color:green;visibility:hidden}
.toast.show{visibility:visible}

/* Hide utility */
.hidden{display:none!important}

/* Date input */
input[type="date"]{-webkit-appearance:none;-moz-appearance:textfield;appearance:none;padding:6px 8px;min-height:38px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230b4d9e' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z'/%3E%3C/svg%3E") no-repeat right 8px center;background-size:16px 16px;cursor:pointer}
input[type="date"]::-webkit-datetime-edit,input[type="date"]::-webkit-input-placeholder{color:#8999b2}
input[type="date"]::-moz-placeholder{color:#8999b2;opacity:1}
input[type="date"]::-moz-inner-spin-button{display:none}

/* Pills above grid (ensure dark blue when active) */
#contact-pills{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#contact-pills .pill{padding:6px 10px;border-radius:9999px;font:700 12px/1 'Inter',Arial,sans-serif;background:#edf1f9;color:#102438;cursor:pointer}
#contact-pills .pill.active{background:#021c40;color:#fff}

/* Choices chips — match pills and white × */
.choices .choices__list--multiple{gap:8px}
.choices .choices__list--multiple .choices__item{
  background:#021c40 !important;color:#fff !important;border-radius:9999px !important;
  padding:6px 10px !important;font:700 12px/1 'Inter',Arial,sans-serif !important;border:0 !important;margin:0 !important;
}
.choices .choices__list--multiple .choices__item .choices__button{
  margin-left:8px !important;border:0 !important;width:16px !important;height:16px !important;
  background-repeat:no-repeat !important;background-position:center !important;background-size:12px 12px !important;
  background-image:url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' \
       stroke='%23fff' stroke-width='2' fill='none' stroke-linecap='round'>\
       <path d='M2 2 L10 10 M10 2 L2 10'/></svg>") !important;
  text-indent:-9999px !important;color:transparent !important;box-shadow:none !important;background-color:transparent !important;
}

/* Placeholder visibility logic */
.choices.has-items .choices__placeholder{display:none !important}
.choices.has-items .choices__input--cloned::placeholder,
.choices.has-items .choices__input::placeholder{color:transparent !important}