/* One squared control standard for dashboard, admin, guides and project apps.
   Shape only: preserve sizes, spacing, colors, focus, disabled states and behavior. */
:root{--ttb-control-radius:4px}
html body button:not(.leaflet-marker-icon):not(.mapboxgl-marker):not(.switch):not([role="switch"]),
html body input[type="button"],
html body input[type="submit"],
html body input[type="reset"],
html body [role="button"]:not(img):not(svg):not(.leaflet-marker-icon):not(.mapboxgl-marker):not(.switch),
html body summary,
html body a:is(.k-btn,.k-btn-ghost,.btn,.btn-ghost,.btn3d,.button,.button-primary,.button-secondary,.primary,.secondary,.call,.goto,.ps-button,.k-chip,.chip,.pill,.k-mback,.k-pv-x,.tm-btn,.sr-button,.br-button,.cq-primary,.cq-secondary),
html body :is(.jump,.pager,.pagination,.pv-toolbar,.k-admin-tabs,.k-osw,.k-cosw,.k-tabs,.tool-tabs,.tabs,.toc,.nb-section-nav,.br-jump,.anatomy-page-links) a,
html body .qf-off-more,
html body .qf-saves-more,
html body .k-nav-item,
html body .k-card-tool .k-open,
html body .k-card-tool .k-card-foot .k-lock,
html body .k-tw > .k-mt-form:not(.rm) .k-mt-btn.add{
  border-radius:var(--ttb-control-radius)!important;
}
/* Form fields follow the same geometry; checkbox/radio/range/color shapes stay native. */
html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
html body select,
html body textarea{
  border-radius:var(--ttb-control-radius)!important;
}
html body input::file-selector-button{border-radius:var(--ttb-control-radius)!important}
/* Keep informative imagery, cards, toolbox handles, badges, map pins, plot marks,
   numbered illustrations and switch tracks/knobs independent of action-button shape. */

/* Center the Dashboard icon when a standalone tool header uses flex navigation. */
html body .ttb-tool-nav a.kit-dash{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  flex:0 0 44px!important;
  padding:0!important;
  box-sizing:border-box!important;
}
html body .ttb-tool-nav a.kit-dash>svg{
  display:block!important;
  margin:0!important;
}

/* Oct 18, 2026 (pilot review): one slim top bar on phones for every library tool — icon, title, Project Toolbox — so the page gets the screen */
@media (max-width:600px){
  header .ttb-tool-nav{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:10px!important;padding-top:8px!important;padding-bottom:8px!important}
  header .ttb-tool-nav .kit-lead{flex:1 1 auto!important;min-width:0!important;display:flex!important;align-items:center!important;gap:10px!important}
  header .ttb-tool-nav .brand{min-width:0}
  header .ttb-tool-nav .brand small{display:none!important}
  header .ttb-tool-nav .brand strong{display:block;font-size:15px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  header .ttb-tool-nav .hnav{flex:0 0 auto!important;margin:0!important}
  header .ttb-tool-nav #ttb-fc-back{margin:0!important;font-size:13.5px!important}
  .home-hero{margin-top:14px!important}
}

/* Oct 18, 2026 (pilot review): The BO, Illustrated tabs — only the page you are on is highlighted, and on phones the tabs sit in one swipeable row */
nav.app-tabs .help:not(.on):not([aria-current]):not([aria-selected="true"]):not([aria-pressed="true"]){background:transparent!important}
@media (max-width:600px){
  nav.app-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important;padding-top:4px!important;padding-bottom:8px!important}
  nav.app-tabs>a,nav.app-tabs>button{width:auto!important;margin:0!important;padding:8px 4px!important;min-height:38px!important;font-size:14px!important;text-align:center;justify-content:center;white-space:nowrap}
}

/* Oct 20, 2026: inset single-select chevrons and reserve room for the label. */
html body select:not([multiple]):not([size]),
html body select:not([multiple])[size="1"]{
  -webkit-appearance:none!important;
  appearance:none!important;
  padding-right:42px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 6 4.5 4.5L12.5 6' fill='none' stroke='%23315b46' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-position:right 14px center!important;
  background-size:14px 14px!important;
  background-repeat:no-repeat!important;
}
@media (forced-colors:active){
  html body select:not([multiple]):not([size]),
  html body select:not([multiple])[size="1"]{appearance:auto!important;background-image:none!important}
}

/* Oct 22, 2026: dashboard dropdown palette and consistent touch sizing.
   Progressive enhancement preserves native select behavior and unsupported-browser pickers. */
