.mathematics-webex {
  --mw-border: #d9dee8;
  --mw-bg: #ffffff;
  --mw-stage-bg: #10131a;
  --mw-text: #1f2937;
  --mw-muted: #667085;
  --mw-primary: #157347;
  --mw-danger: #b42318;
  --mw-radius: 9px;
  box-sizing: border-box;
  width: 100%;
  color: var(--mw-text);
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
}

.mathematics-webex *,
.mathematics-webex *::before,
.mathematics-webex *::after { box-sizing: border-box; }

.mathematics-webex__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--mw-border);
}

.mathematics-webex__title { margin: 0 0 4px; font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.25; }
.mathematics-webex__identity,
.mathematics-webex__privacy { margin: 0; color: var(--mw-muted); font-size: 0.92rem; }

.mathematics-webex__status {
  flex: 0 0 auto;
  max-width: 45%;
  padding: 8px 12px;
  border-radius: 9px;
  background: #f2f4f7;
  font-size: 0.88rem;
  font-weight: 600;
  text-align: center;
}
.mathematics-webex__status[data-state="connected"] { background: #ecfdf3; color: #067647; }
.mathematics-webex__status[data-state="waiting"],
.mathematics-webex__status[data-state="working"] { background: #fffaeb; color: #b54708; }
.mathematics-webex__status[data-state="error"] { background: #fef3f2; color: #b42318; }

.mathematics-webex__admin-notice { padding: 10px 20px; background: #fffaeb; color: #b54708; border-bottom: 1px solid #fedf89; }
.mathematics-webex__player { width: 100%; background: #fff; }

.mathematics-webex__stage {
  position: relative;
  width: 100%;
  min-height: 420px;
  aspect-ratio: 16 / 9;
  background: var(--mw-stage-bg);
  overflow: hidden;
}

.mathematics-webex__remote-video,
.mathematics-webex__remote-share {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: var(--mw-stage-bg);
}

.mathematics-webex__empty-stage[hidden] { display: none !important; }
.mathematics-webex__empty-stage {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  color: #eaecf0;
  text-align: center;
  font-size: 1rem;
}

.mathematics-webex__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 16px 20px;
  border-top: 1px solid var(--mw-border);
  background: #fff;
}

.mathematics-webex__button {
  appearance: none;
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid #98a2b3;
  border-radius: 9px;
  background: #ffffff;
  color: #344054;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.mathematics-webex__button:hover:not(:disabled) { background: #f9fafb; }
.mathematics-webex__button:focus-visible { outline: 3px solid rgba(21, 115, 71, 0.28); outline-offset: 2px; }
.mathematics-webex__button:disabled { cursor: not-allowed; opacity: 0.6; }
.mathematics-webex__button--microphone.is-muted { border-color: #f04438; color: #b42318; background: #fef3f2; }
.mathematics-webex__button--raise-hand.is-raised { border-color: #2f6fed; color: #1f57c3; background: #eef4ff; }

.mathematics-webex__reactions-control {
  position: relative;
  display: inline-flex;
}

.mathematics-webex__reactions-menu[hidden] { display: none !important; }
.mathematics-webex__reactions-menu {
  position: absolute;
  z-index: 20;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
  display: grid;
  grid-template-columns: repeat(5, 44px);
  gap: 6px;
  padding: 10px;
  border: 1px solid var(--mw-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(16, 24, 40, 0.18);
}
.mathematics-webex__reactions-menu::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -7px;
  width: 12px;
  height: 12px;
  transform: translateX(-50%) rotate(45deg);
  border-right: 1px solid var(--mw-border);
  border-bottom: 1px solid var(--mw-border);
  background: #fff;
}
.mathematics-webex__reactions-menu button {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}
.mathematics-webex__reactions-menu button:hover,
.mathematics-webex__reactions-menu button:focus-visible { background: #f2f4f7; outline: none; }
.mathematics-webex__button--leave { border-color: var(--mw-danger); background: var(--mw-danger); color: #fff; }
.mathematics-webex__button--leave:hover:not(:disabled) { background: #912018; }

.mathematics-webex__warning,
.mathematics-webex__error { margin: 0 20px 16px; padding: 12px 14px; border-radius: 8px; overflow-wrap: anywhere; }
.mathematics-webex__warning { border: 1px solid #fedf89; background: #fffaeb; color: #b54708; }
.mathematics-webex__error { border: 1px solid #fecdca; background: #fef3f2; color: #b42318; }
.mathematics-webex__privacy { padding: 0 20px 18px; text-align: center; }

.mathematics-webex-access-message {
  padding: 22px 20px;
  background: transparent;
  text-align: center;
}
.mathematics-webex-access-message p { margin: 0 0 16px; }
.mathematics-webex-access-denied { color: #b42318; }
.mathematics-webex-access-closed { color: #b54708; }
.mathematics-webex--access .mathematics-webex__header { padding-bottom: 16px; }
.mathematics-webex-access-message .btn { min-width: 118px; }

.mathematics-webex__player:fullscreen,
.mathematics-webex__player:-webkit-full-screen {
  display: flex;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  background: #000;
}
.mathematics-webex__player:fullscreen .mathematics-webex__stage,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__stage {
  flex: 1 1 auto;
  min-height: 0;
  height: calc(100vh - 76px);
  aspect-ratio: auto;
}
.mathematics-webex__player:fullscreen .mathematics-webex__actions,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__actions {
  flex: 0 0 auto;
  border-top-color: #333;
  background: #111;
}
.mathematics-webex__player:fullscreen .mathematics-webex__button:not(.mathematics-webex__button--leave),
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__button:not(.mathematics-webex__button--leave) {
  border-color: #777;
  background: #222;
  color: #fff;
}
.mathematics-webex__player:fullscreen .mathematics-webex__button--microphone.is-muted,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__button--microphone.is-muted { background: #4a1714; border-color: #f04438; }
.mathematics-webex__player:fullscreen .mathematics-webex__button--raise-hand.is-raised,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__button--raise-hand.is-raised { background: #183c75; border-color: #6ea0ff; color: #fff; }
.mathematics-webex__player:fullscreen .mathematics-webex__reactions-menu,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__reactions-menu { background: #222; border-color: #555; }
.mathematics-webex__player:fullscreen .mathematics-webex__reactions-menu::after,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__reactions-menu::after { background: #222; border-color: #555; }
.mathematics-webex__player:fullscreen .mathematics-webex__reactions-menu button:hover,
.mathematics-webex__player:fullscreen .mathematics-webex__reactions-menu button:focus-visible,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__reactions-menu button:hover,
.mathematics-webex__player:-webkit-full-screen .mathematics-webex__reactions-menu button:focus-visible { background: #333; }

@media (max-width: 767px) {
  .mathematics-webex__header { align-items: flex-start; flex-direction: column; }
  .mathematics-webex__status { max-width: none; text-align: left; }
  .mathematics-webex__stage { min-height: 260px; aspect-ratio: 4 / 3; }
  .mathematics-webex__actions { align-items: stretch; flex-direction: column; }
  .mathematics-webex__button { width: 100%; }
  .mathematics-webex__reactions-control { width: 100%; }
  .mathematics-webex__reactions-control .mathematics-webex__button { width: 100%; }
  .mathematics-webex__reactions-menu { grid-template-columns: repeat(5, 42px); bottom: calc(100% + 8px); }
  .mathematics-webex__reactions-menu button { width: 42px; height: 42px; }
  .mathematics-webex__player:fullscreen .mathematics-webex__actions,
  .mathematics-webex__player:-webkit-full-screen .mathematics-webex__actions { flex-direction: row; padding: 8px; }
  .mathematics-webex__player:fullscreen .mathematics-webex__button,
  .mathematics-webex__player:-webkit-full-screen .mathematics-webex__button { width: auto; flex: 1 1 auto; padding: 8px; font-size: 0.86rem; }
  .mathematics-webex__player:fullscreen .mathematics-webex__reactions-control,
  .mathematics-webex__player:-webkit-full-screen .mathematics-webex__reactions-control { width: auto; flex: 1 1 auto; }
  .mathematics-webex__player:fullscreen .mathematics-webex__reactions-control .mathematics-webex__button,
  .mathematics-webex__player:-webkit-full-screen .mathematics-webex__reactions-control .mathematics-webex__button { width: 100%; }
}


/* 1.0.14: modern inline control icons + centred classroom messages */
.mathematics-webex__button,
.mathematics-webex [data-webex-join] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  text-align: center;
  line-height: 1.2;
}

.mathematics-webex__button::before,
.mathematics-webex [data-webex-join]::before {
  content: '';
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  background-color: currentColor;
  -webkit-mask: var(--mw-button-icon) center / contain no-repeat;
  mask: var(--mw-button-icon) center / contain no-repeat;
}

/* Log in / enter classroom */
.mathematics-webex [data-webex-join] {
  --mw-button-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpolyline points='10 17 15 12 10 7'/%3E%3Cline x1='15' y1='12' x2='3' y2='12'/%3E%3C/svg%3E");
}

/* Microphone */
.mathematics-webex [data-webex-microphone] {
  --mw-button-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2' width='6' height='12' rx='3'/%3E%3Cpath d='M5 10a7 7 0 0 0 14 0'/%3E%3Cline x1='12' y1='17' x2='12' y2='22'/%3E%3Cline x1='8' y1='22' x2='16' y2='22'/%3E%3C/svg%3E");
}
.mathematics-webex [data-webex-microphone].is-muted {
  --mw-button-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3Cpath d='M9 9v1a3 3 0 0 0 5.1 2.1M15 6V5a3 3 0 0 0-5.6-1.5'/%3E%3Cpath d='M17.7 17.7A7 7 0 0 1 5 13v-3M19 10v2a7 7 0 0 1-.5 2.6'/%3E%3Cline x1='12' y1='19' x2='12' y2='22'/%3E%3Cline x1='8' y1='22' x2='16' y2='22'/%3E%3C/svg%3E");
}

/* Raise / lower hand */
.mathematics-webex [data-webex-raise-hand] {
  --mw-button-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 11V6a2 2 0 0 0-4 0v4'/%3E%3Cpath d='M14 10V4a2 2 0 0 0-4 0v6'/%3E%3Cpath d='M10 10V5a2 2 0 0 0-4 0v8'/%3E%3Cpath d='M6 10.5a2 2 0 0 0-4 0V14c0 4.4 3.6 8 8 8h2c5 0 9-4 9-9v-2a2 2 0 0 0-4 0v1'/%3E%3C/svg%3E");
}

/* Reactions */
.mathematics-webex [data-webex-reactions] {
  --mw-button-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='9' y1='9' x2='9.01' y2='9'/%3E%3Cline x1='15' y1='9' x2='15.01' y2='9'/%3E%3Cpath d='M8.5 14.5a5 5 0 0 0 7 0'/%3E%3C/svg%3E");
}

/* Fullscreen */
.mathematics-webex [data-webex-fullscreen] {
  --mw-button-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='8 3 3 3 3 8'/%3E%3Cline x1='3' y1='3' x2='9' y2='9'/%3E%3Cpolyline points='16 3 21 3 21 8'/%3E%3Cline x1='21' y1='3' x2='15' y2='9'/%3E%3Cpolyline points='8 21 3 21 3 16'/%3E%3Cline x1='3' y1='21' x2='9' y2='15'/%3E%3Cpolyline points='16 21 21 21 21 16'/%3E%3Cline x1='21' y1='21' x2='15' y2='15'/%3E%3C/svg%3E");
}

/* Leave classroom */
.mathematics-webex [data-webex-leave] {
  --mw-button-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17l5-5-5-5'/%3E%3Cpath d='M15 12H3'/%3E%3Cpath d='M14 3h5a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-5'/%3E%3C/svg%3E");
}

/* Keep informational text visually centred at every screen size. */
.mathematics-webex__status,
.mathematics-webex__admin-notice,
.mathematics-webex__warning,
.mathematics-webex__error,
.mathematics-webex__privacy,
.mathematics-webex__empty-stage,
.mathematics-webex-access-message {
  text-align: center;
}

@media (max-width: 767px) {
  .mathematics-webex__status { text-align: center; }
}


/* 1.0.15: the initial Join button uses the site theme's native Bootstrap primary button.
   Keep only plugin-specific sizing/icon behaviour and do not override .btn-primary colours. */
.mathematics-webex [data-webex-join].btn.btn-primary {
  min-height: 44px;
  padding: 10px 18px;
  font-weight: 650;
  cursor: pointer;
}
.mathematics-webex [data-webex-join].btn.btn-primary:disabled {
  cursor: not-allowed;
}
