/* First connection (register flow) */
.fc-page {
  background: #f8f9fa;
  min-height: 100vh;
  width: 100%;
  color: #0f172a;
}

.fc-shell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.fc-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 72px;
  background: #ffffff;
  border-bottom: 1px solid #e5e7eb;
  z-index: 1000;
}

.fc-header-inner {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fc-header-side {
  width: 64px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.fc-header-side.right {
  justify-content: flex-end;
}

.fc-header-logo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
}

.fc-header-logo img {
  height: 40px;
  width: auto;
}

.fc-back-button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: #0f172a;
}

.fc-header-link {
  font-size: 13px;
  font-weight: 600;
  color: #005f73;
  text-decoration: none;
  background: none;
  border: none;
  padding: 0;
}

.fc-header-link.conditions_button {
  text-decoration: none;
  color: #005f73;
  padding: 0;
}

.fc-header-link:hover {
  text-decoration: underline;
}

.fc-content {
  padding: 96px 20px 96px;
  max-width: 720px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.fc-content.fc-content-sticky {
  padding-bottom: calc(160px + env(safe-area-inset-bottom));
}

.fc-content-wide {
  max-width: 1040px;
}

.fc-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 1.3;
  margin: 0;
  text-align: center;
}

.fc-title-lg {
  font-size: 28px;
}

.fc-subtitle {
  font-size: 14px;
  line-height: 1.5;
  color: #475569;
  text-align: center;
  margin: 0;
  max-width: 520px;
}

.fc-title-pill {
  display: inline-block;
  background: #005f73;
  color: #ffffff;
  padding: 2px 10px;
  border-radius: 12px;
  font-weight: 600;
}

.fc-title-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  text-align: center;
  margin-bottom: 12px;
}

.fc-pill {
  display: inline-block;
  background: #e6f6f2;
  color: #005f73;
  padding: 4px 10px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 12px;
  border: 1px solid #d6ebe6;
}

.fc-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.fc-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.fc-interests-page .fc-section {
  gap: 20px;
}

.fc-interests-page .fc-title-stack {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  column-gap: 8px;
  row-gap: 8px;
  text-align: left;
  margin-bottom: 4px;
}

.fc-interests-page .fc-title {
  order: 1;
  margin: 0;
}

.fc-interests-page .fc-subtitle {
  order: 3;
  flex-basis: 100%;
  margin-top: 2px;
  max-width: none;
  text-align: left;
}

.fc-interests-page .fc-title-pill {
  order: 2;
  background: rgba(0, 95, 115, 0.12);
  color: #005f73;
  border: 1px solid rgba(0, 95, 115, 0.25);
}

.fc-interests-page .fc-interest-search {
  margin: 0;
}

.fc-interests-page .fc-content {
  align-items: stretch;
}

.fc-interests-page .influencer_location_input_input_wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-start;
}

.fc-interests-page .influencer_location_input_input_wrapper .mantine-TextInput-root {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  display: block;
}

.fc-interests-page .influencer_location_input_input_wrapper .mantine-TextInput-input {
  width: 100%;
}

.fc-interests-page #input-activity-business-style,
.fc-interests-page #input-activity-business-style .mantine-Textarea-root {
  width: 100%;
  max-width: none;
}

.fc-interests-page #input-activity-business-style .mantine-Textarea-root {
  display: block;
}

.fc-interests-page #input-activity-business-style .mantine-Textarea-input {
  width: 100%;
}

.fc-choice-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}

.fc-choice-button {
  width: 100%;
  max-width: 360px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 14px 16px;
  font-size: 15px;
  font-weight: 600;
  color: #0f172a;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.fc-choice-button small {
  display: block;
  font-size: 12px;
  color: #64748b;
  margin-top: 4px;
  font-weight: 500;
}

.fc-choice-button:hover {
  border-color: #94d2bd;
  background: #f8fafc;
}

.fc-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.fc-cta {
  width: 100%;
  max-width: 360px;
  margin: 0 auto;
}

.fc-page .influencer_offer_button_container {
  position: static;
  transform: none;
  width: 100%;
  background: transparent;
}

.fc-page .influencer_offer_button_container.fc-sticky-cta {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(16px + env(safe-area-inset-bottom));
  width: min(420px, calc(100% - 32px));
  z-index: 1200;
}

.fc-page .influencer_offer_box_style {
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 12px;
  box-shadow: none;
  padding: 12px 14px;
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
}

.fc-page .influencer_offer_box_style::placeholder {
  color: #94a3b8;
}

.fc-page .influencer_offer_box_style:focus,
.fc-page .influencer_offer_box_style:focus-visible {
  outline: none;
  border-color: #005f73;
  box-shadow: 0 0 0 3px rgba(0, 95, 115, 0.15);
}

.fc-input {
  width: 100%;
}

.fc-input input,
.fc-input textarea,
.fc-page .influencer_location_input_input {
  font-size: 15px;
  line-height: 1.5;
  color: #0f172a;
}

.fc-form-fields {
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fc-legal {
  font-size: 12px;
  color: #64748b;
  text-align: center;
  line-height: 1.5;
}

.fc-page .fc-legal.influencer_text {
  font-size: 12px;
  color: #64748b;
}

.fc-banner {
  width: 100%;
  max-width: 420px;
  margin: 0 auto 12px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  gap: 12px;
  align-items: center;
}

.fc-banner-accent {
  background: rgba(0, 95, 115, 0.06);
  border-color: rgba(0, 95, 115, 0.18);
}

.fc-org-sponsored-card {
  max-width: 520px;
  margin: 0 auto;
  border: 1px solid rgba(0, 95, 115, 0.18);
  background: linear-gradient(165deg, #ffffff 0%, #f2f8fa 100%);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  display: grid;
  gap: 12px;
}

.fc-org-sponsored-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  width: fit-content;
  border-radius: 999px;
  border: 1px solid rgba(0, 95, 115, 0.18);
  background: rgba(0, 95, 115, 0.08);
}

.fc-org-sponsored-badge-text {
  font-size: 12px;
  font-weight: 700;
  color: #005f73;
}

.fc-interest-search {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}

.fc-page .influencer_location_input_input_wrapper {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 12px 14px;
  border: 1px solid #cbd5e1;
  border-radius: 14px;
  background: #ffffff;
}

.fc-page .influencer_location_input_input {
  background: transparent;
}

.fc-interests-container {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 14px 16px;
  margin-top: 4px;
}

.fc-interests-container > div {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
}

#category-container {
  margin-top: 4px;
}

#category-container > div {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.fc-empty-state {
  text-align: center;
  padding: 20px;
  color: #64748b;
  font-size: 14px;
}

.fc-page .interest-button,
.fc-page .selected-interest {
  background: #ffffff;
  border: 1px solid #d7dde4;
  color: #0f172a;
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  margin: 0;
  height: auto;
  box-shadow: none;
  transform: none;
  transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.fc-page .interest-button:hover {
  border-color: #94d2bd;
  background: #f8fafc;
}

.fc-page .selected-interest {
  background: #005f73;
  border-color: #005f73;
  color: #ffffff;
  box-shadow: none;
  transform: none;
}

.fc-page .selected-interest:hover {
  background: #005466;
  border-color: #005466;
}

.fc-page .interest-button:focus-visible,
.fc-page .selected-interest:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(0, 95, 115, 0.18);
}

.fc-hero-frame {
  position: relative;
  min-height: calc(100vh - 72px);
  overflow: hidden;
}

.fc-hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  filter: grayscale(100%) contrast(0.9);
  transition: opacity 0.6s ease;
  pointer-events: none;
  z-index: 0;
}

.fc-hero-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(248, 249, 250, 0.96) 0%, rgba(248, 249, 250, 0.99) 100%);
  pointer-events: none;
  z-index: 1;
}

.fc-hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 24px;
  max-width: 1200px;
  width: calc(100% - 32px);
  margin: 0 auto;
  padding: 96px 16px 96px;
}

.fc-hero-text {
  flex: 1 1 420px;
  min-width: 280px;
  max-width: 520px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  text-align: center;
}

.fc-hero-title {
  font-size: clamp(24px, 4vw, 34px);
  font-weight: 600;
  line-height: 1.25;
  color: #0f172a;
  margin: 0;
  white-space: pre-line;
}

.fc-hero-subtitle {
  font-size: clamp(14px, 2.4vw, 18px);
  line-height: 1.5;
  color: #475569;
  margin: 0;
}

.fc-hero-visual {
  flex: 1 1 420px;
  min-width: 280px;
  max-width: 620px;
  border-radius: 16px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}

.fc-hero-visual img {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

.fc-cta-bar {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 24px;
  width: min(520px, calc(100% - 32px));
  z-index: 3;
}

.fc-page .influencer_offer_button_container.fc-cta-bar {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 24px;
  width: min(520px, calc(100% - 32px));
  background: transparent;
}

.fc-page .background_circle {
  display: none;
}

.fc-modal-cta {
  background-color: #005f73;
  border: none;
  color: #ffffff;
  border-radius: 999px;
  padding: 8px 16px;
  font-weight: 600;
}

.fc-modal-content {
  border-radius: 16px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
  background: #ffffff;
}

.fc-modal-content .modal-header {
  border-bottom: 1px solid #e5e7eb;
  padding: 16px 20px;
}

.fc-modal-content .modal-title {
  font-size: 16px;
  font-weight: 600;
  color: #0f172a;
}

.fc-modal-content .modal-body {
  padding: 18px 20px;
  color: #475569;
  font-size: 14px;
  line-height: 1.6;
}

.fc-modal-content .modal-footer {
  border-top: 1px solid #e5e7eb;
  padding: 14px 20px;
  justify-content: flex-end;
}

.location-modal .modal-dialog {
  max-width: 520px;
}

.location-modal .modal-content {
  background: transparent;
  border: none;
  box-shadow: none;
}

.location-modal .modal-body {
  padding: 0;
}

.location-modal-content {
  background: transparent;
}

.location-modal-shell {
  position: relative;
  width: min(520px, 92vw);
  margin: 0 auto;
  background: transparent;
  border: 0px;
}

.location-modal-input {
  position: relative;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.location-modal-input .mantine-TextInput-input {
  border: 1px solid #e2e8f0;
  background: #ffffff;
  padding-left: 40px;
  font-size: 16px;
  color: #0f172a;
  border-radius: 18px;
  box-shadow: none;
}

.location-modal-input .mantine-TextInput-input::placeholder {
  color: #94a3b8;
}

.location-modal-input .mantine-TextInput-input:focus {
  outline: none;
  box-shadow: none;
}

.location-modal-input .mantine-TextInput-section {
  padding-left: 12px;
}

@media (max-width: 768px) {
  .fc-content {
    padding: 88px 16px 88px;
  }
  .fc-header-inner {
    padding: 0 16px;
  }
}
.welcome_title {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 50px;
    text-align: center;
    margin-top: 50px;
}

html,
body {
  overscroll-behavior-x: none;
  background-color: #f8f9fa;
}

#page-content {
  --navbar-height: calc(28px + 12px + 24px);
  --navbar-safe-offset: calc(var(--navbar-height) + env(safe-area-inset-bottom));
}

.non-pwa #page-content {
  --navbar-height: calc(28px + 20px + 20px);
}

.business-navbar-padding {
  padding-bottom: var(--navbar-safe-offset);
}

.no-navbar-padding {
  margin-bottom: 0;
}

#page-content {
  background-color: #f8f9fa;
}

input:invalid {
  outline: none !important;
}



.navbar {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  padding: 5px 20px 40px 20px; /* Valeurs par défaut */
  border-top: 1px solid #eee;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: white;
  box-shadow: 0 -5px 20px rgba(0,0,0,0.1);
  z-index: 1000;
}

/* Lorsque lapp nest pas installée en PWA (mode browser) */
.non-pwa .navbar {
  padding: 20px !important;
}

.influencer_main_container {
    font-family: Montserrat, sans-serif;
    padding: 0px 20px;
    background-color: #f8f9fa;
    position: relative;
    display: flex;
    flex-direction: column;
}

.auth-shell {
    align-items: center;
}

.auth-card {
    width: 100%;
    max-width: 520px;
    background: #ffffff;
    border-radius: 16px;
    padding: 28px 24px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    text-align: center;
    margin: 24px 0 40px;
}

.auth-card.fc-content {
    max-width: 720px;
    margin: 24px auto 40px;
    padding: 0 0 40px;
    background: transparent;
    border: none;
    box-shadow: none;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: stretch;
}

.auth-card.fc-content .influencer_offer_box_style {
    background: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    box-shadow: none !important;
    padding: 12px 14px;
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
}

.auth-card.fc-content .influencer_offer_box_style:focus-within {
    border-color: #005f73;
    box-shadow: 0 0 0 3px rgba(0, 95, 115, 0.15);
}

.auth-card.fc-content .influencer_offer_box_style::placeholder {
    color: #94a3b8;
}

.auth-card.fc-content .influencer_offer_box_style input,
.auth-card.fc-content .influencer_offer_box_style textarea {
    font-size: 15px;
    line-height: 1.5;
    color: #0f172a;
}

.auth-status-copy {
    max-width: 420px;
    margin: 0 auto;
}

.auth-actions {
    margin-top: 24px;
    width: 100%;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
}

.auth-card.fc-content .auth-actions {
    max-width: 360px;
}

.auth-links-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.auth-card.fc-content .fc-form-fields {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
}

.auth-card.fc-content .fc-form-fields > div {
    width: 100%;
}

.auth-card.fc-content .influencer_location_input_input_wrapper {
    justify-content: flex-start;
    gap: 8px;
    width: 100% !important;
}

.auth-card.fc-content .influencer_location_input_input_wrapper .mantine-TextInput-root,
.auth-card.fc-content .influencer_location_input_input_wrapper .mantine-Select-root {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    display: block;
}

.auth-card.fc-content .influencer_location_input_input_wrapper .mantine-TextInput-input,
.auth-card.fc-content .influencer_location_input_input_wrapper .mantine-Select-input {
    width: 100%;
}

.auth-card.fc-content .influencer_location_input_suggestions {
    width: 100%;
    max-width: none !important;
    left: 0;
    right: 0;
}

.auth-card.fc-content #selected-places-container,
.auth-card.fc-content #selected-business-address-container {
    width: 100% !important;
    max-width: none;
    justify-content: flex-start;
    align-items: center;
}

.create-offer-layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.create-offer-left {
    flex: 1 1 auto;
    min-width: 0;
}

.create-offer-right {
    display: none;
}

.business-create-offer {
    background: #f8fafc;
}

.business-create-offer .offer-step {
    box-shadow: none;
    border: 1px solid #e2e8f0;
}

.business-create-offer .offer-step-active {
    border-color: rgba(0, 95, 115, 0.4);
    background: #f0fdfa;
}

.business-create-offer .offer-step-number {
    background: #e2e8f0;
}

.business-create-offer .offer-detail-editor-wrap {
    position: relative;
}

.business-create-offer .offer-detail-editor {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    overflow: hidden;
    background: #ffffff;
}

.business-create-offer .offer-detail-editor .mantine-RichTextEditor-toolbar {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.business-create-offer .offer-detail-editor .mantine-RichTextEditor-content {
    min-height: 200px;
    padding-bottom: 32px;
}

.business-create-offer .offer-detail-count {
    position: absolute;
    bottom: 10px;
    right: 14px;
    font-size: 12px;
    color: #94a3b8;
}

.business-create-offer .offer-detail-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.business-create-offer .offer-detail-actions-left {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.business-create-offer .offer-detail-action {
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.2s ease;
}

.business-create-offer .offer-detail-action.primary {
    background: #005f73;
    border: 1px solid #005f73;
    color: #ffffff;
}

.business-create-offer .offer-detail-action.secondary {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #0f172a;
}

.business-create-offer .offer-detail-action:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.business-create-offer .offer-bento-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-shadow: none;
    height: 100%;
}

.business-create-offer .offer-magic-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-shadow: none;
}

.business-create-offer .offer-magic-head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.business-create-offer .offer-magic-head-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.business-create-offer .offer-magic-title {
    font-weight: 600;
    color: #0f172a;
}

.business-create-offer .offer-magic-subtitle {
    font-size: 12px;
    color: #64748b;
}

.business-create-offer .offer-magic-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.business-create-offer .inline-upload-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0, 95, 115, 0.2);
    background: rgba(0, 95, 115, 0.06);
    color: #005f73;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.business-create-offer .offer-magic-btn {
    background: #f59e0b;
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 999px;
    letter-spacing: 0;
    box-shadow: none;
    border: 1px solid #e7a008;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: all 0.2s ease;
}

.business-create-offer .offer-magic-btn:hover {
    filter: brightness(0.95);
    transform: none;
}

.offer-summary-card {
    border-radius: 20px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: none;
    overflow: hidden;
}

.offer-summary-section {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px 16px;
    background: #f8fafc;
    margin-bottom: 12px;
}

.offer-summary-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.offer-summary-icon {
    color: #0e7490;
}

.offer-summary-title {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    color: #0f172a;
}

.offer-summary-content {
    color: #334155;
    font-size: 14px;
}

/* Influencer profile refresh */
.profile-page {
    background: #f8fafc;
}

.profile-page .profile-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

@media (min-width: 1024px) {
    .profile-page .profile-content {
        max-width: none;
        margin: 0;
        padding: 0 16px;
    }
}

@media (min-width: 1200px) {
    .profile-page .profile-content {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
        align-items: start;
    }

    .profile-page .profile-hero-grid {
        grid-column: 1 / -1;
        height: auto;
    }

    .profile-page .profile-description-grid {
        margin-bottom: 0;
    }

    .profile-page .profile-payments-card {
        height: 100%;
    }

    .profile-page .profile-contact-card {
        height: auto;
    }
}


.profile-page .profile-hero-grid {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

@media (min-width: 1024px) {
    .profile-page .profile-hero-grid {
        display: grid;
        grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
        gap: 24px;
        align-items: start;
    }

    .profile-page .profile-hero-grid.profile-hero-grid--single {
        grid-template-columns: minmax(0, 1fr);
    }

    .profile-page--creator .profile-content {
        display: grid;
        grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
        gap: 24px;
        align-items: start;
    }

    .profile-page--creator .profile-hero-grid {
        grid-column: 1 / 2;
    }

    .profile-page--creator .profile-left-rail-card {
        grid-column: 1 / 2;
    }

    .profile-page--creator .profile-right-rail-card {
        grid-column: 2 / 3;
        grid-row: 1 / span 4;
        align-self: start;
        position: sticky;
        top: 0;
    }
}

.profile-page .influencer_offer_box_style,
.profile-page .profile-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    box-shadow: none;
    padding: 20px 24px;
}

.profile-page .profile-media-card {
    margin: 0;
}

.profile-page .profile-media-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.profile-page .profile-media-card--elevated {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.98) 100%);
  border: 1px solid rgba(148, 163, 184, 0.25);
}

.profile-page .profile-media-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.profile-page .profile-media-title-stack {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.profile-page .profile-media-title {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

.premium-title {
  font-size: 30px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: 0.2px;
  margin: 0;
}

.premium-subtitle {
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.profile-page .profile-media-status {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.profile-page .profile-edit-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #0f172a;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
}

.profile-page .profile-edit-btn:hover {
  border-color: rgba(0, 95, 115, 0.4);
  color: #005f73;
}

.profile-page .profile-media-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.profile-page .profile-media-stat {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.04);
}

.profile-page .profile-media-stat-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.profile-page .profile-media-stat-label {
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
  font-weight: 700;
}

.profile-page .profile-media-stat-value {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

.profile-page .profile-media-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(248, 250, 252, 0.9);
}

.profile-page .profile-media-section-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}

.profile-page .profile-media-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px 16px;
}

.profile-page .profile-media-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.profile-page .profile-media-gallery {
  display: grid;
  gap: 16px;
}

.profile-page .profile-media-gallery-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.profile-page .profile-media-gallery-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.profile-page .profile-media-gallery-title {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
}

.profile-page .profile-media-gallery-meta {
  font-size: 12px;
  color: #64748b;
}

.profile-page .profile-media-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: 8px;
}

.profile-page .profile-media-slot {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  border: 1px dashed rgba(148, 163, 184, 0.4);
  background: #ffffff;
  min-height: 80px;
  overflow: hidden;
}

.profile-page .profile-media-slot.filled {
  border-style: solid;
  border-color: rgba(148, 163, 184, 0.3);
  background: #ffffff;
}

.profile-page .profile-media-slot.empty {
  color: #94a3b8;
}

.profile-page .profile-media-slot-index {
  position: absolute;
  bottom: 6px;
  right: 8px;
  font-size: 11px;
  font-weight: 600;
  color: #94a3b8;
}

/* --- Media Kit modal redesign --- */
#media-kit-modal .modal-dialog {
  max-width: 100vw;
  margin: 0;
  min-height: 100vh;
}

#media-kit-modal .modal-content {
  border: none;
  border-radius: 0;
  overflow: visible;
  background: linear-gradient(180deg, #eef3f6 0%, #f4f6f8 100%);
  box-shadow: none;
  min-height: 100vh;
}

#media-kit-modal .modal-header.media-kit-modal-header,
#media-kit-modal .modal-body.media-kit-modal-body,
#media-kit-modal .modal-footer.media-kit-modal-footer {
  width: min(1180px, calc(100% - 48px));
  margin-left: auto;
  margin-right: auto;
}

#media-kit-modal .modal-header.media-kit-modal-header {
  margin-top: 16px;
  border: 1px solid #dbe5ec;
  border-radius: 18px;
  background: #ffffff;
  padding: 16px 18px;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.07);
}

#media-kit-modal .media-kit-header-shell {
  gap: 14px;
}

#media-kit-modal .media-kit-header-main {
  min-width: 0;
}

#media-kit-modal .media-kit-header-main > .iconify {
  min-width: 38px;
  min-height: 38px;
  padding: 8px;
  border-radius: 12px;
  border: 1px solid #c8dde5;
  background: linear-gradient(135deg, #edf7fa 0%, #e5f2f6 100%);
}

#media-kit-modal .media-kit-header-main .influencer_title {
  margin: 0;
  font-size: 18px;
  line-height: 1.15;
  color: #0f172a;
}

#media-kit-modal .media-kit-header-main .influencer_text {
  color: #64748b;
  font-size: 12px;
}

#media-kit-modal .media-kit-edit-btn.conditions_button {
  border: 1px solid #0e7490;
  border-radius: 999px;
  background: linear-gradient(135deg, #0e7490 0%, #0c8ca0 100%);
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 16px;
  box-shadow: 0 10px 22px rgba(14, 116, 144, 0.2);
  text-decoration: none !important;
}

#media-kit-modal .modal-body.media-kit-modal-body {
  margin-top: 14px;
  margin-bottom: 0;
  border: 1px solid #dbe5ec;
  border-radius: 18px;
  background: #f9fcfd;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
  padding: 18px;
}

#media-kit-tabs .nav-tabs {
  border-bottom: none;
  display: inline-grid;
  grid-auto-flow: column;
  gap: 6px;
  padding: 4px;
  border: 1px solid #d5e2e9;
  border-radius: 999px;
  background: #eff6f8;
}

#media-kit-tabs .nav-tabs .nav-item {
  margin: 0;
}

#media-kit-tabs .nav-tabs .nav-link {
  border: none;
  border-radius: 999px;
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 15px;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
}

#media-kit-tabs .nav-tabs .nav-link:hover {
  background: rgba(14, 116, 144, 0.1);
}

#media-kit-tabs .nav-tabs .nav-link.active {
  color: #ffffff;
  background: linear-gradient(135deg, #0e7490 0%, #0f766e 100%);
  box-shadow: 0 8px 18px rgba(14, 116, 144, 0.24);
}

#media-kit-tabs .tab-content {
  margin-top: 14px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

#media-kit-modal .media-kit-tab-panel {
  display: grid;
  gap: 12px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#media-kit-modal .media-kit-metrics-grid > [class*="col-"] > div,
#media-kit-modal .media-kit-content-panel > div {
  border: 1px solid #dbe6ed;
  border-radius: 15px;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
  padding: 14px;
  width: 100%;
  max-width: none;
  min-width: 0;
}

#media-kit-modal .media-kit-content-panel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

#media-kit-modal .media-kit-content-panel .profile-card,
#media-kit-modal .media-kit-content-panel .profile-media-card,
#media-kit-modal .media-kit-content-panel .ugc-preview-wrapper {
  width: 100%;
  max-width: none;
  min-width: 0;
  box-sizing: border-box;
}

#media-kit-modal .media-kit-content-panel .ugc-preview-column,
#media-kit-modal .media-kit-content-panel .ugc-preview-grid {
  min-width: 0;
}

#media-kit-modal .media-kit-metrics-grid {
  align-items: stretch;
}

#media-kit-modal .media-kit-metrics-grid > [class*="col-"] {
  display: flex;
}

#media-kit-modal .media-kit-metrics-grid > [class*="col-"] > div {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#media-kit-modal .media-kit-left-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
}

#media-kit-modal .media-kit-category-panel--inline {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid #e2e8f0;
}

#media-kit-modal .media-kit-right-column {
  height: 100%;
}

#media-kit-modal .influencer_text {
  color: #334155;
}

#media-kit-modal .mantine-TextInput-input {
  background: #ffffff;
  border: 1px solid #cad8e2;
  border-radius: 10px;
  color: #0f172a;
  font-size: 12px;
  min-height: 36px;
  height: 36px;
  padding: 0 10px;
}

#media-kit-modal .mantine-TextInput-input:focus,
#media-kit-modal .mantine-TextInput-input:focus-visible {
  border-color: #0e7490;
  box-shadow: 0 0 0 3px rgba(14, 116, 144, 0.15);
}

.media-kit-shot-upload-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 8px;
}

.media-kit-shot-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#media-kit-modal .media-kit-shot-upload {
  border: 1px dashed #a9c7d2;
  border-radius: 12px;
  padding: 10px 12px;
  cursor: pointer;
  background: linear-gradient(180deg, #f5fbfd 0%, #edf7fb 100%);
  text-align: center;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

#media-kit-modal .media-kit-shot-upload:hover {
  border-color: #0e7490;
  background: #ecf8fb;
}

#media-kit-modal .media-kit-shot-upload > div {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center;
  gap: 6px;
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
}

#media-kit-modal .media-kit-shot-upload > div span {
  margin-left: 0 !important;
  font-size: 12px !important;
}

.media-kit-shot-preview {
  position: relative;
  border: 1px solid #d5e4ea;
  border-radius: 11px;
  height: 116px;
  overflow: hidden;
  background: linear-gradient(180deg, #f6fafc 0%, #edf4f7 100%);
}

.media-kit-shot-preview-empty {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: #7d95a3;
  font-size: 11px;
  text-align: center;
  padding: 0 8px;
}

.media-kit-shot-preview-frame {
  position: relative;
  width: 100%;
  height: 100%;
}

.media-kit-shot-preview-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.media-kit-shot-scan-overlay {
  display: none;
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.media-kit-shot-preview-frame.is-scanning .media-kit-shot-scan-overlay {
  display: block;
}

.media-kit-shot-preview-frame.is-scanning .media-kit-shot-scan-overlay::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -45%;
  width: 45%;
  background: linear-gradient(
    90deg,
    rgba(14, 116, 144, 0) 0%,
    rgba(14, 116, 144, 0.22) 45%,
    rgba(14, 116, 144, 0.46) 50%,
    rgba(14, 116, 144, 0.22) 55%,
    rgba(14, 116, 144, 0) 100%
  );
  animation: media-kit-scan 1.1s linear infinite;
}

#media-kit-modal .media-kit-warning {
  margin-top: 2px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(245, 158, 11, 0.34);
  background: rgba(254, 243, 199, 0.56);
  color: #92400e;
  font-size: 12px;
}

#media-kit-modal .media-kit-feedback {
  margin-top: 2px;
  min-height: 18px;
  font-size: 13px;
  font-weight: 600;
}

#media-kit-modal .media-kit-analyze-btn.conditions_button,
#media-kit-modal .media-kit-save-btn.conditions_button {
  border-radius: 12px;
  border: 1px solid #0e7490;
  background: linear-gradient(135deg, #0e7490 0%, #0c8ca0 100%);
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 16px;
  text-decoration: none !important;
  box-shadow: 0 10px 20px rgba(14, 116, 144, 0.2);
  margin: 0;
}

#media-kit-modal .media-kit-analyze-btn.conditions_button {
  margin-top: 10px;
}

#media-kit-modal .media-kit-save-btn.conditions_button {
  position: static;
  left: auto;
  transform: none;
  bottom: auto;
  z-index: auto;
  min-width: 190px;
  justify-content: center;
  margin-left: auto;
}

#media-kit-modal .media-kit-analyze-btn.conditions_button:hover,
#media-kit-modal .media-kit-save-btn.conditions_button:hover {
  background: linear-gradient(135deg, #0c6b86 0%, #0a7b8f 100%);
  border-color: #0c6b86;
}

#media-kit-modal .media-kit-close-btn.conditions_button {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid #d2dde5;
  background: #ffffff;
  color: #0f172a;
  font-size: 22px;
  font-weight: 500;
  line-height: 1;
  padding: 0;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
}

#media-kit-modal .modal-footer.media-kit-modal-footer {
  border-top: none;
  position: sticky;
  bottom: 0;
  z-index: 1080;
  margin-top: 12px;
  background: linear-gradient(180deg, rgba(238, 243, 246, 0) 0%, rgba(238, 243, 246, 0.94) 40%, #eef3f6 100%);
  padding: 10px 0 calc(14px + env(safe-area-inset-bottom));
  min-height: 0;
}

@keyframes media-kit-scan {
  from {
    left: -45%;
  }
  to {
    left: 100%;
  }
}

@media (max-width: 900px) {
  #media-kit-modal .modal-dialog {
    max-width: 100vw;
    margin: 0;
  }

  #media-kit-modal .modal-header.media-kit-modal-header,
  #media-kit-modal .modal-body.media-kit-modal-body,
  #media-kit-modal .modal-footer.media-kit-modal-footer {
    width: calc(100% - 24px);
  }

  #media-kit-modal .modal-header.media-kit-modal-header,
  #media-kit-modal .modal-body.media-kit-modal-body,
  #media-kit-modal .modal-footer.media-kit-modal-footer {
    padding-left: 14px;
    padding-right: 14px;
  }

  #media-kit-modal .modal-header.media-kit-modal-header {
    margin-top: 10px;
  }

  #media-kit-modal .modal-body.media-kit-modal-body {
    margin-top: 10px;
  }

  .media-kit-shot-upload-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #media-kit-tabs .nav-tabs {
    width: 100%;
    justify-content: center;
  }

  #media-kit-modal .media-kit-save-btn.conditions_button {
    width: 100%;
    margin-left: 0;
  }
}

