/* =============================================================================
 * ODKAZ V POLI S ROZUMEM (coral-odkaz.js), základní vzhled.
 *
 * Vrstva přebírá písmo, barvu a odsazení pole sama; tady je jen stavba pod
 * :where(), ať ji web přebije bez boje o specifičnost. Proměnné:
 *   --coral-odkaz-sluzba  průhlednost názvu služby nebo domény (výchozí 0.68)
 *   --coral-odkaz-oddel   průhlednost oddělovače · a › (výchozí 0.45)
 * Světlina 182.
 * ============================================================================= */

/* Obyčejný delší text v jednořádkovém poli končí mimo fokus třemi tečkami,
   ne useknutým písmenem; po kliknutí je vidět celý. */
:where(input[type="text"], input[type="url"], input[type="search"], input:not([type])):where(:not(:focus)) {
  text-overflow: ellipsis;
}

/* Pole s náhledem: vlastní text je schovaný pod vrstvou, místo i kurzor zůstávají. */
.coral-odkaz-pole {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

:where(.coral-odkaz) {
  position: absolute;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  margin: 0;
  border: 0;
  background: none;
  overflow: hidden;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}
.coral-odkaz[hidden] { display: none !important; }

:where(.coral-odkaz__radek) { display: flex; align-items: baseline; min-width: 0; max-width: 100%; overflow: hidden; }
:where(.coral-odkaz__radek > [hidden]) { display: none; }
:where(.coral-odkaz__sluzba) {
  flex: 0 0 auto;
  max-width: 62%;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: var(--coral-odkaz-sluzba, 0.68);
}
/* Doména bez názvu za sebou (odkaz jen s parametry) má celou šířku pole,
   strop 62 % drží místo jen pro název. Světlina 447. */
:where(.coral-odkaz--jen-sluzba .coral-odkaz__sluzba) { max-width: 100%; }
:where(.coral-odkaz__oddel) { flex: 0 0 auto; margin: 0 0.42em; opacity: var(--coral-odkaz-oddel, 0.45); }
:where(.coral-odkaz__nazev) { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* U videa malý trojúhelník přehrávání před službou, kreslený barvou textu. */
:where(.coral-odkaz--video .coral-odkaz__sluzba)::before {
  content: '';
  display: inline-block;
  width: 0.58em;
  height: 0.66em;
  margin-right: 0.42em;
  background: currentColor;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}