/* Oneway Broadcasting Network brand, matched to onewaytv.com. Colors are here; the logo
   mark is /logo.svg (and /obn-mark.png), the full logo /obn-logo-white.png and /obn-logo.png.
   The --brand-gold names are kept for compatibility; they now hold the logo red. */
@font-face { font-family: "Playfair Display"; src: url(/fonts/playfair.woff2) format("woff2"); font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url(/fonts/playfair-italic.woff2) format("woff2"); font-weight: 400 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter"; src: url(/fonts/inter.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  --brand-navy: #050508;
  --brand-ink: #050508;
  --brand-blue: #4361ee;
  --brand-blue-hover: #3651d4;
  --brand-sky: #7ba3ff;
  --brand-gold: #e8344a;
  --brand-gold-hover: #ff4d63;
  --brand-gold-soft: #f7941d;
  --brand-glow: 0 0 0 1px rgba(232, 52, 74, .35), 0 10px 40px -8px rgba(232, 52, 74, .45);
  --brand-gradient: linear-gradient(135deg, #f7941d 0%, #e8344a 45%, #a42fd1 100%);
  --brand-gradient-blue: linear-gradient(135deg, #7ba3ff 0%, #4361ee 50%, #2f45c8 100%);
  --font-display: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --brand-red: #e8344a;
  --brand-orange: #f7941d;
  --brand-purple: #a42fd1;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ease-out: cubic-bezier(.16, 1, .3, 1);

  /* Zoom-style pages: OBN orange for "New meeting", OBN blue for everything else */
  --orange: var(--brand-orange);
  --orange-hover: #e2820f;
  /* Shared */
  --blue: var(--brand-blue);
  --blue-hover: var(--brand-blue-hover);
}

.brand-logo { width: 32px; height: 32px; display: block; object-fit: contain; }
.brand-mark { display: flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }
.brand-mark .brand-logo { width: 30px; height: 30px; filter: drop-shadow(0 8px 22px rgba(67, 97, 238, .45)); }
.brand-mark.large { justify-content: center; font-size: 20px; }
.brand-mark.large .brand-logo { width: 52px; height: 52px; }

/* Shared animated backdrop: add <div class="obn-aurora" aria-hidden="true"></div> as the first child of body. */
.obn-aurora { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; background: radial-gradient(1200px 700px at 15% -10%, #1b2250 0%, transparent 60%), radial-gradient(900px 600px at 100% 10%, #3a0d1c 0%, transparent 55%), var(--brand-ink); }
.obn-aurora::before, .obn-aurora::after { content: ""; position: absolute; width: 70vmax; height: 70vmax; border-radius: 50%; opacity: .45; } /* still: a moving blurred backdrop slows phones and laptops */
.obn-aurora::before { left: -20vmax; top: -25vmax; background: radial-gradient(circle, #4361ee 0%, transparent 65%); }
.obn-aurora::after { right: -25vmax; bottom: -35vmax; background: radial-gradient(circle, #e8344a 0%, transparent 60%); opacity: .22; }
@keyframes obn-drift { to { transform: translate(8vmax, 6vmax) scale(1.15); } }
@media (prefers-reduced-motion: reduce) { .obn-aurora::before, .obn-aurora::after { animation: none; } }

.obn-em { font-style: italic; background: var(--brand-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; }

/* Phones with a notch / Dynamic Island (and the OBN Meetings app): keep bars clear of the status bar. */
html body .w-nav { padding-top: max(14px, env(safe-area-inset-top)); }
html body .nav { height: auto; min-height: 66px; padding-top: env(safe-area-inset-top); }
html body .m-top { height: calc(52px + env(safe-area-inset-top)); padding-top: env(safe-area-inset-top); }
.prejoin, .waiting, .ended { padding-top: max(24px, env(safe-area-inset-top)); }

/* Oneway TV logo in place of the long name */
.brand-full { display: block; height: 44px; width: auto; }
.brand-mark.large .brand-full { height: 64px; margin: 0 auto; }
.m-left .brand-mark .brand-full { height: 24px; }

/* People who ask their device for less motion get none. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Dropdowns: one clean chevron instead of each browser's own arrow. */
select:not([multiple]):not([size]) {
  -webkit-appearance: none !important; appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b93a1' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 12px center !important; background-size: 14px 14px !important;
  padding-right: 34px !important; text-overflow: ellipsis; cursor: pointer;
}
select:not([multiple]):not([size]):hover { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c3c8d2' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important; }
select::-ms-expand { display: none; }