.profile-page .profile-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.profile-page .profile-hero-body {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

.profile-page .profile-avatar {
    width: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.profile-page .profile-avatar-img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #e2e8f0;
    display: block;
    transition: transform 0.18s ease, filter 0.18s ease;
}

.profile-page .profile-avatar-upload {
    display: block;
    width: 110px;
    margin-top: 0;
}

.profile-page .profile-avatar-upload-input {
    display: block;
    cursor: pointer;
    line-height: 0;
}

.profile-page .profile-avatar-upload-trigger {
    position: relative;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;
}

.profile-page .profile-avatar-hover-hint {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 7px 8px;
    font-size: 11px;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
    background: linear-gradient(
        180deg,
        rgba(15, 23, 42, 0) 0%,
        rgba(15, 23, 42, 0.72) 65%,
        rgba(15, 23, 42, 0.82) 100%
    );
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.18s ease, transform 0.18s ease;
    pointer-events: none;
}

.profile-page .profile-avatar-upload-trigger:hover .profile-avatar-hover-hint,
.profile-page .profile-avatar-upload-trigger:focus-within .profile-avatar-hover-hint {
    opacity: 1;
    transform: translateY(0);
}

.profile-page .profile-avatar-upload-trigger:hover .profile-avatar-img,
.profile-page .profile-avatar-upload-trigger:focus-within .profile-avatar-img {
    filter: brightness(0.86);
    transform: scale(1.02);
}

.profile-page .profile-hero-info {
    flex: 1 1 260px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

@media (max-width: 768px) {
    .profile-page .profile-content {
        gap: 14px;
    }

    .profile-page .profile-hero-grid {
        gap: 14px;
    }

    .profile-page .profile-description-side {
        gap: 14px;
    }

    .profile-page .profile-hero-body {
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 14px;
    }

    .profile-page .profile-avatar {
        width: auto;
        min-width: 92px;
        align-items: center;
        gap: 6px;
    }

    .profile-page .profile-avatar-upload {
        width: 88px;
        margin-top: 0;
    }

    .profile-page .profile-avatar-upload-trigger {
        width: 88px;
        height: 88px;
    }

    .profile-page .profile-avatar-hover-hint {
        font-size: 10px;
        padding: 6px;
    }

    .profile-page .profile-hero-info {
        flex: 1 1 0%;
        min-width: 0;
        gap: 8px;
    }

    .profile-page .profile-stat-collabs {
        order: 1;
    }

    .profile-page .profile-stat-rating {
        order: 2;
    }

    .profile-page .profile-stat-offered-inline {
        order: 3;
        display: none !important;
    }

    .profile-page .profile-stat-sponsored {
        order: 4;
    }

    .profile-page.profile-page--creator .profile-stat-offered-mobile-row {
        display: flex;
        align-items: center;
        width: 100%;
        margin-top: 8px;
        white-space: normal;
        line-height: 1.35;
    }

    .profile-page .profile-contact-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin: 0;
    }

    .profile-page .profile-contact-links .contact-link,
    .profile-page .profile-contact-links .conditions_button {
        width: 100%;
        padding: 8px 10px !important;
    }

    /* Keep vertical rhythm consistent on business mobile profile cards */
    .profile-page.profile-page--business .profile-mail-preferences-card {
        margin-bottom: 0 !important;
    }
}

.profile-page .influencer_carousel_tag {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 6px 12px;
    box-shadow: none;
}

.profile-page hr {
    border-color: #e2e8f0;
}

.profile-page .contact-link {
    border-radius: 999px;
}

.profile-page .profile-contact-links {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 10px;
    margin: 5px;
    max-width: 100%;
}

.profile-page .profile-contact-links .contact-link,
.profile-page .profile-contact-links .conditions_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.profile-page .profile-stat-offered-mobile-row {
    display: none;
}

.profile-page .conditions_button {
    border-radius: 999px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #0f172a;
    font-weight: 600;
}

.profile-page .conditions_button.ugc-update-button {
    background: #0e7490;
    border-color: #0e7490;
    color: #ffffff;
}

.content-included-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    gap: 20px;
}

.content-included-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.content-included-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.content-included-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: max-height 0.25s ease, opacity 0.25s ease, transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.content-included-card-active {
    border-color: rgba(14, 116, 144, 0.45);
    background: #f3fafc;
    box-shadow: 0 10px 18px rgba(8, 145, 178, 0.12);
}

.content-included-card-muted {
    opacity: 0.56;
    filter: saturate(0.75);
}

.content-included-or {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: #94a3b8;
    text-transform: uppercase;
    text-align: center;
}

.offer-recap-card {
    background: #ffffff;
    border: 1px solid #dbe4ee;
    border-radius: 16px;
    padding: 14px;
    box-shadow: none;
}

.offer-recap-breakdown-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.offer-recap-breakdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    border-radius: 10px;
    padding: 7px 10px;
}

.offer-recap-breakdown-label {
    color: #64748b;
    font-size: 12px;
}

.offer-recap-breakdown-price {
    color: #0f172a;
    font-size: 12px;
    font-weight: 700;
}

.offer-recap-item {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 10px 12px;
    background: #ffffff;
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.offer-recap-item-stacked {
    flex-direction: column;
}

.offer-recap-item-label {
    color: #64748b;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    font-weight: 700;
}

.offer-recap-item-value {
    color: #0f172a;
    font-size: 13px;
    font-weight: 600;
}

.offer-stepper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.offer-step {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    box-shadow: none;
    cursor: pointer;
}

.offer-step-number {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    background: #e2e8f0;
    color: #475569;
    flex-shrink: 0;
}

.offer-step-label {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
}

.offer-step-sub {
    font-size: 11px;
    color: #64748b;
    line-height: 1.2;
}

.offer-step-active {
    border-color: #005f73;
    box-shadow: 0 0 0 1px rgba(0, 95, 115, 0.25);
}

.offer-step-active .offer-step-number {
    background: #005f73;
    color: #ffffff;
}

.offer-step-complete {
    border-color: #16a34a;
    background: #f0fdf4;
}

.offer-step-complete .offer-step-number {
    background: #16a34a;
    color: #ffffff;
}

.offer-summary-shell {
    border: 1px solid #dbe4ee;
    border-radius: 16px;
    box-shadow: none;
    background: #ffffff;
}

/* No gradients allowed on create-offer surfaces */
.business-create-offer,
.business-create-offer .offer-step,
.business-create-offer .offer-recap-card,
.business-create-offer .offer-summary-card,
.business-create-offer .offer-summary-section,
.business-create-offer .offer-bento-card,
.business-create-offer .content-included-card,
.business-create-offer .content-included-card-active,
.business-create-offer .content-included-panel,
.business-create-offer .content-included-options,
.business-create-offer .influencer_offer_box_style,
.business-create-offer .mantine-Paper-root {
    background-image: none !important;
}

.business-create-offer .content-included-card-active {
    background: #f3fafc !important;
}

@media (max-width: 720px) {
    .offer-stepper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .content-included-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 1024px) {
    .create-offer-layout {
        flex-direction: row;
        align-items: flex-start;
    }
    .create-offer-right {
        display: block;
        flex: 0 0 320px;
        max-width: 320px;
        position: sticky;
        top: 120px;
        align-self: flex-start;
    }
}

.influencer_container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.influencer_title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 5px;
    font-family: Montserrat, sans-serif; !important;
    text-align: left !important
}

.influencer_text {
    font-size: 14px;
    color: #666;
    margin-bottom: 0px;
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-family: Montserrat, sans-serif !important;

}

.influencer_view_all {
    text-decoration: none;
    color: #005f73;
    font-size: 16px;
    font-weight: bold;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.influencer_carousel_card_container {
    width: 270px;
    border-radius: 20px;
    overflow: hidden;
    margin-right: 10px;
    display: inline-block;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-color: white;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.influencer_carousel_card_container:active {
    transform: scale(0.95);
  box-shadow: none;
    transition: none;
}

.influencer_carousel_card_container:focus {
    border: 2px solid #94d2bd;
    outline: none;
}

.influencer_carousel_card_container_bookings {
    width: 270px;
    border-radius: 20px;
    overflow: hidden;
    margin-right: 10px;
    display: inline-block;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-color: white;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}
.influencer_carousel_card_container_bookings:active {
  transform: scale(0.95);
  box-shadow: none;
  transition: none; /* No transition delay on active state */
}


.influencer_carousel_image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0
}

.influencer_carousel_heart_icon {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.offer-reco-pill {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 2;
    margin: 0;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.42);
    color: #f8fafc;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.28);
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(3px);
}

.offer-time-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
}
.influencer_carousel_tags_container {
    position: absolute;
    bottom: 10px;
    left: 10px;
    display: flex;
    gap: 1px;
}

.influencer_carousel_tag {
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 15px;
    padding: 4px 8px;
    font-size: 12px;
    font-weight: bold;
    color: #005f73;
}

.influencer_card_footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    margin: 0;
    color: #005f73;
}

.influencer_filter_container {
    overflow-x: auto;
    white-space: nowrap;
    margin-bottom:10px;

}

.influencer_filter_category_button {
    background-color: rgba(220,220,220, 0.5);
    color: #005f73;
    border: none;
    border-radius: 25px;
    padding: 5px 10px;
    font-size: 14px;
    font-weight: bold;
    margin-right: 3px;
    transition: all 0.3s ease;
}

.influencer_location_input_input_wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #e2e8f0;
  padding: 6px 10px;
  border-radius: 14px;
  background: #ffffff;
}


.influencer_location_input_input {
  border: none;
  background-color: transparent;
  font-size: 16px;
  color: #0f172a;
  width: 100%;
  outline: none;
}

.influencer_location_input_input::placeholder {
  color: #94a3b8;
}

.influencer_location_input_suggestions {
  width: 100%;
  max-height: 200px;
  overflow-y: auto;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  z-index: 1000;
  box-shadow: none;
  padding: 8px;
}

.influencer_location_input_suggestions > div {
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  background: #ffffff;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.influencer_location_input_suggestions > div + div {
  margin-top: 6px;
}

.influencer_location_input_suggestions > div:hover {
  border-color: rgba(0, 95, 115, 0.35);
  background: rgba(0, 95, 115, 0.04);
}

.influencer_location_input_suggestions:empty {
    display: none !important;
    border: none !important;
}

.influencer_map_container {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 10px;
    height:250px
}

.influencer_hover_map_info {
    width: 100%;
}

/* Tuiles (déjà présent chez toi) */
.influencer_offer_image_gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 10px;
}

.influencer_offer_image_gallery > div {
    position: relative;
    border: 2px dashed #ccc;
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: #f7f7f8;
    transition: border-color .2s ease;
}

/* Badge "Image 1/2/3" — ne doit PAS capter les événements souris */
.influencer_offer_image_gallery > div::after {
    position: absolute;
    left: 8px; top: 8px;
    font-size: 12px;
    padding: 2px 6px;
    background: rgba(0,0,0,.55);
    color: #fff;
    border-radius: 12px;
    line-height: 1;
    pointer-events: none;      /* <<< empêche de bloquer le clic upload */
    z-index: 2;
}

.influencer_offer_main_image_img_offer {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 20px;
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
}

.influencer_offer_image_gallery_offer {
    display: flex;
    margin-bottom: 10px;
    position: relative;
    height: 200px;
    gap: 8px;
}

.influencer_offer_main_image_container_offer {
    flex: 3;  /* Takes up more space than side images */
    overflow: hidden;
    border-radius: 16px;
}

.influencer_offer_main_image_img_offer {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease-in-out;
    cursor: pointer;
}

.influencer_offer_side_images_container_offer {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
}

.influencer_offer_side_image_offer {
    width: 100%;
    height: calc(50% - 4px);
    object-fit: cover;
    border-radius: 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
    cursor: pointer;
}

.influencer_offer_main_image_img_offer:hover,
.influencer_offer_side_image_offer:hover {
}

.influencer_offer_button_container {
    position: fixed;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    width: 313px;
    padding: 0px;
    background-color: rgba(0, 0, 0, 0);
    z-index: 1000;
}

.influencer_offer_button {
    border-radius: 27px;
    font-weight: 600;
    font-size: 18px;
    background-color: #005f73;
    color: #fff;
    width: 100%;
    outline: none;
    padding: 12px 0px;
    border: none;
    transition: transform 0.2s ease, background-color 0.2s ease; /* Smooth transition for normal state */
    cursor: pointer;
}

/* Hover effect for better UX */
.influencer_offer_button:hover {
    background-color: #005f73;
    color: #fff;
    }

/* Active effect (immediate response) */
.influencer_offer_button:active {
    transform: scale(0.95);
    background-color: #005f73;
    color: #fff;
    transition: none;
}

/* Focus state for keyboard accessibility */
.influencer_offer_button:focus {
    box-shadow: 0 0 0 3px rgba(0, 95, 115, 0.5);
    outline: none;
    background-color: #005f73;
    color: #fff;
}


.influencer_offer_box_style {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 10px 20px 10px 20px;
    margin-bottom: 20px
}

.map-container {
    border-radius: 16px;
    overflow: hidden;
}

.map-container .js-plotly-plot .plotly .mapboxgl-canvas-container {
    border-radius: 16px;
}

.background_circle {
        width: 300px;
        height: 300px,;
        background: rgba(255, 102, 0, 0.16);
        position: absolute;
        top: -150px;
        left: -150px;
        border-radius: 50%
    }

.highlight {
        background-color: rgb(0, 95, 115);
        color: white;
        padding: 2px 10px;
        border-radius: 15px;
        font-weight: 700;
    }

/* Feedback grid (desktop 2x2, mobile 1x1) */
.feedback-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 640px) {
    .feedback-grid {
        grid-template-columns: 1fr;
    }
}

.select_button {
        width: 313px;
        height: 58px;
        text-align: center;
        cursor: pointer;
        transition: all 0.3s ease-in-out;
        margin: 10px auto;
        display: block;
        border-radius: 8px;
    font-weight: 600;
    font-size: 18px;
    background-color: #005f73;
    color: #fff;
    outline: none;
    padding: 12px 0px;
            border: none;

    }

/* Hover effect for better UX */
.select_button:hover {
    background-color: #0a9396;
}

/* Active effect (immediate response) */
.select_button:active {
    transform: scale(0.95);
    transition: none; /* No transition delay on active state */
    background-color: #005f73;
}

/* Focus state for keyboard accessibility */
.select_button:focus {
    box-shadow: 0 0 0 3px rgba(0, 95, 115, 0.5); /* Adds focus ring for accessibility */
    outline: none;
}

.conditions_button {
        background-color: transparent;
        color: rgb(0, 95, 115);
        border: none;
        padding: 5px 15px;
        font-size: 14px;
        cursor: pointer;
        transition: all 0.3s ease-in-out;
        text-decoration: underline;
        font-weight: 600;
        text-align: center;
        cursor: pointer;
        transition: all 0.3s ease-in-out;
        margin: 10px auto;
        display: block;
        border-radius: 8px;
    }

.signup-orange {
    background-color: #ffffff !important;
    color: #ee9b00 !important;
    border: 2px solid #ee9b00 !important;
    text-decoration: none !important;
}

.signup-orange:hover {
    background-color: #fff3e0 !important;
    color: #d48800 !important;
}

.signup-outline {
    background-color: #ffffff !important;
    color: #ee9b00 !important;
    border: 2px solid #ee9b00 !important;
    text-decoration: none !important;
}

.signup-outline:hover {
    background-color: #fff3e0 !important;
    color: #d48800 !important;
}

.save-button-profile {
    display: block;
    margin: 12px auto;
    padding: 14px 0;

    width: 180px;
    border-radius: 24px;

    background-color: #005f73;
    color: #ffffff;

    font-size: 14px;
    font-weight: 500;
    text-align: center;

    cursor: pointer;
    border: none;
    outline: none;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}


/* Button group container */
.button-group {
    display: flex;
    gap: 20px;
}

.tag-fav-btn {
    padding: 3px 15px;
    border: 1px solid #ccc;
    border-radius: 30px;
    color: #005f73;
    background-color: white;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: bold;
}

.platform-button {
    padding: 3px 15px;
    border-radius: 30px;
    border: none;
    color: white;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: bold;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Instagram button */
#instagram-button {
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
}

/* TikTok button */
#tiktok-button {
    background: #000000;
}

/* Active state for both buttons */
.platform-button.active {
    transform: scale(1.1);
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
}

/* Unselected state for both buttons */
.platform-button:not(.active) {
    opacity: 0.5;
    filter: grayscale(50%);
}

/* Hover state */
.platform-button:hover {
    opacity: 0.9;
    filter: grayscale(0%);
}

/* Ensure active button stays prominent on hover */
.platform-button.active:hover {
    opacity: 1;
    filter: none;
}

.profile_picture_avatar {
                    width: 48px;
                    height: 48px;
                    border-radius: 20%;
                    object-fit: cover;
                }


@keyframes float {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0px);
    }
}

/* Style the custom checkboxes when selected */
.custom-checkbox input[type="checkbox"]:checked {
    background-color: #ee9b00;  /* The color you want */
    border-color: #ee9b00;
}


.btn-accept-file {
                                    color: white;
                                    border: 1px solid #005f73;
                                    padding: 5px 12px;
                                    font-size: 12px;
                                    border-radius: 25px;
                                    cursor: pointer;
                                    background-color: #005f73
                                }

.selected-interest {
    height: 40px;
    background: #005f73;
    border: none;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    padding: 0 20px;
    cursor: pointer;
    margin: 5px;
    flex-grow: 0;
    flex-shrink: 0;
    box-shadow: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    color: white;
    transform: none;
}
.interest-button:hover {
}

.interest-button,
.selected-interest {
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

/* Dropdown container */
.material-dropdown {
    font-family: Arial, sans-serif;
    font-size: 14px;
}

/* Selected items with rounded corners and custom color */
.material-dropdown .Select-value {
    padding: 3px 15px;
    border: 1px solid #ccc;
    border-radius: 30px;
    color: #005f73;
    background-color: white;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: bold;
}

/* Dropdown options hover effect */
.material-dropdown .Select-option:hover {
    background-color: #0a9396 !important;
    color: white !important;
}

.tooltip-container {
    position: relative;
    display: inline-block;
}

.tooltip-container:hover .tooltip-text,
.tooltip-container:focus-within .tooltip-text {
    visibility: visible;  /* Show the tooltip when hovered or focused */
}

.heart-icon {
    transition: transform 0.3s ease-in-out, color 0.3s ease-in-out;
    cursor: pointer; /* Adds a pointer cursor for better interactivity */
    user-select: none; /* Prevents text selection when clicking the icon */
}

.heart-icon.clicked {
    color: #ef476f;
    animation: bounce 0.5s ease-in-out;
}

@keyframes double-bounce {
  0% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.25); /* premier agrandissement */
  }
  50% {
    transform: scale(1);    /* retour à létat initial */
  }
  75% {
    transform: scale(1.25); /* deuxième agrandissement */
  }
  100% {
    transform: scale(1);    /* retour final */
  }
}

.heart-icon.clicked-twice {
  color: #ef476f;
  animation: double-bounce 1.3s ease-in-out;
}

/* Bounce animation */
@keyframes bounce {
    0% {
        transform: scale(1);
    }
    30% {
        transform: scale(1.3); /* Slight enlargement for a smoother effect */
    }
    50% {
        transform: scale(1.5); /* Peak size */
    }
    70% {
        transform: scale(1.3); /* Gradual shrink back */
    }
    100% {
        transform: scale(1); /* Return to original size */
    }
}


.attach-button,
.send-button {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 20px;
    color: #0084ff;
    margin-left: 5px;
    padding: 8px;
    border-radius: 50%;
    transition: background-color 0.2s;
}

.attach-button:hover,
.send-button:hover {
    background-color: #e6f2ff;
}

/* Hide the actual radio inputs */
.offer-type-radioitems input[type="radio"] {
    display: none;
    font-size: 14px;
}

/* Style the labels as buttons */
.offer-type-radioitems .offer-type-label {
    cursor: pointer;
    padding: 10px 20px;
    font-size: 14px;
    border: 2px solid #005f73;  /* Primary color border */
    border-radius: 8px;
    background-color: white;
    color: #005f73;
    transition: background-color 0.3s, color 0.3s;
    font-weight: bold;
    text-align: center;
    flex: 1;
}

.segmented-control-custom .btn-outline-primary {
  /* --bs- variables sont des variables CSS de Bootstrap 5 */
  --bs-btn-color: #005f73;                  /* Couleur du texte */
  --bs-btn-border-color: #005f73;           /* Couleur de la bordure */
  --bs-btn-hover-bg: #005f73;               /* Fond au survol */
  --bs-btn-hover-border-color: #005f73;      /* Bordure au survol */
  --bs-btn-hover-color: #fff;               /* Texte au survol */
  --bs-btn-active-bg: #005f73;              /* Fond quand cliqué/actif */
  --bs-btn-active-border-color: #005f73;     /* Bordure quand cliqué/actif */
  --bs-btn-active-color: #fff;              /* Texte quand cliqué/actif */
}

/* Style spécifique pour le bouton actif pour garantir que le fond reste coloré */
.segmented-control-custom .btn-outline-primary.active {
    background-color: #005f73;
    color: white;
}

/* When the radio button is checked, style the label differently */
.offer-type-radioitems input[type="radio"]:checked + .offer-type-label {
    background-color: #005f73;
    color: white;
    font-size: 14px;
}

/* Optional: Hover effect */
.offer-type-radioitems .offer-type-label:hover {
    background-color: #e0f7fa;
}

/* assets/custom.css */
.custom-modal-content {
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.unified-pricing-card {
    display: flex; /* Ajouté pour un meilleur contrôle de la hauteur des enfants */
    flex-direction: column; /* Assure que les enfants sempilent verticalement */
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background-color: rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 16px 40px -15px rgba(0, 95, 115, 0.2);
    padding: 25px 40px; /* Padding légèrement ajusté pour léquilibre */
    flex-shrink: 0;
    opacity: 0;
    transform: translateY(20px);
    animation: slideUpFadeIn 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s forwards;
}

.business-page .unified-pricing-card {
    padding: 18px 22px;
}

@keyframes slideUpFadeIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/**
 * ===================================================================
 * Composant de sélection (Billing Toggle)
 * ===================================================================
 */

.billing-toggle-container {
    position: relative;
    display: flex;
    background-color: rgba(0, 95, 115, 0.08);
    border-radius: 24px;
    padding: 4px;
    margin: 0 auto;
}

.glider {
    position: absolute;
    top: 4px;
    bottom: 4px;
    width: calc((100% - 8px) / 3);
    background-color: #005f73;
    border-radius: 20px;
    box-shadow: 0 4px 12px -4px rgba(0, 95, 115, 0.6);
    transition: transform 0.4s cubic-bezier(0.65, 0, 0.35, 1);
}

/* Mantine SegmentedControl fallback (plan-selector) */
.billing-toggle-container .glider {
    display: none;
}

.billing-toggle-container .mantine-SegmentedControl-root {
    flex: 1;
    width: 100%;
    background: transparent;
}

.billing-toggle-container .mantine-SegmentedControl-control {
    flex: 1;
}

.billing-toggle-container .mantine-SegmentedControl-label {
    color: #005f73;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.3;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.billing-toggle-container .mantine-SegmentedControl-control[data-active] .mantine-SegmentedControl-label {
    color: #ffffff;
}

.billing-toggle-container .mantine-SegmentedControl-indicator {
    background-color: #005f73;
    border-radius: 20px;
    box-shadow: 0 4px 12px -4px rgba(0, 95, 115, 0.6);
}

#plan-selector {
    display: flex !important; /* Maintenu pour surcharger le JS inline */
    flex-wrap: nowrap !important;
    width: 100%;
    align-items: stretch;
}

#plan-selector .form-check {
    flex: 1;
    display: flex;
}

.billing-toggle-container .btn {
  position: relative;
  flex: 1;
  z-index: 2;
  background-color: transparent !important; /* Surcharge nécessaire */
  border: none !important;
  box-shadow: none !important;
  color: #005f73;
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
  transition: color 0.4s ease;
        font-size: 14px;
        padding: 8px 5px;
        line-height: 1.3;
        min-height: 50px; /* Assure une hauteur constante même avec 2 lignes de texte */
        display: flex;
        align-items: center;
        justify-content: center;


}

.billing-toggle-container .btn.active {
    color: white !important;
}

.billing-toggle-container.free-active .glider   { transform: translateX(0%); }
.billing-toggle-container.monthly-active .glider { transform: translateX(100%); }
.billing-toggle-container.yearly-active .glider  { transform: translateX(200%); }


/**
 * ===================================================================
 * Styles génériques et de contenu
 * ===================================================================
 */

.price-amount {
    font-size: 42px;
    font-weight: 700;
    color: #111827;
    transition: font-size 0.3s ease;
}

.price-period {
    font-size: 16px;
    color: #6B7280;
    margin-left: 8px;
}

.features-list li {
    margin-bottom: 18px;
    color: #34495E;
    font-size: 16px;
}

.feature-item .d-flex > div:last-child {
  line-height: 1.4;
}

.subscribe-button-unified {
    width: 100%;
    background-color: #005f73;
    border: none;
    color: white;
    font-weight: 600;
    padding: 14px;
    border-radius: 12px;
    transition: all 0.3s ease-out;
}

.subscribe-button-unified:hover {
    background-color: #0a9396;
}

.discount-pill-in-toggle {
    display: inline-block;
    vertical-align: middle;
    background-color: #E6F6F2;
    color: #0B997A;
    font-size: 12px;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 12px;
    margin-left: 8px;
    line-height: 1;
}

.highlighted-feature {
    font-weight: 600;
    color: #005f73;
}

.highlighted-feature .iconify {
    color: #005f73;
}


/**
 * ===================================================================
 * Ajustements Responsives
 * ===================================================================
 */

/* -- Pour les tablettes et plus petit -- */
@media (max-width: 767.98px) {
    /* Si influencer_main_container est défini dans un autre fichier, cette règle sappliquera */
    .influencer_main_container {
        padding: 0 10px;
    }

    .unified-pricing-card {
        padding: 20px 15px;
    }

    .business-page .unified-pricing-card {
        padding: 14px 12px;
        border-radius: 18px;
    }

    /* --- Correction du Toggle pour les petits écrans --- */
    .billing-toggle-container .btn {
        font-size: 14px;
        padding: 8px 5px;
        white-space: normal !important; /* La règle la plus importante : permet le retour à la ligne */
        line-height: 1.3;
        min-height: 50px; /* Assure une hauteur constante même avec 2 lignes de texte */
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .discount-pill-in-toggle {
        font-size: 11px;
        padding: 3px 6px;
        margin-left: 4px;
    }

    /* --- Ajustements de la typographie --- */
    .price-amount {
        font-size: 36px;
    }

    /* Si influencer-title est défini dans un autre fichier, cette règle sappliquera */
    .influencer-title {
        font-size: 28px !important;
        margin-bottom: 40px !important;
    }
}

/* -- Pour les mobiles très étroits -- */
@media (max-width: 360px) {
    .billing-toggle-container .btn {
        font-size: 13px; /* On réduit encore un peu pour plus de confort */
    }
}

.custom-modal-dialog .modal-content {
    border-radius: 16px;
    border: none;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

/* --- En-tête --- */
.modal-header {
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    padding: 1rem 1.5rem;
}

.modal-title {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

/* --- Corps --- */
.modal-body-content {
    padding: 1.5rem;
}

.form-group {
    margin-bottom: 1.25rem;
}

.form-label {
    display: block;
    font-weight: 500;
    color: #495057;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

/* --- Champs de saisie (Input, Textarea) --- */
.form-control {
    width: 100%;
    padding: 0.65rem 1rem;
    border: 1px solid #ced4da;
    border-radius: 8px;
    font-size: 1rem;
    color: #495057;
    background-color: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control:focus {
    border-color: #005f73;
    box-shadow: 0 0 0 0.2rem rgba(0, 95, 115, 0.2);
    outline: none;
}

.text-area-input {
    resize: vertical;
    min-height: 80px;
}

/* --- Barre de Recherche --- */
.search-bar-wrapper {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0 1rem;
    border: 1px solid #ced4da;
    border-radius: 8px;
    background-color: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.search-bar-wrapper:focus-within {
    border-color: #005f73;
    box-shadow: 0 0 0 0.2rem rgba(0, 95, 115, 0.2);
}
.search-input {
    border: none !important;
    box-shadow: none !important;
    padding-left: 0;
}
.search-input:focus {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* --- Section Logo/Photo --- */
.photo-upload-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    padding: 10px;
    border: 2px dashed #e0e0e0;
    border-radius: 12px;
    background-color: #fdfdfd;
    height: 100%;
}

.profile-photo-preview {
    height: 60px;
    width: 60px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    background-color: #e9ecef; /* Placeholder color */
}

.upload-component {
    text-align: center;
    cursor: pointer;
}

.upload-area-content {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 8px;
    transition: background-color 0.3s ease;
}
.upload-area-content:hover {
    background-color: #e9f5ff;
}

.upload-text {
    color: #0056b3;
    font-weight: 500;
    font-size: 0.9rem;
}

/* --- Suggestions d'adresse --- */
.location-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050; /* Doit être au-dessus du reste de la modale */
    max-height: 200px;
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
    margin-top: -1px; /* Colle les suggestions à l'input */
}

/* --- Pied de page et Boutons --- */
.modal-footer-buttons {
    display: flex;
    justify-content: flex-end;
    padding: 1rem 1.5rem;
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

.btn-primary-action, .btn-secondary-outline {
    border-radius: 25px;
    padding: 0.5rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

.btn-primary-action {
    background-color: #005f73;
    color: white;
    border-color: #005f73;
}
.btn-primary-action:hover {
    background-color: #004c5c;
    border-color: #004c5c;
}

.btn-secondary-outline {
    background-color: transparent;
    color: #6c757d;
    border-color: #6c757d;
}
.btn-secondary-outline:hover {
    background-color: #6c757d;
    color: white;
}

.chat-input-area-container {
    position: absolute;
    bottom: 70px;
    left: 0;
    right: 0;
    padding: 8px 16px 8px;
    background-color: #ffffff;
    border-top: 1px solid #e5e7eb;
}

/* The visual input bar that groups all controls */
.chat-input-bar {
    display: flex;
    align-items: flex-end; /* Aligns items to the bottom, perfect for a growing textarea */
    gap: 10px; /* Consistent spacing between controls */
    background-color: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 24px; /* Fully rounded corners */
    padding: 6px 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    width: 100%;
}

/* Adds a highlight effect when the user is typing */
.chat-input-bar:focus-within {
    border-color: #005f73;
    box-shadow: 0 0 0 3px rgba(0, 95, 115, 0.1);
}

/* Wrapper for the dcc.Upload component */
.chat-input-bar .dcc-upload {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center; /* Keeps the button vertically centered */
}

.chat-input-field {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 6px;
    min-width: 0;
}

.chat-input-icon {
    color: #94a3b8;
    flex-shrink: 0;
    display: none;
}

/* The textarea where the user types their message */
.chat-input-bar textarea {
    flex-grow: 1; /* Allows the textarea to take up available space */
    border: none;
    outline: none;
    resize: none;
    background-color: transparent;
    font-size: 16px;
    line-height: 1.5;
    padding: 8px 5px;
    margin: 0;
    max-height: 125px; /* Limits growth to about 5 lines */
    overflow-y: auto; /* Adds a scrollbar if the text exceeds the max height */
    width: 100%;
    color: #111827;
}

.chat-input-field .mantine-Textarea-root,
.chat-input-field .mantine-Textarea-wrapper,
.chat-input-field .mantine-Textarea-input,
.chat-input-field textarea {
    width: 100%;
    flex: 1 1 auto;
}

.chat-input-field textarea {
    padding-left: 0;
}

/* Custom placeholder color */
.chat-input-bar textarea::placeholder {
    color: #9ca3af;
}

/* A shared style for the round icon buttons (Attach & Send) */
.chat-action-button {
    flex-shrink: 0; /* Prevents buttons from being squashed */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    background-color: transparent;
    color: #4b5563; /* Default icon color */
    transition: background-color 0.2s ease;
    align-self: center;
}

/* Subtle feedback on hover */
.chat-action-button:hover {
    background-color: #f3f4f6;
}

/* Specific styling for the Send button */
#send-button-chat {
    background-color: #005f73; /* Primary brand color */
    color: white;
}

@media (min-width: 992px) {
    #tracking-view-icon {
        display: none !important;
    }
}

#send-button-chat:hover {
    background-color: #004c5c; /* A darker shade for the hover state */
}

/* Style for the disabled send button */
#send-button-chat:disabled {
    background-color: #94d2bd; /* A lighter, muted color */
    color: #e0f2f1;
    cursor: not-allowed;
}

#send-button-chat[data-dash-is-loading="true"] {
    position: relative;
}

#send-button-chat[data-dash-is-loading="true"] > * {
    visibility: hidden;
}

#send-button-chat[data-dash-is-loading="true"]::after {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.6);
    border-top-color: #ffffff;
    border-radius: 50%;
    display: block;
    animation: sendButtonSpin 0.8s linear infinite;
}