html body.k-app select:not([multiple]):not([size]),
html body.k-app select:not([multiple])[size="1"]{
  box-sizing:border-box!important;min-width:0;max-width:100%!important;
  min-height:44px!important;height:auto!important;padding:10px 42px 10px 12px!important;
  font-family:Archivo,Arial,sans-serif!important;font-size:14px!important;font-weight:500!important;line-height:1.4!important;
  color:#294536!important;background-color:#fff!important;border:1.5px solid #77946c!important;
  color-scheme:light;white-space:normal!important;overflow-wrap:anywhere;
}
html body.k-app select:focus-visible{outline:2px solid #b99539!important;outline-offset:2px!important;box-shadow:none!important}
html body.k-app select:disabled{opacity:.6;cursor:not-allowed}
@supports (appearance:base-select){
  html body.k-app select:not([multiple]):not([size]),
  html body.k-app select:not([multiple])[size="1"],
  html body.k-app select:not([multiple]):not([size])::picker(select),
  html body.k-app select:not([multiple])[size="1"]::picker(select){appearance:base-select!important;-webkit-appearance:base-select!important}
  html body.k-app select::picker-icon{display:none}
  html body.k-app select::picker(select){
    box-sizing:border-box;min-width:anchor-size(width);width:max-content;max-width:min(420px,calc(100vw - 24px));
    max-height:min(340px,60dvh,var(--ttb-picker-height,340px));overflow-y:auto;overscroll-behavior:contain;position-area:block-end span-inline-end;inset:auto;position-try-fallbacks:flip-block,flip-inline,flip-block flip-inline;position-try-order:most-height;
    padding:5px;border:1px solid #a6b59c;border-radius:8px;background:#fff;color:#294536;
    box-shadow:0 7px 22px #29453626;font:500 14px/1.4 Archivo,Arial,sans-serif;
  }
  html body.k-app select option{
    display:flex;align-items:center;gap:9px;box-sizing:border-box;min-height:40px;
    padding:9px 11px;border:0;border-radius:4px;white-space:normal;overflow-wrap:anywhere;
    font:500 14px/1.4 Archivo,Arial,sans-serif;color:#294536;background:#fff;
  }
  html body.k-app select option:hover,html body.k-app select option:focus{background:#e8eedf;outline:none}
  html body.k-app select option:checked{background:#f3e3ad;font-weight:650}
  html body.k-app select option:checked:focus{outline:1px solid #b99539;outline-offset:-1px}
  html body.k-app select option::checkmark{color:#315b46;flex:none}
  html body.k-app select option:disabled{color:#7b847b;background:#f5f6f2}
  html body.k-app select optgroup{font:650 12px/1.4 Archivo,Arial,sans-serif;color:#657366}
  html body.k-app select optgroup::legend{padding:8px 11px 4px}
}
@media(max-width:760px){
  html body.k-app select:not([multiple]):not([size]),html body.k-app select:not([multiple])[size="1"]{font-size:16px!important;padding-top:10px!important;padding-bottom:10px!important}
  @supports (appearance:base-select){
    html body.k-app select::picker(select){font-size:16px;max-height:min(320px,55dvh,var(--ttb-picker-height,320px))}
    html body.k-app select option{min-height:44px;font-size:16px;padding:10px 11px}
  }
}
@media(forced-colors:active){
  html body.k-app select:not([multiple]):not([size]),html body.k-app select:not([multiple])[size="1"],html body.k-app select::picker(select){appearance:auto!important;-webkit-appearance:auto!important}
  html body.k-app select{background-image:none!important;color:CanvasText!important;border-color:ButtonText!important}
}

/* Keep project context readable on phones instead of squeezing long names side by side. */
@media(max-width:760px){html body.k-app main.k-main .wp-hierarchy>.wp-pickers{grid-template-columns:minmax(0,1fr)!important;align-items:start!important}html body.k-app .wp-pickers>label,html body.k-app .wp-project-line{min-width:0;width:100%}html body.k-app .wp-pickers select{width:100%!important}}

@supports(appearance:base-select){html body.k-app select[data-ttb-picker-up]::picker(select){position-area:block-start span-inline-end}html body.k-app select[data-ttb-picker-left]::picker(select){position-area:block-end span-inline-start}html body.k-app select[data-ttb-picker-up][data-ttb-picker-left]::picker(select){position-area:block-start span-inline-start}}

/* Release check: keep company role words intact in the People table. */
@media(min-width:761px){html body.k-app .ac-t select:not([multiple]):not([size]){padding-left:8px!important;padding-right:30px!important;overflow-wrap:normal;word-break:normal}}
