/* ═══════════ OrgDeploy owner console ═══════════
   Logical properties only — this renders inside the theme, which mirrors
   from dir alone. A single margin-left here would break Hebrew and
   Arabic while looking correct in English.
   ═══════════════════════════════════════════════ */

.oda-console{
  --c-line:#DDE4EC; --c-ink:#0F1E2E; --c-mut:#64788C;
  --c-accent:#0B6E99; --c-paper:#F5F8FA;
  --c-good:#00a32a; --c-warn:#dba617;
  --oda-console-w:960px;
  color:var(--c-ink); font-size:15px; line-height:1.6;

  /*
   * Width, and escaping the theme's container.
   *
   * A max-width alone cannot make this wider than whatever the theme
   * wraps it in, which is why raising it appeared to do nothing: the
   * ledger is a table and the theme's article column is built for prose.
   *
   * The negative-margin form handles both cases with one rule. When the
   * requested width fits the container, 50% - w/2 is positive and centres
   * exactly like margin auto. When it does not, the value goes negative
   * and the console spills symmetrically past the column. Capped at the
   * viewport so it never causes a horizontal scrollbar.
   *
   * margin-inline takes one value and applies it to both sides, so this
   * stays correct in Hebrew and Arabic without a second rule.
   */
  width:min(var(--oda-console-w), calc(100vw - 2rem));
  max-width:none;
  margin-inline:calc(50% - min(var(--oda-console-w), calc(100vw - 2rem)) / 2)}

.oda-console h2{margin:0; font-size:1.4rem}
.oda-console h3{margin:1.6rem 0 .6rem; font-size:1rem; color:var(--c-mut);
  text-transform:uppercase; letter-spacing:.06em}

.oda-console-head{display:flex; flex-wrap:wrap; gap:1rem;
  align-items:flex-end; justify-content:space-between;
  padding-block-end:1rem; border-block-end:1px solid var(--c-line)}