@keyframes sendButtonSpin {
    to {
        transform: rotate(360deg);
    }
}

#login-button:disabled,
#register-button:disabled {
    position: relative;
    color: transparent !important;
    text-shadow: none;
    text-indent: -9999px;
    overflow: hidden;
}

#login-button:disabled::after,
#register-button:disabled::after {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.6);
    border-top-color: #ffffff;
    border-radius: 50%;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    animation: sendButtonSpin 0.8s linear infinite;
    margin: -9px 0 0 -9px;
}

#send-reset-token-button[data-dash-is-loading="true"],
#validate-token-button[data-dash-is-loading="true"],
#update-password-button[data-dash-is-loading="true"] {
    position: relative;
    color: transparent !important;
}

#send-reset-token-button[data-dash-is-loading="true"]::after,
#validate-token-button[data-dash-is-loading="true"]::after,
#update-password-button[data-dash-is-loading="true"]::after {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.6);
    border-top-color: #ffffff;
    border-radius: 50%;
    display: block;
    animation: sendButtonSpin 0.8s linear infinite;
    margin: 0 auto;
}

.tracking-card {
    align-self: center;
    width: 100%;
    max-width: 520px;
    margin: 0 auto 12px;
    padding: 16px 18px;
    border-radius: 20px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
}

.tracking-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tracking-card-title {
    font-weight: 700;
    color: #0f172a;
}

.tracking-card-subtitle {
    margin-top: 4px;
    font-size: 0.85rem;
    color: #64748b;
}

.tracking-card-text {
    margin: 8px 0 12px;
    color: #475569;
    font-size: 0.95rem;
}

.tracking-card-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 6px;
    flex-wrap: wrap;
}

.tracking-card-carrier {
    font-weight: 600;
    color: #0f172a;
}

.tracking-card-number {
    color: #64748b;
    font-size: 0.95rem;
}

.tracking-card-label {
    color: #64748b;
    font-size: 0.9rem;
}

.tracking-card-value {
    font-weight: 600;
    color: #0f172a;
}

.tracking-card-meta {
    margin-top: 4px;
    color: #64748b;
    font-size: 0.85rem;
}

.tracking-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.tracking-card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    color: #005f73;
    font-weight: 600;
    text-decoration: none;
}

.tracking-card-link:hover {
    text-decoration: underline;
}

.tracking-card-history {
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px dashed #e2e8f0;
    background: #f8fafc;
}

.tracking-card-history-title {
    font-weight: 600;
    color: #0f172a;
    margin-bottom: 6px;
}

.tracking-card-list {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 160px;
    overflow-y: auto;
}

.tracking-card-event {
    padding: 6px 0;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.9rem;
    color: #334155;
}

.tracking-card-event:last-child {
    border-bottom: none;
}

.tracking-card-event-time {
    font-weight: 600;
    color: #0f172a;
}

.tracking-card-event-sep {
    color: #94a3b8;
}

.tracking-card-event-text {
    color: #334155;
}

.tracking-card-event-location {
    color: #64748b;
}

.tracking-card-empty {
    color: #94a3b8;
    font-style: italic;
}

.tracking-action-button {
    flex: 0 1 auto;
    margin: 0;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(0, 95, 115, 0.2);
    cursor: pointer;
    font-weight: 600;
    background: linear-gradient(135deg, #005f73 0%, #0f766e 100%);
    color: #ffffff;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12);
    font-size: 0.85rem;
}

.tracking-action-button:hover {
}

.tracking-action-secondary {
    background: #ffffff;
    color: #0f4c5c;
    border: 1px solid rgba(148, 163, 184, 0.5);
    box-shadow: none;
}

.tracking-action-secondary:hover {
    background-color: #f8fafc;
}

.chat-avatar-wrap {
  position: relative;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.chat-avatar-img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #ffffff;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12);
}

.chat-online-dot {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #94a3b8;
  border: 2px solid #ffffff;
  box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.15);
  transition: background-color 0.3s ease;
}

.chat-top-bar {
  border-radius: 0 0 18px 18px;
}

.tracking-detail {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tracking-detail-header {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.tracking-detail-carrier {
    font-weight: 600;
    color: #0f172a;
}

.tracking-detail-number {
    color: #64748b;
    font-size: 0.9rem;
}

.tracking-detail-badge {
    padding: 3px 10px;
    border-radius: 999px;
    background: #e0f2f1;
    color: #0f4c5c;
    font-size: 0.75rem;
    font-weight: 600;
}

.tracking-detail-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}

.tracking-detail-label {
    color: #64748b;
    font-size: 0.9rem;
}

.tracking-detail-status {
    font-weight: 600;
    color: #0f172a;
}

.tracking-detail-meta {
    color: #64748b;
    font-size: 0.85rem;
}

.tracking-detail-empty {
    color: #94a3b8;
    font-style: italic;
}

/* The special "Valider" button shown to businesses */
.chat-validate-button {
    flex-shrink: 0;
    align-self: center;
    background-color: #10b981; /* A positive green color */
    color: white;
    font-weight: 600;
    font-size: 14px;
    border-radius: 20px;
    padding: 8px 16px;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.chat-validate-button:hover {
    background-color: #059669;
}

/* Conteneur principal du composant de sélection */
.media-selection-container {
    padding: 16px;
    background-color: #f9fafb; /* Fond clair pour l'ensemble du composant */
    display: flex;
    flex-direction: column;
    gap: 20px; /* Espace entre les sections (compteurs, grille, actions) */
}

/* --- Section des compteurs --- */
.media-stats-header {
    display: flex;
    gap: 12px;
    justify-content: center;
}

.stat-card {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    background-color: #ffffff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.stat-card .icon {
    flex-shrink: 0;
    color: #005f73;
}

.stat-card-info .count {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
}

.stat-card-info .label {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
}

/* --- Grille des miniatures sélectionnées --- */
.selected-media-grid {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 8px 4px; /* Empêche les ombres d'être coupées */
    margin: 0 -4px;
    scrollbar-width: thin; /* Firefox */
    scrollbar-color: #ccc #f9fafb; /* Firefox */
}
.selected-media-grid::-webkit-scrollbar {
    height: 6px;
}
.selected-media-grid::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 10px;
}

.thumbnail-card {
    position: relative;
    flex-shrink: 0; /* Empêche les cartes de se déformer */
}

.thumbnail-card-media {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transition: transform 0.2s ease;
}
.thumbnail-card:hover .thumbnail-card-media {
}


.thumbnail-remove-button {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    color: #ef4444; /* Rouge pour la suppression */
    border: 1px solid #e5e7eb;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
}

.thumbnail-remove-button:hover {
    background-color: #ef4444;
    color: white;
}

/* --- Panneau des boutons d'action --- */
.media-selection-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    border-top: 1px solid #e5e7eb;
    padding-top: 20px;
}

/* Style de base pour les boutons de cette section */
.media-action-button {
    width: 100%;
    max-width: 320px;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 12px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
}

/* Style pour l'action principale : "Sélectionner" */
.media-action-button.primary {
    background-color: #005f73;
    color: white;
    border-color: #005f73;
}
.media-action-button.primary:hover:not(:disabled) {
    background-color: #004c5c;
    border-color: #004c5c;
}
/* Style quand le bouton est sélectionné */
.media-action-button.primary.selected {
    background-color: #ffffff;
    color: #005f73;
}

/* Bouton de validation final */
.media-action-button.validate {
    background-color: #ee9b00;
    color: white;
    border-color: #ee9b00;
}
.media-action-button.validate:hover:not(:disabled) {
    background-color: #d98e00;
}

/* Bouton d'action secondaire */
.media-action-button.secondary {
    background-color: transparent;
    color: #4b5563;
    border-color: #d1d5db;
}
.media-action-button.secondary:hover:not(:disabled) {
    background-color: #f3f4f6;
    border-color: #9ca3af;
}

/* État désactivé pour tous les boutons */
.media-action-button:disabled {
    background-color: #e5e7eb;
    color: #9ca3af;
    border-color: #e5e7eb;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Style du message d'erreur */
.selection-error-message {
    color: #dc3545;
    font-size: 13px;
    font-weight: 500;
    text-align: center;
}

/* Placeholder quand aucune sélection n'est faite */
.no-selection-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
    border: 2px dashed #d1d5db;
    border-radius: 12px;
    background-color: #fdfdfd;
    color: #6b7280;
    text-align: center;
    min-height: 100px;
}

.no-selection-placeholder .icon {
    margin-bottom: 8px;
}

.no-selection-placeholder p {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
}

/* confirmation_download_view styles */
.video-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.video-preview-card {
    background-color: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.07);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.video-preview-card:hover {
}

.video-preview-media video {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    background-color: #f0f2f5;
    display: block;
}

.video-preview-info {
    padding: 12px;
    font-size: 14px;
    color: #4a5568;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-top: 1px solid #f0f2f5;
}

/* assets/magic.css */

@keyframes shimmer-effect {
  0% {
    background-position: -1000px 0;
  }
  100% {
    background-position: 1000px 0;
  }
}

.magic-reveal {
  /* L'animation dure 1.5s et ne se joue qu'une fois */
  animation: shimmer-effect 1.5s linear 1;

  /* On crée un dégradé très large qui va se déplacer sur le fond */
  background-image: linear-gradient(
    to right,
    transparent 20%,
    rgba(255, 238, 179, 0.7) 40%, /* Lueur dorée */
    rgba(232, 215, 255, 0.7) 60%, /* Lueur violette */
    transparent 80%
  );

  /* Le dégradé est beaucoup plus large que l'élément pour donner l'effet de balayage */
  background-size: 2000px 100%;
  background-repeat: no-repeat;
  border-radius: 12px; /* Assure que l'effet respecte les bords arrondis */
}

.btn-ghost-teal:hover {
  background-color: #0E7490 !important;
  color: #ffffff !important;
  border-color: #0E7490 !important;
}
.btn-ghost-teal:active {
  transform: translateY(0);
  opacity: .95;
}
#ambassador-card { backdrop-filter: saturate(115%) blur(0.5px); }

.adv-card:hover {
}

@keyframes shimmer { 0%{background-position:-200% 0} 100%{background-position:200% 0} }

.ugc-review-note {
  font-size: 14px;
  color: #0b3e47;
}

.ugc-preview-wrapper {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.ugc-preview-grid {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.ugc-preview-item {
  position: relative;
  min-width: 110px;
  border: none;
  background: transparent;
  padding: 0;
  text-align: left;
  cursor: pointer;
}

.ugc-preview-item:focus-visible {
  outline: 2px solid rgba(14, 116, 144, 0.45);
  outline-offset: 2px;
}

.ugc-preview-index {
  position: absolute;
  bottom: 8px;
  left: 8px;
  background-color: rgba(14, 116, 144, 0.92);
  color: #ffffff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  letter-spacing: .02em;
}

.ugc-review-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(245, 158, 11, 0.14);
  color: #b45309;
  border: 1px solid rgba(245, 158, 11, 0.45);
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
  letter-spacing: .01em;
  backdrop-filter: blur(2px);
}

.ugc-preview-empty {
  min-height: 140px;
  min-width: 180px;
  border: 1px dashed rgba(14, 116, 144, 0.35);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: rgba(14, 116, 144, 0.06);
  border-radius: 12px;
  padding: 18px;
  text-align: center;
  color: #0b3e47;
}

.ugc-preview-empty span {
  font-weight: 500;
}

.ugc-preview-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.ugc-preview-actions .conditions_button {
  flex: 1 0 auto;
}

.ugc-update-button {
  color: #ffffff !important;
}

.ugc-update-button:hover {
  background-color: #0b556a !important;
  border-color: #0b556a !important;
}

.ugc-selection-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px;
}

.ugc-selection-tile {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background-color: #ffffff;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  overflow: hidden;
  width: 100%;
}

.ugc-selection-tile:hover {
}

.ugc-selection-tile.pending {
  cursor: not-allowed;
  opacity: .6;
}

.ugc-selection-tile.pending:hover {
}

.ugc-selection-tile.selected {
  border: 2px solid #0E7490;
  box-shadow: 0 12px 28px rgba(14, 116, 144, 0.24);
}

.ugc-selection-meta {
  padding: 10px;
  background-color: #f8fafc;
  text-align: left;
}

.ugc-selection-meta-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #0b3e47;
}

.ugc-selection-badge {
  display: inline-block;
  margin-top: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #ca6702;
}

.ugc-update-feedback {
  border-radius: 10px;
  padding: 12px 14px;
  border: 1px solid transparent;
  font-size: 14px;
}

.ugc-update-feedback.success {
  background-color: rgba(14, 116, 144, 0.08);
  border-color: rgba(14, 116, 144, 0.16);
  color: #0E7490;
}

.ugc-update-feedback.error {
  background-color: rgba(220, 38, 38, 0.08);
  border-color: rgba(220, 38, 38, 0.2);
  color: #991b1b;
}

.ugc-update-feedback.warning {
  background-color: rgba(217, 119, 6, 0.08);
  border-color: rgba(217, 119, 6, 0.18);
  color: #92400e;
}

.ugc-upload-box {
  border: 1px dashed #94a3b8;
  border-radius: 12px;
  padding: 16px 18px;
  background-color: #f8fafc;
  color: #0b3e47;
  transition: border-color .2s ease, background-color .2s ease;
}

.ugc-upload-box:hover {
  border-color: #0E7490;
  background-color: rgba(14, 116, 144, 0.08);
}

@media (max-width: 768px) {
  .ugc-preview-wrapper {
    flex-direction: column !important;
    gap: 14px !important;
    align-items: stretch !important;
  }

  .ugc-preview-wrapper .ugc-preview-column {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .ugc-preview-grid {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
  }

  .ugc-preview-grid .ugc-preview-item,
  .ugc-preview-grid .ugc-preview-empty {
    flex: 0 0 auto;
  }

  .ugc-selection-grid {
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  }
}

.chat-layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 100vh;
  height: 100vh;
  align-items: stretch;
}

.chat-column {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  overflow: hidden;
}

.chat-list-column {
  padding: 16px;
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border-color: rgba(0, 95, 115, 0.18);
}

.chat-list-host {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.chat-list-host > #chat-list-container {
  flex: 1 1 auto;
  min-height: 0;
}

.chat-list-scroll {
  overflow-y: auto;
  min-height: 0;
  flex: 1;
  padding-right: 4px;
}

#chat-list {
  overflow-y: auto;
  flex: 1;
  min-height: 0;
  padding-right: 4px;
}

@media (max-width: 1023px) {
  .chat-page .chat-list-scroll,
  .chat-page #chat-list {
    padding-bottom: calc(var(--navbar-safe-offset, 92px) + 12px);
  }

  .chat-page #chat-messages {
    padding-bottom: calc(var(--navbar-safe-offset, 92px) + 16px) !important;
  }
}

.chat-list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  background: #ffffff;
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.05);
  margin-bottom: 8px;
  transition: border-color 0.2s ease, background 0.2s ease;
  min-height: 64px;
}

.chat-list-item:hover {
  border-color: rgba(0, 95, 115, 0.35);
  background: rgba(0, 95, 115, 0.05);
}

.chat-list-item.is-spottedge {
  background: #ffffff;
  border-color: rgba(202, 103, 2, 0.35);
}

.chat-list-item.is-unread {
  border-color: rgba(0, 95, 115, 0.45);
  border-left: 3px solid #005f73;
  padding-left: 11px;
}

.chat-list-item.is-disabled {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
  background: #f8fafc;
}

.chat-list-item-body {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.chat-list-item-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.chat-list-item-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  min-width: 60px;
}

.chat-list-column .profile_picture_avatar {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  object-fit: cover;
}

.chat-list-column .influencer_title {
  font-size: 14px;
  font-weight: 700;
  margin: 0;
  color: #0f172a;
}

.chat-list-column .influencer_text {
  font-size: 12px;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.chat-list-section-title {
  font-size: 12px;
  font-weight: 700;
  color: #005f73;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.chat-list-section-title.is-muted {
  color: #bb3e03;
}

@media (max-width: 768px) {
  .chat-list-column {
    padding: 12px;
    height: auto;
  }
  .chat-list-item {
    padding: 10px 12px;
    min-height: 56px;
  }
  #chat-messages {
    padding: 18px !important;
  }
  .chat-input-area-container {
    padding: 10px 12px 12px;
  }
  .collab-details-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .collab-details-image {
    height: 82px;
  }
}

.chat-unread-badge {
  background-color: #005f73;
  color: #ffffff;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 700;
  min-width: 22px;
  text-align: center;
}

#top-bar-chat .profile_picture_avatar {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  box-shadow: 0 6px 12px rgba(15, 23, 42, 0.08);
}

#top-bar-chat .influencer_title {
  font-size: 15px;
  font-weight: 700;
}

#top-bar-chat .influencer_text {
  font-size: 12px;
  color: #64748b;
}

.chat-main-column {
  position: relative;
  min-height: 620px;
  border-color: rgba(0, 95, 115, 0.18);
}

.chat-details-column {
  padding: 18px;
  display: none;
  border-color: rgba(0, 95, 115, 0.18);
}

.price-bar-mobile {
  display: block;
}

@media (max-width: 1023px) {
  .chat-details-column {
    display: none !important;
  }
}

.collab-details-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.collab-timeline-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.collab-details-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}

.collab-details-header-left {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1;
}

.collab-details-header-right {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}

.collab-details-header-right.collab-tracking-actions {
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.collab-tracking-actions .tracking-action-button {
  width: 100%;
}

.collab-tracking-pill {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: rgba(255, 255, 255, 0.9);
  min-width: 160px;
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.08);
}

.collab-tracking-pill.muted {
  border-style: dashed;
  color: #94a3b8;
  box-shadow: none;
}

.collab-tracking-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748b;
  font-weight: 700;
}

.collab-tracking-number {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  word-break: break-all;
  text-align: right;
}

.collab-details-heading {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.collab-open-offer-inline {
  align-self: flex-start;
  margin-top: 2px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0, 95, 115, 0.18);
  background: rgba(0, 95, 115, 0.08);
  color: #005f73;
  font-weight: 700;
  font-size: 12px;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.collab-open-offer-inline:hover {
  background: rgba(0, 95, 115, 0.12);
  border-color: rgba(0, 95, 115, 0.26);
}

.collab-open-offer-inline:active {
  transform: translateY(1px);
}

.collab-details-title {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.collab-details-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: #334155;
}

.collab-details-card {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 12px 14px;
  background: #f8fafc;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.collab-details-links {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.collab-details-link {
  font-size: 13px;
  color: #005f73;
  text-decoration: underline;
}

.collab-details-logo {
  width: 100%;
  max-height: 120px;
  object-fit: contain;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
  padding: 8px;
}

.collab-details-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.collab-details-image {
  width: 100%;
  height: 72px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
}

.collab-details-image-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.collab-details-image-card a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.collab-details-download {
  font-size: 12px;
  color: #005f73;
  text-decoration: underline;
}

.collab-details-list {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  color: #334155;
}

.collab-missing-item {
  margin-bottom: 6px;
}

.collab-missing-action {
  background: none;
  border: none;
  padding: 0;
  color: #0f4c5c;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}

.collab-missing-action:hover {
  text-decoration: underline;
}

.collab-timeline-actions {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
}

.collab-details-empty {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

@media (min-width: 1024px) {
  .price-bar-mobile {
    display: none !important;
  }
  .chat-layout {
    flex-direction: row;
    align-items: stretch;
  }
  .chat-list-host {
    flex: 0 0 280px;
    max-width: 280px;
    height: 100%;
    min-height: 0;
  }
  .chat-list-column {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
    height: 100%;
  }
  .chat-main-column {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
  }
  .chat-details-column {
    display: block;
    flex: 0 0 280px;
    max-width: 280px;
    height: 100%;
    overflow-y: auto;
  }
  #chat-list-container {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    max-height: none;
    overflow: hidden;
  }
  #chat-container {
    height: 100%;
  }
  #top-bar-chat {
    margin-bottom: 0 !important;
  }
  #top-bar-chat > div {
    position: sticky !important;
    top: 0;
    left: auto !important;
    right: auto !important;
    box-shadow: none;
    border-bottom: 1px solid #e5e7eb;
  }
  #chat-messages {
    top: 70px !important;
    bottom: calc(var(--chat-input-height) + 8px) !important;
    padding: 24px !important;
  }
  #back-button-chat {
    display: none;
  }
}

#chat-layout[data-chat-open="false"] #chat-container {
  display: none !important;
}

#chat-layout[data-chat-open="false"] .chat-details-column {
  display: none !important;
}

#chat-layout[data-chat-open="false"] #chat-list-container {
  flex: 1 1 100%;
  max-width: 100%;
  width: 100%;
  height: 100%;
}

#chat-layout[data-chat-open="true"] #chat-list-container {
  flex: 0 0 260px;
  max-width: 260px;
  width: 260px;
  height: 100%;
}

#chat-layout[data-chat-open="false"] .chat-list-host {
  flex: 1 1 auto;
  max-width: 100%;
  width: 100%;
  height: 100%;
  min-height: 0;
}

#chat-layout[data-chat-open="true"] .chat-list-host {
  flex: 0 0 260px;
  max-width: 260px;
  width: 260px;
  height: 100%;
  min-height: 0;
}

#chat-layout[data-chat-open="true"] .chat-list-column {
  width: 100%;
  max-width: 100%;
  flex: 1 1 auto;
}

#chat-layout[data-chat-open="true"] #chat-container {
  min-width: 0;
  flex: 1 1 0;
}

#chat-layout #chat-list-container {
  transition: max-width 0.28s ease, flex-basis 0.28s ease, width 0.28s ease;
}

#chat-layout[data-chat-open="true"] #chat-container {
  animation: chatFadeIn 0.25s ease;
}

@keyframes chatFadeIn {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1023px) {
  #chat-layout[data-chat-open="true"] .chat-list-host {
    display: none !important;
  }
  #chat-layout[data-chat-open="false"] .chat-list-host {
    display: flex !important;
  }
  .chat-page .chat-list-host {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
  }
  .chat-page #chat-list-container {
    height: 100% !important;
    min-height: 0 !important;
  }
  .chat-page .chat-list-scroll,
  .chat-page #chat-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  #chat-layout[data-chat-open="true"] #chat-list-container {
    display: none !important;
  }
  #chat-layout[data-chat-open="true"] #chat-container {
    display: flex !important;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
  }
  .chat-page {
    height: 100dvh;
    min-height: 100dvh;
  }
  #page-content .influencer_main_container.chat-page,
  #page-content .influencer_main_container.chat-page.no-navbar-padding {
    padding: 0 !important;
    gap: 0 !important;
    margin: 0 !important;
    height: 100dvh;
    min-height: 100dvh;
  }
  .chat-page .chat-layout {
    gap: 0;
    height: 100%;
    min-height: 100%;
  }
  .chat-page .chat-column {
    border-radius: 0 !important;
    border: none !important;
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .chat-page #chat-messages {
    border-radius: 0 !important;
  }
  .chat-page .chat-input-area-container {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: var(--navbar-height, 64px) !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
    z-index: 5 !important;
  }
}

/* Chat page refinements */
.chat-page {
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  height: 100vh;
  height: 100dvh;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
  padding-bottom: 0;
}

.chat-page .chat-layout {
  gap: 18px;
  height: 100%;
  min-height: 0;
}

.chat-page .chat-column {
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  box-shadow: none;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(6px);
  min-height: 0;
}

.chat-page .chat-list-column,
.chat-page .chat-main-column,
.chat-page .chat-details-column {
  height: 100%;
}

.chat-page .chat-main-column {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.chat-page #chat-container {
  height: 100%;
}

.chat-page .chat-list-column {
  background: #f8fafc;
  border-color: #e2e8f0;
}

.chat-page .chat-list-item {
  border: 1px solid #e2e8f0;
  box-shadow: none;
  background: #ffffff;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.chat-page .chat-list-item:hover {
  background: #f8fafc;
  border-color: rgba(0, 95, 115, 0.25);
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.08);
}

.chat-page .chat-list-item.is-unread {
  border-left: 4px solid #005f73;
  background: #ecfeff;
}

.chat-page .chat-list-item.is-disabled .profile_picture_avatar {
  filter: grayscale(1);
}

#chat-layout[data-chat-readonly="true"] #chat-messages {
  overflow-y: hidden !important;
  pointer-events: auto;
}

#chat-layout[data-chat-readonly="true"] #top-bar-chat .profile_picture_avatar {
  filter: grayscale(1);
}

.chat-page #top-bar-chat > div {
  box-shadow: none !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

.chat-page #chat-messages {
  background: #f8fafc !important;
  background-image: none !important;
  border-radius: 18px;
  padding: 8px;
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  flex: 1 1 auto;
  min-height: 0;
}

.chat-page #chat-messages,
.support-chat-messages {
  overflow-x: hidden !important;
}

.chat-message-row {
  width: 100%;
  min-width: 0;
  gap: 8px;
}

.chat-message-avatar {
  flex: 0 0 auto;
}

.chat-message-content {
  min-width: 0;
  overflow: hidden;
}

.chat-message-markdown {
  overflow-wrap: anywhere;
  word-break: break-word;
  min-width: 0;
}

.chat-message-markdown > * {
  max-width: 100%;
}

.chat-message-markdown p {
  margin-bottom: 0;
}

.chat-message-markdown img,
.chat-message-markdown video,
.chat-message-media img,
.chat-message-media video {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
}

.chat-message-media {
  width: 100%;
  max-width: min(250px, calc(100vw - 132px));
  min-width: 0;
  overflow: hidden;
  border-radius: 8px;
}

.chat-message-media .dash-spinner,
.chat-message-media .dash-spinner-container {
  max-width: 100%;
}

.chat-page {
  --chat-input-offset: 0px;
  --chat-input-height: 72px;
}

.chat-page .chat-input-area-container {
  background: #ffffff;
  border-top: 1px solid #e2e8f0;
  position: relative;
  bottom: auto;
  margin-top: auto;
  padding-bottom: 12px;
}

.chat-page .chat-input-bar {
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  box-shadow: none;
  width: 100%;
  max-width: none;
  margin: 0;
}

.chat-page .chat-input-bar:focus-within {
  box-shadow: 0 0 0 2px rgba(0, 95, 115, 0.12);
}

.chat-page #top-bar-chat .profile_picture_avatar {
  box-shadow: none;
}

/* Visual system overrides */
.influencer_carousel_card_container,
.influencer_carousel_card_container_bookings,
.offer-recap-card,
.influencer_offer_box_style,
.tracking-card,
.video-preview-card,
.ugc-selection-tile,
.stat-card,
.chat-column,
.business-card,
.unified-pricing-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 20px;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
  background-image: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.influencer_offer_button,
.select_button,
.save-button-profile,
.subscribe-button-unified,
.tracking-action-button,
.media-action-button.primary,
.btn-primary-action {
  height: 48px !important;
  padding: 0 18px !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  background: #005f73 !important;
  border: 1px solid #005f73 !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.influencer_offer_button:hover,
.select_button:hover,
.save-button-profile:hover,
.subscribe-button-unified:hover,
.tracking-action-button:hover,
.media-action-button.primary:hover,
.btn-primary-action:hover {
  background: #004c5c !important;
  border-color: #004c5c !important;
}

.influencer_offer_button_container {
  display: flex;
  justify-content: center;
}

.influencer_offer_button,
.select_button {
  margin-left: auto;
  margin-right: auto;
}

.influencer_offer_button:focus-visible,
.select_button:focus-visible,
.save-button-profile:focus-visible,
.subscribe-button-unified:focus-visible,
.tracking-action-button:focus-visible,
.media-action-button.primary:focus-visible,
.btn-primary-action:focus-visible {
  outline: 2px solid rgba(0, 95, 115, 0.35);
  outline-offset: 2px;
}

.select_button.signup-outline {
  background: #ffffff !important;
  color: #ee9b00 !important;
  border: 2px solid #ee9b00 !important;
  box-shadow: none !important;
}

.select_button.signup-outline:hover {
  background: #fff3e0 !important;
  color: #d48800 !important;
  border-color: #d48800 !important;
}

.media-action-button.primary.selected {
  background: #ffffff;
  color: #005f73;
  border-color: #005f73;
  box-shadow: none;
}

.influencer_main_container {
  font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #0f172a;
  background-color: #f8f9fa;
  padding: 24px 24px max(96px, calc(var(--navbar-safe-offset, 92px) + 12px));
  gap: 24px;
}

.influencer_main_container.business-page {
  min-height: unset !important;
  margin-bottom: 0 !important;
}

.business-home .influencer_offer_button_container.fc-sticky-cta {
  bottom: 16px;
  z-index: 900;
}

@media (max-width: 1023px) {
  .business-home .influencer_offer_button_container.fc-sticky-cta {
    bottom: calc(var(--navbar-height, 64px) + 8px);
  }
}

.influencer_title {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
}

.influencer_text {
  font-size: 14px;
  line-height: 1.5;
  color: #475569;
}

.influencer-title-lg {
  font-size: 24px;
  margin: 0;
}

.influencer-title-md {
  font-size: 18px;
  margin: 0 0 6px;
}

.influencer-title-sm {
  font-size: 16px;
  margin: 0;
  font-weight: 600;
  color: #0b3e47;
}

.influencer-title-section {
  font-size: 18px;
  margin: 0;
  color: #005f73;
}

.influencer-text-sm {
  font-size: 13px;
}

.influencer-text-xs {
  font-size: 12px;
}

.influencer-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 4px 0 6px;
  border-bottom: 1px solid transparent;
  background-color: transparent;
  position: sticky;
  top: 0;
  z-index: 900;
  transition: padding 0.25s ease, box-shadow 0.25s ease;
}

.influencer-header.influencer_container {
  margin: 0;
}

.influencer-header .influencer_title {
  margin-bottom: 2px;
}

.influencer-header .influencer_text {
  margin-bottom: 0;
}

.influencer-header-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.influencer-header-search {
  width: min(420px, 100%);
  max-width: 0;
  opacity: 0;
  transform: translateY(6px) scale(0.98);
  pointer-events: none;
  position: relative;
  overflow: visible;
  transition: max-width 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
  justify-self: center;
}

