/*
 * Open-in-browser block, partial open-in-browser.php. Shown by the in-app
 * detector in place of a gesture the browser of an application cannot perform
 * (print, file download, calendar file). Same dashed plate, field and quiet
 * button as the waiting room of the video consultation, which draws it too.
 * Only the token layer is read, so the block follows the widget, the customer
 * area and the waiting room alike; each surface places it in its own sheet.
 */
.oubkw-open-browser {
  margin: 0;
  padding: 14px;
  border: 1px dashed var(--oubkw-bg-dark, #E8E0D8);
  border-radius: 12px;
  background: var(--oubkw-bg-mid, #F5EFE7);
  color: var(--oubkw-text, #2C1F14);
  font-size: .92rem;
  line-height: 1.55;
  text-align: justify;
}
.oubkw-open-browser p { margin: 0 0 10px; }
.oubkw-open-browser .oubkw-open-browser-title { display: block; font-weight: 600; }
.oubkw-open-browser .oubkw-open-browser-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; }
/* 16px and not the .92rem of the text: below 16px iOS zooms the page on the
   first touch, and this block is read on a phone first. */
.oubkw-open-browser .oubkw-open-browser-url {
  font: inherit;
  font-size: 16px;
  flex: 1 1 200px;
  min-width: 0;
  min-height: 44px;
  padding: 8px 10px;
  border-radius: 9px;
  border: 1px solid var(--oubkw-bg-dark, #E8E0D8);
  background: var(--oubkw-card-bg, #fff);
  color: var(--oubkw-text, #2C1F14);
  text-align: left;
}
.oubkw-open-browser .oubkw-open-browser-copy {
  font: inherit;
  font-size: .88rem;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 9px 14px;
  border-radius: 10px;
  border: 1px solid var(--oubkw-bg-dark, #E8E0D8);
  background: transparent;
  color: var(--oubkw-text, #2C1F14);
  cursor: pointer;
}
@media (hover: hover) {
  .oubkw-open-browser .oubkw-open-browser-copy:hover { background: var(--oubkw-background-soft, rgba(44, 31, 20, .035)); }
}
.oubkw-open-browser .oubkw-open-browser-copy:focus-visible,
.oubkw-open-browser .oubkw-open-browser-url:focus-visible {
  outline: 2px solid var(--oubkw-primary-ui, #C4705A);
  outline-offset: 2px;
}