/* ==========================================================================
   styles.css  —  Common stylesheet for all panels
   (Operator · Reviewer · Organiser · Speaker · Sponsor · Viewer · Admin login pages)
   Admin panel component styles → admin-style.css
   ========================================================================== */


/* ==========================================================================
   1. CSS Variables
   ========================================================================== */
:root {
  --primary-blue: #fd1d3d;
  --accent-red:   #fd1d3d;
}

a { cursor: pointer; }


/* ==========================================================================
   2. Layout — Content Offset & Sticky Footer
   ========================================================================== */

/* Fixed top nav — push content below navbar (header min-height is 52px) */
.wrapper .content-wrapper { margin-top: 56px; }

/* Sticky footer for layout-top-nav pages */
body.layout-top-nav .wrapper { display: flex; flex-direction: column; min-height: 100vh; }
body.layout-top-nav .wrapper > .content-wrapper,
body.layout-top-nav .wrapper > .app-content { flex: 1 0 auto; }
body.layout-top-nav .wrapper > .app-footer   { flex-shrink: 0; }


/* ==========================================================================
   4. Utility Color Classes
   ========================================================================== */
.bg-custom-blue   { background-color: var(--primary-blue) !important; color: #fff; }
.bg-custom-red    { background-color: var(--accent-red)   !important; color: #fff; }
.text-custom-blue { color: var(--primary-blue) !important; }
.text-custom-red  { color: var(--accent-red)   !important; }

.btn-custom-blue       { background-color: var(--primary-blue); color: #fff; border: none; }
.btn-custom-blue:hover { background-color: #d4182f; color: #fff; }

.bgLight { background: rgb(242 242 242 / 65%); }


/* ==========================================================================
   5. Sidebar — Active / Hover  (Operator & Reviewer share blue)
   ========================================================================== */
[data-bs-theme="light"].app-sidebar .nav-link.active   { background-color: var(--primary-blue) !important; color: #fff !important; }
[data-bs-theme="light"].app-sidebar .nav-link.active i { color: #fff !important; }
/* a red count on the red (current) item could not be read: there it is white with red figures */
.app-sidebar .nav-link.active .badge.bg-danger { background-color: #fff !important; color: #d2122f !important; }
.app-sidebar .nav-link:hover { background-color: rgba(253, 29, 61, .1); color: var(--primary-blue); }

.brand-link .brand-text   { color: #000; }
.brand-link .brand-text b { color: var(--accent-red); font-weight: 600; }


/* ==========================================================================
   6. Dropdown
   ========================================================================== */
.dropdown-toggle::before { display: none !important; }
.dropdown-toggle::after  { display: none !important; }
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
  background-color: #fff0f2 !important;
  color: #fd1d3d !important;
}
.dropdown-item { font-size: 14px; color: rgb(33 37 41 / 78%); }

/* Profile pill — shade only while hovering; no stuck blue focus ring */
.app-header .nav-link:focus,
.app-header .nav-link:focus-visible,
.user-profile-trigger:focus,
.user-profile-trigger:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
.user-profile-trigger {
  border-radius: 10px;
  transition: background-color .15s ease, box-shadow .15s ease;
}
.user-profile-trigger:hover,
.user-profile-nav:hover > .user-profile-trigger,
.user-profile-nav.show > .user-profile-trigger {
  background-color: #fff0f2 !important;
  box-shadow: 0 0 0 2px rgba(253, 29, 61, 0.28) !important;
}
.user-profile-nav:not(:hover):not(.show) > .user-profile-trigger {
  background-color: transparent !important;
  box-shadow: none !important;
}


/* ==========================================================================
   7. Forms — Floating Custom Label  (shared across all panels)
   ========================================================================== */
.form-floating-custom { position: relative; margin-bottom: 38px; }

.form-floating-custom .form-control,
.form-floating-custom .form-select,
.form-floating-custom textarea {
  height:           48px;
  border-radius:    8px;
  border:           1.5px solid #ced4da;
  padding:          10px 12px 6px;
  background-color: #fff;
  box-shadow:       none;
  color:            #303030 !important;
}

.form-floating-custom textarea        { height: auto; min-height: 100px; }
.form-floating-custom select.form-control,
.form-floating-custom .form-select    { padding-right: 2.25rem; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }

.form-floating-custom label {
  position:    absolute;
  top:         -8px;
  left:        12px;
  font-size:   12px;
  padding:     0 6px;
  background:  #fff;
  color:       #333;
  font-weight: 500;
  z-index:     1;
}

.form-floating-custom .form-control:focus,
.form-floating-custom .form-select:focus,
.form-floating-custom textarea:focus  { border-color: #000; box-shadow: none; }

.form-floating-custom .form-control:focus + label,
.form-floating-custom .form-select:focus + label,
.form-floating-custom textarea:focus + label { color: #000; }

.form-floating-custom .invalid-feedback { position: absolute; bottom: -18px; left: 0; width: 100%; font-size: 12px; color: #dc3545; }

/* file fields (every one, with or without .file-input): the "Choose file" button sits inside the box — rounded, a little
   room around it, below the floating label — not Bootstrap's edge-to-edge block */
.form-floating-custom .file-input,
.form-floating-custom input[type="file"].form-control { height: auto; min-height: 48px; padding: 11px 10px 7px 10px; cursor: pointer; line-height: 1.6; }
.form-floating-custom .file-input::file-selector-button,
.form-floating-custom input[type="file"].form-control::file-selector-button {
  border: none; background: var(--primary-blue) !important; color: #fff; font-weight: 600;
  padding: 5px 14px; border-radius: 6px; margin: 0 12px 0 0; cursor: pointer; font-size: 13px; transition: background-color .15s;
}
.form-floating-custom input[type="file"]::file-selector-button:hover { background-color: #d2122f !important; }

.form-floating-custom .form-control:disabled,
.form-floating-custom .form-select:disabled,
.form-floating-custom textarea:disabled { background-color: #f5f5f5; border-color: #ddd; color: #888; cursor: not-allowed; opacity: 1; }
.form-floating-custom input[type="file"]:disabled::file-selector-button { background: #ccc !important; cursor: not-allowed; }

.dark-floating-custom label,
.dark-floating-custom input { background: #f5f5f5 !important; }
.dark-floating-custom input { height: auto !important; }

.required-label::after { content: " *"; color: #dc3545; font-weight: 600; }

/* Autofill override */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-box-shadow:      0 0 0 1000px #fff inset !important;
  box-shadow:              0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color: #000 !important;
  transition:              background-color 5000s ease-in-out 0s;
  font-size:               14px;
}

/* Remove number spinners */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }

.form-select               { font-size: 14px; }
.form-control::placeholder { color: #6c757d; }
.form-control.form-select  { color: #6c757d; font-size: 14px; }
.eventFMC .form-floating-custom { margin-bottom: 25px; }

/* Keep field + inline button aligned when in a flex/grid row */
.row.align-items-center .form-floating-custom,
.d-flex.align-items-center .form-floating-custom { margin-bottom: 0; }

/* Button height matches .form-floating-custom (48px) */
.btn-field-h { height: 48px; display: inline-flex; align-items: center; justify-content: center; }

/* Viewer dashboard filter card */
.viewer-filter-card {
  border: 1px solid #e8edf3;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
  overflow: hidden;
}
.viewer-filter-form{margin-bottom: 0;}
.viewer-filter-card .card-body {
  /* Top slightly tighter so floating labels don't make top look larger than bottom */
  padding: 18px 18px 18px !important;
}
.viewer-filter-form .form-floating-custom {
  margin-bottom: 0 !important;
}
.viewer-filter-form .row {
  --bs-gutter-x: 0.85rem;
  --bs-gutter-y: 0.85rem;
}
.viewer-filter-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 48px;
}
.viewer-filter-actions .btn {
  width: 48px;
  height: 48px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  flex-shrink: 0;
}
/* Reset matches Search: solid red tile + white icon */
.viewer-filter-actions .btn-outline-primary,
.viewer-filter-actions .btn-outline-primary:hover,
.viewer-filter-actions .btn-outline-primary:focus,
.viewer-filter-actions .btn-outline-primary:active,
.card button[type="reset"].btn-outline-primary,
.card button[type="reset"].btn-outline-primary:hover,
.card button[type="reset"].btn-outline-primary:focus,
.card button[type="reset"].btn-outline-primary:active {
  background: #fd1d3d !important;
  border-color: #fd1d3d !important;
  color: #fff !important;
  box-shadow: none !important;
}
.viewer-filter-actions .btn-outline-primary:hover,
.card button[type="reset"].btn-outline-primary:hover {
  background: #d90404 !important;
  border-color: #d90404 !important;
}
.card button[type="reset"].btn-outline-primary {
  width: 48px;
  height: 48px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
@media (max-width: 767.98px) {
  .viewer-filter-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

.viewer-sticky-sentinel {
  height: 1px;
  width: 100%;
  margin: 0;
  padding: 0;
  pointer-events: none;
  visibility: hidden;
}
.viewer-dashboard {
  --viewer-nav-offset: 56px;
  --viewer-sticky-bar-h: 58px;
}
.viewer-sticky-bar {
  position: sticky;
  top: var(--viewer-nav-offset);
  z-index: 1025;
  background: transparent;
  padding-top: 4px;
  padding-bottom: 0;
  margin-bottom: 12px;
  border-bottom: 1px solid transparent;
  box-shadow: none;
  transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.viewer-sticky-bar.is-stuck {
  background: #ffffff;
  border-bottom-color: #e8edf3;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
}
.viewer-sticky-bar .nav-pills {
  margin-bottom: 0 !important;
  border-bottom: none !important;
}
.viewer-dashboard .nav-pills .nav-link {
  color: #334155 !important;
  font-weight: 600;
  font-size: 14px !important;
  padding: 10px 16px !important;
  background: transparent !important;
  opacity: 1 !important;
}
.viewer-dashboard .nav-pills .nav-link i {
  color: inherit !important;
}
.viewer-dashboard .nav-pills .nav-link:hover {
  color: #fd1d3d !important;
  background: rgba(253, 29, 61, 0.06) !important;
}
.viewer-dashboard .nav-pills .nav-link.active {
  color: #fd1d3d !important;
  border-bottom: 3px solid #fd1d3d !important;
  background: transparent !important;
}
.viewer-dashboard .nav-pills .nav-link .badge {
  font-size: 11px;
  vertical-align: middle;
}
/* My Contribution cards — stronger contrast */
.viewer-dashboard #MyContribution .card h6 {
  color: #0f172a;
  font-size: 1.05rem;
}
.viewer-dashboard #MyContribution .card .text-muted,
.viewer-dashboard #MyContribution .card .small {
  color: #475569 !important;
  font-size: 0.875rem !important;
}
.viewer-dashboard #MyContribution .card p.text-muted {
  color: #334155 !important;
  font-size: 0.92rem !important;
  line-height: 1.45;
}
.viewer-sticky-bar .evTabs {
  margin-bottom: 0;
}
.viewer-sticky-breadcrumb {
  font-size: 13px;
  padding-top: 4px;
  padding-bottom: 8px;
}
.viewer-dash-side {
  align-self: stretch;
}
.viewer-dash-side .viewer-side-stack {
  gap: 14px;
}
@media (max-width: 767.98px) {
  .viewer-dash-side {
    margin-top: 16px;
  }
  .viewer-sticky-bar {
    top: var(--viewer-nav-offset);
  }
}

/* Viewer right sidebar — Advertisement + Upcoming Events */
.viewer-side-stack {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.viewer-side-card {
  background: #fff;
  border: 1px solid #e8edf3;
  border-radius: 14px;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.05);
  overflow: visible;
}
.viewer-side-card__head {
  padding: 14px 16px;
  border-bottom: none;
  background: #fd1d3d;
  border-radius: 14px 14px 0 0;
}
.viewer-side-card__head .viewer-side-card__eyebrow,
.viewer-side-card__eyebrow {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.92) !important;
  margin-bottom: 2px;
}
.viewer-side-card__head .viewer-side-card__title,
.viewer-side-card__title,
.viewer-side-card__head h6 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #ffffff !important;
  letter-spacing: -0.01em;
}
.viewer-side-card__body {
  padding: 14px 16px;
}
.viewer-side-card__body--list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-height: none;
  overflow: visible;
  padding: 14px;
  /* background: #e8eef5; */
  border-radius: 0 0 14px 14px;
}
.viewer-side-ad {
  border-radius: 10px;
  overflow: hidden;
  background: #f1f5f9;
  border: 1px solid #eef2f7;
}
.viewer-side-ad__img {
  width: 100%;
  display: block;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.35s ease;
}
.viewer-side-ad:hover .viewer-side-ad__img {
  transform: scale(1.03);
}
.viewer-side-event {
  display: block;
  flex-shrink: 0;
  border-radius: 12px;
  overflow: visible;
  border: 1.5px solid #b8c9dc;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.1);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  color: inherit;
}
.viewer-side-event:hover {
  transform: translateY(-2px);
  border-color: var(--primary-blue, #fd1d3d);
  box-shadow: 0 10px 24px rgba(8, 75, 132, 0.16);
  color: inherit;
}
.viewer-side-event__thumb {
  position: relative;
  margin: 10px 10px 0;
  border-radius: 10px;
  overflow: hidden;
  background: #d7e0ea;
  border: 1px solid #c5d2e0;
}
.viewer-side-event--image .viewer-side-event__thumb {
  margin: 8px;
  border: none;
  background: transparent;
}
.viewer-side-event__img {
  width: 100%;
  display: block;
  height: auto;
  max-height: 150px;
  object-fit: contain;
  object-position: center;
  background: #f8fafc;
}
.viewer-side-event--image .viewer-side-event__img {
  max-height: none;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.viewer-side-event__datebadge {
  position: absolute;
  top: 8px;
  left: 8px;
  min-width: 42px;
  padding: 6px 8px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.1);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.16);
  text-align: center;
  line-height: 1.05;
  z-index: 2;
}
.viewer-side-event__day {
  display: block;
  font-size: 15px;
  font-weight: 800;
  color: var(--primary-blue, #fd1d3d);
}
.viewer-side-event__mon {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
  margin-top: 2px;
}
.viewer-side-event__meta {
  padding: 12px 12px 14px;
  background: #fff;
  border-radius: 0 0 12px 12px;
}
.viewer-side-event__name {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.4;
  white-space: normal;
  overflow: visible;
  display: block;
}
.viewer-side-event__row {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 11px;
  color: #64748b;
  line-height: 1.4;
  margin-top: 4px;
}
.viewer-side-event__row i {
  margin-top: 2px;
  font-size: 10px;
  color: var(--primary-blue, #fd1d3d);
  opacity: 0.85;
  flex-shrink: 0;
}
.viewer-side-event__row span {
  min-width: 0;
  white-space: normal;
  overflow: visible;
  display: block;
}
.viewer-side-event:nth-child(even) {
  border-color: var(--primary-blue, #fd1d3d);
}
.viewer-side-event:nth-child(even) .viewer-side-event__meta {
  background: #f8fafc;
}
.viewer-side-event:nth-child(even) .viewer-side-event__datebadge {
  background: var(--primary-blue, #fd1d3d);
  border-color: transparent;
}
.viewer-side-event:nth-child(even) .viewer-side-event__day,
.viewer-side-event:nth-child(even) .viewer-side-event__mon {
  color: #fff;
}
.viewer-side-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 28px 12px;
  color: #94a3b8;
  font-size: 13px;
  text-align: center;
}
.viewer-side-empty i {
  font-size: 22px;
  color: #cbd5e1;
}


/* ==========================================================================
   8. File Upload Row  (admin event-edit-info, operator content pages)
   ========================================================================== */
.uploadFile label { font-size: 14px; color: #555; display: block; margin-bottom: 0; }

.upload-row {
  display:       flex;
  align-items:   center;
  gap:           10px;
  border:        1px solid #ccc;
  border-radius: 6px;
}

.file-name {
  flex:        1;
  padding:     0 10px;
  font-size:   13px;
  display:     flex;
  align-items: center;
  background:  #fafafa;
}


/* ==========================================================================
   9. TomSelect  (shared)
   ========================================================================== */
.ts-control {
  border: none !important; padding: 0 30px 0 0 !important; min-height: 30px !important;
  z-index: 99 !important; outline: none; align-items: center; background: none !important; border-radius: 6px;
}
.ts-control input    { height: 30px; min-width: auto !important; }
.ts-control .item    { padding-right: 10px; min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ts-control          { padding-right: 30px; }

.ts-wrapper { position: relative; }
.ts-wrapper::after {
  content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 900;
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  pointer-events: none; color: #6c757d; font-size: 14px; z-index: 1;
}
.ts-wrapper.single.focus .ts-control               { border: none !important; box-shadow: none !important; }
.ts-wrapper.single.focus .ts-control input         { opacity: 1 !important; position: relative !important; left: auto !important; display: block !important; width: auto !important; }
/* Single select with dropdown closed: keep the empty search input out of the row (even while focused
   right after picking) so the selected text gets the full width. Typing reopens the dropdown. */
/* closed, with something chosen: the typing box is out of the way. With nothing chosen it stays, so its
   placeholder ("Select Speaker") shows and the field is not an empty box. */
.ts-wrapper.single.has-items:not(.dropdown-active) .ts-control > input { position: absolute !important; width: 0 !important; min-width: 0 !important; opacity: 0 !important; }
.ts-dropdown .active                               { background-color: var(--primary-blue) !important; color: #fff !important; }
.ts-dropdown .option input                         { margin-left: 10px; }


/* ==========================================================================
   10. Login Page  (operator & reviewer standalone login pages)
   ========================================================================== */
.login {
  height:          100vh;
  display:         flex;
  justify-content: center;
  align-items:     center;
  background:      linear-gradient(to bottom, #f5f5f5, #fff);
}
.login-wrapper { text-align: center; width: 100%; max-width: 450px; padding: 0 20px; }

.brand p       { font-size: 18px; margin-bottom: 5px; }
.brand h1      { font-size: 48px; font-weight: 500; margin-bottom: 0; }
.brand h1 span { color: var(--accent-red); font-weight: bold; }

.login-card {
  margin-top:      30px;
  padding:         40px 30px;
  border-radius:   20px;
  background:      rgba(255,255,255,.15);
  backdrop-filter: blur(15px);
  box-shadow:      0 20px 50px rgba(0,0,0,.2);
}

.icon    { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); }
.options { display: flex; justify-content: space-between; font-size: 14px; margin-bottom: 20px; }
.options a { text-decoration: none; }

.login-btn {
  width: 100%; height: 45px; border: none; border-radius: 10px;
  background: var(--accent-red); color: #fff; font-size: 18px; font-weight: 600;
}

.swal2-html-container ul { text-align: center !important; }
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) { background: var(--accent-red) !important; }


/* ==========================================================================
   11. Pagination  (shared)
   ========================================================================== */
.pagination               { display: flex; gap: 8px; padding: 6px; margin-bottom: 0; }
.page-item .page-link     { display: flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 14px; color: #495057; font-weight: 500; transition: all .25s ease; box-shadow: 0 2px 6px rgba(0,0,0,.05); }
.page-item .page-link:hover  { background: #f1f3f5; transform: translateY(-2px); }
.page-item.active .page-link { background: var(--primary-blue) !important; color: #fff !important; box-shadow: 0 4px 12px rgba(0,0,0,.15); border-color: var(--primary-blue) !important; }
.page-item.disabled .page-link { opacity: .4; pointer-events: none; box-shadow: none; }
.page-link:focus { box-shadow: none; }


/* ==========================================================================
   12. Tables  (shared)
   ========================================================================== */
.table thead th { background: var(--primary-blue); color: #fff; font-size: 14px; font-weight: 600; padding: 14px 16px; text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; vertical-align: middle; }
.table tbody td { padding: 12px 16px; vertical-align: middle; border-color: #eef1f6; font-size: 14px; }
.table > tbody > tr:nth-of-type(odd) > * { background-color: #f8f9fa !important; }

/* Light header variant — used in admin master list tables */
.th-light th { background-color: #f5f6f8; color: #000; text-transform: uppercase; font-size: 14px; font-weight: 600; }


/* ==========================================================================
   13. Nav Pills  (shared)
   ========================================================================== */
.nav-pills                  { border-bottom: 2px solid #eee; margin-bottom: 15px; }
.nav-pills .nav-link        { border: none; color: #777; font-weight: 500; padding: 12px 25px; border-radius: 0; }
.nav-pills .nav-link.active { border-bottom: 3px solid var(--primary-blue) !important; color: var(--primary-blue) !important; background: transparent; }
.breadcrumb-item a          { text-decoration: none; }


/* ==========================================================================
   14. Scrollable Tabs  (admin my-contributions, operator event tabs)
   ========================================================================== */
.evTabs {
  overflow-x: auto !important;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 10px;
}
.evTabs::-webkit-scrollbar       { height: 3px; }
.evTabs::-webkit-scrollbar-thumb { background: #999; border-radius: 4px; }

.material-tabs {
  display:    inline-flex !important;
  flex-wrap:  nowrap !important;
  min-width:  max-content;
}
.material-tabs .nav-item { flex: 0 0 auto !important; }
.material-tabs .nav-link { white-space: nowrap; margin-right: 0 !important; }

/* Generic scrollable tabs wrapper */
.scrollable-tabs              { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.scrollable-tabs .nav         { flex-wrap: nowrap !important; display: flex !important; }
.scrollable-tabs .nav-item    { flex: 0 0 auto; }
.scrollable-tabs .nav-link    { white-space: nowrap; margin-right: 8px; }


/* ==========================================================================
   15. Search  (shared)
   ========================================================================== */
.search-box         { max-width: 300px; }
.search-input       { border-radius: 10px 0 0 10px !important; border: 1px solid #dee2e6; padding: 10px 12px; box-shadow: none; }
.search-input:focus { border-color: var(--primary-blue); box-shadow: none; }
.search-btn         { border-radius: 0 10px 10px 0 !important; background-color: var(--primary-blue); color: rgba(255,255,255,.86); padding: 0 16px; border: none; }
.search-btn:hover   { color: #fff; background-color: #063a66; }

.search-wrapper       { position: relative; display: inline-block; }
.search-wrapper i     { position: absolute; top: 50%; left: 12px; transform: translateY(-50%); font-size: 14px; color: #6c757d; pointer-events: none; }
.search-wrapper input { width: 200px; height: 36px; padding-left: 35px; border-radius: 50px; border: 1px solid #ced4da; transition: all .3s ease; font-size: 13px; }
.search-wrapper input:focus { width: 260px; border-color: var(--primary-blue); box-shadow: 0 0 8px rgba(253,29,61,.2); }


/* ==========================================================================
   16. Buttons  (shared)
   ========================================================================== */
.btn-outline-primary       { color: var(--primary-blue); border-color: var(--primary-blue); }
.btn-outline-primary:hover { color: #fff; background-color: var(--primary-blue); border-color: var(--primary-blue); }
.btn-outline-primary:focus,
.btn-outline-primary:active { box-shadow: 0 0 0 .2rem rgba(8,75,132,.25); }

.action-icon       { transition: all .25s ease; font-size: 16px; cursor: pointer; text-decoration: none; border: none; background: none; padding: 0 5px; color: #777; }
.action-icon:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(0,0,0,.08); color: var(--primary-blue); }

.icon-btn       { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: #f5f5f5; color: #555; text-decoration: none; }
.icon-btn:hover { color: var(--accent-red); background: #e0e0e0; }

/* Modal close button */
.close-btn {
  position:        absolute;
  top:             10px;
  right:           10px;
  width:           35px;
  height:          35px;
  border:          none;
  border-radius:   50%;
  background:      #f1f3f5;
  font-size:       22px;
  cursor:          pointer;
  display:         flex;
  align-items:     center;
  justify-content: center;
  transition:      .2s;
}
.close-btn:hover { background: var(--accent-red); color: #fff; }


/* ==========================================================================
   17. Misc Utilities  (shared)
   ========================================================================== */
.step-heading  { padding: 10px 20px; background: #e6edf2; border-bottom: 1px dashed #ccc; margin-bottom: 30px !important; color: var(--primary-blue); }
.progress-bar  { border-radius: 5px; }
.sub-title     { font-size: 15px; padding-bottom: 8px; margin-bottom: 18px !important; border-bottom: 2px solid #eef1f6; color: var(--primary-blue); }

.progress:has(.progress-bar[style*="width:0%"]) { display: none; }
.app-header .navbar-brand { font-size: 25px; }
.modal-body video         { display: block; width: 100%; }
.dashed-divider           { border-top: 1px dashed rgba(0,0,0,.175); margin: 8px 0; opacity: 1; }
.svg-icon                 { width: 18px; height: 18px; display: block; filter: grayscale(100%); opacity: .85; }
.two-line-text            { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.or-separator             { display: flex; align-items: center; text-align: center; margin: 12px 0; color: #adb5bd; font-size: 10px; font-weight: bold; text-transform: uppercase; }
.or-separator::before,
.or-separator::after      { content: ''; flex: 1; border-bottom: 1px solid #e9ecef; }
.or-separator:not(:empty)::before { margin-right: .5em; }
.or-separator:not(:empty)::after  { margin-left:  .5em; }

.bg-secondary-soft { background-color: #e9ecef; }
.alert-msg         { font-size: 10px; color: #dc3545; line-height: 1.2; font-style: italic; }
.divider           { margin: 0 8px; color: #bbb; }


/* ==========================================================================
   18. Section / Page Headings  (shared)
   ========================================================================== */
.title         { position: relative; margin-bottom: 25px; }
.title::before {
  content:    '';
  display:    block;
  position:   absolute;
  left:       0;
  bottom:     -5px;
  height:     2px;
  width:      75px;
  background: var(--accent-red);
}
.section-title { font-size: 16px; font-weight: 600; margin-bottom: 12px; }


/* ==========================================================================
   19. iframeIcon  (viewer layout modal close button)
   ========================================================================== */
.iframeIcon {
  position:        absolute;
  top:             15px;
  right:           15px;
  width:           25px;
  height:          25px;
  background:      #f10606;
  display:         flex;
  align-items:     center;
  justify-content: center;
  border-radius:   50%;
}
.iframeIcon span { font-size: 15px; color: #fff; }


/* ==========================================================================
   20. Profile / Contact Card  (shared)
   ========================================================================== */
.profile-card      { border-radius: 10px; }
.company-name      { font-weight: 600; color: #333; }
.profile-content p { text-align: justify; }
/* formatted text (About Event, About Organiser, a speaker's profile): bold is really bold. The page's text
   weight is 300, and "bolder" than 300 is only 400, which looks the same as the text around it. */
.profile-content b, .profile-content strong { font-weight: 700; }
.profile-content ul, .profile-content ol { padding-left: 1.4em; margin-bottom: 1rem; }

.profile-photo       { position: relative; width: 120px; height: 120px; margin: auto; }
.profile-photo img   { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; border: 4px solid #f1f1f1; }

/* Profile modal — consistent left/right padding */
#profile .profile-modal {
  border: none;
  border-radius: 16px;
  overflow: hidden;
}
#profile .profile-modal__header {
  position: relative;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #eef2f7;
}
#profile .profile-modal__header .close-btn {
  position: static;
  margin-left: auto;
  background: #fd1d3d;
  color: #fff;
  width: 36px;
  height: 36px;
  font-size: 16px;
  flex-shrink: 0;
}
#profile .profile-modal__header .close-btn:hover {
  background: #d90404;
  color: #fff;
}
#profile .profile-modal__body {
  padding: 1.25rem 1.5rem 1rem;
}
#profile .profile-modal__footer {
  padding: 0.9rem 1.5rem;
  border-top: 1px solid #eef2f7;
}
#profile .profile-modal__company {
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 0.9rem;
}
#profile .profile-modal__contacts .value {
  font-weight: 600;
  color: #1f2937;
  white-space: normal;
  overflow: visible;
  word-break: normal;
  overflow-wrap: anywhere;
}
#profile .profile-modal__contacts .value a {
  white-space: normal;
  word-break: normal;
  overflow-wrap: anywhere;
}
#profile .profile-modal__contacts .label {
  font-size: 0.82rem;
  color: #6b7280;
}
#profile .profile-modal__contacts .icon-box {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fd1d3d;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 0;
}
#profile .profile-modal__contacts .profile-modal__contact-row {
  gap: 0.55rem !important;
  align-items: center !important;
}
#profile .profile-modal__contacts .min-w-0 {
  min-width: 0;
  flex: 1 1 auto;
}
/* Email / website get wider columns so the full address fits */
#profile .profile-modal__contacts .profile-modal__contact--wide {
  flex: 1 1 100%;
}
@media (min-width: 768px) {
  #profile .profile-modal__contacts .profile-modal__contact--wide {
    flex: 1 1 50%;
    max-width: 50%;
  }
}
#profile .profile-content {
  padding: 0;
  color: #374151;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
#profile .profile-photo {
  margin: 0;
}
@media (max-width: 575.98px) {
  #profile .profile-modal__header,
  #profile .profile-modal__body,
  #profile .profile-modal__footer {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  #profile .profile-photo,
  #profile .profile-photo img {
    width: 88px;
    height: 88px;
  }
}
.change-photo {
  position:        absolute;
  bottom:          5px;
  right:           5px;
  background:      var(--primary-blue);
  color:           #fff;
  width:           32px;
  height:          32px;
  border-radius:   50%;
  display:         flex;
  align-items:     center;
  justify-content: center;
  cursor:          pointer;
  font-size:       18px;
}

.contact-card { border-radius: 10px; }
.contact-item { display: flex; align-items: center; margin-bottom: 15px; }
.icon-box {
  width:           42px;
  height:          42px;
  background:      #f1f3f5;
  border-radius:   8px;
  display:         flex;
  align-items:     center;
  justify-content: center;
  margin-right:    12px;
  font-size:       20px;
  color:           var(--primary-blue);
}
.value { font-weight: 500; color: #333; }
.label { font-size: 12px; color: #888; }

.contributor-badge .badge { top: -5px; position: absolute; right: -5px; }

.event-icon {
  width:           42px;
  height:          42px;
  min-width:       42px;
  border-radius:   10px;
  background:      rgba(8,75,132,.08);
  display:         flex;
  align-items:     center;
  justify-content: center;
  color:           var(--primary-blue);
  font-size:       18px;
}


/* ==========================================================================
   21. Carousel Arrows  (shared)
   ========================================================================== */
.arrow-left,
.arrow-right {
  position:        absolute;
  top:             50%;
  transform:       translateY(-50%);
  width:           25px;
  height:          25px;
  background:      rgba(0,0,0,.6);
  color:           #fff;
  font-size:       16px;
  display:         flex;
  align-items:     center;
  justify-content: center;
  border-radius:   50%;
  cursor:          pointer;
  z-index:         10;
  transition:      .3s;
}
.arrow-left  { left: 15px; }
.arrow-right { right: 15px; }
.arrow-left:hover,
.arrow-right:hover { background: var(--primary-blue); transform: translateY(-50%) scale(1.1); }


/* ==========================================================================
   22. Event & Speaker Cards  (Organiser · Speaker · Sponsor · Viewer pages)
   ========================================================================== */
.event-img           { width: 250px; aspect-ratio: 500/280; align-self: flex-start; overflow: hidden; flex-shrink: 0; border-radius: 6px; padding: 0; background: #f3f4f6; border: 1px solid #dee2e6; }
.event-img img       { width: 100%; height: 100%; object-fit: contain; display: block; }   /* the picture whole, never cut */
.event-img .ev-img-placeholder,
.ev-img-placeholder {
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: #f3f4f6;
  border-radius: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
}
.event-link          { text-decoration: none; color: inherit; display: block; }

.event-card          { position: relative; }
.event-card:hover h5 { color: var(--accent-red); }

.event-header  { background: #e7f3ff; padding: 15px 20px; border-bottom: 1px solid #eee; }
.event-title   { margin: 0; font-size: 18px; font-weight: 600; }
.event-meta    { margin-top: 5px; font-size: 13px; color: #666; display: flex; align-items: center; }
.event-meta span { margin-right: 10px; }

.event-banner     { border-radius: 10px; overflow: hidden; }
.event-banner img { width: 100%; height: 350px; object-fit: cover; border-radius: 8px; }

.conference-card { border: 1px solid #e6e6e6; border-radius: 8px; background: #fff; margin-bottom: 20px; overflow: hidden; }
.hall-card       { border-left: 4px solid var(--accent-red); }
.session-card    { border-left: 4px solid #28a745; margin-top: 10px; }

.speaker-section     { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; border-top: 1px dashed #ddd; margin-bottom: 15px; }
.speaker-left        { display: flex; }
.speaker-img img     { width: 80px; height: 80px; border-radius: 6px; object-fit: cover; margin-right: 12px; }
.speaker-name        { margin: 0; font-size: 15px; font-weight: 600; }
.speaker-designation { margin: 2px 0 0; font-size: 13px; color: #777; }

.speaker-item            { padding: 15px 0; border-bottom: 1px dashed #ccc; transition: background .2s; }
.speaker-item:hover      { background: #f5f5f5; }
.speaker-item:last-child { border-bottom: none; }
.speaker-avatar          { padding-left: 10px; }
.speaker-avatar img      { width: 70px; height: 70px; border-radius: 6px;  object-fit: cover; object-position: center top; }
.speaker-topic           { font-weight: 600; color: #3c4b64; }

/* Hover view icon over event card */
.view-icon-link {
  position:        absolute;
  right:           16px;
  top:             50%;
  transform:       translateY(-50%);
  opacity:         0;
  transition:      opacity .3s ease;
  z-index:         2;
  text-decoration: none;
  display:         flex;
}
.event-card:hover .view-icon-link { opacity: 1; }

.view-icon {
  box-shadow:      0 8px 20px rgba(0,0,0,.15);
  border:          1px solid #eee;
  color:           var(--accent-red);
  border-radius:   50%;
  width:           44px;
  height:          44px;
  background:      #fff;
  display:         flex;
  align-items:     center;
  justify-content: center;
  font-size:       18px !important;
  transition:      transform .3s ease;
}
.event-card:hover .view-icon { transform: scale(1.1); }

.modal-contact-item          { margin: 15px 0; padding: 15px; background: #f8f9fa; border-radius: 8px; border-left: 4px solid var(--accent-red); }
.modal-contact-item h3       { color: var(--accent-red); margin-bottom: 8px; font-size: 1.1em; }


/* ==========================================================================
   23. Sponsors & Gallery  (shared)
   ========================================================================== */
.sponsor-logo {
  background:      #fff;
  overflow:        hidden;
  border:          1px solid #dfdfdf;
  transition:      all .3s ease;
  display:         flex;
  align-items:     center;
  justify-content: center;
}
.sponsor-logo:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0,0,0,.15); }

.sponsor-title {
  text-align:            center;
  text-transform:        uppercase;
  letter-spacing:        1px;
  display:               grid;
  grid-template-columns: 1fr auto 1fr;
  grid-template-rows:    16px 0;
  grid-gap:              22px;
  margin-bottom:         15px;
}
.sponsor-title::after,
.sponsor-title::before { content: " "; display: block; border-bottom: 2px solid #eee; }

.gallery-img       { cursor: pointer; border-radius: 8px; transition: .3s; }
.gallery-img:hover { transform: scale(1.05); box-shadow: 0 5px 15px rgba(0,0,0,.3); }

.gallery-video     { width: 100%; height: 150px; object-fit: cover; border-radius: 8px; cursor: pointer; transition: transform .3s, box-shadow .3s; }
.video-card:hover  { transform: scale(1.05); box-shadow: 0 10px 20px rgba(0,0,0,.15); transition: .3s ease; }
.video-card h5     { font-size: 1rem; line-height: 1.2; }
.video-card p      { font-size: .85rem; color: #6c757d; }

.play-btn {
  font-size:       14px;
  color:           rgba(255,255,255,.9);
  pointer-events:  none;
  background:      var(--accent-red);
  padding:         10px;
  border-radius:   50%;
  width:           30px;
  height:          30px;
  display:         flex;
  align-items:     center;
  justify-content: center;
  position:        absolute;
  top:             8px;
  right:           8px;
}

.pptDownload {
  position:        absolute;
  top:             12px;
  right:           12px;
  z-index:         9;
  padding:         0;
  width:           36px;
  height:          36px;
  display:         flex;
  align-items:     center;
  justify-content: center;
  background:      rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color:           #0f172a;
  border:          1px solid rgba(15, 23, 42, 0.08);
  border-radius:   10px;
  box-shadow:      0 2px 10px rgba(15, 23, 42, 0.08);
  transition:      background .15s ease, color .15s ease;
}
.pptDownload:hover {
  background: var(--color-primary, #fd1d3d);
  color: #fff;
  border-color: transparent;
}
.pptDownload a,
.pptDownload a.text-white {
  color: inherit !important;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.secBoxImageRight .carousel-inner { border-radius: 0; }
.secBoxVideo .carousel-inner      { border-radius: 0 0 8px 8px; }


/* ==========================================================================
   24. Misc Page Components  (shared)
   ========================================================================== */
.menu-icon {
  padding:         10px;
  background:      var(--accent-red);
  color:           #fff;
  border-radius:   6px;
  border:          1px solid var(--accent-red);
  display:         flex;
  align-items:     center;
  justify-content: center;
  cursor:          pointer;
}
/* Above sticky page chrome, but BELOW Bootstrap modals (1050/1055) */
.event-menu-dropdown {
  position: relative;
  z-index: 1040;
}
.event-menu-dropdown .dropdown-menu,
.event-menu-dropdown-list {
  z-index: 1045 !important;
  min-width: 200px;
}
/* When any modal is open, keep the red menu under the modal layer */
body.modal-open .event-menu-dropdown {
  z-index: 1;
}

.role-box {
  border:        1px solid #edf2f9;
  padding:       8px 12px;
  border-radius: 8px;
  background:    #fdfdfd;
  font-size:     13px;
  transition:    .2s ease;
  color:         rgba(33,37,41,.78);
}
.role-box:hover { background-color: #fff0f2; color: #fd1d3d; border-color: #fecaca; }
.role-box.disabled-role { opacity: .5; background-color: #f8f9fa; filter: grayscale(1); cursor: not-allowed !important; pointer-events: none; }

.btn-upgrade       { text-decoration: none; font-size: 11px; background: #fd1d3d; color: #fff !important; padding: 2px 10px; border-radius: 4px; font-weight: 500; }
.btn-upgrade:hover { background: #d4182f; }


/* ==========================================================================
   25. Responsive
   ========================================================================== */
@media (max-width: 767.98px) {
  .nav-item.dropdown                 { position: static; }
  .dropdown-menu                     { width: 90% !important; }
  .dropdown-menu-end[data-bs-popper] { left: 5% !important; right: 5% !important; }
  .event-img                         { width: 100% !important; }
  /* Event cards on a phone: the picture takes the whole width (the rule above), so the text goes UNDER it. Side by
     side, the text was pushed out of the card to the right and cut off: a card showed its picture only. */
  .d-flex:has(> .event-img)          { flex-direction: column; }
  @supports not selector(:has(*)) {    /* (a browser from before 2023: the same, by the card's own row) */
    .event-card .card-body > .d-flex { flex-direction: column; }
  }
  .event-img                         { margin-right: 0 !important; margin-bottom: 12px; }
  /* The viewer's tabs: one row that slides sideways and no breadcrumb, so the bar that stays on top while the list
     moves is one line high. It was two rows of tabs and a breadcrumb: a quarter of the screen. */
  .viewer-sticky-bar .nav-pills      { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .viewer-sticky-bar .nav-pills::-webkit-scrollbar { display: none; }
  .viewer-sticky-bar .nav-pills .nav-item { flex: 0 0 auto; }
  .viewer-sticky-bar .nav-pills .nav-link { white-space: nowrap; padding: 10px 12px !important; }
  .viewer-sticky-breadcrumb          { display: none; }
}


/* ==========================================================================
   Panel Header — Avatar, Username, Role, Chevron
   ========================================================================== */

.panel-avatar-sm {
  width: 32px;
  height: 32px;
  object-fit: cover;
  border: 2px solid #dee2e6;
}

.panel-avatar-drop {
  object-fit: cover;
}

.panel-username {
  font-size: 13px;
  max-width: 120px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.panel-role-label {
  font-size: 11px;
}

.panel-chevron {
  font-size: 10px;
  opacity: .5;
}

.panel-upgrade-label {
  font-size: 11px;
  letter-spacing: 0.5px;
}


/* ==========================================================================
   Common Modal — Gray Body
   ========================================================================== */

.modal-body-gray {
  background: #f2f2f2;
}


/* ==========================================================================
   Validation Error List (msg.blade.php)
   ========================================================================== */

.validation-list {
  text-align: left;
  padding-left: 15px;
  list-style: none;
}


/* ==========================================================================
   Viewer — Event Tables & Cards
   ========================================================================== */

.tbl-banner-thumb {
  width: 70px;
  height: 50px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
}

.text-accent {
  color: #fd1d3d;
}

.pending-approval-card {
  background: #fff5f6;
  border: 2px solid #fd1d3d;
  border-radius: 14px;
}

.pending-icon {
  color: #fd1d3d;
  font-size: 18px;
}

.pending-heading {
  color: #fd1d3d;
  font-size: 15px;
}

.pending-event-name {
  font-size: 14px;
}

.pending-event-meta {
  font-size: 12px;
}


/* ==========================================================================
   Dashboard — Content Offset
   ========================================================================== */

.panel-content-offset { padding-top: 40px; }


/* ==========================================================================
   Badges — Extra Small
   ========================================================================== */

.badge-xs { font-size: 11px; }
.badge-green { background: #10b981; }
.badge-amber { background: #f59e0b; color: #fff; }


/* ==========================================================================
   Alert — Small
   ========================================================================== */

.alert-sm { font-size: 12px; border-radius: 8px; }


/* ==========================================================================
   tcModal — Terms & Conditions Overlay
   ========================================================================== */

.tc-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,.5);
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.tc-modal-box {
  background: #fff;
  border-radius: 16px;
  padding: 28px;
  width: 100%;
  max-width: 480px;
  position: relative;
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
}

.tc-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: #f1f5f9;
  border: none;
  border-radius: 8px;
  width: 32px;
  height: 32px;
  cursor: pointer;
}

.tc-modal-title {
  font-size: 16px;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 12px;
}

.tc-modal-text {
  font-size: 13px;
  color: #475569;
  line-height: 1.6;
  margin-bottom: 12px;
}

.tc-modal-agree-label {
  font-size: 13px;
  color: #dc3545;
  font-weight: 600;
}

.tc-modal-actions {
  display: flex;
  gap: 10px;
}

.tc-modal-btn { border-radius: 8px; }


/* ==========================================================================
   Stage Info Box (Day / Hall / Session schedule block)
   ========================================================================== */

.stage-info-box {
  background: #eef2ff;
  border: 1.5px solid #c7d2fe;
  border-radius: 10px;
}

.stage-info-header {
  font-size: 11px;
  color: #6366f1;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: .4px;
}

.stage-info-label {
  font-size: 11px;
  color: #818cf8;
  font-weight: 600;
  text-transform: uppercase;
}

.stage-info-value {
  font-size: 14px;
  color: #1e293b;
  font-weight: 700;
}


/* ==========================================================================
   Event Title / Banner / Description (stage & speaker views)
   ========================================================================== */

.ev-title-wrap   { flex: 1; min-width: 0; }
.ev-title-text   { color: #1e293b; }
.ev-subtitle-muted { font-size: 12px; color: #94a3b8; }
.ev-banner-img   { width: 100%; height: auto; display: block; border-radius: 8px; }
.ev-desc-text    { font-size: 13px; color: #334155; line-height: 1.6; }
.ev-info-bar     { background: #f8fafc; border: 1px solid #e9ecef; border-radius: 10px; }
.ev-nav-bar      { background: #f8fafc; border-top: 1px solid #e9ecef; }


/* ==========================================================================
   Nav Counter — Meta Labels
   ========================================================================== */

.nav-meta-label {
  font-size: 11px;
  color: #8898aa;
  text-transform: uppercase;
}

.count-total {
  font-size: 14px;
  font-weight: 400;
  color: #8898aa;
}


/* ==========================================================================
   Speaker Dynamic View — Modals & Media
   ========================================================================== */

/* Document icon box */
.spk-doc-icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: #ede9fe;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}

.spk-truncate-wrap { min-width: 0; }
.spk-doc-title     { font-size: 13px; font-weight: 600; color: #1e293b; }
.spk-doc-link      { font-size: 11px; color: #6366f1; }

/* Fullscreen overlay (video & image lightbox) */
.spk-fullscreen-modal {
  position: fixed; inset: 0;
  z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.7);
  animation: spkFadeIn .2s ease;
}
.spk-video-bg   { background: rgba(0,0,0,.75); }
.spk-modal-inner {
  position: relative;
  width: 90%;
  max-width: 720px;
  background: #1a1a2e;
  border-radius: 14px;
  overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,.6);
  animation: spkFadeIn .2s ease;
}
.spk-img-center  { align-items: center; justify-content: center; }
.spk-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; flex-shrink: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.spk-modal-title  { color: #fff; font-size: 14px; font-weight: 600; }

/* Icon chip (video = red, etc.) */
.spk-type-icon { width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.spk-icon-video { background: #ef4444; }
.spk-icon-sm   { font-size: 14px; }

/* Close buttons */
.spk-close-btn {
  background: rgba(255,255,255,.1);
  border: none; border-radius: 8px;
  color: #fff;
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: 16px;
  transition: background .2s;
}
.spk-close-btn:hover { background: rgba(255,255,255,.2); }
.spk-close-abs { position: absolute; top: 16px; right: 16px; }

/* Video element (old fullscreen — kept for image modal) */
.spk-modal-content-center { flex: 1; display: flex; align-items: center; justify-content: center; padding: 0 20px 20px; }
.spk-video-el { max-width: 100%; max-height: calc(100vh - 100px); border-radius: 12px; outline: none; }

/* ── Small video popup ── */
.spk-video-popup-overlay {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.65);
  animation: spkFadeIn .2s ease;
}
.spk-video-popup-box {
  width: 92%; max-width: 560px;
  background: #111827;
  border-radius: 14px; overflow: hidden;
  box-shadow: 0 24px 64px rgba(0,0,0,.7);
  animation: spkFadeIn .2s ease;
}
.spk-video-popup-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.spk-video-popup-body { padding: 12px; }
.spk-video-popup-el {
  width: 100%; max-height: 320px;
  border-radius: 8px; outline: none; display: block;
  background: #000;
}

/* Centered white-card modal (audio) */
.spk-centered-modal {
  position: fixed; inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,.6);
  align-items: center; justify-content: center;
}
.spk-card-modal {
  background: #fff; border-radius: 16px; padding: 28px;
  width: 90%; max-width: 420px; position: relative;
}
.spk-audio-icon {
  width: 50px; height: 50px; border-radius: 50%;
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.spk-audio-label { font-size: 13px; color: #64748b; font-weight: 500; word-break: break-all; }

/* Image lightbox */
.spk-img-el    { max-width: 90vw; max-height: 78vh; border-radius: 10px; object-fit: contain; }
.spk-img-meta  { color: #94a3b8; font-size: 12px; }
.spk-img-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.12); border: none;
  color: #fff; width: 42px; height: 42px; border-radius: 50%;
  cursor: pointer; font-size: 16px;
}
.spk-img-prev  { left: 16px; }
.spk-img-next  { right: 16px; }

/* Shared modal title / hint */
.spk-modal-h6   { font-size: 15px; font-weight: 700; color: #1e293b; margin-bottom: 4px; }
.spk-modal-hint { font-size: 12px; color: #94a3b8; margin-bottom: 18px; }
.spk-form-label { font-size: 12px; font-weight: 600; color: #475569; display: block; margin-bottom: 6px; }
.spk-form-ctrl  { border-radius: 8px; font-size: 14px; }
.spk-range-hint { font-size: 11px; color: #94a3b8; margin-top: 6px; }
.spk-btn-indigo { background: #6366f1 !important; border-color: #6366f1 !important; }


/* ==========================================================================
   Operator/Speaker Filter — Event Status Bars & Cards
   ========================================================================== */

.ev-card-round { border-radius: 12px; overflow: hidden; }

.ev-status-bar {
  padding: 7px 16px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
.ev-status-approved { background: #dcfce7; border-bottom-color: #bbf7d0; color: #166534; }
.ev-status-rejected { background: #fee2e2; border-bottom-color: #fecaca; color: #991b1b; }
.ev-status-pending  { background: #fef9c3; border-bottom-color: #fef08a; color: #a16207; }

.ev-action-btn { border-radius: 8px; font-size: 12px; padding: 4px 14px; }
.ev-img-placeholder {
  width: 100%;
  height: 100%;
  background: #f3f4f6;
  border-radius: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
}

/* Accent badge (community card type label) */
.badge-accent-xs { background: #fd1d3d; font-size: 10px; padding: 3px 8px; border-radius: 20px; }


/* ==========================================================================
   Profile & Contribution Cards
   ========================================================================== */

.profile-card-round { border-radius: 16px; }

.stat-col-bordered {
  border-left: 1px solid #f3f4f6;
  border-right: 1px solid #f3f4f6;
}

.info-meta-label {
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.contrib-banner-preview { height: 100px; border-radius: 10px; object-fit: cover; }


/* ==========================================================================
   Utility
   ========================================================================== */

.cursor-pointer { cursor: pointer; }
/* the speaker's name takes the room the heading has (it was cut at 180px whatever the room); cut with … only when the heading is full */
.spk-name-truncate { flex: 1 1 0; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; }
.swap-icon { cursor: pointer; margin-left: 4px; }


/* Terms & Conditions modal — checkbox label (dark variant) */
.tc-modal-text-dark { font-size: 13px; color: #1e293b; }

/* Round photos everywhere: always a square box filled without squashing (non-square photos used to show as ellipses) */
img.rounded-circle { aspect-ratio: 1 / 1; object-fit: cover; object-position: center top; }

/* ==========================================================================
   Loader (every "please wait" popup — SweetAlert2's loader): the EventoX logo icon (the black and red
   globe of dots) speaks — its black half stays still, all the red dots of its right half move: they leave it as sound waves (arcs of sparkling dots, big to small) and
   go to the audience of every kind (little people, each in its own colour, in rows: a row on
   chairs, a row on headphones, a row standing). Only the red dots move. Not the plain spinner.
   ========================================================================== */
.swal2-loader {
  position: relative; width: 166px !important; height: 114px !important; margin: 6px auto 0 !important;
  border: 0 !important; border-radius: 0 !important; animation: none !important; background: none !important;
}
.swal2-loader::before {   /* the black half of the logo icon (still) */
  content: ""; position: absolute; left: 4px; top: 27px; width: 60px; height: 60px;
  background: url(../img/evx-globe-black.png) center / contain no-repeat;
}
.swal2-loader::after {   /* the red dots: waves from the middle of the globe towards the audience */
  content: ""; position: absolute; left: 0; top: 0; width: 166px; height: 114px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 166 114'%3E%3Cg transform='translate%2834 57%29'%3E%3Cg opacity='0' fill='%23fd1d3d'%3E%3Canimate attributeName='opacity' values='0;1;1;0' keyTimes='0;0.15;0.8;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-8.5;-45.3' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.34s' begin='0s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-6;-32' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.46s' begin='0s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-3.1;-16.6' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.4s' begin='0s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='12;64' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='0;0' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.3s' begin='0s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='3.1;16.6' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.44s' begin='0s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='6;32' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.36s' begin='0s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='8.5;45.3' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.5s' begin='0s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3Cg opacity='0' fill='%23fd1d3d'%3E%3Canimate attributeName='opacity' values='0;1;1;0' keyTimes='0;0.15;0.8;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-8.5;-45.3' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.34s' begin='0.4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-6;-32' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.46s' begin='0.4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-3.1;-16.6' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.4s' begin='0.4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='12;64' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='0;0' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.3s' begin='0.4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='3.1;16.6' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.44s' begin='0.4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='6;32' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.36s' begin='0.4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='8.5;45.3' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.5s' begin='0.4s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3Cg opacity='0' fill='%23fd1d3d'%3E%3Canimate attributeName='opacity' values='0;1;1;0' keyTimes='0;0.15;0.8;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-8.5;-45.3' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.34s' begin='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-6;-32' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.46s' begin='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-3.1;-16.6' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.4s' begin='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='12;64' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='0;0' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.3s' begin='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='3.1;16.6' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.44s' begin='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='6;32' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.36s' begin='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='8.5;45.3' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='0.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.5s' begin='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3Cg opacity='0' fill='%23fd1d3d'%3E%3Canimate attributeName='opacity' values='0;1;1;0' keyTimes='0;0.15;0.8;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-8.5;-45.3' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.34s' begin='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-6;-32' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.46s' begin='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-3.1;-16.6' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.4s' begin='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='12;64' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='0;0' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.3s' begin='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='3.1;16.6' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.44s' begin='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='6;32' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.36s' begin='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='8.5;45.3' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.5s' begin='1.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3Cg opacity='0' fill='%23fd1d3d'%3E%3Canimate attributeName='opacity' values='0;1;1;0' keyTimes='0;0.15;0.8;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-8.5;-45.3' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.34s' begin='1.6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-6;-32' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.46s' begin='1.6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-3.1;-16.6' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.4s' begin='1.6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='12;64' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='0;0' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.3s' begin='1.6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='3.1;16.6' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.44s' begin='1.6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='6;32' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.36s' begin='1.6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='8.5;45.3' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='1.6s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.5s' begin='1.6s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3Cg opacity='0' fill='%23fd1d3d'%3E%3Canimate attributeName='opacity' values='0;1;1;0' keyTimes='0;0.15;0.8;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-8.5;-45.3' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.34s' begin='2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-6;-32' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.46s' begin='2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='-3.1;-16.6' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.4s' begin='2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='12;64' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='0;0' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.3s' begin='2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='11.6;61.8' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='3.1;16.6' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.44s' begin='2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='10.4;55.4' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='6;32' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.36s' begin='2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='3'%3E%3Canimate attributeName='cx' values='8.5;45.3' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='cy' values='8.5;45.3' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='3;1' dur='2.4s' begin='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='1;.25;1' dur='0.5s' begin='2s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/g%3E%3Cg fill='%23FCC258'%3E%3Ccircle cx='116' cy='23' r='4'/%3E%3Cpath d='M110 36a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cpath d='M110.5 23a5.5 5.5 0 0 1 11 0' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M110.5 22.5v3M121.5 22.5v3' fill='none' stroke='%2394a3b8' stroke-width='3.4' stroke-linecap='round'/%3E%3Cg fill='%2322c55e'%3E%3Ccircle cx='116' cy='49' r='4'/%3E%3Cpath d='M110 62a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cpath d='M123 53v16M109 63.5h14M110 63.5v5.5' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cg fill='%233b82f6'%3E%3Ccircle cx='116' cy='75' r='4'/%3E%3Cpath d='M110 88a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cg fill='%23a855f7'%3E%3Ccircle cx='135' cy='23' r='4'/%3E%3Cpath d='M129 36a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cpath d='M129.5 23a5.5 5.5 0 0 1 11 0' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M129.5 22.5v3M140.5 22.5v3' fill='none' stroke='%2394a3b8' stroke-width='3.4' stroke-linecap='round'/%3E%3Cg fill='%23fd1d3d'%3E%3Ccircle cx='135' cy='49' r='4'/%3E%3Cpath d='M129 62a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cpath d='M142 53v16M128 63.5h14M129 63.5v5.5' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cg fill='%23fb923c'%3E%3Ccircle cx='135' cy='75' r='4'/%3E%3Cpath d='M129 88a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cg fill='%2314b8a6'%3E%3Ccircle cx='154' cy='23' r='4'/%3E%3Cpath d='M148 36a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cpath d='M148.5 23a5.5 5.5 0 0 1 11 0' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M148.5 22.5v3M159.5 22.5v3' fill='none' stroke='%2394a3b8' stroke-width='3.4' stroke-linecap='round'/%3E%3Cg fill='%23FCC258'%3E%3Ccircle cx='154' cy='49' r='4'/%3E%3Cpath d='M148 62a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3Cpath d='M161 53v16M147 63.5h14M148 63.5v5.5' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cg fill='%2322c55e'%3E%3Ccircle cx='154' cy='75' r='4'/%3E%3Cpath d='M148 88a6 7 0 0 1 12 0z'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
}