.influencer-header-search .header-search-input {
  border-radius: 18px;
  padding: 6px 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  position: relative;
}


.influencer-header-search .header-search-input .mantine-TextInput-input {
  box-shadow: none;
  color: #0f172a;
}

.influencer-header-search .header-search-input .mantine-TextInput-input::placeholder {
  color: #94a3b8;
}

.influencer-header-search .header-search-input::before {
  content: "";
  position: absolute;
  top: -6px;
  right: 18px;
  width: 120px;
  height: 22px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0));
  opacity: 0;
  transform: translateY(-8px) scale(0.9);
  transition: opacity 0.35s ease, transform 0.35s ease;
  pointer-events: none;
}

.influencer-header-search .header-search-input::after {
  content: "";
  position: absolute;
  inset: -10px -12px;
  border-radius: 26px;
  background: transparent;
  opacity: 0;
  transform: scale(0.96);
  transition: opacity 0.35s ease, transform 0.35s ease;
  pointer-events: none;
  z-index: -1;
}

.offer-search-chips-wrapper {
  margin-top: 4px;
  display: flex;
  justify-content: center;
  width: 100%;
}

.influencer-header-search:focus-within .offer-search-chips-wrapper {
  display: flex;
}

.offer-search-chips-wrapper > div,
.offer-search-chips-wrapper .mantine-ChipGroup-root {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  width: 100%;
}

.offer-search-chips-wrapper .mantine-Chip-label {
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid #e2e8f0;
  background: rgba(248, 250, 252, 0.85);
  color: #334155;
}

.offer-search-chips-wrapper .mantine-Chip-input:checked + .mantine-Chip-label {
  background: rgba(0, 95, 115, 0.12);
  border-color: rgba(0, 95, 115, 0.4);
  color: #005f73;
}

.offer-search-results {
  position: fixed;
  top: 76px;
  left: 50%;
  transform: translateX(-50%);
  width: min(720px, calc(100vw - 32px));
  margin: 0 auto;
  padding: 16px 18px;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.06);
  max-height: min(70vh, 520px);
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 1301;
  display: none;
  pointer-events: auto;
}

.offer-search-backdrop {
  position: fixed;
  inset: 0;
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  z-index: 880;
  cursor: default;
}

.offer-search-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  gap: 12px;
}

.offer-search-title {
  font-size: 15px;
  font-weight: 600;
  color: #0f172a;
}

.offer-search-meta {
  font-size: 12px;
  color: #64748b;
}

.offer-search-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
  overflow: visible;
  white-space: normal;
  padding-bottom: 4px;
  align-content: start;
  touch-action: pan-y;
  overscroll-behavior: contain;
}

.offer-search-grid::-webkit-scrollbar {
  height: 6px;
}

.offer-search-grid::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.6);
  border-radius: 999px;
}

.offer-search-result-card {
  width: 100%;
  min-width: 0;
  flex: 0 0 auto;
  border-radius: 14px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  background: #ffffff;
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.06);
  overflow: hidden;
  cursor: pointer;
  appearance: none;
  padding: 0;
  text-align: left;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.offer-search-result-card:hover {
  border-color: rgba(0, 95, 115, 0.32);
}

.offer-search-result-image {
  width: 100%;
  height: 128px;
  object-fit: cover;
  display: block;
  background: #e2e8f0;
}

.offer-search-result-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
}

.offer-search-result-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  border-radius: 999px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: rgba(0, 95, 115, 0.08);
  color: #005f73;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 2px 8px;
  text-transform: uppercase;
}

.offer-search-result-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.offer-search-result-business {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offer-search-result-title {
  font-size: 12px;
  color: #475569;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offer-search-result-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.offer-search-result-price {
  font-size: 12px;
  font-weight: 700;
  color: #b45309;
  white-space: nowrap;
}

.offer-search-result-footer {
  font-size: 11px;
  color: #64748b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offer-search-empty {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.offer-search-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.offer-search-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  background: #ffffff;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.offer-search-item:hover {
  border-color: rgba(0, 95, 115, 0.35);
  background: rgba(0, 95, 115, 0.04);
}

.search-pill {
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(0, 95, 115, 0.25);
  background: rgba(0, 95, 115, 0.08);
  color: #005f73;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.offer-time-pill {
  flex-shrink: 0;
  white-space: nowrap;
}

.offer-time-pill .influencer_text {
  white-space: nowrap;
}

.influencer-header-location {
  justify-self: end;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

body.influencer-scroll-compact .influencer-header {
  padding: 3px 0 4px;
  box-shadow: none;
  background-color: transparent;
}

body:not(.influencer-scroll-compact) .influencer-header-search:not(:focus-within) .offer-search-chips-wrapper {
  display: flex;
}

body.influencer-scroll-compact .influencer-header-text {
  opacity: 0;
  transform: translateX(40px) scale(0.9);
  pointer-events: none;
}

body.influencer-scroll-compact .influencer-header-search {
  max-width: min(460px, calc(100vw - 80px));
  opacity: 1;
  transform: translateY(0) scale(1.02);
  pointer-events: auto;
}

body.influencer-scroll-compact .influencer-header-search .header-search-input {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  animation: dropletBump 420ms ease-out;
}

body.influencer-scroll-compact .influencer-header-search .header-search-input::before,
body.influencer-scroll-compact .influencer-header-search .header-search-input::after {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.influencer-header-search:focus-within .header-search-input {
  border-color: rgba(0, 95, 115, 0.35);
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

@keyframes dropletBump {
  0% { transform: translateY(4px) scale(0.96); }
  55% { transform: translateY(-2px) scale(1.03); }
  100% { transform: translateY(0) scale(1.02); }
}

body.influencer-scroll-compact .influencer-header-location {
  opacity: 0;
  transform: translateX(-20px);
  pointer-events: none;
}

.location-modal .influencer_location_input_suggestions {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
  width: min(420px, calc(100% - 24px));
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.12);
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
}

.influencer-location-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #0f172a;
  text-decoration: none;
  cursor: pointer;
}

.influencer-location-text {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.influencer-section-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 5px;
}

.influencer-info-button {
  padding: 4px;
  margin-left: 4px;
  font-size: 18px;
  color: #64748b;
}

.influencer-tooltip .tooltip-inner {
  background-color: #f8f9fa;
  color: #0f172a;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.4;
}

.influencer-tooltip .tooltip-arrow::before {
  border-right-color: #e5e7eb;
}

.influencer-alert {
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.2);
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.influencer-alert-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.influencer-alert-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.influencer-alert-note {
  color: #92400e;
}

.influencer-overlay-card {
  padding: 18px 20px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  text-align: center;
  max-width: 420px;
}

.category-filters {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  white-space: nowrap;
  margin-bottom: 20px;
}

.tag-fav-btn {
  padding: 6px 14px;
  border: 1px solid #d7dde4;
  border-radius: 999px;
  color: #005f73;
  background-color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  box-shadow: none;
}

.influencer-map-shell {
  position: relative;
  margin-bottom: 20px;
}

.influencer-map-container {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 10px;
  height: 125px;
  border: none;
  background: transparent;
}

.influencer-map-toggle {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  background: #ffffff;
  border-radius: 999px;
  padding: 4px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.influencer-banner-card {
  padding: 14px;
  border-radius: 12px;
  background: rgba(14, 116, 144, 0.04);
  border: 1px solid rgba(14, 116, 144, 0.12);
  box-shadow: none;
  margin-bottom: 16px;
}

.influencer-banner-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.influencer-banner-close {
  margin-left: auto;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 4px;
}

.btn-ghost-teal {
  width: 100%;
  background-color: rgba(14, 116, 144, 0.08);
  border: 1px solid rgba(14, 116, 144, 0.2);
  color: #0e7490;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.modal-title {
  font-family: inherit;
}

/* Force unified grey background across all entry/login/register pages */
html,
body,
#page-content,
.fc-page,
.influencer_main_container {
  background-color: #f8f9fa !important;
}

.form-control,
.influencer_location_input_input,
.search-bar-wrapper,
.influencer_location_input_input_wrapper,
.chat-input-bar {
  border-radius: 12px;
  border: 1px solid #d1d5db;
  background: #ffffff;
}

.form-control,
.influencer_location_input_input,
.chat-input-bar textarea,
.search-input {
  font-size: 15px;
  line-height: 1.5;
  color: #0f172a;
}

.influencer_location_input_input {
  background: transparent;
}

.form-control:focus,
.influencer_location_input_input:focus,
.search-bar-wrapper:focus-within,
.chat-input-bar:focus-within {
  border-color: #005f73;
  box-shadow: 0 0 0 3px rgba(0, 95, 115, 0.12);
  outline: none;
}

input:invalid {
  outline: 2px solid rgba(238, 155, 0, 0.35) !important;
  outline-offset: 1px;
}

.influencer_carousel_tag,
.discount-pill-in-toggle,
.tracking-detail-badge,
.ugc-review-badge,
.ugc-selection-badge,
.tag-fav-btn {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 20px;
  background: #E6F6F2;
  color: #005f73;
  box-shadow: none;
  border: 1px solid #d6ebe6;
}

.selected-interest {
  background: #005f73;
  color: #ffffff;
  border-radius: 20px;
  box-shadow: none;
  transform: none;
}

.influencer_container {
  margin-bottom: 16px;
}

.create-offer-layout,
.chat-layout,
.video-grid-container,
.ugc-selection-grid {
  gap: 16px;
}

.influencer_offer_button_container,
.select_button {
  width: min(100%, 360px);
}

.navbar {
  padding: 12px 20px 24px 20px;
  border-top: 1px solid #e5e7eb;
  box-shadow: 0 -2px 8px rgba(15, 23, 42, 0.08);
  background-color: #ffffff;
}

.navbar .navbar-main-icon {
  color: currentColor;
  filter: var(--navbar-icon-filter, none);
  transition: filter 0.2s ease, color 0.2s ease;
}

.navbar .navbar-profile-avatar {
  border: 1.5px solid #cbd5e1;
  box-sizing: border-box;
  filter: var(--navbar-avatar-filter, none);
  transition: filter 0.2s ease, border-color 0.2s ease;
}

.chat-input-area-container {
  position: absolute;
  bottom: 70px;
  left: 0;
  right: 0;
  padding: 8px 16px 8px;
  background: #ffffff;
  border-top: 1px solid rgba(226, 232, 240, 0.9);
  box-shadow: 0 -12px 24px rgba(15, 23, 42, 0.04);
  width: 100%;
}

.chat-input-bar {
  max-width: none;
  width: 100%;
  padding: 8px 12px;
  border-radius: 18px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
  gap: 10px;
}

.chat-format-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  background: #f8fafc;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 12px;
  padding: 4px 6px;
}

.chat-format-btn {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #475569;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.chat-format-btn:hover {
  background: rgba(0, 95, 115, 0.08);
  color: #005f73;
}

.chat-input-field textarea {
  font-size: 15px;
  color: #0f172a;
}

.chat-action-button {
  width: 36px;
  height: 36px;
  border-radius: 12px;
}

#top-bar-chat > div {
  border-bottom: 1px solid rgba(226, 232, 240, 0.8);
  background: rgba(255, 255, 255, 0.98);
}

.magic-reveal {
  animation: none;
  background-image: none;
}

.heart-icon.clicked,
.heart-icon.clicked-twice {
  animation: none;
  transform: none;
}

.video-preview-card:hover,
.ugc-selection-tile:hover,
.adv-card:hover,
.influencer_offer_main_image_img_offer:hover,
.influencer_offer_side_image_offer:hover {
}

.attach-button,
.send-button {
  color: #005f73;
}

.attach-button:hover,
.send-button:hover {
  background-color: #E6F6F2;
}

#typing-indicator.chat-typing-wrap {
  position: fixed;
  left: 24px;
  bottom: 168px;
  right: auto;
  max-width: min(360px, calc(100vw - 24px));
  z-index: 1200;
  text-align: left;
  pointer-events: none;
  align-items: center;
}

.chat-validate-button {
  background-color: #005f73;
}

.chat-validate-button:hover {
  background-color: #004c5c;
}

@media (max-width: 767.98px) {
  .influencer_main_container {
    padding: 16px 16px max(96px, calc(var(--navbar-safe-offset, 92px) + 12px));
  }
}
.login-recap-card {
  animation: loginRecapEnter 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.login-recap-fade-auto {
  animation: loginRecapAuto 3s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.login-recap-close-top {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: rgba(255, 255, 255, 0.58);
  backdrop-filter: blur(8px);
  color: #0f172a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 2;
  text-decoration: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.login-recap-close-top:hover {
  background: rgba(255, 255, 255, 0.86);
  border-color: rgba(14, 116, 144, 0.36);
  transform: translateY(-1px);
}

.login-recap-close-top:focus-visible {
  outline: 2px solid #0ea5b7;
  outline-offset: 2px;
}

.login-recap-content-wrap {
  width: 100%;
  height: 100%;
  max-width: 920px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow-y: auto;
}

#login-recap-overlay .influencer_title {
  letter-spacing: -0.01em;
}

#login-recap-overlay .influencer_text {
  line-height: 1.45;
}

@keyframes loginRecapEnter {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes loginRecapAuto {
  0% {
    opacity: 0;
    transform: translateY(14px) scale(0.99);
  }
  12% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  84% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(8px) scale(0.995);
  }
}

@media (max-width: 767.98px) {
  .login-recap-close-top {
    top: 12px;
    right: 12px;
  }

  .login-recap-content-wrap {
    max-width: 100%;
    align-items: stretch;
    padding-top: 8px;
  }
}

.session-notice-shell {
  width: 100%;
  min-height: min(62vh, 520px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(18px, 4vw, 36px);
}

.session-notice-card {
  width: min(640px, 96vw);
  border-radius: 20px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: linear-gradient(152deg, rgba(255, 255, 255, 0.86) 0%, rgba(248, 250, 252, 0.78) 100%);
  backdrop-filter: blur(14px) saturate(120%);
  box-shadow: 0 18px 52px rgba(15, 23, 42, 0.16);
  padding: clamp(18px, 3vw, 28px);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.session-notice-chip {
  width: fit-content;
  border: 1px solid rgba(148, 163, 184, 0.3);
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.session-notice-title {
  margin: 0;
  color: #0f172a;
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.session-notice-text {
  margin: 0;
  color: #334155;
  font-size: 14px;
  line-height: 1.5;
}

.session-notice-hint {
  margin: 0;
  color: #64748b;
  font-size: 12px;
}
@keyframes typingModernBounce {
  0%, 80%, 100% {
    opacity: 0.35;
    transform: translateY(0) scale(0.85);
  }
  40% {
    opacity: 1;
    transform: translateY(-3px) scale(1);
  }
}

@keyframes typingModernPulse {
  0%, 100% {
    opacity: 0.75;
    box-shadow: 0 0 0 0 rgba(20, 184, 166, 0.15);
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 0 5px rgba(20, 184, 166, 0.03);
  }
}

.chat-typing-bubble {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: linear-gradient(140deg, rgba(255, 255, 255, 0.92) 0%, rgba(241, 245, 249, 0.92) 100%);
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.14);
}

.chat-typing-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid rgba(148, 163, 184, 0.32);
  background: #f8fafc;
}

.chat-typing-content {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.chat-typing-label {
  font-size: 11px;
  font-weight: 700;
  color: #334155;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

.typing-modern-dots {
  display: inline-flex;
  align-items: flex-end;
  gap: 4px;
}

.typing-modern-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: linear-gradient(180deg, #14b8a6 0%, #0f766e 100%);
  display: inline-block;
  animation: typingModernBounce 1.15s infinite ease-in-out;
}

.typing-modern-dot:nth-child(2) {
  animation-delay: 0.16s;
}

.typing-modern-dot:nth-child(3) {
  animation-delay: 0.32s;
}

#booking-chat-typing-indicator-business.booking-chat-typing-wrap {
  width: fit-content;
  margin: 4px 0 10px 2px;
  pointer-events: none;
}

.booking-chat-typing-bubble {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: linear-gradient(130deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 250, 252, 0.96) 100%);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.1);
}

.booking-chat-typing-glow {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #14b8a6;
  animation: typingModernPulse 1.6s infinite ease-in-out;
}

.booking-chat-typing-label {
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  letter-spacing: 0.01em;
}

@media (max-width: 768px) {
  #typing-indicator.chat-typing-wrap {
    left: 14px;
    bottom: 148px;
    max-width: calc(100vw - 28px);
  }
}
@media (max-width: 768px) {
  .chat-format-bar--mobile-hidden {
    display: none !important;
  }
  #format-emoji-toggle,
  #emoji-picker {
    display: none !important;
  }
}

.influencer-dual-layout {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 20px;
}

.influencer-for-you,
.influencer-map-section {
  min-width: 0;
}

.influencer-for-you-cards {
  margin-bottom: 20px;
}

.influencer-map-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.influencer-map-shell {
  position: relative;
  flex: 1 1 auto;
  margin-bottom: 0;
}

#map-container .js-plotly-plot,
#map-container .plot-container,
#map-container .mapboxgl-canvas-container,
#map-container .mapboxgl-map {
  height: 100% !important;
  width: 100% !important;
}

@media (min-width: 1024px) {
  .influencer-dual-layout {
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: stretch;
  }

  .influencer-dual-layout.is-stacked {
    flex-direction: column;
  }

  .influencer-for-you {
    flex: 0 0 auto;
    width: min(570px, 100%);
  }

  .influencer-for-you-cards {
    margin-bottom: 0;
  }

  .influencer-dual-layout.is-stacked .influencer-for-you {
    width: 100%;
  }

  .influencer-map-section {
    flex: 1 1 auto;
    min-width: 0;
  }

  .influencer-map-section > .influencer_container {
    display: none;
  }

  .influencer-dual-layout .category-filters {
    display: none !important;
  }

  .influencer-map-section {
    height: auto;
    align-self: stretch;
  }

  .influencer-map-shell {
    flex: 1 1 auto;
    height: 100%;
  }

  .influencer-map-container {
    height: 100%;
  }

  #for_you_offer > div > div {
    display: grid;
    grid-template-columns: repeat(2, 280px);
    column-gap: 10px;
    row-gap: 10px;
    justify-content: start;
    overflow: visible;
    white-space: normal;
  }

  #for_you_offer .influencer_carousel_card_container,
  #for_you_offer .influencer_carousel_card_container_bookings {
    width: 280px;
    margin-right: 0;
    display: block;
  }

  #for_you_offer .influencer_carousel_card_container:nth-child(n + 5),
  #for_you_offer .influencer_carousel_card_container_bookings:nth-child(n + 5) {
    display: none;
  }

  .map-section-title {
    display: none;
  }

  .influencer-map-toggle {
    display: none !important;
  }
}

/* Influencer home refinements */
.influencer-home {
  padding: 20px 24px 120px;
  gap: 20px;
}

@media (max-width: 720px) {
  .influencer-home {
    padding: 8px 16px 112px;
    gap: 16px;
  }
}

@media (min-width: 1024px) {
  .influencer-home {
    padding-bottom: 88px;
  }
}

.influencer-home .influencer_container {
  margin: 0;
}

.influencer-home .influencer-header {
  padding: 0;
}

@media (max-width: 768px) {
  .influencer-home .influencer-header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    row-gap: 8px;
    position: sticky;
    top: 0;
    z-index: 910;
    background: #f8f9fa;
    padding: 0 0 8px;
  }

  .influencer-home .influencer-header-text {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  .influencer-home .influencer-header-location {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: center;
  }

  .influencer-home .influencer-header-search {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    width: 100%;
    max-width: none;
    max-height: 220px;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    overflow: visible;
  }

  body.influencer-scroll-compact .influencer-home .influencer-header {
    grid-template-columns: 1fr;
    padding: 0 0 8px;
    row-gap: 6px;
  }

  body.influencer-scroll-compact .influencer-home .influencer-header-text {
    display: none;
  }

  body.influencer-scroll-compact .influencer-home .influencer-header-search {
    grid-column: 1;
    grid-row: 1;
    justify-self: stretch;
    width: 100%;
    max-width: none;
    max-height: 220px;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    overflow: visible;
  }

  body.influencer-scroll-compact .influencer-home .influencer-header-location {
    display: none;
  }
}

.influencer-home .influencer_title {
  font-weight: 600;
  letter-spacing: -0.01em;
}

.influencer-home .influencer_text {
  color: #475569;
}

.influencer-home .influencer-location-chip {
  border-color: #d7dde4;
  font-size: 12px;
  font-weight: 600;
  box-shadow: none;
}

.influencer-home .influencer-location-chip.conditions_button {
  text-decoration: none;
}

.influencer-home .influencer-section-head {
  margin: 0 0 8px;
}

.influencer-home .category-filters {
  padding-bottom: 4px;
  scrollbar-width: none;
}

.influencer-home .category-filters::-webkit-scrollbar {
  display: none;
}

.influencer-home .tag-fav-btn {
  border-color: #e2e8f0;
  background: #ffffff;
  color: #005f73;
}

.dashboard-preview-header {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.dashboard-preview-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dashboard-preview-title {
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}

.dashboard-preview-pill {
  font-size: 12px;
  font-weight: 600;
  color: #005f73;
  background: rgba(0, 95, 115, 0.12);
  border: 1px solid rgba(0, 95, 115, 0.2);
  padding: 2px 10px;
  border-radius: 999px;
}

.dashboard-preview-subtitle {
  font-size: 13px;
  color: #64748b;
}

.dashboard-preview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

@media (max-width: 720px) {
  .dashboard-preview-grid {
    grid-template-columns: 1fr;
  }
}

.dashboard-preview-video-card {
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #d7eef3;
  background: #000000;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.dashboard-preview-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.dashboard-preview-copy-title {
  font-size: 15px;
  font-weight: 600;
  color: #0f172a;
}

.dashboard-preview-copy-text {
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
}

.dashboard-preview-features {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dashboard-preview-feature {
  font-size: 13px;
  color: #0f172a;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 8px 10px;
  border-radius: 10px;
}

.influencer-home .tag-fav-btn:focus-visible {
  outline: 2px solid rgba(0, 95, 115, 0.3);
  outline-offset: 2px;
}

.influencer-home .influencer_carousel_card_container:not(.promoted-card),
.influencer-home .influencer_carousel_card_container_bookings:not(.promoted-card) {
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  width: 252px !important;
}

.business-home .influencer_carousel_card_container:not(.promoted-card),
.business-home .influencer_carousel_card_container_bookings:not(.promoted-card) {
  width: 252px !important;
}

.influencer-home .influencer_carousel_card_container.promoted-card,
.influencer-home .influencer_carousel_card_container_bookings.promoted-card,
.business-home .influencer_carousel_card_container.promoted-card,
.business-home .influencer_carousel_card_container_bookings.promoted-card {
  width: 100% !important;
  max-width: 100% !important;
}

.influencer-home .influencer_carousel_card_container:hover,
.influencer-home .influencer_carousel_card_container_bookings:hover {
  border-color: #d7dde4;
}

.influencer-home .influencer_carousel_card_container:active,
.influencer-home .influencer_carousel_card_container_bookings:active {
  transform: scale(0.98);
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12);
  transition: none;
}

@media (max-width: 768px) {
  .influencer-home .offer-carousel-track,
  .business-home .offer-carousel-track {
    display: flex !important;
    gap: 10px;
    overflow-x: auto !important;
    overflow-y: hidden;
    padding: 2px 2px 6px;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
  }

  .influencer-home .offer-carousel-track > .influencer_carousel_card_container:not(.promoted-card),
  .influencer-home .offer-carousel-track > .influencer_carousel_card_container_bookings:not(.promoted-card),
  .business-home .offer-carousel-track > .influencer_carousel_card_container:not(.promoted-card),
  .business-home .offer-carousel-track > .influencer_carousel_card_container_bookings:not(.promoted-card) {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  .influencer-home .influencer_carousel_card_container:not(.promoted-card),
  .influencer-home .influencer_carousel_card_container_bookings:not(.promoted-card),
  .business-home .influencer_carousel_card_container:not(.promoted-card),
  .business-home .influencer_carousel_card_container_bookings:not(.promoted-card) {
    width: min(292px, 86vw) !important;
    border-radius: 16px;
    margin-right: 0 !important;
  }

  .influencer-home .influencer_carousel_card_container:not(.promoted-card) > div:first-child,
  .influencer-home .influencer_carousel_card_container_bookings:not(.promoted-card) > div:first-child,
  .business-home .influencer_carousel_card_container:not(.promoted-card) > div:first-child,
  .business-home .influencer_carousel_card_container_bookings:not(.promoted-card) > div:first-child {
    height: 126px !important;
  }

  .influencer-home .influencer_carousel_card_container:not(.promoted-card) > div:last-child,
  .influencer-home .influencer_carousel_card_container_bookings:not(.promoted-card) > div:last-child,
  .business-home .influencer_carousel_card_container:not(.promoted-card) > div:last-child,
  .business-home .influencer_carousel_card_container_bookings:not(.promoted-card) > div:last-child {
    padding: 0 12px 12px !important;
  }

  .influencer-home .influencer_card_footer,
  .business-home .influencer_card_footer {
    gap: 8px;
  }

  .influencer-home .offer-time-pill,
  .business-home .offer-time-pill {
    gap: 4px;
  }
}

.influencer-home .influencer_carousel_tag {
  background: #f1f5f9 !important;
  color: #475569;
  border: 1px solid #e2e8f0;
}

/* Business home aligned to influencer home */
.business-home .banner {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-left: 4px solid #005f73 !important;
  box-shadow: none !important;
}

.business-home .banner .banner-cta {
  border-radius: 12px;
  box-shadow: none !important;
}

.business-home .business-stat-grid {
  gap: 16px;
}

.business-home .business-stat-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
}

.business-home .business-dashboard-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}

.business-home .business-dashboard-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1.6fr) minmax(220px, 0.9fr);
  align-items: center !important;
  gap: 16px !important;
  padding: 18px !important;
}

.business-home .business-dashboard-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.business-home .business-dashboard-kicker-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #0f4f5c;
  text-transform: uppercase;
}

.business-home .business-dashboard-kicker-pill {
  font-size: 11px;
  font-weight: 700;
  color: #005f73;
  background: #ecfeff;
  border: 1px solid #bae6fd;
  border-radius: 999px;
  padding: 2px 8px;
}

.business-home .business-dashboard-copy {
  min-width: 0;
}

.business-home .business-dashboard-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.business-home .business-dashboard-point {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 6px 10px;
  background: #f8fafc;
  color: #0f172a;
  font-size: 12px;
  font-weight: 600;
}

.business-home .business-dashboard-point .influencer_text {
  margin: 0;
  font-size: 12px;
  color: #0f172a;
}

.business-home .business-dashboard-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.business-home .business-dashboard-cta {
  min-width: 210px;
  justify-content: center;
}

.business-home .business-dashboard-cta-note {
  font-size: 12px;
  color: #64748b;
  text-align: right;
}

.organization-home .organization-hero-shell {
  display: grid;
  gap: 16px;
}

.organization-home .organization-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(290px, 1fr);
  gap: 16px;
}

.organization-home .organization-hero-main-card,
.organization-home .organization-hero-side-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  padding: 18px;
}

.organization-home .organization-eyebrow {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid #dbeafe;
  color: #0f4f5c;
  background: #f8fafc;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin-bottom: 10px;
}

.organization-home .organization-quick-list {
  display: grid;
  gap: 8px;
  margin: 10px 0 12px;
}

.organization-home .organization-quick-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

.organization-home .organization-quick-label {
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
}

.organization-home .organization-quick-value {
  font-size: 24px;
  line-height: 1;
  font-weight: 700;
  margin-top: 2px;
}

.organization-home .organization-quick-inline-value {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
}

.organization-home .organization-hero-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  margin-bottom: 10px;
}

.organization-home .organization-hero-actions > * {
  flex: 1 1 0;
  min-width: 0;
}

.organization-home .organization-content-stack {
  display: grid;
  gap: 18px;
}

.organization-home .organization-banner-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}

.organization-home .business-dashboard-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}

.organization-home .organization-link-card,
.organization-home .organization-section-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}

.organization-home .org-sponsored-body {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr);
  gap: 14px;
  align-items: start;
}

.organization-home .org-sponsored-cards-wrap,
.organization-home .org-sponsored-manager-wrap {
  min-width: 0;
}

.organization-home .org-businesses-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  overflow: visible;
  white-space: normal;
  scroll-snap-type: none;
}

.organization-home .org-business-card-item {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-right: 0 !important;
  scroll-snap-align: none;
  border-radius: 18px !important;
  box-shadow: none !important;
}

.organization-home .organization-reporting-grid {
  gap: 14px !important;
}

.organization-home .org-map-shell {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 10px;
  background: #ffffff;
}

.organization-home .org-map-chart {
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
}

.organization-home .org-map-locations-shell {
  display: grid;
  gap: 10px;
}

.organization-home .org-map-locations-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.organization-home .org-map-location-item {
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  border-radius: 12px;
  padding: 8px 10px;
  min-width: 0;
}

.organization-home .org-map-location-title {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.organization-home .org-map-location-meta {
  font-size: 11px;
  color: #64748b;
  margin-top: 2px;
}

.organization-home .organization-insights-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 18px;
}

.organization-home .organization-dashboard-section .dashboard-card {
  min-height: auto !important;
}

.organization-home .organization-dashboard-section .dashboard-card:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 1100px) {
  .business-home .business-dashboard-shell {
    grid-template-columns: 1fr;
    align-items: flex-start !important;
  }

  .business-home .business-dashboard-actions {
    align-items: flex-start;
  }

  .business-home .business-dashboard-cta-note {
    text-align: left;
  }

  .organization-home .org-businesses-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .organization-home .organization-hero-grid,
  .organization-home .org-sponsored-body,
  .organization-home .organization-insights-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .organization-home .organization-reporting-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
    overflow: visible;
    padding-bottom: 0;
  }

  .agency-home .agency-reporting-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 12px !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }

  .organization-home .organization-reporting-card {
    min-width: 0 !important;
    padding: 14px !important;
    border-radius: 14px !important;
  }

  .agency-home .agency-reporting-card {
    flex: 0 0 220px;
    min-width: 220px !important;
  }

  .organization-home .organization-summary-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px !important;
    overflow: visible;
    padding-bottom: 0;
  }

  .organization-home .organization-summary-grid .organization-stat-card {
    min-width: 0 !important;
    padding: 12px !important;
    border-radius: 14px !important;
  }

  .organization-home .organization-summary-grid > .organization-stat-card:nth-child(3) {
    grid-column: 1 / -1;
  }

  .organization-home .org-businesses-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .organization-home .organization-hero-main-card,
  .organization-home .organization-hero-side-card,
  .organization-home .organization-section-card {
    padding: 14px !important;
    border-radius: 14px !important;
  }

  .organization-home .organization-hero-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 8px;
  }

  .organization-home .organization-hero-actions > * {
    width: 100%;
  }

  .organization-home .org-map-locations-list {
    grid-template-columns: 1fr;
  }

  .organization-home .organization-quick-row {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 6px;
  }

  .organization-home .org-sponsored-body {
    gap: 12px;
  }

  .organization-home #org-remove-sponsored-btn,
  .organization-home #org-transfer-sponsored-btn {
    flex: 1 1 calc(50% - 6px);
    min-width: 0;
  }

  .business-home .business-dashboard-cta {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 420px) {
  .organization-home .organization-reporting-grid,
  .organization-home .organization-summary-grid {
    grid-template-columns: 1fr !important;
  }

  .organization-home .organization-hero-actions {
    grid-template-columns: 1fr;
  }

  .organization-home .organization-summary-grid > .organization-stat-card:nth-child(3) {
    grid-column: auto;
  }

  .organization-home .organization-hero-main-card,
  .organization-home .organization-hero-side-card,
  .organization-home .organization-section-card,
  .organization-home .org-map-shell {
    padding: 12px !important;
    border-radius: 12px !important;
  }
}

