/* AuCRA INSIGHT, companies and sharing (docs/plans/companies-and-sharing.md,
   D4, D5, D14, D15): the top bar's Share button and its dialog, the locked
   rail row and menu link, the read only line, the Dashboard's owner and
   access cells, and the Accounts page. Linked last of the pages family by
   ui/styles.py. */

/* ---- ui/share_button.py ---- */
.aucra-share-slot {
  display: inline-flex;
}
.q-btn.aucra-share-btn {
  height: 36px;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  color: #e8edf2;
  font-size: 13px;
  font-weight: 500;
}
.q-btn.aucra-share-btn:hover {
  background: rgba(255, 255, 255, 0.08);
}
.q-btn.aucra-share-btn:focus-visible {
  box-shadow: 0 0 0 2px var(--focus-ring);
}
.aucra-share-btn .q-focus-helper {
  display: none;
}
.aucra-share-btn .q-icon {
  font-size: 18px;
}
.aucra-share-btn .q-btn__content {
  gap: 6px;
}
.q-btn.aucra-share-btn.aucra-share-off {
  color: #77828c;
  cursor: default;
}
.aucra-share-locked .q-icon:last-child {
  font-size: 14px;
  opacity: 0.8;
}
@media (max-width: 1023px) {
  .aucra-share-btn .block {
    display: none;
  }
}

