/* Settings > Integrations (integrations.php) and Aerial Measuring (measure.php). Own file, like quickwins.css, so
   style.css is untouched. Palette and sizes from style.css only. */
.int-sub { font-size: .8rem; font-weight: 400; margin-left: 6px; }
.int-stats { margin-top: 0; }
/* Name, status, plan and buttons take their natural width; What It Does takes all the rest (Use the space, Oct 17, 2026). */
table.int-table { width: 100%; }
table.int-table td { vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
table.int-table td.int-about { width: 100%; max-width: 0; } /* td.t-main in the markup (style.css) */
table.int-table td.int-name { font-weight: 650; }
table.int-table td.int-name a { color: var(--ink); text-decoration: none; }
table.int-table td.int-name a:hover { color: var(--blue); text-decoration: underline; }
table.int-table .int-own { color: var(--muted); font-size: .8rem; }
table.int-table td.int-act { text-align: right; overflow: visible; }
table.int-table td.int-act > * { vertical-align: middle; }
table.int-table td.int-act form { display: inline; margin: 0; }
table.int-table td.int-act button, table.int-table td.int-act .btn { margin: 0 0 0 8px; min-height: 32px; height: 32px; padding: 0 14px; }
table.int-table td.int-act .top-ico { padding: 0; width: 32px; display: inline-grid; place-items: center; }
table.int-table td.int-act button[disabled] { opacity: .55; cursor: default; }
table.int-table td.int-act button[disabled]:hover { background: #fff; }
table.int-table tr.int-soon td.int-name { color: var(--muted); font-weight: 600; }
@media (max-width: 700px) {
  /* Phones: one flat row per integration inside its group card, two short lines:
     name + status / what it does + plan, with the button on the right of both. */
  table.int-table, table.int-table tbody { display: block; table-layout: auto; }
  table.int-table tr:first-child { display: none; }
  table.int-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name state" "about about" "plan act"; align-items: center; gap: 4px 8px; padding: 10px 0; border-bottom: 1px solid var(--paper); }
  table.int-table tr:last-child { border-bottom: 0; }
  table.int-table td { display: block; padding: 0; border: 0 !important; border-radius: 0 !important; width: auto !important; max-width: none; min-width: 0; background: transparent !important; }
  table.int-table td.int-name { grid-area: name; }
  table.int-table td.int-about { grid-area: about; font-size: .8rem; }
  table.int-table td.int-about .int-own { display: none; }
  table.int-table td.int-state { grid-area: state; justify-self: end; }
  table.int-table td.int-plan { grid-area: plan; justify-self: start; }
  table.int-table td.int-act { grid-area: act; display: flex; gap: 6px; align-items: center; justify-content: flex-end; }
  table.int-table td.int-act button, table.int-table td.int-act .btn { margin: 0; padding: 0 12px; }
  table.int-table td.int-act .top-ico { padding: 0; }
  .int-sub { display: block; margin: 2px 0 0; }
}

/* Aerial Measuring */
.measure-card h2 { margin-bottom: 10px; }
.measure-types a { display: inline-flex; align-items: center; gap: 6px; }
.measure-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--dot, var(--grass)); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .25); flex: none; margin-right: 6px; vertical-align: middle; }
.measure-types a .measure-dot { margin-right: 0; }
.measure-dot.cut { background: transparent; box-shadow: inset 0 0 0 2px var(--dot); }
.measure-map-wrap { position: relative; }
.measure-map { height: 560px; border-radius: 10px; background: var(--paper); touch-action: none; }
.measure-tip { position: absolute; z-index: 500; left: 10px; bottom: 10px; right: 120px; margin: 0; padding: 7px 10px; border-radius: 8px; background: rgba(255, 255, 255, .94); color: var(--ink); font-size: .8rem; box-shadow: 0 1px 4px rgba(0, 0, 0, .25); pointer-events: none; }
.measure-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.measure-tools button { margin: 0; }
.measure-tools button[disabled] { opacity: .5; cursor: default; }
.measure-tools button.quiet[disabled]:hover { background: #fff; }
table.measure-totals { margin-top: 12px; }
table.measure-totals td, table.measure-totals th { white-space: nowrap; }
table.measure-totals .num { text-align: right; font-variant-numeric: tabular-nums; }
table.measure-totals .m-short { display: none; }
table.measure-totals th:last-child, table.measure-totals td:last-child { width: 64px; }
table.measure-totals td[data-measured] { font-weight: 650; }
.measure-save { justify-content: flex-end; margin: 0; }
.measure-handle { background: transparent; border: 0; }
.measure-handle i { display: block; width: 14px; height: 14px; margin: 6px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px var(--blue), 0 1px 4px rgba(0, 0, 0, .4); }
@media (max-width: 700px) {
  .measure-map { height: min(58vh, 480px); }
  .measure-tip { top: 8px; bottom: auto; left: 8px; right: 52px; }
  .measure-tools { display: grid; grid-template-columns: 1fr 1fr; }
  .measure-tools #m-fit { grid-column: auto; }
  table.measure-totals { table-layout: fixed; }
  table.measure-totals th, table.measure-totals td { padding: 9px 6px; overflow: hidden; text-overflow: ellipsis; }
  table.measure-totals th { font-size: .66rem; }
  table.measure-totals th:first-child { width: 34%; }
  table.measure-totals th:last-child, table.measure-totals td:last-child { width: 48px; }
  table.measure-totals .m-long { display: none; }
  table.measure-totals .m-short { display: inline; }
}