.agency-home .agency-section-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}

.agency-home .agency-reporting-grid {
  gap: 14px !important;
}

.agency-home .businesses-carousel {
  scroll-snap-type: x mandatory;
}

.agency-home .business-card {
  scroll-snap-align: start;
  box-shadow: none !important;
}

.agency-home .business-dashboard-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}

.agency-home .agency-section-card .dashboard-card {
  min-height: auto !important;
}

.influencer-home .influencer_map_container,
.influencer-home .influencer-map-container {
  border-radius: 16px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.influencer-home .influencer-map-toggle {
  border-color: #e5e7eb;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

.influencer-home .hover-info-card {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: min(330px, calc(100% - 24px));
  max-height: min(220px, calc(100% - 24px));
  overflow: auto;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(226, 232, 240, 0.78);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14);
  padding: 10px;
  z-index: 20;
  animation: hoverMapCardIn 0.18s ease-out;
}

@media (max-width: 520px) {
  .influencer-home .hover-info-card {
    left: 12px;
    right: 12px;
    width: auto;
  }
}

@keyframes hoverMapCardIn {
  from {
    transform: translateY(6px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .influencer-home .hover-info-card {
    animation: none;
  }
}

.influencer-home .hover-info-card .influencer_title {
  font-size: 16px;
  margin-bottom: 2px;
}

.influencer-home .hover-info-card .influencer_text {
  font-size: 12px;
}

.hover-map-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}

.hover-map-main {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  padding-right: 34px;
}

.hover-map-close {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #475569;
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.hover-map-close:hover {
  background: rgba(255, 255, 255, 0.9);
}

.hover-map-image {
  width: 100%;
  height: 86px;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.1);
}

.hover-map-image.hover-map-image-compact {
  width: 78px;
  height: 62px;
  min-width: 78px;
  border-radius: 12px;
  box-shadow: none;
}

.hover-map-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.hover-map-body.hover-map-body-compact {
  gap: 3px;
}

.hover-map-business {
  margin: 0;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(15, 23, 42, 0.55);
}

.hover-map-title {
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.15;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

@supports not (-webkit-line-clamp: 2) {
  .hover-map-title {
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

.hover-map-subtitle {
  margin: 0;
  font-size: 12px;
  color: #64748b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hover-map-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.hover-map-actions.hover-map-actions-compact {
  flex-wrap: wrap;
  gap: 8px;
}

.hover-map-distance {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(15, 118, 110, 0.25);
  background: rgba(15, 118, 110, 0.08);
  color: #005f73;
  font-size: 10px;
  font-weight: 600;
  white-space: nowrap;
}

.hover-map-link {
  text-decoration: none;
  font-size: 11px;
  font-weight: 600;
  color: #005f73;
  padding: 3px 8px;
  border-radius: 8px;
  border: 1px solid rgba(15, 118, 110, 0.2);
  background: rgba(15, 118, 110, 0.08);
  transition: border-color 0.2s ease, color 0.2s ease;
  white-space: nowrap;
}

.hover-map-link:hover {
  color: #0f5c54;
  border-color: rgba(15, 118, 110, 0.45);
}

.hover-map-delivery-pill {
  background: rgba(59, 130, 246, 0.08);
  border-color: rgba(59, 130, 246, 0.2);
  color: #1d4ed8;
}

.hover-map-cta {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  border: 1px solid rgba(0, 95, 115, 0.24);
  background: rgba(0, 95, 115, 0.08);
  color: #005f73;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  white-space: nowrap;
}

.hover-map-cta:hover {
  background: rgba(0, 95, 115, 0.12);
  border-color: rgba(0, 95, 115, 0.32);
}

.hover-map-cta:active {
  transform: translateY(1px);
}

@media (max-width: 420px) {
  .hover-map-cta {
    margin-left: 0;
    width: 100%;
  }
}

.markdown-hint {
  margin-top: 6px;
  font-size: 12px;
  color: #94a3b8;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.markdown-hint-code {
  font-family: "Courier New", Courier, monospace;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 2px 6px;
  border-radius: 6px;
  color: #0f172a;
}

.offer-markdown {
  font-size: 0.95rem;
  color: inherit;
  line-height: 1.8;
}

.offer-markdown ul {
  padding-left: 18px;
  margin: 6px 0;
}

.offer-markdown li {
  margin-bottom: 4px;
}

.offer-booking-page {
  background: radial-gradient(circle at top, rgba(226, 232, 240, 0.6), rgba(248, 250, 252, 0.9)) #f8fafc;
  padding: 22px 24px 140px;
  gap: 22px;
}

.offer-request-page {
  background: radial-gradient(circle at top, rgba(226, 232, 240, 0.6), rgba(248, 250, 252, 0.9)) #f8fafc;
  padding: 22px 24px 140px;
  gap: 22px;
}

.offer-request-page .offer-request-grid {
  display: grid;
  gap: 16px;
}

@media (min-width: 900px) {
  .offer-request-page .offer-request-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}

.offer-booking-page .influencer_offer_box_style,
.offer-request-page .influencer_offer_box_style {
  background: rgba(255, 255, 255, 0.98);
  border-radius: 20px;
  border: 1px solid rgba(226, 232, 240, 0.85);
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
  padding: 20px 22px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
  .offer-booking-page .influencer_offer_box_style:hover,
  .offer-request-page .influencer_offer_box_style:hover {
  }
}

.offer-booking-page .influencer_title {
  color: #0f172a;
}

.offer-booking-page .influencer_text {
  color: #475569;
}

.offer-request-page .influencer_title,
.offer-booking-page .influencer_title {
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.offer-request-page .influencer_text {
  color: #475569;
}

.offer-booking-page .influencer_offer_button_container,
.offer-request-page .influencer_offer_button_container {
  width: min(420px, calc(100% - 32px));
}

.offer-booking-page .influencer_offer_button,
.offer-request-page .influencer_offer_button {
  background: linear-gradient(135deg, #005f73 0%, #0f766e 100%);
  border: none;
  border-radius: 999px;
  color: #ffffff;
  box-shadow: 0 14px 26px rgba(0, 95, 115, 0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.offer-booking-page .influencer_offer_button:hover,
.offer-request-page .influencer_offer_button:hover {
}

.offer-asset-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: stretch;
  margin-top: 24px;
}

.offer-asset-card {
  flex: 1 1 240px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 100%;
}

.offer-asset-head {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ugc-creator-col {
  display: flex;
}

.ugc-creator-col > div {
  flex: 1 1 auto;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.business-booking-view {
  background: #f8fafc;
}

.business-booking-view .influencer_container {
  max-width: 1120px;
  margin: 0 auto;
}

.business-booking-view .influencer_offer_box_style {
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: none !important;
  padding: 22px 24px;
}

.business-booking-view .booking-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}

.business-booking-view .booking-creator-card .booking-creator-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
  font-weight: 600;
}

.business-booking-view .booking-creator-card .booking-creator-handle {
  font-size: 13px;
  color: #64748b;
  margin-top: 2px;
}

.business-booking-view .booking-creator-card .booking-creator-head {
  gap: 18px;
}

.business-booking-view .booking-creator-card .booking-creator-meta-row {
  border-top: 1px solid #e2e8f0;
  color: #475569;
  padding-top: 10px;
  margin-top: 12px;
}

.business-booking-view .booking-audience-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.business-booking-view .booking-audience-tile {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 14px 16px;
  background: #f8fafc;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.business-booking-view .booking-audience-tile-head {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #0f172a;
  font-weight: 600;
  font-size: 13px;
}

.business-booking-view .booking-audience-label {
  font-size: 12px;
  font-weight: 600;
  color: #475569;
}

.business-booking-view .booking-audience-value {
  font-size: 14px;
  color: #0f172a;
  font-weight: 600;
}

.business-booking-view .booking-audience-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.business-booking-view .booking-audience-location {
  position: relative;
  overflow: hidden;
}

.business-booking-view .booking-location-map {
  margin-top: 8px;
  height: 46px;
  border-radius: 12px;
  background: radial-gradient(circle at 30% 30%, rgba(14, 165, 233, 0.15), transparent 45%),
    radial-gradient(circle at 70% 40%, rgba(20, 184, 166, 0.15), transparent 50%),
    #f1f5f9;
  position: relative;
}

.business-booking-view .booking-location-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #0ea5e9;
  position: absolute;
  top: 16px;
  left: 26px;
  box-shadow: 0 0 0 6px rgba(14, 165, 233, 0.15);
}

.business-booking-view .booking-location-dot.second {
  top: 10px;
  left: 62px;
  background: #14b8a6;
  box-shadow: 0 0 0 6px rgba(20, 184, 166, 0.15);
}

.business-booking-view .booking-location-dot.third {
  top: 24px;
  left: 98px;
  background: #64748b;
  box-shadow: 0 0 0 6px rgba(100, 116, 139, 0.12);
}

.business-booking-view .booking-quick-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.business-booking-view .booking-quick-stat {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.business-booking-view .booking-quick-stat-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.business-booking-view .booking-quick-stat-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
  font-weight: 700;
}

.business-booking-view .booking-quick-stat-value {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.business-booking-view .booking-quick-stats-card {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.98) 100%);
  border: 1px solid rgba(148, 163, 184, 0.25);
}

.business-booking-view .booking-meta-empty {
  font-size: 13px;
  color: #94a3b8;
  background: #f8fafc;
  border-radius: 12px;
  padding: 10px 12px;
  border: 1px dashed rgba(148, 163, 184, 0.35);
}

.dashboard-soft-cta:hover,
.dashboard-soft-cta:focus-visible {
  background-color: #e6f4f2 !important;
  border-color: rgba(0, 95, 115, 0.35) !important;
  color: #0b3e47 !important;
}

@media (max-width: 720px) {
  .business-booking-view {
    padding: 16px 16px 120px;
    gap: 16px;
  }

  .business-booking-view .influencer_container {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .business-booking-view .influencer_offer_box_style {
    padding: 16px;
    margin-bottom: 16px;
    border-radius: 16px;
  }

  .business-booking-view .modern-banner-button,
  .business-booking-view .conditions_button,
  .business-booking-view .influencer_offer_button {
    width: 100%;
    justify-content: center;
  }

  .business-booking-view .container_style {
    width: 100%;
  }
}

.booking-profile-drawer .mantine-Drawer-content {
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(241, 245, 249, 0.98) 100%);
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.booking-profile-drawer {
  z-index: 10040;
}

.booking-profile-drawer .mantine-Drawer-overlay {
  z-index: 10040;
}

.booking-profile-drawer .mantine-Drawer-content {
  z-index: 10050;
}

.booking-profile-drawer .mantine-Drawer-body {
  padding: 20px 24px 160px;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}

.booking-profile-drawer .booking-drawer-container {
  min-height: 100%;
}

.booking-profile-drawer .mantine-Drawer-overlay {
  background-color: rgba(15, 23, 42, 0.04);
  opacity: 1;
  backdrop-filter: none;
  pointer-events: none;
}

.business-booking-view {
  --panel-bg: #ffffff;
  --panel-border: #e2e8f0;
  --panel-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
  --panel-radius: 18px;
  --panel-padding: 18px;
  --panel-title: #0f172a;
  --panel-subtitle: #64748b;
}

.booking-drawer-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.booking-drawer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e2e8f0;
  padding-bottom: 12px;
}

.booking-drawer-title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}

.booking-drawer-close {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.booking-drawer-close:hover {
  border-color: rgba(0, 95, 115, 0.4);
  color: #005f73;
}

.booking-drawer-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100%;
}

.booking-drawer-hero {
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(244, 247, 251, 0.96) 100%);
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.08);
}

.booking-drawer-banner {
  height: 70px;
  background: linear-gradient(135deg, rgba(0, 95, 115, 0.2) 0%, rgba(14, 165, 233, 0.24) 60%, rgba(16, 185, 129, 0.2) 100%);
}

.booking-drawer-hero-content {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 14px 16px 18px;
}

.booking-drawer-header {
  display: flex;
  gap: 14px;
  align-items: center;
}

.booking-drawer-avatar {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  object-fit: cover;
  border: 3px solid #ffffff;
  margin-top: -36px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.12);
}

.booking-drawer-title-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.booking-drawer-name {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.booking-drawer-handle {
  font-size: 13px;
  color: #64748b;
}

.booking-drawer-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
}

.booking-drawer-stat {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(255, 255, 255, 0.85);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.booking-drawer-stat-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.booking-drawer-stat-label {
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
  font-weight: 700;
}

.booking-drawer-stat-value {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

.booking-drawer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.booking-drawer-card {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255, 255, 255, 0.9);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.booking-drawer-card-map {
  background: radial-gradient(circle at 20% 30%, rgba(14, 165, 233, 0.12), transparent 45%),
    radial-gradient(circle at 75% 60%, rgba(20, 184, 166, 0.12), transparent 55%),
    #f8fafc;
}

.booking-drawer-section-title {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748b;
  font-weight: 700;
}

.booking-drawer-value {
  font-size: 14px;
  color: #0f172a;
  font-weight: 600;
}

.booking-drawer-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.booking-drawer-pill {
  padding: 4px 10px;
  border-radius: 999px;
  background: #e6f6f2;
  color: #005f73;
  font-size: 12px;
  font-weight: 600;
}

.booking-drawer-pill.muted {
  background: #f1f5f9;
  color: #94a3b8;
}

.booking-drawer-empty {
  font-size: 14px;
  color: #64748b;
  text-align: center;
  padding: 12px 0;
}

.booking-profile-drawer .business-booking-view {
  background: transparent;
}

.booking-profile-drawer .influencer_offer_box_style {
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.96) 100%);
  padding: 16px 18px;
  margin-bottom: 10px;
}

.booking-profile-drawer .booking-drawer-body .influencer_title {
  font-size: 18px;
  color: #0f172a;
}

.booking-profile-drawer .booking-drawer-body .influencer_text {
  color: #475569;
}

.booking-profile-drawer .booking-drawer-select-card {
  padding: 0;
  background: transparent;
  border: none;
}

.booking-drawer-actions {
  position: sticky;
  bottom: 16px;
  display: flex;
  gap: 12px;
  padding: 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(226, 232, 240, 0.9);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(12px);
  z-index: 8;
  margin-top: 12px;
}

.booking-drawer-action-btn {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.booking-drawer-action-btn:hover {
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12);
}

.booking-profile-drawer .booking-drawer-select-btn {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.booking-profile-drawer .booking-drawer-select-btn:hover {
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.12);
}

.booking-creator-card .creator-summary-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) minmax(220px, 1fr);
  gap: 16px;
  align-items: start;
}

.creator-summary-left-wrapper {
  display: flex;
  gap: 14px;
  align-items: center;
}

.creator-avatar {
  width: 88px;
  height: 88px;
  border-radius: 20px;
  object-fit: cover;
  border: 3px solid #ffffff;
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.12);
}

.creator-summary-left {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.creator-name {
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}

.creator-followers {
  font-size: 14px;
  color: #475569;
  font-weight: 600;
}

.creator-instagram-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #0f172a;
}

.creator-instagram-row.locked {
  color: #94a3b8;
}

.creator-instagram-text {
  font-weight: 600;
}

.creator-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0, 95, 115, 0.12);
  color: #005f73;
  font-size: 12px;
  font-weight: 700;
  width: fit-content;
}

.creator-summary-right {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.creator-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #334155;
}

.creator-meta-text {
  font-weight: 600;
  color: #0f172a;
}

.creator-section-title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.creator-interests-section,
.creator-equipment-section,
.creator-description-section {
  margin-top: 10px;
}

.creator-interests-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.creator-interest-tag {
  padding: 4px 10px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}

.creator-description-card {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0, 95, 115, 0.08);
  color: #005f73;
}

.creator-description-text {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}

.audience-highlight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.audience-card {
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: #ffffff;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.audience-card-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
  font-weight: 700;
}

.audience-card-value {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.audience-card-value.locked {
  color: #94a3b8;
  filter: blur(3px);
}

.audience-charts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin-top: 14px;
}

.audience-panel {
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 16px;
  padding: 12px;
  background: #ffffff;
}

.audience-section-title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.audience-chart {
  width: 100%;
  height: 220px;
  max-height: 220px;
}

.audience-panel .js-plotly-plot,
.audience-panel .plot-container {
  height: 220px !important;
  max-height: 220px !important;
}

.audience-empty {
  font-size: 13px;
  color: #94a3b8;
  padding: 12px 4px;
}

.audience-tabs {
  font-size: 13px;
}

.audience-tabs .tab {
  padding: 8px 12px !important;
  border: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  border-radius: 10px 10px 0 0 !important;
  font-weight: 600 !important;
  color: #475569 !important;
}

.audience-tabs .tab--selected {
  background: #ffffff !important;
  color: #0f172a !important;
  border-bottom: none !important;
}

.audience-summary-row {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}

.audience-location-summary {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #475569;
  font-size: 13px;
}

.audience-location-text {
  font-weight: 600;
  color: #0f172a;
}

.audience-engagement-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #475569;
}

.audience-engagement-label {
  font-weight: 600;
  color: #0f172a;
}

.audience-engagement-value {
  font-weight: 700;
  color: #0f172a;
}

.audience-engagement-value.locked {
  color: #94a3b8;
}

@media (max-width: 900px) {
  .booking-creator-card .creator-summary-row {
    grid-template-columns: 1fr;
  }

  .creator-summary-left-wrapper {
    flex-direction: column;
    align-items: flex-start;
  }
}


.campaign-header {
  position: sticky;
  top: 0;
  z-index: 5;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.95) 100%);
  padding: 14px 18px;
  border-radius: var(--panel-radius);
  border: 1px solid rgba(148, 163, 184, 0.24);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.08);
}

.campaign-header-title {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}

.campaign-header-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.campaign-header-subtitle {
  font-size: 12px;
  color: #64748b;
}

.campaign-header-dot {
  color: #cbd5f5;
  font-size: 12px;
}

.campaign-header-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}

.campaign-header-time {
  font-size: 12px;
  font-weight: 600;
  color: #d62828;
}

.campaign-header-price {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.campaign-preview-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 16px;
}

/* --- Booking profile drawer redesign --- */
.booking-profile-drawer .mantine-Drawer-content {
  background: #ffffff;
}

.booking-profile-drawer .mantine-Drawer-body {
  padding: 0;
  overflow: hidden;
  height: 100%;
}

.booking-drawer-container {
  height: 100%;
  position: relative;
}

.booking-drawer-close-static {
  position: absolute;
  top: 12px;
  right: 16px;
  z-index: 10;
}

#booking-profile-drawer-body {
  height: 100%;
}

.booking-drawer-shell {
  height: 100%;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  background: #ffffff;
}

.booking-drawer-hero-section {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0;
  overflow: hidden;
  --carousel-height: 240px;
  min-height: 320px;
}

.booking-drawer-carousel {
  position: relative;
  height: var(--carousel-height);
  margin: 0;
  overflow: hidden;
  background: #f8fafc;
}

.booking-drawer-carousel-inner,
.booking-drawer-carousel .carousel,
.booking-drawer-carousel .carousel-inner,
.booking-drawer-carousel .carousel-item,
.booking-drawer-carousel .carousel-item img {
  height: 100%;
}

.booking-drawer-carousel .carousel-item img {
  width: 100%;
  object-fit: cover;
}

.booking-drawer-carousel-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0) 0%, rgba(15, 23, 42, 0.35) 100%);
  pointer-events: none;
}

.booking-drawer-carousel-empty {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 600;
}

.booking-drawer-profile-overlay {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(var(--carousel-height) - 42px);
  width: 100%;
  box-sizing: border-box;
  padding: 0 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  z-index: 3;
}

.booking-drawer-avatar {
  width: 84px;
  height: 84px;
  border-radius: 999px;
  object-fit: cover;
  margin-top: 0;
  margin-left: 0;
  border: 3px solid #ffffff;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.18);
  background: #ffffff;
}

.booking-drawer-name {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  text-align: center;
}

.booking-drawer-name-line {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  flex-wrap: wrap;
}

.booking-drawer-name-meta {
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
  max-width: min(100%, 520px);
  text-align: center;
  line-height: 1.3;
}

.booking-drawer-header-info {
  flex: 1;
  min-width: 0;
  margin-top: 56px;
  padding: 0 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  text-align: center;
}

.booking-drawer-handle-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}

.booking-drawer-instagram {
  font-weight: 700;
  color: #0f172a;
}

.booking-drawer-instagram.locked {
  filter: blur(3px);
  color: #94a3b8;
  cursor: help;
}

.booking-drawer-header-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.booking-drawer-info-pill {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}

.booking-drawer-interests {
  justify-content: center;
}

.booking-drawer-interest-scroll {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  gap: 6px;
  scrollbar-width: thin;
  -ms-overflow-style: none;
  scroll-behavior: smooth;
  max-width: 100%;
  padding: 2px;
  position: relative;
}

.booking-drawer-interest-scroll::-webkit-scrollbar {
  display: none;
}

.booking-drawer-interest-scroll::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.6);
  border-radius: 999px;
}

.booking-drawer-interest-scroll .creator-interest-tag {
  white-space: nowrap;
  flex: 0 0 auto;
  scroll-snap-align: start;
}

.booking-drawer-inline-scroll {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scrollbar-width: none;
  -ms-overflow-style: none;
  scroll-behavior: smooth;
}

.booking-drawer-inline-scroll::-webkit-scrollbar {
  display: none;
}

.booking-drawer-inline-scroll.is-auto-scrolling {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
}

.booking-drawer-interest-scroll.is-auto-scrolling {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
}

.booking-profile-drawer .booking-drawer-content {
  max-width: 880px;
  width: 100%;
  margin: 0 auto;
}

.booking-profile-drawer .booking-drawer-hero-section {
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 22px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.booking-profile-drawer .booking-drawer-content > .booking-section:not(.booking-drawer-hero-section) {
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.booking-profile-drawer .booking-drawer-content > .booking-section .booking-section-title {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.booking-profile-drawer .booking-drawer-header-info {
  gap: 12px;
}

.booking-profile-drawer .booking-drawer-info-pill {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-color: rgba(148, 163, 184, 0.3);
  box-shadow: 0 6px 12px rgba(15, 23, 42, 0.04);
}

.booking-profile-drawer .booking-drawer-description {
  max-width: 70ch;
  text-align: center;
}

.booking-profile-drawer .booking-drawer-footer {
  background: rgba(255, 255, 255, 0.92);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.booking-profile-drawer .booking-drawer-btn {
  border-radius: 14px;
}

.booking-collab-avatar-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 4px;
}

.booking-collab-avatar-scroll .mantine-AvatarGroup-root {
  flex-wrap: nowrap;
}

.booking-collab-avatar-scroll::-webkit-scrollbar {
  height: 4px;
}

.booking-collab-avatar-scroll::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.6);
  border-radius: 999px;
}

.booking-drawer-description {
  margin: 0;
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
}

@media (max-width: 640px) {
  .booking-drawer-hero-section {
    --carousel-height: 190px;
    min-height: 280px;
  }

  .booking-drawer-profile-overlay {
    top: calc(var(--carousel-height) - 34px);
  }

  .booking-drawer-avatar {
    width: 72px;
    height: 72px;
  }

  .booking-drawer-header-info {
    margin-top: 64px;
  }
}

.booking-drawer-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.booking-drawer-badge {
  padding: 4px 10px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}

.booking-drawer-badge.locked {
  color: #94a3b8;
}

.booking-drawer-content {
  padding: 16px 20px 96px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.premium-details-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.premium-details-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

@media (min-width: 992px) {
  .premium-details-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.offer-profile-preview .booking-drawer-shell {
  height: auto;
  overflow: visible;
  box-shadow: none;
}

.offer-profile-preview .booking-drawer-content {
  padding: 16px;
}

.offer-profile-preview .booking-drawer-footer {
  display: none;
}

.offer-profile-preview .booking-media-btn {
  display: none;
}

.booking-platform-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.booking-platform-pill {
  padding: 4px 10px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}

.booking-platform-pill.locked {
  color: #94a3b8;
}

.booking-premium-link {
  background: none;
  border: none;
  color: #005f73;
  font-size: 12px;
  font-weight: 600;
  padding: 0;
  cursor: pointer;
}

.booking-drawer-tabs {
  padding: 12px 20px 0;
}

.booking-drawer-tabs .tab {
  padding: 8px 12px !important;
  margin-right: 6px !important;
  border-radius: 999px !important;
  border: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  color: #475569 !important;
}

.booking-drawer-tabs .tab--selected {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: #0f172a !important;
}

.booking-drawer-tab-panel {
  padding: 16px 20px 96px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.booking-drawer-grid-profile {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 24px;
}

.booking-drawer-col {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.booking-drawer-col-side {
  gap: 12px;
}

.booking-drawer-section {
  border-top: 1px solid #e5e7eb;
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.booking-drawer-section:first-child {
  border-top: none;
  padding-top: 0;
}

.booking-drawer-section-title {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 8px;
}

.booking-subsection-title {
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  margin-top: 6px;
}

.booking-section-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.booking-section-icon {
  font-size: 14px;
  color: #94a3b8;
}

.booking-summary-line {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.booking-summary {
  border-top: none;
  padding-top: 0;
}

.booking-summary-followers {
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}

.booking-summary-badge {
  padding: 4px 8px;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}

.booking-meta-line {
  font-size: 12px;
  color: #475569;
}

.booking-media-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.booking-media-row-scroll {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
}

.booking-media-row-scroll .booking-media-preview-btn,
.booking-media-row-scroll .booking-media-tile {
  flex: 0 0 auto;
}

.booking-media-row-scroll .booking-media-preview-btn {
  scroll-snap-align: start;
}

.booking-media-row-scroll .booking-media-tile {
  width: 110px;
  min-width: 110px;
}

.booking-media-preview-btn {
  border: none;
  padding: 0;
  background: transparent;
  cursor: pointer;
  display: inline-flex;
}

.booking-media-modal .modal-content {
  border: none;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
}

/* The creator-profile drawer uses a very high z-index; keep media modal above it. */
.booking-media-modal {
  z-index: 10120 !important;
}

.booking-media-modal .modal-body {
  padding: 0;
}

.booking-media-modal .booking-drawer-modal-inner {
  padding: 16px;
  background: #ffffff;
}

.booking-media-carousel {
  width: 100%;
}

.booking-media-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.booking-media-slide-inner {
  width: 100%;
  height: 70vh;
  min-height: 360px;
  background: #0f172a;
  border-radius: 18px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.booking-media-slide-inner img,
.booking-media-slide-inner video {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
}

@media (min-width: 900px) {
  .booking-media-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.booking-media-tile {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  overflow: hidden;
  background: #f8fafc;
}

.booking-media-tile img,
.booking-media-tile video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 12px;
}

.booking-media-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  background: rgba(15, 23, 42, 0.35);
}

.booking-media-btn {
  align-self: center;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #0f172a;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 999px;
  cursor: pointer;
}

.booking-produced-modal {
  border: none;
  border-radius: 18px;
  overflow: hidden;
}

.booking-produced-modal .modal-header {
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 12px 16px;
}

.booking-produced-modal .modal-body {
  padding: 14px 16px;
}

.booking-produced-modal .modal-footer {
  border-top: 1px solid #e2e8f0;
  background: #ffffff;
  padding: 10px 16px;
}

.booking-produced-view {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.booking-produced-empty {
  text-align: center;
  color: #64748b;
  font-size: 13px;
  padding: 20px 8px;
}

.booking-produced-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.booking-produced-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.booking-produced-group-title {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.booking-produced-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef6f6;
  border: 1px solid #d8ecec;
  color: #0b7285;
  font-size: 12px;
  font-weight: 700;
}

.booking-produced-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}

.booking-produced-card {
  display: flex;
  flex-direction: column;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
}

.booking-produced-media-frame {
  height: 140px;
  background: #0f172a;
  display: flex;
  align-items: center;
  justify-content: center;
}

.booking-produced-media {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #0f172a;
}

.booking-produced-media-empty {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: #94a3b8;
  font-size: 12px;
  background: #f8fafc;
}

.booking-produced-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
}

.booking-produced-meta-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.booking-produced-badge {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid transparent;
  white-space: nowrap;
}

.booking-produced-badge.is-ok {
  color: #166534;
  background: #ecfdf3;
  border-color: #bbf7d0;
}

.booking-produced-badge.is-ko {
  color: #b42318;
  background: #fef3f2;
  border-color: #fecdd3;
}

.booking-produced-badge.is-neutral {
  color: #475569;
  background: #f8fafc;
  border-color: #e2e8f0;
}

.booking-produced-time {
  font-size: 11px;
  color: #64748b;
  white-space: nowrap;
}

.booking-produced-detail {
  font-size: 12px;
  color: #475569;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.booking-drawer-text {
  font-size: 13px;
  color: #334155;
  line-height: 1.6;
  margin: 0;
}

.booking-drawer-text-strong {
  font-weight: 700;
  color: #0f172a;
}

.booking-drawer-text-muted {
  font-size: 12px;
  color: #94a3b8;
}

.booking-drawer-section-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.booking-drawer-link {
  background: none;
  border: none;
  padding: 0;
  color: #005f73;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
}

.booking-drawer-media-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.booking-collab-logos {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.booking-collab-logo {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  object-fit: cover;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

.booking-drawer-info-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
  font-size: 13px;
  color: #0f172a;
}

.booking-drawer-info-list li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.booking-drawer-info-label {
  color: #64748b;
  font-weight: 600;
  font-size: 12px;
}

.booking-drawer-info-value {
  font-weight: 600;
  color: #0f172a;
  text-align: right;
}

.booking-drawer-footer {
  position: sticky;
  bottom: 0;
  background: #ffffff;
  border-top: 1px solid #e5e7eb;
  padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  z-index: 5;
  min-height: 72px;
}

.booking-profile-drawer .booking-drawer-footer {
  bottom: 90px;
}

.booking-drawer-btn {
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.booking-drawer-btn.ghost {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  color: #0f172a;
}

.booking-drawer-btn.primary {
  background: #005f73;
  border: 1px solid #005f73;
  color: #ffffff;
}

.booking-drawer-btn.primary.active {
  background: #0f172a;
  border-color: #0f172a;
}

.booking-drawer-btn:hover {
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

.creator-interest-tag {
  padding: 6px 12px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}

.audience-highlight-grid {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.audience-panel {
  border: none;
  background: transparent;
  padding: 0;
}

.booking-timeline-card {
  padding: 0;
}

.booking-timeline {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-left: 20px;
}

.booking-timeline::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 4px;
  bottom: 4px;
  width: 1px;
  background: #e2e8f0;
}

.booking-timeline-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.booking-timeline-icon {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  color: #94a3b8;
  flex-shrink: 0;
  margin-left: -20px;
}

.booking-timeline-item.past .booking-timeline-icon {
  background: #0f172a;
  color: #ffffff;
  border-color: #0f172a;
}

.booking-timeline-item.active .booking-timeline-icon {
  background: #005f73;
  color: #ffffff;
  border-color: #005f73;
}

.booking-timeline-title {
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}

.booking-timeline-subtitle {
  font-size: 12px;
  color: #64748b;
}

.booking-timeline-item.future .booking-timeline-title {
  color: #64748b;
}

@media (max-width: 900px) {
  .booking-drawer-grid-profile {
    grid-template-columns: 1fr;
  }

  .booking-drawer-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .booking-profile-drawer .booking-drawer-shell {
    background: #ffffff;
  }

  .booking-profile-drawer .booking-drawer-content {
    padding: 14px 14px calc(120px + env(safe-area-inset-bottom));
    gap: 16px;
  }

  .booking-profile-drawer .booking-drawer-content > .booking-section:not(.booking-drawer-hero-section) {
    gap: 10px;
    padding: 16px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: none;
  }

  .booking-profile-drawer .booking-drawer-content > .booking-section .booking-section-title {
    margin: 0;
    font-size: 14px;
    line-height: 1.35;
  }

  .booking-profile-drawer .booking-drawer-content > .booking-section .booking-subsection-title {
    margin: 0;
    line-height: 1.35;
    color: #64748b;
  }

  .booking-profile-drawer .booking-drawer-content > .booking-section .booking-drawer-text,
  .booking-profile-drawer .booking-drawer-content > .booking-section .booking-drawer-description {
    margin: 0;
  }

  .booking-profile-drawer .booking-drawer-hero-section {
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 20px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
    min-height: auto;
    gap: 8px;
  }

  .booking-profile-drawer .booking-drawer-profile-overlay {
    position: static;
    left: auto;
    right: auto;
    top: auto;
    width: 100%;
    padding: 0 14px;
    gap: 3px;
  }

  .booking-profile-drawer .booking-drawer-avatar {
    margin-top: 6px;
  }

  .booking-profile-drawer .booking-drawer-name-line {
    gap: 2px;
    line-height: 1.2;
  }

  .booking-profile-drawer .booking-drawer-name-meta {
    line-height: 1.2;
  }

  .booking-profile-drawer .booking-drawer-header-info {
    margin-top: 0;
    padding: 0 14px 14px;
    gap: 6px;
  }

  .booking-profile-drawer .booking-drawer-handle-row {
    margin-top: -1px;
  }

  .booking-profile-drawer .booking-drawer-header-stats {
    gap: 6px;
  }

  .booking-profile-drawer .booking-drawer-info-pill {
    padding: 5px 10px;
  }

  .booking-profile-drawer .booking-drawer-footer {
    bottom: calc(var(--navbar-safe-offset, 5px) + 8px);
    gap: 8px;
    padding: 10px 14px calc(12px + env(safe-area-inset-bottom));
    box-shadow: 0 -10px 20px rgba(15, 23, 42, 0.08);
  }

  .booking-profile-drawer .booking-drawer-btn {
    width: 100%;
    justify-content: center;
  }
}

.campaign-preview-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 auto;
  width: 100%;
}

.campaign-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.96) 100%);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: var(--panel-radius);
  padding: var(--panel-padding);
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
  position: relative;
  overflow: hidden;
}

.campaign-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.6);
  opacity: 0.6;
}

.campaign-card--hero {
  background: radial-gradient(circle at 20% 20%, rgba(14, 165, 233, 0.12), transparent 55%),
    radial-gradient(circle at 80% 0%, rgba(0, 95, 115, 0.18), transparent 55%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(243, 248, 251, 0.98) 100%);
  border-color: rgba(0, 95, 115, 0.25);
}

.campaign-card--content {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 248, 255, 0.95) 100%);
}

.campaign-card--impact {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(240, 253, 250, 0.94) 100%);
}