.oda-console-who{margin:.2rem 0 0; font-size:.85rem; color:var(--c-mut)}
.oda-console-range{display:flex; flex-direction:column; gap:.2rem; font-size:.8rem}
.oda-console-range span{color:var(--c-mut)}
.oda-console-range select{padding:.4rem .6rem; border:1px solid var(--c-line);
  border-radius:6px; font:inherit; background:#fff}

/* Tabs */
.oda-console-tabs{display:flex; flex-wrap:wrap; gap:.3rem; margin-block:1rem}
.oda-console-tabs button{background:transparent; border:1px solid transparent;
  border-radius:7px; padding:.5rem .9rem; font:inherit; font-size:.9rem;
  color:var(--c-mut); cursor:pointer}
.oda-console-tabs button:hover{color:var(--c-ink); background:var(--c-paper)}
.oda-console-tabs button[aria-selected="true"]{
  background:var(--c-paper); border-color:var(--c-line); color:var(--c-ink); font-weight:600}
.oda-console-tabs button:focus-visible{outline:3px solid var(--c-accent); outline-offset:2px}

.oda-console-body{min-height:220px}
.oda-console-loading{color:var(--c-mut)}
.oda-console-hint{color:var(--c-mut); font-size:.9rem; margin-block-start:0}
.oda-console-note{margin-block-start:2rem; padding-block-start:1rem;
  border-block-start:1px solid var(--c-line); font-size:.8rem; color:var(--c-mut)}

/* Numbers */
.oda-stats{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:.8rem}
.oda-stat{background:var(--c-paper); border:1px solid var(--c-line);
  border-radius:10px; padding:1rem; display:flex; flex-direction:column; gap:.2rem}
.oda-stat-v{font-size:1.9rem; font-weight:700; line-height:1.1}
.oda-stat-l{font-size:.8rem; color:var(--c-mut)}
.oda-stat.is-good .oda-stat-v{color:var(--c-good)}
.oda-stat.is-warn .oda-stat-v{color:var(--c-warn)}

/* Sparkline. Bars are ordered oldest to newest and mirror with the
   document, which is correct: the time axis runs with the reading
   direction, not against it. */
.oda-spark{display:flex; align-items:flex-end; gap:2px; height:80px;
  padding:.5rem; background:var(--c-paper); border:1px solid var(--c-line);
  border-radius:10px}
.oda-spark-bar{flex:1 1 0%; min-width:2px; background:var(--c-accent);
  border-radius:2px 2px 0 0; opacity:.85}
.oda-spark-bar:hover{opacity:1}

/* Tables */
.oda-table{width:100%; border-collapse:collapse; font-size:.9rem}
.oda-table th, .oda-table td{
  padding:.55rem .7rem; text-align:start;
  border-block-end:1px solid var(--c-line); vertical-align:top}
.oda-table th{font-size:.75rem; text-transform:uppercase; letter-spacing:.05em;
  color:var(--c-mut); font-weight:600}
.oda-table tbody tr:hover{background:var(--c-paper)}
.oda-table td:last-child{width:1%; white-space:nowrap; font-variant-numeric:tabular-nums}

/* Knowledge base editor */
.oda-kb-field{margin-block-end:1.1rem}
.oda-kb-field label{display:block; font-size:.8rem; font-weight:600;
  color:var(--c-mut); margin-block-end:.3rem}
.oda-kb-field textarea{width:100%; box-sizing:border-box; padding:.6rem .7rem;
  border:1px solid var(--c-line); border-radius:7px; font:inherit;
  font-size:.9rem; line-height:1.55; resize:vertical}
.oda-kb-field textarea:focus-visible{outline:2px solid var(--c-accent); outline-offset:1px}
.oda-kb-field textarea[readonly]{background:var(--c-paper); color:var(--c-mut)}
.oda-kb-save{margin-block-start:.4rem; background:var(--c-accent); color:#fff;
  border:0; border-radius:6px; padding:.4rem .9rem; font:inherit;
  font-size:.85rem; cursor:pointer}
.oda-kb-save:disabled{opacity:.6; cursor:default}
.oda-kb-note{margin-inline-start:.6rem; font-size:.8rem; color:var(--c-mut)}

/* Sign-in gate */
.oda-console-gate{max-width:400px}
.oda-console-gate .login-username,
.oda-console-gate .login-password{margin-block-end:.8rem}
.oda-console-gate label{display:block; font-size:.85rem; color:var(--c-mut);
  margin-block-end:.25rem}
.oda-console-gate input[type="text"],
.oda-console-gate input[type="password"]{width:100%; box-sizing:border-box;
  padding:.55rem .7rem; border:1px solid var(--c-line); border-radius:7px; font:inherit}
.oda-console-gate .button-primary{background:var(--c-accent); color:#fff; border:0;
  border-radius:7px; padding:.55rem 1.2rem; font:inherit; cursor:pointer}
.oda-console-denied{padding:1.2rem; background:var(--c-paper);
  border:1px solid var(--c-line); border-radius:10px}

@media(max-width:560px){
  .oda-console-head{flex-direction:column; align-items:flex-start}
  .oda-stat-v{font-size:1.5rem}
}

/* Knowledge base: profile/language pickers and the add form */
.oda-kb-bar{display:flex; flex-wrap:wrap; gap:1rem; margin-block:.8rem 1.4rem;
  padding-block-end:.8rem; border-block-end:1px solid var(--c-line)}
.oda-kb-pick{display:flex; flex-direction:column; gap:.2rem; font-size:.8rem}
.oda-kb-pick span{color:var(--c-mut)}
.oda-kb-pick select{padding:.35rem .6rem; border:1px solid var(--c-line);
  border-radius:6px; font:inherit; background:#fff}
.oda-kb-empty{color:var(--c-mut); font-style:italic}
.oda-kb-actions{display:flex; align-items:center; gap:.5rem; margin-block-start:.4rem}
.oda-kb-del{background:transparent; color:#b32d2e; border:1px solid var(--c-line);
  border-radius:6px; padding:.4rem .8rem; font:inherit; font-size:.85rem; cursor:pointer}
.oda-kb-del:hover{background:#fdf0f0; border-color:#b32d2e}
.oda-kb-add{margin-block-start:2rem; padding:1.2rem; background:var(--c-paper);
  border:1px solid var(--c-line); border-radius:10px}
.oda-kb-add h3{margin-block-start:0}
.oda-kb-add label{display:block; font-size:.8rem; font-weight:600;
  color:var(--c-mut); margin-block-end:.3rem}
.oda-kb-add input[type="text"]{width:100%; box-sizing:border-box; padding:.55rem .7rem;
  border:1px solid var(--c-line); border-radius:7px; font:inherit;
  margin-block-end:.7rem; background:#fff}
.oda-kb-add textarea{width:100%; box-sizing:border-box; padding:.6rem .7rem;
  border:1px solid var(--c-line); border-radius:7px; font:inherit;
  font-size:.9rem; resize:vertical; margin-block-end:.7rem; background:#fff}

/* Decision ledger */
.oda-table-ledger{font-size:.82rem; table-layout:fixed; width:100%}
.oda-table-ledger td{overflow-wrap:anywhere}
.oda-table-ledger td:last-child{width:auto; white-space:normal}
.oda-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.78rem}
.oda-args{color:var(--c-mut); font-size:.76rem;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.oda-out{display:inline-block; padding:.1rem .45rem; border-radius:5px;
  font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.03em}
.oda-out.is-allow{background:#e6f6ea; color:#00713b}
.oda-out.is-deny{background:#fdecec; color:#b32d2e}
.oda-out.is-require_human{background:#fdf6e3; color:#8a6100}

/* ── Filters ─────────────────────────────────────────────────────── */
.oda-filters{display:flex; flex-wrap:wrap; gap:.8rem 1rem; align-items:flex-end;
  padding:1rem; margin-block:1rem; background:var(--c-paper);
  border:1px solid var(--c-line); border-radius:10px}
.oda-filter{display:flex; flex-direction:column; gap:.2rem; font-size:.78rem}
.oda-filter > span{color:var(--c-mut)}
.oda-filter input, .oda-filter select{padding:.4rem .55rem; border:1px solid var(--c-line);
  border-radius:6px; font:inherit; font-size:.85rem; background:#fff; min-width:9rem}
.oda-filter-check{flex-direction:row; align-items:center; gap:.4rem; font-size:.85rem}
.oda-filter-check input{min-width:0}
.oda-filter-reset{align-self:flex-end; background:transparent; border:1px solid var(--c-line);
  border-radius:6px; padding:.45rem .8rem; font:inherit; font-size:.82rem;
  color:var(--c-mut); cursor:pointer}
.oda-filter-reset:hover{color:var(--c-ink); background:#fff}

/* ── Toolbar and downloads ───────────────────────────────────────── */
.oda-toolbar{display:flex; flex-wrap:wrap; gap:.8rem; align-items:center;
  justify-content:space-between; margin-block-end:.8rem}
.oda-toolbar-count{font-size:.85rem; color:var(--c-mut)}
.oda-toolbar-actions{display:flex; gap:.4rem}
.oda-dl{display:inline-block; background:#fff; color:var(--c-ink);
  border:1px solid var(--c-line); border-radius:6px; padding:.4rem .85rem;
  font:inherit; font-size:.82rem; text-decoration:none; cursor:pointer}
.oda-dl:hover{border-color:var(--c-accent); color:var(--c-accent)}

/* ── Sorting and paging ──────────────────────────────────────────── */
.oda-sortable{cursor:pointer; user-select:none}
.oda-sortable:hover{color:var(--c-accent)}
.oda-sort{font-size:.65rem}
.oda-pager{display:flex; flex-wrap:wrap; align-items:center; gap:.6rem;
  margin-block-start:1rem; font-size:.85rem}
.oda-page{background:#fff; border:1px solid var(--c-line); border-radius:6px;
  padding:.4rem .8rem; font:inherit; font-size:.82rem; cursor:pointer}
.oda-page:disabled{opacity:.45; cursor:default}
.oda-pager-at{color:var(--c-mut); font-variant-numeric:tabular-nums}

/* ── Print, which is also how a PDF is produced ──────────────────────
   No PDF library ships with WordPress, and adding one to a plugin that
   runs on a payment site is a large dependency for a table. The browser
   already renders this document correctly — including Hebrew and Arabic
   shaping and the operator's own fonts — so printing to PDF gives a
   better result than anything generated server-side would. */
@media print{
  .oda-console-tabs,
  .oda-console-range,
  .oda-console-who,
  .oda-print-hide{display:none !important}

  .oda-console{width:auto; max-width:none; margin-inline:0; font-size:10pt; color:#000}
  .oda-console-head{border-block-end:1px solid #000; margin-block-end:.5rem}

  .oda-stats{display:flex; gap:.6rem; page-break-inside:avoid}
  .oda-stat{border:1px solid #999; padding:.4rem .6rem; background:none}
  .oda-stat-v{font-size:1.1rem}

  .oda-table{font-size:8.5pt}
  .oda-table th{border-block-end:1px solid #000; color:#000}
  .oda-table td{border-block-end:1px solid #ddd}
  .oda-table thead{display:table-header-group}   /* repeat header on each page */
  .oda-table tr{page-break-inside:avoid}
  .oda-args{font-size:7.5pt; color:#333}
  .oda-out{border:1px solid #999; background:none !important; color:#000 !important}
}

/* Settings form */
.oda-settings{display:grid; gap:.85rem}
.oda-setting{display:grid; grid-template-columns:minmax(0,1fr) auto auto;
  gap:.8rem; align-items:center; padding-block-end:.7rem;
  border-block-end:1px solid var(--c-line)}
.oda-setting label{font-size:.9rem}
.oda-setting input[type="number"], .oda-setting input[type="text"],
.oda-setting select{padding:.4rem .6rem; border:1px solid var(--c-line);
  border-radius:6px; font:inherit; font-size:.88rem; background:#fff; min-width:8rem}
.oda-setting input[type="checkbox"]{width:18px; height:18px}
.oda-setting input:disabled, .oda-setting select:disabled{
  background:var(--c-paper); color:var(--c-mut)}
.oda-setting-range{font-size:.75rem; color:var(--c-mut);
  font-variant-numeric:tabular-nums}
.oda-console-actions{display:flex; align-items:center; gap:.6rem;
  margin-block-start:1.2rem}

/* The live agent, shown inside its tab */
.oda-console-try{margin-block-start:1rem}
.oda-console-try[hidden]{display:none}

@media(max-width:560px){
  .oda-setting{grid-template-columns:1fr; gap:.35rem; justify-items:start}
}