/* ---- ui/share_dialog.py, share_dialog_rows.py ---- */
.aucra-share-dialog {
  width: 640px;
  max-width: calc(100vw - 32px);
}
.aucra-share-title {
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}
.aucra-share-body {
  padding: 14px 18px;
}
.aucra-share-caption {
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.aucra-share-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  width: 100%;
}
.aucra-share-person {
  flex-direction: column;
  align-items: stretch;
}
.aucra-share-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
}
.aucra-share-who {
  flex: 1 1 12rem;
  min-width: 0;
}
.aucra-share-name {
  font-size: 13.5px;
  font-weight: 500;
}
.aucra-share-company-name,
.aucra-share-ai-line {
  font-size: 12px;
  color: var(--muted);
}
.aucra-share-company {
  font-size: 13.5px;
  font-weight: 500;
}
.aucra-share-owner,
.aucra-share-viewer {
  font-size: 13px;
  color: var(--muted);
}
.aucra-share-acts {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.aucra-share-level {
  width: 9rem;
}
.aucra-share-ai {
  padding-left: 2px;
}
.aucra-share-ai-line {
  padding-left: 30px;
}
.aucra-share-add {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 9rem auto;
  gap: 8px;
  align-items: center;
}
@media (max-width: 599px) {
  .aucra-share-add {
    grid-template-columns: minmax(0, 1fr);
  }
}
.aucra-share-said,
.aucra-warn-line {
  border-left: 3px solid var(--warn);
  background: var(--warn-wash);
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 13px;
  color: var(--text);
}
/* A change that went through is said in the positive style; the warning one
   stays for a refusal (fix pass C 5). */
.aucra-share-said.aucra-share-said-done {
  border-left-color: var(--pass);
  background: var(--pass-wash);
}
.aucra-share-foot {
  padding: 12px 18px;
  border-top: 1px solid var(--line);
}

/* ---- kit/locked.py's notice, and the Accounts page drawn locked ---- */
.aucra-locked-notice {
  width: 440px;
  max-width: calc(100vw - 32px);
}
.aucra-locked-icon {
  color: var(--muted);
  font-size: 18px;
}
.aucra-locked-ask {
  padding-left: 26px;
}
.aucra-locked-ask.aucra-locked-alone {
  padding-left: 0;
}

/* ---- ui/sidebar_accounts.py ---- */
button.aucra-nav-locked {
  position: relative;
  display: flex;
  align-items: center;
  align-self: stretch;
  gap: 14px;
  height: 36px;
  margin: 2px 10px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: none;
  color: #aab4bd;
  font: inherit;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
}
button.aucra-nav-locked:hover {
  background: rgba(255, 255, 255, 0.06);
}
button.aucra-nav-locked:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.aucra-nav-locked .nav-label {
  flex: 1 1 auto;
}
.aucra-nav-lock.q-icon {
  font-size: 15px;
  color: var(--rail-muted);
}
.aucra-collapsed button.aucra-nav-locked {
  padding: 0;
  gap: 0;
  justify-content: center;
}
.aucra-collapsed .aucra-nav-lock {
  display: none;
}
button.aucra-menu-locked {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
  text-align: left;
}
.aucra-menu-lock.q-icon {
  font-size: 15px;
  color: var(--muted);
}

/* ---- ui/read_only_line.py ---- */
.aucra-read-only-ask {
  color: var(--muted);
  font-size: 13.5px;
}

/* ---- ui/pages/home.py, home_rows.py, home_remove.py ---- */
.aucra-create-line {
  padding: 0 16px 14px;
  font-size: 12.5px;
  color: var(--muted);
}
.aucra-dashboard-row .aucra-row-owner {
  flex: 0 1 220px;
  min-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12.5px;
  color: var(--muted);
}
.aucra-dashboard-row .aucra-row-access {
  flex: 0 0 64px;
  font-size: 12.5px;
  font-weight: 500;
}
.aucra-dashboard-row .aucra-bar-row {
  flex: 0 1 auto;
}
.aucra-dashboard-row .aucra-bar-text {
  flex: 0 1 220px;
  min-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aucra-row-delete-slot {
  display: inline-flex;
}
.aucra-row-delete-locked .q-icon {
  font-size: 18px;
  color: var(--muted);
}
/* A row's Share (fix pass C 6), beside Remove and drawn as quietly. */
.aucra-row-share-slot {
  display: inline-flex;
}
.aucra-row-share.q-btn {
  flex: 0 0 auto;
  color: var(--muted);
}
.aucra-row-share.q-btn:hover {
  color: var(--text);
}
.q-btn.aucra-row-share:focus-visible {
  box-shadow: 0 0 0 2px var(--focus-ring);
}
.aucra-row-share .q-focus-helper {
  display: none;
}

/* ---- ui/pages/accounts.py and its parts ---- */
.aucra-company-require {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 16px;
  padding: 12px 18px;
}
.aucra-company-require-name {
  font-size: 14px;
  font-weight: 500;
}
.aucra-company-require-help {
  font-size: 12.5px;
  color: var(--muted);
}
.aucra-choice-form {
  width: auto;
}
.aucra-choice-pair {
  display: inline-flex;
  border: 1px solid var(--line-control);
  border-radius: 8px;
  overflow: hidden;
}
.aucra-choice-pair .q-btn.aucra-choice {
  border-radius: 0;
  background: var(--panel);
  color: var(--text);
  padding: 4px 14px;
  min-height: 30px;
}
.aucra-choice-pair .q-btn.aucra-choice-on {
  background: var(--gold-wash);
  box-shadow: inset 0 0 0 1px var(--gold);
  font-weight: 600;
}
.aucra-add-account {
  padding: 0;
}
.aucra-add-account .aucra-add-foot {
  grid-column: 1 / -1;
}
.aucra-role-help,
.aucra-add-line {
  font-size: 12.5px;
  color: var(--muted);
}
.aucra-accounts .aucra-account-row {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 14px 18px;
}
/* The row is a column here, so pages.css's `flex: 1 1 18rem` for the facts
   would be a height of 18rem; every child of the row takes its own height. */
.aucra-accounts .aucra-account-row > * {
  flex: none;
}
.aucra-accounts .aucra-account-facts {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px 90px 100px 120px;
  align-items: center;
  gap: 8px 14px;
}
@media (max-width: 900px) {
  .aucra-accounts .aucra-account-facts {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}
.aucra-account-name {
  font-size: 14px;
  font-weight: 600;
}
.aucra-account-email {
  font-size: 12px;
  color: var(--muted);
  overflow-wrap: anywhere;
}
.aucra-account-role {
  font-size: 13.5px;
  font-weight: 500;
}
.aucra-account-role-form {
  width: auto;
}
.aucra-account-status,
.aucra-account-spaces,
.aucra-account-added {
  font-size: 12.5px;
}
.aucra-account-spaces,
.aucra-account-added {
  color: var(--muted);
}
.aucra-two-step,
.aucra-deactivated {
  justify-self: start;
  border-radius: 999px;
  padding: 1px 9px;
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}
.aucra-two-step-on {
  background: var(--pass-wash);
  color: var(--pass);
  border: 1px solid var(--pass);
}
.aucra-two-step-off {
  background: var(--wash-head);
  color: var(--muted);
  border: 1px solid var(--line-strong);
}
.aucra-deactivated {
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  border: 1px solid var(--line-strong);
}
.aucra-account-gone .aucra-account-facts,
.aucra-account-gone .aucra-account-spaces {
  opacity: 0.7;
}
.aucra-account-ask {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--wash-head);
  border: 1px solid var(--line);
}
.aucra-account-question {
  font-size: 13px;
  flex: 1 1 100%;
}
.aucra-account-group,
.aucra-company-loose {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 12px 18px 8px;
  border-top: 1px solid var(--line);
  box-shadow: inset 3px 0 0 var(--gold);
}
.aucra-account-group-name {
  font-size: 13px;
  font-weight: 600;
}
.aucra-account-group-count {
  font-size: 12.5px;
  color: var(--muted);
}
.aucra-company-add {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  padding: 14px 18px;
}
.aucra-company-add .aucra-field {
  flex: 1 1 16rem;
}
.aucra-company-table {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 140px 110px 130px 96px 110px 84px;
  align-items: center;
  gap: 10px 12px;
  padding: 8px 18px 12px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
@media (max-width: 1000px) {
  .aucra-company-table {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .aucra-company-head {
    display: none;
  }
}
.aucra-company-head {
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
}
.aucra-company-name {
  font-size: 14px;
  font-weight: 500;
}
.aucra-company-key {
  font-size: 12px;
}
.aucra-company-key-none {
  color: var(--placeholder);
}
.aucra-company-rename {
  grid-column: 1 / -1;
}
.aucra-company-rename .aucra-company-add {
  padding: 0;
}
.aucra-company-space,
.aucra-outside-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 14px;
  padding: 10px 18px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.aucra-company-space-name,
.aucra-outside-space {
  font-weight: 500;
}
.aucra-company-give {
  width: auto;
}
.aucra-outside-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 200px 80px minmax(0, 280px);
}
@media (max-width: 900px) {
  .aucra-outside-row {
    grid-template-columns: minmax(0, 1fr);
  }
}
.aucra-outside-by {
  font-size: 12px;
  color: var(--muted);
}
.aucra-activity-line {
  padding: 9px 18px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}