.campaign-card--budget {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(254, 249, 240, 0.96) 100%);
}

.campaign-card--creators {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 250, 251, 0.96) 100%);
}

.campaign-card--guarantee {
  background: linear-gradient(135deg, rgba(0, 95, 115, 0.92) 0%, rgba(15, 118, 110, 0.94) 100%);
  border: 1px solid rgba(0, 95, 115, 0.4);
  color: #ffffff;
}

.campaign-card--guarantee .campaign-card-title,
.campaign-card--guarantee .campaign-card-subtitle {
  color: #ffffff;
}

.campaign-guarantee-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.92);
}

.campaign-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}

.campaign-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}

.campaign-card-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--panel-title);
}

.campaign-card-subtitle {
  font-size: 12px;
  color: var(--panel-subtitle);
}

.campaign-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.campaign-pill {
  background: rgba(241, 245, 249, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 600;
  color: #0f172a;
}

.campaign-pill.accent {
  background: linear-gradient(135deg, rgba(0, 95, 115, 0.2), rgba(14, 165, 233, 0.2));
  border-color: rgba(0, 95, 115, 0.35);
  color: #005f73;
}

.campaign-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.campaign-stat {
  display: flex;
  gap: 10px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(255, 255, 255, 0.78);
  align-items: flex-start;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.campaign-stat-icon {
  color: #0f766e;
  background: rgba(0, 95, 115, 0.12);
  border-radius: 10px;
  padding: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.campaign-stat-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.campaign-stat-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
  font-weight: 700;
}

.campaign-stat-value-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.campaign-stat-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--panel-title);
}

.campaign-stat-sub {
  font-size: 12px;
  color: #94a3b8;
}

.campaign-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.campaign-meta-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(255, 255, 255, 0.72);
}

.campaign-meta-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
  font-weight: 700;
}

.campaign-meta-value {
  font-size: 14px;
  font-weight: 600;
  color: var(--panel-title);
}

.campaign-creator-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 6px;
}

.campaign-creator-avatar {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  object-fit: cover;
  background: #ffffff;
}

.campaign-subtle {
  font-size: 12px;
  color: #64748b;
}

.campaign-tip {
  display: flex;
  align-items: center;
  padding: 12px 18px;
  border-radius: 14px;
  border: 1px solid rgba(14, 165, 233, 0.25);
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.12), rgba(16, 185, 129, 0.12));
  color: #0f172a;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
  margin-bottom: 18px;
}

/* Modern switch & slider */
.mantine-Switch-root {
  --switch-thumb-size: 18px;
  --switch-track-height: 24px;
  --switch-track-width: 44px;
}

.mantine-Switch-track {
  height: var(--switch-track-height);
  width: var(--switch-track-width);
  border-radius: 999px;
  background: #e2e8f0;
  border: 1px solid #cbd5e1;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08);
}

.mantine-Switch-track[data-checked] {
  background: linear-gradient(135deg, #005f73, #0f766e);
  border-color: rgba(0, 95, 115, 0.4);
  box-shadow: 0 6px 14px rgba(0, 95, 115, 0.18);
}

.mantine-Switch-thumb {
  width: var(--switch-thumb-size);
  height: var(--switch-thumb-size);
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(148, 163, 184, 0.6);
  box-shadow: 0 8px 16px rgba(15, 23, 42, 0.18);
}

.mantine-Switch-label {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}

.mantine-Slider-root {
  padding: 6px 0;
}

.mantine-Slider-track {
  height: 6px;
  background: #e2e8f0;
  border-radius: 999px;
}

.mantine-Slider-bar {
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(135deg, #005f73, #0f766e);
}

.mantine-Slider-thumb {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #ffffff;
  border: 2px solid rgba(0, 95, 115, 0.6);
  box-shadow: 0 10px 18px rgba(0, 95, 115, 0.2);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.mantine-Slider-thumb:hover,
.mantine-Slider-thumb:focus {
  transform: scale(1.06);
  box-shadow: 0 12px 24px rgba(0, 95, 115, 0.25);
}

.mantine-Slider-label {
  background: #0f172a;
  color: #ffffff;
  border-radius: 8px;
  font-size: 12px;
  padding: 4px 8px;
}

.booking-drawer-modal-inner {
  background: #ffffff;
  border-radius: 18px;
  padding: 24px 26px 28px;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12);
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-height: 80vh;
  overflow-y: auto;
}

.booking-drawer-modal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

@media (max-width: 980px) {
  .business-booking-view .booking-audience-grid {
    grid-template-columns: 1fr;
  }
}

.offer-flow-header {
  position: sticky;
  top: 0;
  z-index: 900;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(226, 232, 240, 0.8);
  border-radius: 18px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.offer-flow-header-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.offer-flow-header-title {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
  text-align: center;
}

.offer-flow-header-subtitle {
  font-size: 13px;
  color: #64748b;
  margin: 0;
  text-align: center;
}

.offer-flow-header-spacer {
  width: 42px;
  flex: 0 0 42px;
}

.favorite-btn {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.favorite-btn:hover {
  border-color: rgba(239, 71, 111, 0.4);
}

.favorite-btn:active {
  transform: scale(0.96);
}

.offer-hero {
  position: relative;
}

.offer-hero-actions {
  position: fixed;
  top: 16px;
  left: 0;
  right: 0;
  padding: 0 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 1100;
  pointer-events: none;
}

.offer-hero-actions .favorite-btn,
.offer-hero-actions .offer-hero-btn {
  pointer-events: auto;
}

.offer-hero-btn {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.offer-hero-btn:hover {
  border-color: rgba(2, 132, 199, 0.35);
}

/* Offer viewer redesign */
.offer-viewer-page {
  --offer-bg: #f3f5f7;
  --offer-card-bg: #ffffff;
  --offer-border: #dbe3eb;
  --offer-border-soft: #e8edf3;
  --offer-text: #0f172a;
  --offer-muted: #5b6678;
  --offer-subtle: #f7f9fb;
  --offer-accent: #005f73;
  background: var(--offer-bg);
  padding: 18px 22px 136px;
  gap: 16px;
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
}

.offer-viewer-page .influencer_title {
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--offer-text);
}

.offer-viewer-page .influencer_text {
  color: var(--offer-muted);
}

.offer-viewer-page .influencer_offer_box_style {
  background: var(--offer-card-bg) !important;
  border: 1px solid var(--offer-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.05), 0 10px 18px rgba(15, 23, 42, 0.05) !important;
  padding: 20px !important;
  margin-bottom: 0 !important;
  transition: none !important;
}

.offer-viewer-page .influencer_offer_box_style:hover {
  transform: none !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.05), 0 10px 18px rgba(15, 23, 42, 0.05) !important;
}

.offer-support-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 18px !important;
}

.offer-support-content {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  flex: 1;
}

.offer-support-button {
  width: auto;
  padding: 10px 16px !important;
  font-size: 13px;
  border-radius: 999px;
  gap: 8px;
  white-space: nowrap;
  border: 1px solid rgba(14, 116, 110, 0.35) !important;
  background: #ffffff !important;
  color: #0f766e !important;
  box-shadow: 0 8px 18px rgba(14, 116, 110, 0.12) !important;
  font-weight: 700;
}

.offer-support-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.offer-support-button-secondary {
  border-color: rgba(0, 95, 115, 0.35) !important;
  background: #ffffff !important;
}

@media (max-width: 720px) {
  .offer-support-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .offer-support-actions,
  .offer-support-button {
    width: 100%;
  }

  .offer-support-button {
    justify-content: center;
  }
}

.booking-info-modal .booking-modal-btn {
  border-radius: 999px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid transparent;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.booking-info-modal .booking-modal-btn-secondary {
  background: #f1f5f9;
  color: #0f172a;
  border-color: #e2e8f0;
}

.booking-info-modal .booking-modal-btn-primary {
  background: #005f73;
  color: #ffffff;
  box-shadow: none;
}

.booking-info-modal .booking-modal-btn:hover {
}

.offer-viewer-page .offer-hero {
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
  margin-bottom: 0;
  border: none;
  background: transparent;
  padding: 0;
}

.offer-viewer-page .offer-hero .influencer_carousel_image {
  border-radius: 0;
}

.offer-viewer-page .offer-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: transparent;
  pointer-events: none;
}

.offer-viewer-page .favorite-btn,
.offer-viewer-page .offer-hero-btn {
  border-radius: 999px;
  border: 1px solid rgba(219, 227, 235, 0.95);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.1);
  backdrop-filter: none;
}

.offer-view-hero-shell {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.offer-view-media-shell {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.offer-viewer-page .offer-view-desktop-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 0;
  width: 100%;
  height: clamp(300px, 34vw, 420px);
  border-radius: 18px;
  overflow: hidden;
  background: #edf1f5;
}

.offer-viewer-page .offer-view-desktop-tile {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #edf1f5;
}

.offer-viewer-page .offer-view-desktop-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 0;
  border: none;
  background: #edf1f5;
  display: block;
}

.offer-viewer-page .offer-view-desktop-image:first-child {
  grid-row: auto;
}

.offer-view-mobile-carousel-wrap {
  display: none;
}

.offer-view-mobile-carousel,
.offer-view-mobile-carousel .carousel-item,
.offer-view-mobile-carousel .carousel-item img {
  height: 270px;
}

.offer-view-mobile-carousel .carousel-item img {
  object-fit: cover;
  border-radius: 16px;
}

.offer-view-brand-strip {
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid var(--offer-border);
  border-radius: 16px;
  padding: 12px 14px;
  background: #ffffff;
}

.offer-view-brand-avatar {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  object-fit: cover;
  border: 1px solid var(--offer-border);
}

.offer-view-brand-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.offer-view-brand-handle {
  font-size: 14px;
  font-weight: 700;
  color: var(--offer-text);
}

.offer-view-brand-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.offer-view-brand-tags span {
  background: #f3f6f9 !important;
  color: #334155 !important;
  border: 1px solid #e3e8ef !important;
  border-radius: 999px !important;
  padding: 4px 10px !important;
  margin: 0 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

.offer-view-brand-description {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--offer-muted);
}

.offer-primary-info-card {
  gap: 14px;
}

.offer-primary-head h2 {
  margin: 0;
  font-size: clamp(24px, 2.8vw, 32px);
}

.offer-primary-head p {
  margin: 4px 0 0;
  font-size: 14px;
  color: var(--offer-muted);
}

.offer-primary-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.offer-primary-info-tile {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--offer-border-soft);
  border-radius: 14px;
  padding: 11px 12px;
  background: var(--offer-subtle);
}

.offer-primary-info-icon {
  color: var(--offer-accent);
  margin-top: 2px;
}

.offer-primary-info-text {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.offer-primary-info-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}

.offer-primary-info-value {
  font-size: 13px;
  font-weight: 700;
  color: var(--offer-text);
  line-height: 1.35;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}

.offer-view-panels {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 18px;
  align-items: start;
}

.offer-view-main-column,
.offer-view-side-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.offer-detail-card {
  border-radius: 18px !important;
  padding: 16px !important;
}

.offer-detail-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--offer-border-soft);
}

.offer-detail-icon {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #334155;
  background: var(--offer-subtle);
  border: 1px solid var(--offer-border-soft);
}

.offer-detail-title {
  margin: 0;
  font-size: 17px;
}

.offer-detail-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.offer-detail-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
  border: 1px solid var(--offer-border-soft);
  border-radius: 12px;
  background: var(--offer-subtle);
  padding: 10px 12px;
}

.offer-detail-row-important {
  border-color: rgba(245, 158, 11, 0.45);
  background: #fff8e6;
}

.offer-detail-row-important .offer-detail-label {
  color: #92400e;
}

.offer-detail-row-rules {
  background: #f8fafc;
}

.offer-detail-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #64748b;
}

.offer-detail-value {
  min-width: 0;
}

.offer-detail-value .influencer_text,
.offer-detail-value-text {
  margin: 0;
  color: #1f2937;
  line-height: 1.5;
}

.offer-detail-value-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.offer-detail-value-line {
  margin: 0;
}

.offer-detail-value ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.offer-detail-value ul li {
  margin: 0;
}

.offer-detail-value a {
  color: var(--offer-accent);
  text-decoration: none;
}

.offer-detail-value a:hover {
  text-decoration: underline;
}

.offer-detail-value pre {
  background: #ffffff;
  border: 1px solid var(--offer-border-soft);
  border-radius: 10px;
  padding: 8px 10px;
  overflow-x: auto;
}

.offer-bullet-list {
  margin: 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.offer-bullet-list li {
  color: #1f2937;
  line-height: 1.55;
}

.offer-fit-wrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.offer-fit-tag {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  border: 1px solid transparent;
}

.offer-fit-tag-good {
  background: #ecfdf3;
  color: #166534;
  border-color: rgba(22, 163, 74, 0.35);
}

.offer-fit-tag-medium,
.offer-fit-tag-neutral {
  background: #fff7ed;
  color: #9a3412;
  border-color: rgba(217, 119, 6, 0.35);
}

.offer-fit-tag-low {
  background: #fef2f2;
  color: #991b1b;
  border-color: rgba(220, 38, 38, 0.35);
}

.offer-fit-meta {
  font-size: 12px;
  color: #475569;
}

.offer-read-button-shell {
  position: relative;
  width: min(100%, 360px);
  margin: 0 auto;
}

.offer-read-lock-overlay {
  position: absolute;
  inset: 0;
  border: none;
  background: transparent;
  cursor: not-allowed;
  z-index: 3;
}

.offer-read-inline-hint {
  margin-top: 8px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: #92400e;
}

.offer-waiting-card {
  position: relative;
  width: 100%;
  border-radius: 16px;
  border: 1px solid #dbe3ea;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
  padding: 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: hidden;
}

.offer-waiting-card::before {
  content: none;
}

.offer-waiting-head {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.offer-waiting-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #0f172a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.offer-waiting-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-top: 1px;
}

.offer-waiting-title {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #0f172a;
  line-height: 1.15;
}

.offer-waiting-subtitle {
  font-size: 12px;
  color: #475569;
  line-height: 1.35;
}

.offer-waiting-payout {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 10px;
  border-radius: 10px;
  border: 1px solid #b6e4cf;
  background: #f0fdf4;
  color: #14532d;
}

.offer-waiting-payout-text {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
}

.offer-waiting-cancel-btn {
  position: relative;
  width: 100%;
  border-radius: 12px;
  padding: 10px 12px;
  font-weight: 800;
  font-size: 13px;
  border: 1px solid #fecaca;
  background: #ffffff;
  color: #b91c1c;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.offer-waiting-cancel-btn:hover,
.offer-waiting-cancel-btn:focus-visible {
  background: rgba(239, 68, 68, 0.08);
  border-color: rgba(239, 68, 68, 0.38);
  outline: none;
}

.offer-waiting-cancel-btn:active {
  transform: translateY(1px);
}

.offer-time-card {
  position: relative;
  overflow: hidden;
  background: #ffffff !important;
  border: 1px solid rgba(148, 163, 184, 0.32) !important;
}

.offer-time-card .offer-detail-head.offer-time-head {
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.offer-time-head-left {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.offer-time-card .offer-detail-icon {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(14, 116, 144, 0.10);
  border: 1px solid rgba(14, 116, 144, 0.25);
  color: #0e7490;
}

.offer-time-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  border: 1px solid transparent;
  white-space: nowrap;
}

.offer-time-badge-open {
  background: #ecfeff;
  color: #0e7490;
  border-color: #a5f3fc;
}

.offer-time-badge-pending {
  background: #fffbeb;
  color: #b45309;
  border-color: #fed7aa;
}

.offer-time-badge-closed {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.offer-time-value-shell {
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: relative;
  z-index: 1;
}

.offer-time-value {
  display: inline-flex;
  align-self: flex-start;
  padding: 7px 12px;
  border-radius: 12px;
  font-size: clamp(20px, 3vw, 27px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: #0f172a;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  box-shadow: none;
}

.offer-time-caption {
  font-size: 11px;
  color: #64748b;
  font-weight: 500;
  line-height: 1.3;
}

.offer-time-card-pending .offer-time-value {
  color: #0e7490;
  border-color: rgba(14, 116, 144, 0.28);
  background: #f0fdfa;
}

.offer-time-card-closed .offer-time-value {
  color: #b91c1c;
  border-color: rgba(185, 28, 28, 0.24);
  background: #fef2f2;
}

.offer-description-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.offer-description-body .influencer_text {
  margin: 0;
  line-height: 1.6;
  color: #334155;
}

.offer-map-shell {
  position: relative;
}

.offer-map-expand-button {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--offer-border);
  background: rgba(255, 255, 255, 0.96);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.1);
}

.offer-map-container {
  margin-bottom: 0 !important;
}

.offer-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.offer-stat-item {
  border: 1px solid var(--offer-border-soft);
  border-radius: 12px;
  padding: 10px 11px;
  background: var(--offer-subtle);
  display: flex;
  gap: 10px;
  align-items: center;
}

.offer-stat-icon {
  color: #334155;
}

.offer-stat-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.offer-stat-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748b;
  font-weight: 700;
}

.offer-stat-value {
  font-size: 14px;
  font-weight: 700;
  color: var(--offer-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 1080px) {
  .offer-view-panels {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .offer-view-main-column,
  .offer-view-side-column {
    gap: 10px;
  }
}

@media (max-width: 990px) {
  .offer-viewer-page .offer-view-desktop-gallery {
    display: none;
  }

  .offer-view-mobile-carousel-wrap {
    display: block;
  }

  .offer-detail-row {
    padding: 9px 10px;
  }

  .offer-primary-info-grid {
    grid-template-columns: 1fr;
  }

  .offer-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .offer-viewer-page {
    padding: 22px 28px 140px;
  }
}

@media (max-width: 640px) {
  .offer-viewer-page {
    padding: 10px 12px 122px;
    gap: 12px;
  }

  .offer-viewer-page .offer-detail-card {
    border-radius: 16px !important;
    padding: 12px 12px !important;
  }

  .offer-detail-title {
    font-size: 16px;
  }

  .offer-view-brand-strip {
    align-items: flex-start;
    padding: 10px 12px;
    border-radius: 14px;
  }

  .offer-view-brand-avatar {
    width: 50px;
    height: 50px;
    border-radius: 12px;
  }

  .offer-stats-grid {
    grid-template-columns: 1fr;
  }
}

/* Offer viewer support chat */
.support-chat-window {
  position: fixed;
  right: 22px;
  bottom: 22px;
  width: 340px;
  max-width: calc(100vw - 32px);
  background: #ffffff;
  border: 1px solid rgba(226, 232, 240, 0.85);
  border-radius: 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  z-index: 1400;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif;
}

.offer-ai-chat-window {
  width: 360px;
  max-width: calc(100vw - 28px);
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 16px;
  padding: 12px;
  gap: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.booking-chat-window {
  width: 360px;
  border-radius: 20px;
}

.support-chat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.7);
}

.support-chat-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  color: #0f172a;
  flex: 1;
  min-width: 0;
}

.support-chat-avatar {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(14, 116, 110, 0.12);
  color: #005f73;
}

.booking-chat-logo {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.support-chat-title-stack {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.support-chat-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex-wrap: wrap;
}

.support-chat-title-text {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
}

.support-chat-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.support-chat-human-btn {
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #334155;
  border-radius: 8px;
  padding: 5px 8px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

.support-chat-status {
  font-size: 11px;
  font-weight: 600;
  color: #005f73;
}

.support-chat-close {
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  padding: 5px 8px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
}

.support-chat-close:hover {
}

.support-chat-messages {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 240px;
  overflow-y: auto;
  padding-right: 2px;
}

.offer-ai-chat-window .support-chat-messages {
  max-height: 240px;
}

.support-chat-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}

.support-chat-item-user {
  align-items: flex-end;
}

.support-chat-bubble {
  background: #f8fafc;
  color: #0f172a;
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.4;
  max-width: min(90%, 320px);
  white-space: pre-line;
  word-break: break-word;
  border: 1px solid #e2e8f0;
}

.support-chat-bubble-typing {
  /* Keeps the bubble stable while words are revealed. */
}

.support-chat-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(2px);
  filter: blur(0.35px);
  will-change: opacity, transform, filter;
  animation-name: supportChatWordIn;
  animation-duration: 0.22s;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
}

@keyframes supportChatWordIn {
  from {
    opacity: 0;
    transform: translateY(2px);
    filter: blur(0.35px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .support-chat-word {
    animation: none;
    opacity: 1;
    transform: none;
    filter: none;
  }
}

.support-chat-bubble-user {
  background: #eef6f9;
  border-color: #d7e7ef;
}

.support-chat-bubble-ai {
  background: #f8fafc;
  border-color: #e2e8f0;
}

.support-chat-bubble-human {
  background: #f8fafc;
  border-color: #e2e8f0;
}

.support-chat-bubble-system {
  background: #ffffff;
  border-color: #e2e8f0;
  color: #475569;
}

.support-chat-system-note {
  display: none;
}

.support-chat-empty {
  font-size: 13px;
  color: #94a3b8;
  text-align: center;
}

/* Booking dashboard */
.booking-dashboard {
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  min-height: 100vh;
}

.booking-hero-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.booking-summary-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.booking-summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
}

.booking-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.booking-filter-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

.booking-filter-group--slider {
  position: relative;
  overflow: hidden;
  padding: 2px;
}

.booking-filter-group--slider .booking-filter-indicator {
  position: absolute;
  top: 2px;
  bottom: 2px;
  left: 2px;
  width: calc((100% - (var(--tabs-count) - 1) * var(--tab-gap) - 4px) / var(--tabs-count));
  border-radius: 999px;
  background: #005f73;
  transform: translateX(calc(var(--active-index) * (100% + var(--tab-gap))));
  transition: transform 0.28s ease;
  z-index: 0;
  box-shadow: 0 8px 16px rgba(0, 95, 115, 0.18);
}

.booking-filter-group--slider .booking-filter-btn,
.booking-filter-group--slider .booking-view-btn {
  position: relative;
  z-index: 1;
  flex: 1 1 0;
  min-width: 0;
  justify-content: center;
  padding: 7px 14px;
  white-space: nowrap;
  text-align: center;
}

.booking-filter-group--slider .booking-filter-btn.is-active,
.booking-filter-group--slider .booking-view-btn.is-active {
  background: transparent;
  color: #ffffff;
}

.booking-filter-btn,
.booking-view-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: none;
  background: transparent;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 14px;
  border-radius: 999px;
  cursor: pointer;
}

.booking-filter-btn.is-active,
.booking-view-btn.is-active {
  background: #005f73;
  color: #ffffff;
}

.booking-sections-stack {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 0 16px;
}

.booking-section {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  padding: 16px;
  box-shadow: none;
}

.booking-section.booking-drawer-hero-section {
  padding: 0;
  overflow: hidden;
}

.booking-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.booking-section-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 1;
  min-width: 0;
  gap: 10px;
  flex-wrap: wrap;
}

.booking-section-head-actions .booking-next-event {
  flex: 1 1 320px;
  min-width: 260px;
  max-width: 560px;
}

.booking-calendar-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(0, 95, 115, 0.28);
  background: #ffffff;
  color: #0f172a;
  border-radius: 12px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.booking-calendar-toggle:hover {
  background: #f0f9fb;
  border-color: rgba(14, 116, 144, 0.46);
}

.booking-calendar-toggle:focus-visible {
  outline: 2px solid rgba(14, 116, 144, 0.36);
  outline-offset: 2px;
}

.booking-section-title.main {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 12px;
}

.booking-section-head .booking-section-title.main {
  margin-bottom: 0;
}

.booking-table {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.booking-table-waiting {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
}

.booking-table-header {
  display: grid;
  grid-template-columns: 140px 2fr 1.6fr 120px;
  gap: 12px;
  padding: 6px 8px;
  border-bottom: 1px solid #e2e8f0;
}

.booking-table-waiting .booking-table-header,
.booking-table-waiting .booking-row {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
}

.booking-table-header-waiting {
  align-items: center;
}

.booking-table-header-waiting .booking-col-header {
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.booking-table-waiting .booking-cell-remuneration {
  align-items: flex-end;
  text-align: right;
}

.booking-col-header {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #94a3b8;
  font-weight: 700;
}

.booking-table-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.booking-row {
  display: grid;
  grid-template-columns: 140px 2fr 1.6fr 120px;
  gap: 12px;
  padding: 10px 8px;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.booking-row:hover {
  background: #f8fafc;
  border-color: rgba(0, 95, 115, 0.25);
}

.booking-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  justify-content: center;
}

.booking-cell-mobile-label {
  display: none;
}

.booking-remuneration-value {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.booking-detail-message {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.booking-date {
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.booking-date-btn {
  text-align: left;
  justify-content: flex-start;
  display: inline-flex;
  padding-left: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.booking-status {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #005f73;
}

.booking-status.active {
  color: #0f766e;
}

.booking-status.waiting {
  color: #ca6702;
}

.booking-status.finished {
  color: #64748b;
}

.booking-title {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.booking-subtitle {
  font-size: 12px;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.booking-offer {
  display: flex;
  align-items: center;
  gap: 10px;
}

.booking-offer-image {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  object-fit: cover;
  background: #e2e8f0;
}

.booking-offer-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.booking-offer-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.booking-offer-title-row .booking-title {
  flex: 1 1 auto;
  min-width: 0;
}

.booking-offer-open-btn {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: #ffffff;
  color: #0f172a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
}

.booking-offer-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  flex: 0 0 auto;
  min-width: max-content;
  pointer-events: auto;
  position: relative;
  z-index: 2;
}

.booking-offer-open-anchor {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
  flex: 0 0 auto;
}

.booking-offer-open-anchor .booking-offer-open-btn {
  margin-left: 0 !important;
}

.booking-title-remuneration {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(248, 250, 252, 0.96);
  color: #0f172a;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.booking-offer-finish-btn {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  border: 1px solid rgba(22, 163, 74, 0.3);
  background: #ffffff;
  color: #16a34a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 2;
}

.booking-offer-finish-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.booking-content-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.booking-content-row > :first-child {
  flex: 0 0 auto;
  min-width: 14px;
  min-height: 14px;
}

.booking-cell-remuneration {
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.booking-detail {
  font-size: 12px;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.booking-detail.muted {
  color: #94a3b8;
}

.booking-cell-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
  overflow-x: auto;
  padding-bottom: 2px;
}

.booking-cell.booking-cell-actions {
  flex-direction: row;
}

.booking-cell-actions-inline {
  margin-top: 6px;
  justify-content: flex-start;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 0;
  -webkit-overflow-scrolling: touch;
}

.booking-icon-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #0f172a;
  text-decoration: none;
  cursor: pointer;
  flex: 0 0 auto;
}

.booking-icon-btn.booking-icon-btn-important {
  background: #0a9396;
  border-color: #0a9396;
  color: #ffffff;
}

.booking-icon-btn.booking-icon-btn-important:hover {
  background: #087f83;
  border-color: #087f83;
}

.booking-icon-btn.booking-icon-btn-important:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.booking-text-action-btn {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: #ffffff;
  color: #0f172a;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  white-space: nowrap;
}

.booking-text-action-btn-danger {
  color: #b42318;
  border-color: rgba(180, 35, 24, 0.35);
  background: rgba(254, 242, 242, 0.95);
}

.booking-action-primary {
  background: #005f73;
  color: #ffffff;
  border-color: #005f73;
}

.booking-empty {
  padding: 16px;
  border-radius: 12px;
  background: #f8fafc;
  color: #94a3b8;
  font-size: 12px;
  text-align: center;
}

.waiting-table-card {
  background: #ffffff;
  border: 1px solid rgba(0, 95, 115, 0.15);
  border-radius: 18px;
  padding: 16px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.06);
  backdrop-filter: blur(8px);
}

.waiting-table-scroll {
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  overflow: hidden;
  background: #ffffff;
}

.waiting-booking-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif;
}

.waiting-booking-table th,
.waiting-booking-table td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.8);
  text-align: left;
  vertical-align: middle;
}

.waiting-booking-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: rgba(0, 95, 115, 0.06);
}

.waiting-table-head {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #64748b;
  font-weight: 700;
}

.waiting-booking-table tbody tr:hover {
  background: rgba(0, 95, 115, 0.05);
}

.waiting-booking-table .booking-table-header,
.waiting-booking-table .booking-row {
  grid-template-columns: 110px 2.2fr 1.6fr 160px;
  align-items: center;
}

.waiting-header-select {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.waiting-price-header {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.waiting-select-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 0;
  gap: 6px;
}

.booking-row.booking-row-waiting .booking-cell {
  overflow: hidden;
}

.booking-row.booking-row-waiting .booking-offer {
  gap: 8px;
}

.waiting-price-cell {
  align-items: center;
  justify-content: center;
}

.profile-description-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: stretch;
  margin-bottom: 20px;
}

.profile-description-grid > * {
  flex: 1 1 320px;
  min-width: 260px;
}


.profile-description-side {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

@media (max-width: 900px) {
  .profile-description-grid {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 1200px) {
  .profile-page.profile-page--business .profile-content {
    align-items: stretch;
    grid-auto-rows: minmax(220px, auto);
  }

  .profile-page.profile-page--business .profile-description-grid {
    grid-column: 1 / 2;
    grid-row: 2;
    align-self: stretch;
    margin-bottom: 0;
    display: block;
    height: 100%;
    min-height: 220px;
  }

  .profile-page.profile-page--business .profile-description-side {
    height: 100%;
    gap: 0;
  }

  .profile-page.profile-page--business .profile-payments-card {
    height: 100%;
    min-height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .profile-page.profile-page--business .profile-description-side > .profile-payments-card {
    height: 100%;
  }

  .profile-page.profile-page--business .profile-contact-card {
    grid-column: 2 / 3;
    grid-row: 2;
    align-self: stretch;
    min-height: 220px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }

  .profile-page.profile-page--business .profile-mail-preferences-card {
    grid-column: 1 / 2;
    grid-row: 3;
    align-self: stretch;
  }

  .profile-page.profile-page--business .profile-account-card {
    grid-column: 2 / 3;
    grid-row: 3;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
}

.waiting-creator-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 8px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid rgba(226, 232, 240, 0.7);
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.05);
}

.waiting-creator-avatar-wrap {
  position: relative;
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
}

.waiting-creator-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #ffffff;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.2);
}

.waiting-creator-fav {
  position: absolute;
  bottom: -4px;
  right: -4px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid rgba(239, 68, 68, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 12px rgba(239, 68, 68, 0.2);
}

.waiting-creator-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.waiting-creator-name {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  max-width: 160px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.waiting-creator-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(0, 95, 115, 0.08);
  border: 1px solid rgba(0, 95, 115, 0.18);
  color: #0f766e;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  width: fit-content;
}

.waiting-creator-open {
  margin-left: auto;
  border: none;
  background: rgba(0, 95, 115, 0.08);
  color: #005f73;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

.waiting-creator-open:hover {
  background: rgba(0, 95, 115, 0.16);
}

.waiting-message-cell {
  display: flex;
  align-items: center;
}

.waiting-message-pill {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 6px 12px;
  border-radius: 12px;
  background: rgba(0, 95, 115, 0.08);
  border: 1px solid rgba(0, 95, 115, 0.16);
  color: #0f172a;
  font-size: 12px;
  font-weight: 600;
}

.waiting-message-empty {
  color: #94a3b8;
  font-size: 12px;
  font-style: italic;
}

.waiting-metric-pill {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(14, 116, 144, 0.08);
  border: 1px solid rgba(14, 116, 144, 0.16);
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
}

.waiting-price-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(0, 95, 115, 0.12);
  border: 1px solid rgba(0, 95, 115, 0.2);
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
}

.waiting-summary-row td {
  background: rgba(14, 116, 144, 0.06);
  border-bottom: none;
}

.waiting-summary-row .waiting-summary-chip {
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: rgba(0, 95, 115, 0.08);
  color: #0f172a;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}

.booking-next-event {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(0, 95, 115, 0.16);
  background: #ffffff;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.05);
  color: #0f172a;
}

.booking-next-event.is-today {
  border-color: rgba(245, 158, 11, 0.55);
  background: rgba(251, 191, 36, 0.12);
}

.booking-next-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #0f766e;
}

.booking-next-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  gap: 2px;
  font-size: 12px;
  font-weight: 600;
}

.booking-next-date {
  color: #0f172a;
}

.booking-next-subtitle {
  font-size: 11px;
  font-weight: 600;
  color: #92400e;
}

.booking-next-sep {
  color: #94a3b8;
}

.booking-next-title {
  color: #475569;
}

.booking-next-open {
  width: 26px;
  height: 26px;
  border-radius: 10px;
  border: 1px solid rgba(0, 95, 115, 0.25);
  background: #ffffff;
  color: #0f172a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

@media (max-width: 990px) {
  .booking-section-head .booking-section-title.main {
    display: none !important;
  }

  .booking-section-head-actions {
    width: 100%;
    justify-content: space-between;
  }

  .booking-section-head-actions .booking-next-event {
    flex: 1 1 100%;
    min-width: 0;
    max-width: 100%;
  }

  .booking-calendar-toggle {
    margin-left: auto;
  }

  .booking-section.booking-section-waiting .booking-section-head {
    display: none;
  }

  .booking-section.booking-section-active .booking-section-title.main,
  .booking-section.booking-section-finished .booking-section-title.main {
    display: none;
  }

  .booking-section.booking-section-finished .booking-section-head {
    display: none;
  }

  .booking-table-header,
  .booking-row {
    grid-template-columns: 1fr;
  }

  .booking-table-header {
    display: none;
  }

  .booking-table {
    border: none;
    background: transparent;
    box-shadow: none;
    padding: 0;
  }

  .booking-table-rows {
    gap: 12px;
  }

  .booking-table,
  .booking-table-rows,
  .booking-table-rows > .booking-row {
    width: 100%;
  }

  .booking-cell-actions {
    justify-content: flex-start;
  }

  .booking-toolbar {
    flex-direction: column;
    align-items: stretch;
    margin-bottom: 10px;
  }

  .booking-filter-group--slider {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(var(--tabs-count, 3), minmax(0, 1fr));
  }

  .booking-filter-group--slider .booking-filter-btn,
  .booking-filter-group--slider .booking-view-btn {
    padding: 8px 6px;
    font-size: 11px;
    text-align: center;
    justify-content: center;
  }

  .booking-sections-stack {
    padding: 0;
  }

  .booking-section {
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: none;
    box-shadow: none;
  }

  .booking-row {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid rgba(148, 163, 184, 0.25);
    background: #ffffff;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
  }

  .booking-cell {
    gap: 4px;
    padding: 0;
    border: none;
    background: transparent;
  }

  .booking-cell-info {
    order: 1;
  }

  .booking-cell-date {
    order: 2;
  }

  .booking-cell-request {
    order: 3;
  }

  .booking-cell-remuneration {
    order: 4;
  }

  .booking-cell-actions-wrap {
    order: 5;
  }

  .booking-cell-mobile-label {
    display: block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
    line-height: 1.2;
  }

  .booking-date,
  .booking-detail,
  .booking-subtitle {
    white-space: normal;
    overflow: visible;
    text-overflow: initial;
  }

  .booking-offer {
    align-items: flex-start;
    gap: 12px;
  }

  .booking-row .booking-offer,
  .booking-row .booking-offer-text {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .booking-row .booking-offer-title-row {
    min-width: 0 !important;
    overflow: visible !important;
  }

  .booking-row .booking-offer {
    width: 100% !important;
  }

  .booking-row .booking-offer-text {
    width: 100% !important;
  }

  .booking-row .booking-offer-title-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 8px !important;
    width: 100% !important;
  }

  .booking-row .booking-offer-actions {
    justify-self: end !important;
    margin-left: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: max-content !important;
  }

  .booking-row .booking-offer-open-btn {
    margin-left: auto !important;
  }

  .booking-row .booking-title,
  .booking-row .booking-subtitle {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .booking-row .booking-offer-title-row .booking-title {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  .booking-offer-image {
    width: 54px;
    height: 54px;
    border-radius: 12px;
  }

  .booking-cell-actions,
  .booking-cell-actions-inline {
    flex-wrap: nowrap;
    overflow-x: visible;
    padding-bottom: 0;
  }

  .booking-cell-actions-wrap .booking-cell-actions {
    margin-top: 4px;
  }

  .booking-row.booking-row-active-influencer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "info info"
      "content remun"
      "date actions"
      "muted muted";
    align-items: center;
    gap: 8px 10px;
    padding: 11px;
    border-radius: 14px;
    border-color: rgba(14, 116, 110, 0.22);
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
    width: 100%;
    box-sizing: border-box;
    align-self: stretch;
  }

  .booking-row.booking-row-active-influencer .booking-cell-mobile-label {
    display: none;
  }

  .booking-row.booking-row-active-influencer .booking-cell-info {
    grid-area: info !important;
    grid-column: auto !important;
    position: relative;
    padding-right: 0 !important;
    order: 0;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-active-influencer .booking-offer {
    gap: 10px;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-active-influencer .booking-offer-image {
    width: 44px;
    height: 44px;
    border-radius: 10px;
  }

  .booking-row.booking-row-active-influencer .booking-title {
    font-size: 13px;
    line-height: 1.2;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-active-influencer .booking-subtitle {
    font-size: 12px;
    line-height: 1.3;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-active-influencer .booking-offer-text {
    min-width: 0;
    flex: 1 1 auto;
  }

  .booking-row.booking-row-active-influencer .booking-offer-title-row {
    display: block !important;
    position: static !important;
    padding-right: 0 !important;
    min-width: 0;
    width: 100%;
  }

  .booking-row.booking-row-active-influencer .booking-offer-actions {
    position: static !important;
    top: auto !important;
    right: auto !important;
    margin-left: auto !important;
    width: max-content !important;
    flex: 0 0 auto;
    z-index: 3;
  }

  .booking-row.booking-row-active-influencer .booking-cell-date,
  .booking-row.booking-row-active-influencer .booking-cell-remuneration {
    order: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.95);
  }

  .booking-row.booking-row-active-influencer .booking-cell-date {
    grid-area: date !important;
    grid-row: auto !important;
    grid-column: auto !important;
    justify-self: start !important;
    min-width: 0;
  }

  .booking-row.booking-row-active-influencer .booking-status {
    display: none;
  }

  .booking-row.booking-row-active-influencer .booking-cell-remuneration {
    grid-area: remun !important;
    grid-row: auto !important;
    grid-column: auto !important;
    justify-self: end !important;
    align-self: center !important;
    margin-left: auto !important;
    width: max-content !important;
    min-width: 0;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request {
    display: contents;
    padding: 0;
    border: none;
    background: transparent;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-content-row {
    grid-area: content !important;
    grid-row: auto !important;
    grid-column: auto !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.95);
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-cell-actions-inline {
    grid-area: actions !important;
    grid-row: 3 !important;
    grid-column: auto !important;
    justify-self: end !important;
    align-self: center !important;
    margin-top: 0;
    margin-left: auto !important;
    flex-wrap: nowrap;
    overflow: visible;
    justify-content: flex-end !important;
    padding-bottom: 0;
    padding-right: 0 !important;
    width: max-content !important;
    gap: 6px;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-detail.muted {
    grid-area: muted !important;
    grid-row: auto !important;
    grid-column: auto !important;
    min-width: 0;
    padding: 0 2px;
  }

  .booking-row.booking-row-active-influencer .booking-date,
  .booking-row.booking-row-active-influencer .booking-status,
  .booking-row.booking-row-active-influencer .booking-detail,
  .booking-row.booking-row-active-influencer .booking-remuneration-value {
    font-size: 12px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-active-business {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "info info"
      "content content"
      "date actions"
      "muted muted";
    align-items: center;
    gap: 8px 10px;
    padding: 11px;
    border-radius: 14px;
    border-color: rgba(14, 116, 110, 0.22);
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
    width: 100%;
    box-sizing: border-box;
    align-self: stretch;
  }

  .booking-row.booking-row-active-business .booking-cell-mobile-label {
    display: none;
  }

  .booking-row.booking-row-active-business .booking-cell-info {
    grid-area: info !important;
    grid-column: auto !important;
    position: relative;
    padding-right: 0 !important;
    order: 0;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-active-business .booking-offer {
    gap: 10px;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-active-business .booking-offer-image {
    width: 44px;
    height: 44px;
    border-radius: 10px;
  }

  .booking-row.booking-row-active-business .booking-title {
    font-size: 13px;
    line-height: 1.2;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-active-business .booking-subtitle {
    font-size: 12px;
    line-height: 1.3;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-active-business .booking-offer-text {
    min-width: 0;
    flex: 1 1 auto;
  }

  .booking-row.booking-row-active-business .booking-offer-title-row {
    display: block !important;
    position: static !important;
    padding-right: 0 !important;
    min-width: 0;
    width: 100%;
  }

  .booking-row.booking-row-active-business .booking-offer-actions {
    position: static !important;
    top: auto !important;
    right: auto !important;
    margin-left: auto !important;
    width: max-content !important;
    flex: 0 0 auto;
    z-index: 3;
  }

  .booking-row.booking-row-active-business .booking-cell-date {
    order: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.95);
    grid-area: date !important;
    grid-row: auto !important;
    grid-column: auto !important;
    justify-self: start !important;
    min-width: 0;
  }

  .booking-row.booking-row-active-business .booking-status {
    display: none;
  }

  .booking-row.booking-row-active-business .booking-cell-request {
    display: contents;
    padding: 0;
    border: none;
    background: transparent;
  }

  .booking-row.booking-row-active-business .booking-cell-request .booking-content-row {
    grid-area: content !important;
    grid-row: auto !important;
    grid-column: auto !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.95);
  }

  .booking-row.booking-row-active-business .booking-cell-request .booking-cell-actions-inline {
    grid-area: actions !important;
    grid-row: 3 !important;
    grid-column: auto !important;
    justify-self: end !important;
    align-self: center !important;
    margin-top: 0;
    margin-left: auto !important;
    flex-wrap: nowrap;
    overflow: visible;
    justify-content: flex-end !important;
    padding-bottom: 0;
    padding-right: 0 !important;
    width: max-content !important;
    gap: 6px;
  }

  .booking-row.booking-row-active-business .booking-cell-remuneration {
    display: none !important;
  }

  .booking-row.booking-row-active-business .booking-remuneration-value {
    display: none !important;
  }

  .booking-row.booking-row-active-business .booking-cell-request .booking-detail.muted {
    grid-area: muted !important;
    grid-row: auto !important;
    grid-column: auto !important;
    min-width: 0;
    padding: 0 2px;
  }

  .booking-row.booking-row-active-business .booking-date,
  .booking-row.booking-row-active-business .booking-status,
  .booking-row.booking-row-active-business .booking-detail {
    font-size: 12px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-waiting {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center;
    gap: 8px 10px;
    padding: 11px;
    border-radius: 14px;
    border-color: rgba(202, 103, 2, 0.22);
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
    width: 100%;
    box-sizing: border-box;
    align-self: stretch;
  }

  .booking-row.booking-row-waiting .booking-cell-mobile-label {
    display: none;
  }

  .booking-row.booking-row-waiting .booking-cell-info {
    grid-column: 1 / -1;
    order: 0;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-waiting .booking-offer {
    gap: 10px;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-waiting .booking-offer-image {
    width: 44px;
    height: 44px;
    border-radius: 10px;
  }

  .booking-row.booking-row-waiting .booking-title {
    font-size: 13px;
    line-height: 1.2;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-waiting .booking-subtitle {
    font-size: 12px;
    line-height: 1.3;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-waiting .booking-offer-text {
    min-width: 0;
    flex: 1 1 auto;
  }

  .booking-row.booking-row-waiting .booking-offer-title-row {
    min-width: 0;
    width: 100%;
  }

  .booking-row.booking-row-waiting .booking-cell-date,
  .booking-row.booking-row-waiting .booking-cell-request {
    order: 0;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.95);
  }

  .booking-row.booking-row-waiting .booking-cell-date {
    display: none;
  }

  .booking-row.booking-row-waiting .booking-cell-remuneration {
    display: none;
  }

  .booking-row.booking-row-waiting .booking-cell-request {
    grid-row: 2;
    grid-column: 1 !important;
    width: 100% !important;
    max-width: none;
    min-width: 0;
  }

  .booking-row.booking-row-waiting .booking-cell-request .booking-content-row {
    min-width: 0;
    width: 100%;
  }

  .booking-row.booking-row-waiting .booking-cell-request .booking-detail {
    flex: 1 1 auto;
    min-width: 0;
  }

  .booking-row.booking-row-waiting .booking-date,
  .booking-row.booking-row-waiting .booking-detail,
  .booking-row.booking-row-waiting .booking-remuneration-value {
    font-size: 12px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-waiting .booking-cell-actions-wrap {
    order: 0;
    grid-row: 2;
    grid-column: 2 !important;
    justify-self: end !important;
    align-self: center;
    width: max-content;
    margin-left: 0 !important;
  }

  .booking-row.booking-row-waiting .booking-cell-actions {
    margin-top: 0;
    gap: 0;
    overflow: visible;
    justify-content: flex-end;
  }

  .booking-row.booking-row-waiting .booking-text-action-btn {
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 12px;
  }

  .booking-row.booking-row-finished {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center;
    gap: 8px 10px;
    padding: 11px;
    border-radius: 14px;
    border-color: rgba(148, 163, 184, 0.32);
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
    width: 100%;
    box-sizing: border-box;
    align-self: stretch;
  }

  .booking-row.booking-row-finished .booking-cell-mobile-label {
    display: none;
  }

  .booking-row.booking-row-finished .booking-cell-info {
    grid-column: 1 / -1;
    order: 0;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-finished .booking-offer {
    gap: 10px;
    width: 100%;
    min-width: 0;
  }

  .booking-row.booking-row-finished .booking-offer-image {
    width: 44px;
    height: 44px;
    border-radius: 10px;
  }

  .booking-row.booking-row-finished .booking-title {
    font-size: 13px;
    line-height: 1.2;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-finished .booking-subtitle {
    font-size: 12px;
    line-height: 1.3;
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-finished .booking-offer-text {
    min-width: 0;
    flex: 1 1 auto;
  }

  .booking-row.booking-row-finished .booking-offer-title-row {
    min-width: 0;
    width: 100%;
  }

  .booking-row.booking-row-finished .booking-cell-date,
  .booking-row.booking-row-finished .booking-cell-request {
    order: 0;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.95);
  }

  .booking-row.booking-row-finished .booking-cell-date {
    display: none !important;
  }

  .booking-row.booking-row-finished .booking-cell-remuneration {
    display: none !important;
  }

  .booking-row.booking-row-finished .booking-cell-request {
    grid-row: 2;
    grid-column: 1 !important;
    width: 100% !important;
    max-width: none;
    min-width: 0;
  }

  .booking-row.booking-row-finished .booking-cell-request .booking-content-row {
    min-width: 0;
    width: 100%;
  }

  .booking-row.booking-row-finished .booking-cell-request .booking-detail {
    flex: 1 1 auto;
    min-width: 0;
  }

  .booking-row.booking-row-finished .booking-date,
  .booking-row.booking-row-finished .booking-detail,
  .booking-row.booking-row-finished .booking-remuneration-value {
    font-size: 12px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .booking-row.booking-row-finished .booking-cell-actions-wrap,
  .booking-row.booking-row-finished > .booking-cell-actions {
    order: 0;
    grid-row: 2;
    grid-column: 2 !important;
    justify-self: end !important;
    align-self: center;
    width: max-content;
    margin-left: 0 !important;
  }

  .booking-row.booking-row-finished > .booking-cell-actions {
    padding: 0;
    border: none;
    background: transparent;
    gap: 8px;
  }

  .booking-row.booking-row-finished .booking-cell-actions-wrap .booking-cell-actions {
    margin-top: 0;
    gap: 8px;
    overflow: visible;
    justify-content: flex-end;
  }
}

@media (max-width: 520px) {
  .booking-row {
    padding: 12px;
    gap: 10px;
  }

  .booking-cell {
    gap: 6px;
  }

  .booking-icon-btn {
    width: 30px;
    height: 30px;
    border-radius: 9px;
  }

  .booking-cell-actions {
    gap: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .booking-offer-image {
    width: 42px;
    height: 42px;
    border-radius: 10px;
  }

  .booking-offer-open-btn {
    width: 26px;
    height: 26px;
    border-radius: 9px;
  }

  .booking-row.booking-row-waiting .booking-cell-actions {
    overflow: visible;
    justify-content: flex-end;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-cell-actions-inline {
    grid-column: auto !important;
    justify-self: end !important;
    align-self: center !important;
    width: max-content !important;
    margin-left: auto !important;
    overflow: visible;
    justify-content: flex-end !important;
  }

  .booking-row.booking-row-active-business .booking-cell-request .booking-cell-actions-inline {
    grid-column: auto !important;
    justify-self: end !important;
    align-self: center !important;
    width: max-content !important;
    margin-left: auto !important;
    overflow: visible;
    justify-content: flex-end !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-remuneration {
    justify-self: end !important;
    align-self: center !important;
    margin-left: auto !important;
    width: max-content !important;
  }

  .booking-row.booking-row-finished .booking-cell-actions-wrap .booking-cell-actions,
  .booking-row.booking-row-finished > .booking-cell-actions {
    overflow: visible;
    justify-content: flex-end;
  }

}

.booking-agenda {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.booking-agenda-date {
  font-size: 13px;
  font-weight: 700;
  color: #005f73;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: rgba(0, 95, 115, 0.12);
  border: 1px solid rgba(0, 95, 115, 0.28);
  border-radius: 12px;
  padding: 8px 10px;
  text-align: center;
}

.booking-agenda-day-row {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 12px;
  align-items: start;
}

.booking-agenda-items {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.booking-agenda-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  min-width: 0;
  align-items: center;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.booking-agenda-card:hover {
  background: #f8fafc;
  border-color: rgba(0, 95, 115, 0.25);
}

.booking-month-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 18px;
  box-shadow: none;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.booking-month-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.booking-month-title {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.booking-month-btn {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.booking-month-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 6px;
  width: 100%;
  min-width: 0;
}

.booking-month-weekday {
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
}

.booking-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
  min-width: 0;
}

.booking-month-cell {
  min-height: 64px;
  border-radius: 14px;
  background: #f4fbfc;
  border: 1px solid rgba(148, 163, 184, 0.2);
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-align: left;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  appearance: none;
  cursor: pointer;
}

.booking-month-cell.has-event {
  background: rgba(0, 95, 115, 0.12);
  border-color: rgba(0, 95, 115, 0.45);
}

.booking-month-cell.is-selected {
  background: rgba(0, 95, 115, 0.16);
  border-color: rgba(0, 95, 115, 0.6);
}

.booking-month-cell.is-outside {
  opacity: 0.45;
}

.booking-month-cell:disabled {
  cursor: default;
}

.booking-month-day {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.booking-month-avatars {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

.booking-month-count {
  font-size: 11px;
  color: #0f172a;
  background: rgba(15, 118, 110, 0.12);
  border-radius: 999px;
  padding: 2px 8px;
  width: fit-content;
}

.booking-month-count.is-empty {
  display: none;
}

.booking-active-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  gap: 18px;
  align-items: start;
  transition: grid-template-columns 0.28s cubic-bezier(0.22, 1, 0.36, 1), gap 0.24s ease;
}

.booking-active-layout.booking-active-layout--table-only {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.booking-active-table-pane {
  min-width: 0;
  overflow-x: auto;
  transition: box-shadow 0.24s ease, border-color 0.24s ease, background-color 0.24s ease;
}

.booking-active-layout.booking-active-layout--table-only .booking-active-table-pane {
  border-radius: 14px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  background:
    radial-gradient(120% 160% at 0% 0%, rgba(15, 118, 110, 0.07) 0%, rgba(15, 118, 110, 0) 52%),
    #ffffff;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.07);
  animation: bookingTableExpandIn 0.26s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes bookingTableExpandIn {
  from {
    opacity: 0.78;
    transform: translateY(6px) scale(0.994);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.booking-active-calendar-panel {
  position: sticky;
  top: 88px;
  align-self: start;
}

.booking-agenda-layout {
  display: grid;
  grid-template-columns: minmax(360px, 480px) 1fr;
  gap: 18px;
  align-items: start;
}

@media (max-width: 900px) {
  .booking-active-layout {
    grid-template-columns: 1fr;
  }

  .booking-active-calendar-panel {
    display: none;
  }

  .booking-calendar-toggle {
    display: none !important;
  }

  .booking-agenda-layout {
    grid-template-columns: 1fr;
  }

  .booking-agenda-day-row {
    grid-template-columns: 1fr;
  }

  .booking-agenda-items {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .booking-active-layout,
  .booking-active-table-pane {
    transition: none !important;
    animation: none !important;
  }
}
.booking-tab-stack {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.booking-dashboard-section {
  padding: 0 16px;
  margin-bottom: 18px;
}

.booking-sections-stack {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 0 16px;
}

.booking-planning-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

.booking-panel {
  background: #ffffff;
  border: 1px solid rgba(0, 95, 115, 0.2);
  border-radius: 18px;
  padding: 16px;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.06);
}

.booking-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.booking-section-title {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
}

.booking-section-subtitle {
  font-size: 12px;
  color: #64748b;
}

@media (max-width: 900px) {
  .booking-dashboard-section {
    padding: 0;
  }

  .booking-sections-stack {
    padding: 0;
  }

  .booking-section {
    padding: 10px 8px;
  }
}

.booking-calendar-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.booking-calendar-day {
  min-width: 72px;
  border-radius: 14px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: #f4fbfc;
  padding: 10px 8px;
  text-align: center;
}

.booking-calendar-day.is-active {
  background: rgba(14, 116, 144, 0.12);
  border-color: rgba(14, 116, 144, 0.35);
}

.booking-calendar-day-label {
  font-size: 11px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.booking-calendar-day-number {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.booking-calendar-day-count {
  font-size: 11px;
  color: #0f172a;
  margin-top: 2px;
}

.booking-calendar-day-count.is-empty {
  color: #cbd5e1;
}

.booking-upcoming-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.booking-upcoming-item {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(248, 250, 252, 0.8);
}

.booking-upcoming-date {
  font-size: 12px;
  font-weight: 700;
  color: #0f172a;
}

.booking-upcoming-title {
  font-size: 12px;
  color: #64748b;
}

.booking-followup-wrap {
  margin-top: 14px;
}

.booking-waiting-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
  margin-bottom: 8px;
}

.booking-waiting-metric {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.18);
}

.booking-followup-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.booking-followup-item {
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px dashed rgba(148, 163, 184, 0.45);
  background: #ffffff;
}

.booking-followup-title {
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}

.booking-followup-subtitle {
  font-size: 12px;
  color: #64748b;
}

.booking-empty-note {
  font-size: 12px;
  color: #94a3b8;
}

.booking-dashboard .influencer_carousel_card_container_bookings {
  width: 100%;
  max-width: none;
  border-radius: 20px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: #ffffff;
}

.booking-dashboard .booking-card {
  border-bottom: 1px solid #f1f5f9;
}

@media (max-width: 720px) {
  .booking-dashboard-section {
    padding: 0;
  }

  .booking-sections-stack {
    padding: 0;
  }
}

.support-chat-input {
  display: flex;
  gap: 8px;
  align-items: flex-end;
}

.offer-ai-chat-window .support-chat-input {
  gap: 10px;
}

.support-chat-textarea {
  flex: 1;
  min-height: 58px;
  resize: none;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 10px;
  padding: 9px 12px;
  font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  color: #0f172a;
  background: #ffffff;
  box-shadow: none;
}

.offer-ai-chat-window .support-chat-textarea {
  min-height: 58px;
  border-radius: 10px;
}

.support-chat-textarea:focus {
  outline: none;
  border-color: rgba(14, 116, 110, 0.5);
  box-shadow: 0 0 0 3px rgba(14, 116, 110, 0.15);
}

.support-chat-send {
  border: 1px solid #005f73;
  background: #005f73;
  color: #ffffff;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  box-shadow: none;
  transition: none;
}

.support-chat-send:hover {
}

.support-chat-human-btn:hover {
}

@media (max-width: 720px) {
  .support-chat-window {
    right: 16px;
    left: 16px;
    width: auto;
  }

  .offer-ai-chat-window {
    bottom: 16px;
    padding: 12px;
    gap: 8px;
  }

  .offer-ai-chat-window .support-chat-header {
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .offer-ai-chat-window .support-chat-header-actions {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    margin-left: auto;
  }

  .offer-ai-chat-window .support-chat-human-btn {
    order: 1;
    font-size: 11px;
    padding: 5px 8px;
    background: #f59e0b;
    border-color: #f59e0b;
    color: #ffffff;
  }

  .offer-ai-chat-window .support-chat-close {
    order: 2;
  }

  .offer-ai-chat-window .support-chat-messages {
    max-height: 210px;
  }

  .booking-chat-window {
    bottom: var(--navbar-height, 64px);
  }

  .offer-view-desktop-gallery {
    display: none;
  }

  .offer-view-mobile-carousel-wrap {
    display: block;
  }

  .offer-view-brand-strip {
    border-radius: 14px;
    padding: 10px;
  }

  .offer-view-brand-avatar {
    width: 48px;
    height: 48px;
  }

  .offer-primary-info-grid {
    grid-template-columns: 1fr;
  }
}

/* Offer cards: no shadows */
.influencer_carousel_card_container,
.influencer_carousel_card_container_bookings {
  box-shadow: none !important;
}

.influencer_carousel_card_container:hover,
.influencer_carousel_card_container_bookings:hover {
}

/* Promoted offer card */
.promoted-card {
  border-radius: 22px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  overflow: hidden;
  background: #ffffff;
}

.promoted-card .influencer_carousel_image {
  border-radius: 0;
}

.promoted-card .promoted-image-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 70px;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0) 0%, rgba(15, 23, 42, 0.35) 100%);
  z-index: 2;
  pointer-events: none;
}

.promoted-card .promoted-type-pill {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.18);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.promoted-card .promoted-card-description {
  margin: 6px 0 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.influencer-home .influencer_location_input_input_wrapper {
  border-radius: 14px;
  border-color: #e2e8f0;
  background: #ffffff;
  padding: 12px 14px;
}

.influencer-home .influencer_location_input_suggestions {
  border: 1px solid #e5e7eb;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.influencer-home .fc-modal-content {
  border-radius: 16px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.16);
}

.influencer-home .influencer-modal .modal-body,
.influencer-modal-body {
  padding: 16px 18px 20px;
  background: #ffffff;
}

.influencer-modal-body .influencer_offer_box_style {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}

.influencer-modal-body .mantine-TextInput-root {
  width: 100%;
}

.influencer-modal-body .mantine-TextInput-input {
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 12px;
}

/* Keep the location modal input standalone (no white block around it). */
.location-modal .influencer-modal-body {
  padding: 0;
  background: transparent;
}

.location-modal .influencer-modal-body .location-modal-input,
.location-modal .influencer-modal-body .mantine-TextInput-root,
.location-modal .influencer-modal-body .mantine-Input-wrapper {
  background: transparent;
  border: none;
  box-shadow: none;
}

.location-modal .influencer-modal-body .location-modal-input .mantine-TextInput-input {
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  background: #ffffff;
}

/* --- Affiliation drawer redesign --- */
.affiliation-fab-btn {
  position: fixed;
  right: 16px;
  bottom: 42px;
  z-index: 1060;
  border: 1px solid rgba(0, 95, 115, 0.28);
  border-radius: 14px;
  padding: 10px 14px;
  background: linear-gradient(135deg, #005f73 0%, #0a9396 100%);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 14px 30px rgba(2, 62, 74, 0.28);
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.affiliation-fab-btn:hover {
  transform: translateY(-1px);
  filter: saturate(1.05);
  box-shadow: 0 18px 34px rgba(2, 62, 74, 0.34);
}

.affiliation-fab-btn:active {
  transform: translateY(0);
}

.affiliation-offcanvas-panel.offcanvas {
  width: min(560px, 95vw);
  border-left: 1px solid rgba(148, 163, 184, 0.28);
  box-shadow: -22px 0 46px rgba(15, 23, 42, 0.16);
}

.affiliation-offcanvas-panel .offcanvas-header {
  padding: 16px 18px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.95);
  background: linear-gradient(180deg, #f8fcfd 0%, #f1f7f8 100%);
}

.affiliation-offcanvas-panel .offcanvas-title {
  width: 100%;
}

.affiliation-offcanvas-panel .offcanvas-body {
  padding: 0;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

.affiliation-offcanvas-panel .btn-close {
  opacity: 0.55;
}

.affiliation-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #0b3e47;
}

.affiliation-title-copy {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.affiliation-title-row .influencer_title {
  margin: 0;
  font-size: 18px;
  color: #0b3e47;
  font-weight: 700;
}

.affiliation-title-sub {
  font-size: 12px;
  color: #64748b;
  font-weight: 500;
}

.affiliation-drawer-content {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.affiliation-hero-card {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid rgba(0, 95, 115, 0.2);
  background: linear-gradient(145deg, rgba(0, 95, 115, 0.96) 0%, rgba(10, 147, 150, 0.94) 100%);
  color: #ffffff;
  padding: 16px;
  box-shadow: 0 12px 28px rgba(2, 62, 74, 0.24);
}

.affiliation-hero-card::after {
  content: "";
  position: absolute;
  inset: -35% -55% auto auto;
  width: 240px;
  height: 240px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 70%);
  pointer-events: none;
}

.affiliation-hero-kicker {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.86;
  font-weight: 700;
}

.affiliation-hero-title {
  margin: 6px 0 2px;
  font-size: 19px;
  line-height: 1.28;
  font-weight: 700;
}

.affiliation-hero-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  opacity: 0.97;
}

.affiliation-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.affiliation-chip {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(255, 255, 255, 0.38);
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.affiliation-hero-list {
  margin: 12px 0 0;
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 12px;
  line-height: 1.5;
}

.affiliation-section-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
  margin-top: 2px;
}

.affiliation-benefit-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.affiliation-benefit-card {
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: #ffffff;
  padding: 12px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
}

.affiliation-benefit-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(14, 116, 144, 0.22);
  background: rgba(14, 116, 144, 0.08);
  color: #0e7490;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.affiliation-benefit-copy {
  min-width: 0;
}

.affiliation-benefit-title {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
}

.affiliation-benefit-text {
  margin: 3px 0 0;
  font-size: 12.5px;
  line-height: 1.52;
  color: #475569;
}

.affiliation-link-card {
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: #ffffff;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.affiliation-link-row {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #0e7490;
  min-width: 0;
}

.affiliation-link-url {
  color: #0f172a;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  word-break: break-all;
  min-width: 0;
}

.affiliation-link-url:hover {
  text-decoration: underline;
}

.affiliation-pitch-box {
  margin: 0;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: #ffffff;
  font-size: 13px;
  line-height: 1.58;
  color: #0f172a;
  white-space: pre-wrap;
  max-height: 220px;
  overflow: auto;
}

.affiliation-btn {
  border: 1px solid transparent;
  border-radius: 11px;
  min-height: 38px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  transition: transform 0.16s ease, filter 0.16s ease;
}

.affiliation-btn:hover {
  transform: translateY(-1px);
}

.affiliation-btn-secondary {
  border-color: rgba(14, 116, 144, 0.34);
  background: rgba(14, 116, 144, 0.08);
  color: #0b5261;
}

.affiliation-btn-primary {
  width: 100%;
  border-color: rgba(5, 150, 105, 0.25);
  background: linear-gradient(135deg, #059669 0%, #10b981 100%);
  color: #ffffff;
  box-shadow: 0 10px 18px rgba(5, 150, 105, 0.24);
}

.affiliation-footnote {
  font-size: 12px;
  color: #64748b;
  line-height: 1.45;
}

.affiliation-toast {
  position: fixed;
  right: 16px;
  bottom: 110px;
  z-index: 2000;
}

@media (max-width: 768px) {
  .affiliation-fab-btn {
    right: 12px;
    bottom: 32px;
    padding: 9px 12px;
  }

  .affiliation-drawer-content {
    padding: 14px 12px 16px;
  }

  .affiliation-hero-title {
    font-size: 17px;
  }

  .affiliation-benefit-card {
    padding: 11px;
  }

  .affiliation-link-card {
    padding: 11px;
  }
}

/* Create offer: keep both accompaniment options visible on small screens */
.creator-accompaniment-segmented .mantine-SegmentedControl-control {
  min-width: 0;
}

.creator-accompaniment-segmented .mantine-SegmentedControl-label {
  white-space: normal;
  text-align: center;
  line-height: 1.2;
}

@media (max-width: 767.98px) {
  .creator-accompaniment-segmented .mantine-SegmentedControl-label {
    font-size: 11px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
}

@media (max-width: 900px) {
  /* Business waiting cards: cleaner mobile look */
  .influencer_main_container.business-page .booking-section.booking-section-waiting {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
  }

  .influencer_main_container.business-page .booking-section.booking-section-waiting .booking-table-header {
    display: none;
  }

  .influencer_main_container.business-page .booking-section.booking-section-waiting .booking-table-rows {
    gap: 10px;
  }

  .influencer_main_container.business-page .booking-row.booking-row-waiting {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px 12px;
    padding: 12px;
    border-radius: 16px;
    border: 1px solid rgba(0, 95, 115, 0.14);
    background: linear-gradient(180deg, #ffffff 0%, #f5fbfc 100%);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
  }

  .influencer_main_container.business-page .booking-row.booking-row-waiting .booking-cell-info {
    grid-column: 1 / -1;
  }

  .influencer_main_container.business-page .booking-row.booking-row-waiting .booking-cell-date {
    display: inline-flex !important;
    grid-row: 2;
    grid-column: 1;
    width: max-content;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: rgba(248, 250, 252, 0.98);
  }

  .influencer_main_container.business-page .booking-row.booking-row-waiting > .booking-cell-actions {
    grid-row: 2;
    grid-column: 2 !important;
    justify-self: end;
    align-self: center;
    width: max-content;
    margin-left: 0 !important;
    padding: 0;
    gap: 6px;
    overflow: visible;
  }

  .influencer_main_container.business-page .booking-row.booking-row-waiting .booking-cell-request {
    grid-row: 3;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    padding: 0;
    border: none;
    background: transparent;
  }

  .influencer_main_container.business-page .booking-row.booking-row-waiting .booking-cell-request .booking-content-row {
    display: inline-flex;
    width: max-content;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0, 95, 115, 0.16);
    background: rgba(0, 95, 115, 0.06);
  }

  .influencer_main_container.business-page .booking-row.booking-row-waiting .booking-icon-btn {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  /* Keep space above the fixed mobile navbar on influencer and business pages */
  #page-content .influencer_main_container:not(.chat-page),
  #page-content .influencer_main_container.business-page:not(.chat-page) {
    padding-bottom: calc(var(--navbar-safe-offset, 92px) + 12px) !important;
  }

  #page-content .influencer_main_container.no-navbar-padding:not(.chat-page) {
    padding-bottom: calc(var(--navbar-safe-offset, 92px) + 12px) !important;
  }
}

/* Profile: force "Contenu sélectionné" header onto two lines on mobile */
.profile-page .selected-content-title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.profile-page .selected-content-title-info-wrap {
  display: inline-flex;
  align-items: center;
}

@media (max-width: 768px) {
  .profile-page .selected-content-title-text {
    display: block;
    flex-basis: 100%;
    line-height: 1.2;
    white-space: normal !important;
  }

  .profile-page .selected-content-title-info-wrap {
    flex-basis: 100%;
  }
}


/* ===== Legacy booking mobile fixes merged on 2026-02-09 (from z/zz/zzz files) ===== */
/* Source merged: assets/z_booking_mobile_fix.css (identical to assets/zz_booking_mobile_fix_v2.css) */
/* Mobile booking hard-fix: right-align actions and enforce ellipsis. */
@media (max-width: 990px) {
  .booking-section-head .booking-section-title.main {
    display: none !important;
  }

  .booking-row .booking-offer,
  .booking-row .booking-offer-text {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .booking-row .booking-offer-title-row {
    min-width: 0 !important;
    overflow: visible !important;
  }

  .booking-row .booking-offer {
    width: 100% !important;
  }

  .booking-row .booking-offer-text {
    width: 100% !important;
  }

  .booking-row .booking-offer-title-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 8px !important;
    width: 100% !important;
  }

  .booking-row .booking-offer-actions {
    justify-self: end !important;
    margin-left: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: max-content !important;
  }

  .booking-row .booking-offer-open-btn {
    margin-left: auto !important;
  }

  .booking-row .booking-offer-open-anchor {
    display: inline-flex !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    flex: 0 0 auto !important;
  }

  .booking-row .booking-title,
  .booking-row .booking-subtitle {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .booking-row .booking-offer-title-row .booking-title {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  .booking-row.booking-row-active-influencer {
    --booking-mobile-side-col-width: 104px;
    grid-template-areas:
      "info info"
      "content remun"
      "date actions"
      "muted muted" !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-remuneration {
    grid-area: remun !important;
    justify-self: end !important;
    align-self: center !important;
    margin-left: auto !important;
    width: max-content !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request {
    display: contents !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-info {
    position: relative !important;
    padding-right: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-title-row {
    display: block !important;
    position: static !important;
    padding-right: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-actions {
    position: static !important;
    top: auto !important;
    right: auto !important;
    margin-left: auto !important;
    width: max-content !important;
    z-index: 3 !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-content-row {
    grid-area: content !important;
    grid-column: auto !important;
    justify-self: start !important;
    align-self: center !important;
    margin-right: auto !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-date {
    grid-area: date !important;
    justify-self: end !important;
    align-self: center !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: var(--booking-mobile-side-col-width) !important;
    min-width: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-cell-actions-inline {
    grid-area: actions !important;
    grid-column: auto !important;
    justify-self: end !important;
    align-self: center !important;
    width: var(--booking-mobile-side-col-width) !important;
    max-width: var(--booking-mobile-side-col-width) !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .booking-row.booking-row-active-business {
    --booking-mobile-side-col-width: 104px;
    grid-template-areas:
      "info info"
      "content content"
      "date actions"
      "muted muted" !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  .booking-row.booking-row-active-business .booking-cell-date {
    grid-area: date !important;
    justify-self: end !important;
    align-self: center !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: var(--booking-mobile-side-col-width) !important;
    min-width: 0 !important;
  }

  .booking-row.booking-row-active-business .booking-cell-request {
    display: contents !important;
  }

  .booking-row.booking-row-active-business .booking-cell-info {
    position: relative !important;
    padding-right: 0 !important;
  }

  .booking-row.booking-row-active-business .booking-offer-title-row {
    display: block !important;
    position: static !important;
    padding-right: 0 !important;
  }

  .booking-row.booking-row-active-business .booking-offer-actions {
    position: static !important;
    top: auto !important;
    right: auto !important;
    margin-left: auto !important;
    width: max-content !important;
    z-index: 3 !important;
  }

  .booking-row.booking-row-active-business .booking-cell-request .booking-content-row {
    grid-area: content !important;
    grid-column: auto !important;
    justify-self: start !important;
    align-self: center !important;
    margin-right: auto !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .booking-row.booking-row-active-business .booking-cell-request .booking-cell-actions-inline {
    grid-area: actions !important;
    grid-column: auto !important;
    justify-self: end !important;
    align-self: center !important;
    width: var(--booking-mobile-side-col-width) !important;
    max-width: var(--booking-mobile-side-col-width) !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-date .booking-date,
  .booking-row.booking-row-active-business .booking-cell-date .booking-date,
  .booking-row.booking-row-active-influencer .booking-cell-date .booking-status,
  .booking-row.booking-row-active-business .booking-cell-date .booking-status {
    display: block !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-align: right !important;
  }

  .booking-row.booking-row-active-business .booking-cell-remuneration,
  .booking-row.booking-row-active-business .booking-remuneration-value {
    display: none !important;
  }
}

@media (max-width: 520px) {
  .booking-row.booking-row-active-influencer .booking-cell-request .booking-cell-actions-inline,
  .booking-row.booking-row-active-business .booking-cell-request .booking-cell-actions-inline {
    grid-column: auto !important;
    justify-self: end !important;
    width: var(--booking-mobile-side-col-width) !important;
    max-width: var(--booking-mobile-side-col-width) !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-remuneration {
    justify-self: end !important;
    margin-left: auto !important;
    width: max-content !important;
  }
}

/* Source merged: assets/zzz_booking_arrow_fix.css */
@media (max-width: 990px) {
  .booking-row.booking-row-active-business .booking-cell-info {
    position: relative !important;
    padding-right: 36px !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-info {
    position: relative !important;
    padding-right: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer,
  .booking-row.booking-row-active-business .booking-offer {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding-left: 54px !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-text,
  .booking-row.booking-row-active-business .booking-offer-text {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-image,
  .booking-row.booking-row-active-business .booking-offer-image {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 10px !important;
    margin: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-text {
    width: auto !important;
    flex: 1 1 auto !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-open-anchor,
  .booking-row.booking-row-active-business .booking-offer-open-anchor {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    z-index: 8 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-open-anchor .booking-offer-open-btn,
  .booking-row.booking-row-active-business .booking-offer-open-anchor .booking-offer-open-btn {
    margin-left: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-title,
  .booking-row.booking-row-active-influencer .booking-subtitle,
  .booking-row.booking-row-active-business .booking-title,
  .booking-row.booking-row-active-business .booking-subtitle {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

/* Active booking cards on mobile: single-column flow + deadline line centered */
@media (max-width: 990px) {
  .booking-row.booking-row-active-influencer,
  .booking-row.booking-row-active-business {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "info"
      "content"
      "actions"
      "date" !important;
    gap: 8px !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-info,
  .booking-row.booking-row-active-business .booking-cell-info {
    grid-area: info !important;
    width: 100% !important;
    min-width: 0 !important;
    padding-right: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer,
  .booking-row.booking-row-active-business .booking-offer {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding-left: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-image,
  .booking-row.booking-row-active-business .booking-offer-image {
    position: static !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-text,
  .booking-row.booking-row-active-business .booking-offer-text {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-title-row,
  .booking-row.booking-row-active-business .booking-offer-title-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    position: static !important;
    padding-right: 0 !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-actions,
  .booking-row.booking-row-active-business .booking-offer-actions {
    position: static !important;
    margin-left: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: max-content !important;
  }

  .booking-row.booking-row-active-influencer .booking-offer-open-anchor,
  .booking-row.booking-row-active-business .booking-offer-open-anchor {
    position: static !important;
    top: auto !important;
    right: auto !important;
    margin-left: 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    z-index: 1 !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-remuneration,
  .booking-row.booking-row-active-business .booking-cell-remuneration {
    display: none !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request,
  .booking-row.booking-row-active-business .booking-cell-request {
    display: contents !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-content-row,
  .booking-row.booking-row-active-business .booking-cell-request .booking-content-row {
    grid-area: content !important;
    justify-self: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 10px !important;
    border-radius: 10px !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    background: rgba(248, 250, 252, 0.95) !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-request .booking-cell-actions-inline,
  .booking-row.booking-row-active-business .booking-cell-request .booking-cell-actions-inline {
    grid-area: actions !important;
    justify-self: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    overflow: visible !important;
    flex-wrap: nowrap !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-date,
  .booking-row.booking-row-active-business .booking-cell-date {
    grid-area: date !important;
    justify-self: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-date .booking-date,
  .booking-row.booking-row-active-business .booking-cell-date .booking-date {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-weight: 700 !important;
  }

  .booking-row.booking-row-active-influencer .booking-cell-date .booking-status,
  .booking-row.booking-row-active-business .booking-cell-date .booking-status {
    display: none !important;
  }

  .booking-date-deadline-info {
    color: #0f766e;
  }

  .booking-date-deadline-warning {
    color: #b45309;
  }

  .booking-date-deadline-danger {
    color: #b91c1c;
  }
}

@media (min-width: 991px) {
  .booking-title-remuneration-active {
    display: none !important;
  }
}

/* Mobile polish: chat composer, create-offer layout, and single active offer card width */
@media (max-width: 1023px) {
  .chat-page #chat-container {
    position: relative;
  }

  .chat-page .chat-input-area-container {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: var(--navbar-height, 64px) !important;
    margin: 0 !important;
    padding: 8px 12px 0 !important;
    background: #ffffff !important;
    border-top: 1px solid rgba(226, 232, 240, 0.95) !important;
    z-index: 980 !important;
  }

  body.modal-open .chat-page .chat-input-area-container,
  body[data-scroll-locked="1"] .chat-page .chat-input-area-container,
  html[data-scroll-locked="1"] .chat-page .chat-input-area-container {
    z-index: 900 !important;
    pointer-events: none !important;
  }

  .chat-page #chat-messages {
    padding-bottom: calc(var(--navbar-height, 64px) + 92px) !important;
  }

  body.chat-mobile-navbar-lock .chat-page .chat-input-area-container {
    bottom: 0 !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
  }

  body.chat-mobile-navbar-lock .chat-page #chat-messages {
    padding-bottom: calc(92px + env(safe-area-inset-bottom)) !important;
  }

  body.chat-mobile-navbar-lock .booking-chat-window {
    bottom: 0 !important;
  }
}

.business-create-offer .offer-stepper {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.business-create-offer .offer-step-track {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
}

@media (max-width: 900px) {
  .business-create-offer .offer-stepper {
    position: sticky;
    top: 6px;
    z-index: 20;
    margin: 0 0 12px;
    padding: 8px;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
    backdrop-filter: blur(6px);
  }

  .business-create-offer .offer-step-progress-chip {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(0, 95, 115, 0.08);
    border: 1px solid rgba(0, 95, 115, 0.2);
    color: #0f4f5c;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
  }

  .business-create-offer .offer-step-track {
    display: flex;
    overflow-x: auto;
    gap: 8px;
    padding: 0 2px 2px;
    scrollbar-width: thin;
    scroll-snap-type: x proximity;
  }

  .business-create-offer .offer-step {
    flex: 0 0 min(220px, 72vw);
    min-width: 160px;
    padding: 10px 12px;
    border-radius: 12px;
    scroll-snap-align: center;
  }
}

@media (max-width: 900px) {
  .business-create-offer {
    padding: 12px 12px calc(var(--navbar-safe-offset, 92px) + 124px) !important;
    gap: 14px !important;
  }

  .business-create-offer .create-offer-layout {
    gap: 14px !important;
  }

  .business-create-offer .card,
  .business-create-offer .offer-bento-card,
  .business-create-offer .content-included-card,
  .business-create-offer .offer-recap-card,
  .business-create-offer .offer-summary-card,
  .business-create-offer .offer-summary-section {
    border-radius: 14px !important;
  }

  .business-create-offer .card .card-header {
    padding: 14px 16px !important;
  }

  .business-create-offer .card .card-body {
    padding: 14px 16px !important;
  }

  .business-create-offer .offer-value-row {
    max-width: 100% !important;
  }

  .business-create-offer .offer-value-row .mantine-Select-root {
    width: 108px !important;
    flex: 0 0 108px;
  }

  .business-create-offer .content-included-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .business-create-offer .giveaway-inline-grid,
  .business-create-offer .giveaway-rules-grid {
    grid-template-columns: 1fr !important;
  }

  .business-create-offer .offer-navigation-bar {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: var(--navbar-safe-offset, 92px) !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    gap: 8px !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch !important;
    background: rgba(248, 250, 252, 0.96);
    border-top: 1px solid rgba(226, 232, 240, 0.95);
    box-shadow: 0 -8px 20px rgba(15, 23, 42, 0.08);
    z-index: 980 !important;
    backdrop-filter: blur(8px);
  }

  body.modal-open .business-create-offer .offer-navigation-bar {
    display: none !important;
  }

  .business-create-offer .offer-navigation-bar > * {
    min-width: 0;
  }

  .business-create-offer .offer-navigation-bar .me-2 {
    margin-right: 0 !important;
  }

  .business-create-offer .offer-navigation-bar .btn,
  .business-create-offer .offer-navigation-bar .influencer_offer_button {
    width: 100%;
    min-height: 44px;
    border-radius: 12px !important;
    margin: 0 !important;
    justify-content: center;
  }

  .business-create-offer .offer-navigation-bar #style_submit,
  .business-create-offer .offer-navigation-bar #style_next,
  .business-create-offer .offer-navigation-bar #save-draft-container {
    width: 100%;
  }

  .business-create-offer .offer-navigation-spacer {
    height: 134px !important;
  }

  .business-home .business-active-offers-row.business-active-offers-row-single {
    display: block !important;
    overflow-x: visible !important;
    white-space: normal !important;
  }

  .business-home .business-active-offers-row.business-active-offers-row-single .offer-carousel-shell,
  .business-home .business-active-offers-row.business-active-offers-row-single .offer-carousel-track,
  .business-home .business-active-offers-row.business-active-offers-row-single .influencer_carousel_card_container {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }

  .business-home .business-active-offers-row.business-active-offers-row-single .offer-carousel-track {
    overflow-x: visible !important;
    white-space: normal !important;
  }

  .business-home .business-active-offers-row.business-active-offers-row-single .influencer_carousel_card_container {
    display: block !important;
    margin-right: 0 !important;
  }

  .business-waiting-mobile-layout {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .business-waiting-mobile-preview-panel {
    margin: 4px 10px 2px;
    padding: 8px;
    border-radius: 18px;
    border: 1px solid rgba(203, 213, 225, 0.72);
    background:
      radial-gradient(120% 140% at 100% -20%, rgba(0, 95, 115, 0.08) 0%, rgba(0, 95, 115, 0) 48%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(248, 250, 252, 0.98) 100%);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(6px);
  }

  .business-waiting-mobile-preview-summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    min-height: 44px;
    padding: 4px 6px;
    border-radius: 12px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(255, 255, 255, 0.84);
  }

  .business-waiting-mobile-preview-summary::-webkit-details-marker {
    display: none;
  }

  .business-waiting-mobile-preview-summary::marker {
    content: "";
  }

  .business-waiting-mobile-preview-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border-radius: 999px;
    background: rgba(0, 95, 115, 0.07);
    border: 1px solid rgba(15, 118, 110, 0.22);
  }

  .business-waiting-mobile-preview-title-text {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #0f4f5c;
  }

  .business-waiting-mobile-preview-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #0f4f5c;
  }

  .business-waiting-mobile-preview-toggle-text {
    font-size: 10.5px;
    font-weight: 600;
    color: #5b6b82;
  }

  .business-waiting-mobile-preview-chevron {
    opacity: 0.72;
    transition: transform 0.22s ease, opacity 0.2s ease;
  }

  .business-waiting-mobile-preview-panel[open] .business-waiting-mobile-preview-chevron {
    transform: rotate(180deg);
    opacity: 1;
  }

  .business-waiting-mobile-preview-content {
    margin-top: 10px;
  }

  .business-waiting-mobile-preview-panel:not([open]) .business-waiting-mobile-preview-content {
    display: none;
    margin-top: 0;
  }

  .business-waiting-mobile-preview-content .business-waiting-campaign-layout {
    position: relative;
    padding-bottom: 2px;
  }

  .business-waiting-mobile-preview-content .business-waiting-campaign-preview {
    gap: 12px !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-header {
    border-radius: 14px !important;
    border: 1px solid #e2e8f0 !important;
    background: #ffffff !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06) !important;
    padding: 12px 14px 10px !important;
    margin-bottom: 0 !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-card {
    border-radius: 15px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.07) !important;
    padding: 14px !important;
    margin-bottom: 0 !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-card h4 {
    margin-bottom: 10px !important;
    font-size: 15px !important;
    line-height: 1.3;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-tip {
    border-left: 3px solid rgba(15, 118, 110, 0.6) !important;
    border-radius: 12px !important;
    margin-bottom: 0 !important;
    padding: 11px 13px !important;
    background: linear-gradient(180deg, rgba(236, 253, 245, 0.9) 0%, rgba(240, 249, 255, 0.9) 100%) !important;
    border-color: rgba(15, 118, 110, 0.25) !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-card-location,
  .business-waiting-mobile-preview-content .business-waiting-preview-card-guarantee,
  .business-waiting-mobile-preview-content .business-waiting-preview-row > .business-waiting-preview-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-card-guarantee {
    background: linear-gradient(160deg, #0f5a6a 0%, #0b3f49 100%) !important;
    border-color: rgba(148, 211, 226, 0.28) !important;
    box-shadow: 0 12px 24px rgba(8, 47, 54, 0.28) !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-bento {
    gap: 8px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    padding: 2px 0 4px !important;
    scrollbar-width: thin;
    scroll-snap-type: x proximity;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-bento > div {
    min-width: 100px !important;
    flex: 0 0 auto !important;
    scroll-snap-align: start;
    border-radius: 12px !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-card-location .tab {
    padding: 8px 12px !important;
    margin-right: 4px !important;
    font-size: 12px !important;
  }

  .business-waiting-mobile-preview-content .business-waiting-preview-card-location .dash-graph {
    border-radius: 12px;
    overflow: hidden;
  }

  .business-waiting-mobile-tabs {
    border-radius: 12px;
  }

  .business-waiting-mobile-pane {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px 2px 2px;
  }

  .business-waiting-mobile-sections {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 0 calc(var(--navbar-safe-offset, 92px) + 6px);
  }

  .business-waiting-mobile-offer-section {
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 14px;
    background: #ffffff;
    padding: 10px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
  }

  .business-waiting-mobile-offer-title {
    font-size: 14px;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
  }

  .business-waiting-mobile-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 2px;
  }

  .business-waiting-mobile-select-all {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 6px 10px;
    margin-bottom: 2px;
    border-radius: 999px;
    border: 1px solid rgba(0, 95, 115, 0.22);
    background: rgba(248, 250, 252, 0.95);
  }

  .business-waiting-mobile-card {
    border: 1px solid rgba(14, 116, 110, 0.22);
    border-radius: 14px;
    background: #ffffff;
    padding: 11px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  }

  .business-waiting-mobile-card.is-selected {
    border-color: rgba(0, 95, 115, 0.55);
    box-shadow: 0 10px 20px rgba(0, 95, 115, 0.14);
  }

  .business-waiting-mobile-header {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
  }

  .business-waiting-mobile-avatar-wrap {
    position: relative;
    width: 52px;
    height: 52px;
    flex: 0 0 auto;
  }

  .business-waiting-mobile-avatar {
    width: 52px;
    height: 52px;
    border-radius: 10px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    object-fit: cover;
    background: #f8fafc;
  }

  .business-waiting-mobile-fav {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid rgba(239, 71, 111, 0.35);
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12);
  }

  .business-waiting-mobile-open-btn {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    border: 1px solid rgba(0, 95, 115, 0.22);
    background: rgba(0, 95, 115, 0.08);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
  }

  .business-waiting-mobile-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .business-waiting-mobile-name {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .business-waiting-mobile-content-row {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: 100%;
    min-width: 0;
    padding: 4px 9px;
    border-radius: 999px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.95);
    color: #475569;
    font-size: 11px;
    font-weight: 600;
  }

  .business-waiting-mobile-content-value {
    min-width: 0;
    flex: 1 1 auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .business-waiting-mobile-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .business-waiting-mobile-metric {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 0;
    padding: 6px 5px;
    border-radius: 10px;
    border: 1px solid rgba(148, 163, 184, 0.32);
    background: rgba(248, 250, 252, 0.95);
    color: #334155;
    text-align: center;
  }

  .business-waiting-mobile-metric-label {
    font-size: 10px;
    font-weight: 700;
    color: #64748b;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    line-height: 1.1;
  }

  .business-waiting-mobile-metric-value {
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .business-waiting-mobile-select-row {
    margin-top: 2px;
    padding-top: 8px;
    border-top: 1px solid rgba(226, 232, 240, 0.85);
  }

  .business-waiting-mobile-select-row .mantine-CheckboxGroup-root,
  .business-waiting-mobile-select-row .mantine-Checkbox-root {
    display: flex;
    justify-content: center;
    width: 100%;
  }

  .business-waiting-mobile-select-row input[type="checkbox"],
  .business-waiting-mobile-select-all input[type="checkbox"] {
    accent-color: #005f73 !important;
  }

  .business-waiting-mobile-select-row .mantine-Checkbox-input,
  .business-waiting-mobile-select-all .mantine-Checkbox-input {
    border-color: rgba(0, 95, 115, 0.45) !important;
  }

  .business-waiting-mobile-select-row .mantine-Checkbox-input:checked,
  .business-waiting-mobile-select-row .mantine-Checkbox-input[data-checked],
  .business-waiting-mobile-select-all .mantine-Checkbox-input:checked,
  .business-waiting-mobile-select-all .mantine-Checkbox-input[data-checked] {
    background-color: #005f73 !important;
    border-color: #005f73 !important;
  }
}

@media (max-width: 480px) {
  .business-create-offer .offer-navigation-bar {
    grid-template-columns: 1fr;
  }

  .business-waiting-mobile-card-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .influencer-home .home-promoted-offer-slot .offer-carousel-shell,
  .influencer-home .home-promoted-offer-slot .offer-carousel-track {
    width: 100% !important;
    max-width: 100% !important;
  }

  .influencer-home .home-promoted-offer-slot .offer-carousel-track {
    display: block !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    white-space: normal !important;
    padding: 0 !important;
  }

  .influencer-home .home-promoted-offer-slot .influencer_carousel_card_container.promoted-card,
  .influencer-home .home-promoted-offer-slot .influencer_carousel_card_container_bookings.promoted-card {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    display: block !important;
  }
}

:root {
  --mobile-chat-navbar-shift: 0px;
}

@media (max-width: 1023px) {
  body.chat-mobile-navbar-lock .navbar {
    transform: translate3d(0, calc(var(--mobile-chat-navbar-shift, 0px) + 120%), 0) !important;
    will-change: transform;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}