.vlb-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

/* VLB Events - Modern modal + form */

/* Modal backdrop */
#vlb-event-modal,
#vlb-boost-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  background: rgba(15, 23, 42, .6);
  backdrop-filter: blur(10px);
  opacity: 0;
  transition: opacity .2s ease;
}

.vlb-center {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(16px, 4vh, 48px) 16px;
  min-height: 100vh;
}

.vlb-modal-wrap {
  width: 100%;
  margin: 0 auto;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .28);
  transform: scale(.98);
  transition: transform .18s ease;
  position: relative;
  z-index: 2147483647;
  overflow: hidden;
}

.vlb-modal-header {
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}

#vlb-event-modal .vlb-center,
#vlb-boost-modal .vlb-center {
  position: relative;
  z-index: 2147483647;
}

#vlb-event-modal .vlb-modal-wrap {
  max-width: 720px;
  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.35);
}

#vlb-boost-modal .vlb-modal-wrap {
  max-width: 980px;
}

.vlb-badge--boost {
  color: #3730a3;
  background: #eef2ff;
  border-color: #c7d2fe;
  left: 25px;
  position: relative;
}

.vlb-modal-header {
  position: sticky;
  top: 0;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-bottom: none;
  padding: 12px 20px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.vlb-modal-header h2,
.vlb-modal-header h3 {
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}

.vlb-modal-body {
  padding: 60px 24px 20px 24px !important;
  max-height: 85vh;
  overflow: auto;
  background: #fafafa;
  border-radius: 16px;
}

.vlb-close,
button.vlb-close,
#vlb-modal-close {
  border-radius: 50% !important;
  border: none !important;
  padding: 0 !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  font-size: 20px !important;
  line-height: 1 !important;
  background: rgba(107, 114, 128, 0.1) !important;
  cursor: pointer !important;
  color: #374151 !important;
  top: 16px !important;
  right: 16px !important;
  position: absolute !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
  z-index: 10 !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  font-weight: 300 !important;
}

.vlb-close:hover,
button.vlb-close:hover,
#vlb-modal-close:hover {
  background: rgba(107, 114, 128, 0.2) !important;
  transform: scale(1.1) !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
  color: #111827 !important;
}

/* Buttons */
.vlb-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  font-size: 13px;
}

.vlb-btn--sm {
  padding: 5px 9px;
  font-size: 12px;
}

.vlb-btn--xs {
  padding: 4px 8px;
  font-size: 11px;
}

.vlb-btn-primary {
  background: #0f766e;
  color: #fff;
}

.vlb-btn-primary:hover {
  background: #115e59;
}

.vlb-btn-dark {
  background: #111827;
  color: #fff;
}

.vlb-btn-dark:hover {
  background: #000;
}

.vlb-btn-indigo {
  background: #4f46e5;
  color: #fff;
}

.vlb-btn-indigo:hover {
  background: #4338ca;
}

.vlb-btn-outline {
  background: #fff;
  border-color: #e5e7eb;
  color: #111827;
}

.vlb-btn-outline:hover {
  background: #f9fafb;
}

/* Toast */
#vlb-toast {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 100001;
}

#vlb-toast-inner {
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .15);
  padding: 10px 14px;
  color: #fff;
}

/* Picker dropdown (Lieu / Organisateur) */
.vlb-table {
  width: 100%;
  border: 1px solid #e5e7eb;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 6px;
  overflow: hidden;
  font-size: 14px;
}

.vlb-table th,
.vlb-table td {
  padding: 15px 10px;
}

/* Dashboard - Actions côte à côte sur mobile */
.vlb-action-buttons {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

/* Boutons avec icônes et tooltips */
.vlb-btn-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  cursor: pointer;
  transition: all 0.2s;
}

.vlb-btn-icon svg {
  flex-shrink: 0;
}

/* Sur mobile: rendre les actions visibles dans le tableau */
@media (max-width: 767px) {
  .vlb-dashboard-table {
    font-size: 13px;
    width: 100%;
    display: table;
  }

  .vlb-dashboard-table .status_events {
    display: none;
  }

  .vlb-dashboard-table .title_events {
    max-width: none;
    width: auto;
    overflow: visible;
    text-overflow: unset;
    white-space: normal;
    word-wrap: break-word;
    padding: 8px 12px;
  }

  .vlb-dashboard-table .actions_events {
    min-width: 160px;
    width: 160px;
    padding: 8px 12px;
  }

  .vlb-action-buttons {
    display: flex;
    gap: 6px;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }

  .vlb-btn--edit,
  .vlb-btn--boost {
    font-size: 12px;
    padding: 6px 10px !important;
    white-space: nowrap;
    flex-shrink: 0;
    display: inline-flex !important;
    align-items: center;
    visibility: visible;
    opacity: 1;
  }

  .vlb-btn--boost {
    gap: 4px;
  }

  .vlb-btn--boost svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    display: block;
  }

  .vlb-btn--boost span {
    font-size: 12px;
    display: inline-block;
  }
}

.vlb-table thead {
  background: #f9fafb;
}

.vlb-th {
  padding: 8px 12px;
  text-align: left;
  color: #374151;
  font-weight: 600;
}

.vlb-td {
  padding: 15px 0;
  border-collapse: initial;
  border-radius: 0;
  border-top: 0;
  border-top-width: 0px;
  border-bottom: 2px solid rgba(50, 50, 50, 0.1);
}

.vlb-table-wrap {
  overflow-x: auto;
}

.vlb-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border: 1px solid;
  border-radius: 6px;
  font-size: 12px;
}

.vlb-badge--success {
  color: #065f46;
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.vlb-badge--pending {
  color: #92400e;
  background: #fffbeb;
  border-color: #fcd34d;
}

.vlb-badge--boost {
  color: #3730a3;
  background: #eef2ff;
  border-color: #c7d2fe;
}

.vlb-btn {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px !important;
  border-radius: 6px;
  border: 1px solid transparent !important;
  cursor: pointer;
}

.vlb-btn--edit {
  background: #1f2937;
  color: #fff;
}

.vlb-btn--edit:hover {
  background: #000;
}

.vlb-btn--boost {
  background: #4f46e5;
  color: #fff;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 8px 12px !important;
}

.vlb-btn--boost:hover {
  background: #4338ca;
}

.vlb-btn--boost svg {
  flex-shrink: 0;
}

.vlb-picker {
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .12);
  overflow: auto;
  max-height: 240px;
  padding: 6px;
  backdrop-filter: saturate(120%);
}

.vlb-picker-empty {
  color: #6b7280;
  padding: 10px 12px;
  font-size: 13px;
}

.vlb-picker-loading {
  color: #6b7280;
  padding: 10px 12px;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.vlb-spinner {
  width: 14px;
  height: 14px;
  border: 2px solid #d1d5db;
  border-top-color: #4f46e5;
  border-radius: 50%;
  animation: vlb-spin .8s linear infinite;
}

@keyframes vlb-spin {
  to {
    transform: rotate(360deg);
  }
}

.vlb-picker-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: background .12s ease, transform .06s ease;
}

.vlb-picker-item:hover {
  background: #f9fafb;
}

.vlb-picker-item:active {
  transform: scale(.995);
}

.vlb-picker-title {
  font-size: 14px;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media screen and (max-width: 768px) {
  .events_container {

    padding: 0 15px;
  }

  .start_date_events,
  .end_date_events {
    display: none;
  }



  .woocommerce-MyAccount-navigation,
  .woocommerce-MyAccount-content {
    width: 100% !important;
  }

}

/* Boost grid - Responsive pour 5 produits */
.vlb-boost-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  padding: 20px;
}

@media (max-width: 1200px) {
  .vlb-boost-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
}

@media (max-width: 768px) {
  .vlb-boost-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    padding: 12px;
  }
}

@media (max-width: 480px) {
  .vlb-boost-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

.vlb-boost-card {
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 0;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.vlb-boost-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.vlb-boost-image-wrapper {
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background: #f9fafb;
}

.vlb-boost-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.vlb-boost-card .vlb-btn {
  margin: 16px;
  width: calc(100% - 32px);
}

/* Form layout (no Tailwind) */
.vlb-form {
  max-width: 680px;
}

.vlb-form>div {
  margin-bottom: 12px;
}

.vlb-form .vlb-row {
  margin-bottom: 12px;
}

.vlb-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.vlb-col {
  flex: 1 1 0;
  min-width: 0;
  max-width: 100%;
}

.vlb-col--wide {
  flex: 1 1 100%;
  max-width: 680px;
}

#vlb-event-modal form#vlb-event-form .w-full {
  width: 100% !important;
}

#vlb-event-modal form#vlb-event-form textarea {
  width: 100% !important;
}

/* Inline group for date+time */
.vlb-inline {
  display: flex;
  gap: 8px;
  align-items: center;
  width: 100%;
}

.vlb-inline .vlb-field {
  flex: 1 1 0;
  min-width: 0;
}

.vlb-inline .vlb-field--date {
  flex: 1 1 50%;
}

.vlb-inline .vlb-field--time {
  flex: 1 1 50%;
}

.vlb-inline input[type=date],
.vlb-inline input[type=time] {
  width: 100% !important;
  max-width: none;
  flex: 1 1 0;
  min-width: 0;
}

/* Inputs look */
#vlb-event-modal form#vlb-event-form input[type=text],
#vlb-event-modal form#vlb-event-form input[type=url],
#vlb-event-modal form#vlb-event-form input[type=number],
#vlb-event-modal form#vlb-event-form input[type=date],
#vlb-event-modal form#vlb-event-form input[type=time],
#vlb-event-modal form#vlb-event-form textarea,
#vlb-event-modal form#vlb-event-form select {
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: 8px 10px;
  outline: 0;
  transition: box-shadow .15s ease, border-color .15s ease;
}

#vlb-event-modal form#vlb-event-form input:focus,
#vlb-event-modal form#vlb-event-form textarea:focus,
#vlb-event-modal form#vlb-event-form select:focus {
  border-color: #94a3b8;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, .15);
}

/* Force two columns on desktop for date/time row */
.vlb-row.vlb-row--two .vlb-col {
  flex: 1 1 calc(50% - 8px);
  max-width: calc(50% - 8px);
}

/* Smaller buttons */
.vlb-btn--sm {
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 6px;
}

/* Image line: preview left, input right */
.vlb-image-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.vlb-image-line input[type=file] {
  max-width: 240px;
}

.vlb-field--file {
  margin-top: 8px;
}

.vlb-field--file>label {
  display: block;
  font-size: 12px;
  color: #6b7280;
  margin-top: 6px;
}

.vlb-image-preview {
  margin-top: 8px;
}

.vlb-image-preview img {
  width: 100%;
  height: auto;
  max-height: 140px;
  object-fit: cover;
  border-radius: 8px;
  display: none;
}

#vlb-thumbnail-file {
  top: 10px;
  position: relative;
}

/* Floating labels */
.vlb-field {
  position: relative;
}

.vlb-field>input,
.vlb-field>textarea,
.vlb-field>select {
  width: 100% !important;
}

/* Floating labels - style archive harmonisé */
.vlb-field label {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  transition: all 0.2s ease;
  color: #9ca3af;
  font-size: 14px;
  background: #fff;
  padding: 0 4px;
  z-index: 1;
}

.vlb-field textarea+label {
  top: 16px;
  transform: none;
}

/* Quand l'input a du contenu ou est en focus, déplacer le label vers le haut */
.vlb-field input:focus+label,
.vlb-field input:not(:placeholder-shown)+label,
.vlb-field textarea:focus+label,
.vlb-field textarea:not(:placeholder-shown)+label,
.vlb-field select:focus+label,
.vlb-field select:not([value=""])+label {
  top: 0;
  transform: translateY(-50%);
  font-size: 12px;
  color: #1a3c8c;
  background: #fff;
  z-index: 2;
}

.vlb-field textarea:focus+label,
.vlb-field textarea:not(:placeholder-shown)+label {
  top: -8px;
  transform: none;
}

/* Ajuster le padding des inputs pour laisser de la place au label */
.vlb-field input:not([type="date"]):not([type="time"]):not([type="url"]),
.vlb-field textarea,
.vlb-field select {
  padding-top: 16px !important;
  padding-bottom: 8px !important;
}

.vlb-field input:not([type="date"]):not([type="time"]):not([type="url"]):focus,
.vlb-field textarea:focus,
.vlb-field select:focus {
  padding-top: 16px !important;
  padding-bottom: 8px !important;
}

/* Pour les inputs URL qui ont déjà un placeholder visible */
.vlb-field input[type="url"] {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

.vlb-field input[type="url"]+label {
  display: none;
}

/* Pour les inputs date et time, ajuster différemment */
.vlb-field input[type="date"]+label,
.vlb-field input[type="time"]+label {
  top: 0;
  transform: translateY(-50%);
  font-size: 12px;
}

.vlb-field input[type="date"]:focus+label,
.vlb-field input[type="date"]:not(:placeholder-shown)+label,
.vlb-field input[type="time"]:focus+label,
.vlb-field input[type="time"]:not(:placeholder-shown)+label {
  top: 0;
  transform: translateY(-50%);
}

/* Suffix button inside field (for + add) */
.vlb-field--suffix {
  position: relative;
}

.vlb-field--suffix>input {
  padding-right: 34px;
}

/* Minimal icon button for suffix (+) */
.vlb-icon-btn {
  background: transparent;
  border: 1px solid #e5e7eb;
  color: #111827;
  border-radius: 6px;
  height: 26px;
  width: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.vlb-icon-btn:hover {
  background: #f9fafb;
}

.vlb-suffix-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0;
  line-height: 1;
  z-index: 2;
}


#vlb-venue-add,
#vlb-org-add {
  position: absolute;
}


#vlb-event-modal form#vlb-event-form input[type=text],
#vlb-event-modal form#vlb-event-form input[type=url],
#vlb-event-modal form#vlb-event-form input[type=number],
#vlb-event-modal form#vlb-event-form input[type=date],
#vlb-event-modal form#vlb-event-form input[type=time],
#vlb-event-modal form#vlb-event-form textarea,
#vlb-event-modal form#vlb-event-form select {
  width: 100% !important;
  max-width: 100%;
}

@media (max-width: 640px) {
  .vlb-row {
    gap: 10px;
  }

  .vlb-col,
  .vlb-col--wide {
    flex: 1 1 100%;
    max-width: 100%;
  }

  /* Exception : Téléphone et Email restent sur la même ligne sur mobile */
  .vlb-row:not(.vlb-row--two) .vlb-col {
    flex: 1 1 calc(50% - 5px);
    max-width: calc(50% - 5px);
  }

  .vlb-row.vlb-row--two .vlb-col {
    flex: 1 1 100%;
    max-width: 100%;
  }

  #vlb-event-modal form#vlb-event-form input[type=text],
  #vlb-event-modal form#vlb-event-form input[type=url],
  #vlb-event-modal form#vlb-event-form input[type=number],
  #vlb-event-modal form#vlb-event-form input[type=date],
  #vlb-event-modal form#vlb-event-form input[type=time],
  #vlb-event-modal form#vlb-event-form textarea,
  #vlb-event-modal form#vlb-event-form select {
    width: 100% !important;
    max-width: 100%;
  }
}

/* FIX iPhone : débordement formulaire + lecteur audio */
@media (max-width: 768px) {

  /* Éviter débordement horizontal */
  .vlb-mobile-auth-panel #vlb-event-form {
    max-width: 100%;
    overflow-x: hidden;
  }

  .vlb-mobile-auth-panel #vlb-event-form * {
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Padding-bottom pour éviter que le lecteur audio cache le bouton */
  .vlb-mobile-panel-content {
    padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Font-size 16px minimum pour éviter zoom auto iOS */
  .vlb-mobile-auth-panel input,
  .vlb-mobile-auth-panel textarea,
  .vlb-mobile-auth-panel select {
    font-size: 16px !important;
  }

  /* Masquer les labels des champs heures sur mobile */
  label[for="vlb-start-time"],
  label[for="vlb-end-time"] {
    display: none;
  }
}

/* Popup pour les événements (frontend) - CENTRÉE VERTICALEMENT */
.vlb-event-popup {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.vlb-event-popup-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
}

.vlb-event-popup-content {
  position: relative;
  background: #ffffff;
  border-radius: 20px;
  width: 100%;
  max-width: 650px;
  max-height: 90vh;
  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.35);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  z-index: 1;
  margin: 0 auto;
  animation: vlb-popup-fade-in 0.3s ease;
}

@keyframes vlb-popup-fade-in {
  from {
    opacity: 0;
    transform: scale(0.95) translateY(20px);
  }

  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* Bouton fermer - surcharge complète du thème */
.vlb-event-popup .vlb-event-popup-close,
button.vlb-event-popup-close {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  width: 32px !important;
  max-width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: #1a3c8c !important;
  border-radius: 50% !important;
  font-size: 20px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #374151 !important;
  z-index: 999999 !important;
  transition: all 0.2s ease !important;
  font-weight: 300 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

.vlb-event-popup .vlb-event-popup-close:hover,
button.vlb-event-popup-close:hover {
  background: #6b7280 !important;
  color: #ffffff !important;
  transform: scale(1.1) !important;
  box-shadow: 0 4px 12px rgba(107, 114, 128, 0.3) !important;
}

.vlb-event-popup .vlb-event-popup-close:active,
button.vlb-event-popup-close:active {
  transform: scale(0.95) !important;
}

.vlb-event-popup-header {
  padding: 24px 24px 20px;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
  position: relative;
}

.vlb-popup-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  padding-right: 48px;
  /* Espace pour le bouton fermer */
}

.vlb-event-popup-header h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
  line-height: 1.3;
  flex: 1;
}

/* Ligne info : dates à gauche, lieu+prix à droite */
.vlb-event-info-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
}

.vlb-event-venue-cost-group {
  display: flex;
  align-items: center;
  gap: 12px;
}

.vlb-event-dates {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #6b7280;
  line-height: 1.4;
  font-weight: 500;
  margin: 0;
  padding: 0;
}

/* Ancienne classe pour compatibilité */
.vlb-event-venue-cost-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px 0 0 0;
  flex-wrap: wrap;
}

.vlb-event-venue {
  font-size: 14px;
  color: #6b7280;
  line-height: 1.4;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  list-style: none;
}

.vlb-event-venue::before {
  content: none;
  /* Pas de puce */
}

.vlb-event-venue a {
  color: #1a3c8c;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.15s ease;
}

.vlb-event-venue a:hover {
  color: #2d5aa0;
}

.vlb-event-address {
  display: none;
  /* On cache l'adresse pour plus de compacité */
}

.vlb-event-cost {
  font-size: 13px;
  color: #10b981;
  line-height: 1;
  margin: 0;
  font-weight: 600;
  padding: 6px 10px;
  background: #ecfdf5;
  border-radius: 4px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
}

.vlb-event-popup-body {
  padding: 20px 24px 24px;
  overflow-y: auto;
  flex: 1;
  background: #ffffff;
}

.vlb-event-popup-body .vlb-event-description {
  color: #374151;
  line-height: 1.6;
  font-size: 15px;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  max-width: 100%;
  overflow: visible;
  box-sizing: border-box;
  margin: 0;
}

.vlb-event-popup-body .vlb-event-description p {
  margin: 0 0 14px 0;
}

.vlb-event-popup-body .vlb-event-description p:last-child {
  margin-bottom: 0;
}

.vlb-event-popup-body .vlb-event-description h1,
.vlb-event-popup-body .vlb-event-description h2,
.vlb-event-popup-body .vlb-event-description h3,
.vlb-event-popup-body .vlb-event-description h4 {
  color: #111827;
  margin-top: 18px;
  margin-bottom: 10px;
  font-weight: 600;
}

.vlb-event-popup-body .vlb-event-description h1 {
  font-size: 22px;
}

.vlb-event-popup-body .vlb-event-description h2 {
  font-size: 20px;
}

.vlb-event-popup-body .vlb-event-description h3 {
  font-size: 18px;
}

.vlb-event-popup-body .vlb-event-description h4 {
  font-size: 16px;
}

.vlb-event-popup-body .vlb-event-description ul,
.vlb-event-popup-body .vlb-event-description ol {
  margin: 12px 0;
  padding-left: 24px;
}

.vlb-event-popup-body .vlb-event-description li {
  margin: 6px 0;
}

/* Ligne avec lien web et adresse */
.vlb-popup-url-address-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: 8px;
}

#vlb-popup-url {
  flex-shrink: 0;
}

#vlb-popup-url .vlb-event-external-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #6b7280;
  font-size: 13px;
  text-decoration: none;
  transition: all 0.2s ease;
  padding: 2px 0;
}

#vlb-popup-url .vlb-event-external-link:hover {
  color: #1a3c8c;
}

#vlb-popup-url .vlb-event-external-link svg {
  width: 14px;
  height: 14px;
  opacity: 0.7;
  transition: opacity 0.2s ease;
}

#vlb-popup-url .vlb-event-external-link:hover svg {
  opacity: 1;
}

#vlb-popup-url .vlb-event-external-link span {
  font-weight: 400;
}

/* Adresse à droite */
#vlb-popup-address {
  flex: 1;
  text-align: right;
  min-width: 0;
}

#vlb-popup-address .vlb-address-text {
  font-size: 13px;
  color: #6b7280;
  line-height: 1.4;
  word-break: break-word;
}

/* Lien adresse Google Maps */
.vlb-address-maps-link {
  color: #6b7280;
  text-decoration: none;
  transition: all 0.2s ease;
  border-bottom: 1px dotted rgba(107, 114, 128, 0.3);
}

.vlb-address-maps-link:hover {
  color: #1a3c8c;
  border-bottom-color: #1a3c8c;
}

/* Responsive mobile */
@media (max-width: 768px) {
  .vlb-popup-url-address-line {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  #vlb-popup-address {
    text-align: left;
    width: 100%;
  }

  #vlb-popup-address .vlb-address-text {
    font-size: 12px;
  }
}

/* Informations de contact dans le header */
.vlb-event-contact-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.vlb-contact-items {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.vlb-contact-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 1.5;
  color: #374151;
  text-decoration: none;
  transition: color 0.2s ease;
  flex-shrink: 0;
}

.vlb-contact-item:hover {
  color: #1a3c8c;
}

.vlb-contact-item-address {
  cursor: default;
  pointer-events: none;
}

.vlb-contact-icon {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  color: currentColor;
}

.vlb-contact-label {
  flex: 1;
  color: currentColor;
}

/* Responsive mobile pour les infos de contact - Mise en ligne horizontale */
@media (max-width: 768px) {
  .vlb-event-contact-info {
    margin-top: 8px;
    padding-top: 8px;
  }

  .vlb-contact-items {
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 16px;
    align-items: center;
    justify-content: flex-start;
  }

  .vlb-contact-item {
    display: inline-flex;
    align-items: center;
    gap: 0;
    font-size: 0;
    padding: 0;
    min-width: 24px;
  }

  .vlb-contact-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
  }

  /* Masquer le texte sur mobile pour tel et email */
  .vlb-contact-item:not(.vlb-contact-item-address) .vlb-contact-label {
    display: none;
  }

  /* Afficher le texte pour le lien web mobile */
  #vlb-popup-url-mobile .vlb-contact-item {
    padding: 6px 12px;
    min-width: auto;
    gap: 4px;
  }

  #vlb-popup-url-mobile .vlb-contact-item .vlb-contact-label {
    display: inline-block !important;
    font-size: 10px;
    margin-left: 0;
    color: #374151;
    line-height: 1.2;
  }

  #vlb-popup-url-mobile .vlb-contact-item .vlb-contact-icon {
    width: 14px;
    height: 14px;
  }

  /* Adresse : afficher le texte mais tronqué */
  .vlb-contact-item-address {
    flex: 1;
    min-width: 0;
    gap: 6px;
  }

  .vlb-contact-item-address .vlb-contact-label {
    display: block;
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    color: #6b7280;
  }

  /* Espacement égal si plusieurs éléments */
  .vlb-contact-items>.vlb-contact-item:not(:last-child) {
    margin-right: auto;
  }
}

/* Footer retiré - plus de lien vers la single page */

/* Vignettes d'événements - Style header/body comme premier screenshot */
.vlb-event-card-clickable {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.vlb-event-card-clickable:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

/* Style pour les cartes d'événements dans la vue Photo */
.proradio-post.tribe-event.vlb-event-card-clickable {
  background: transparent;
  border-radius: 12px;
  overflow: hidden;
  min-height: 180px;
  max-height: 320px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Header avec localité CENTRÉE - EMBELLI */
.vlb-event-card-header {
  background: #1a3c8c;
  padding: 10px 16px !important;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  min-height: 38px;
  text-align: center;
}

.vlb-event-venue-name {
  color: #ffffff;
  font-size: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  display: flex;
  gap: 8px;
}

.vlb-event-card-header .vlb-event-icon {
  font-size: 18px;
  display: inline-block;
  line-height: 1;
}

/* Body blanc/clair - TOUT CENTRÉ - EMBELLI */
.vlb-event-card-body {
  background: #ffffff;
  padding: 16px 16px 12px 16px !important;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: center;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  min-height: 120px;
  overflow: hidden;
}

/* Catégorie avec icône - CENTRÉE - EMBELLIE */
.vlb-event-category {
  color: #1a3c8c;
  font-size: 17px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 16px;
  letter-spacing: 0.8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.vlb-event-icon {
  font-size: 24px;
  display: inline-block;
  line-height: 1;
}

/* Titre dans la miniature */
.vlb-event-title-miniature {
  color: #111827;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 8px !important;
  text-align: center;
  line-height: 1.3;
}

/* Date - CENTRÉE avec emoji */
.vlb-event-date {
  color: #333333;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px !important;
  text-align: center;
  line-height: 1.4;
}

/* Prix dans la miniature */
.vlb-event-cost-miniature {
  color: #333333;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px !important;
  text-align: center;
  line-height: 1.4;
}

/* Wrapper pour la description avec "lire plus" */
.vlb-event-description-wrapper {
  margin-top: auto;
  width: 100%;
  padding-bottom: 4px;
}

/* Description - A gauche - PLUS CLAIRE ET PLUS GROSSE */
.vlb-event-description {
  color: #1a3c8c;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.7;
  text-align: left;
}

/* Description tronquée dans la miniature */
.vlb-event-description-truncated {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* Hauteur exacte pour 3 lignes complètes avec line-height 1.7 et font-size 18px */
  /* 18px * 1.7 = 30.6px par ligne, donc 3 lignes = 91.8px */
  max-height: 92px;
  margin-bottom: 10px;
  position: relative;
  /* S'assurer que la dernière ligne est complètement visible - pas de padding qui pourrait masquer */
  padding-bottom: 0;
  /* Forcer l'affichage de 3 lignes complètes */
  line-height: 1.7;
}

/* Bouton "Lire plus" */
.vlb-event-read-more {
  background: transparent;
  border: none;
  color: #1a3c8c;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  margin-top: 4px;
  text-align: left;
  text-decoration: underline;
  transition: color 0.2s ease;
  display: block;
  width: 100%;
}

.vlb-event-read-more:hover {
  color: #d65a95;
}

/* Lien externe dans la miniature */
.vlb-event-url-miniature {
  color: #1a3c8c;
  font-size: 18px;
  font-weight: 500;
  margin-top: auto;
  text-align: center;
  line-height: 1.7;
}

/* Footer avec URL (quand description + URL) */
.vlb-event-card-footer {
  background: #f9fafb;
  padding: 12px 20px !important;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  border-top: 1px solid #e5e7eb;
  text-align: center;
}

.vlb-event-external-link-footer {
  color: #1a3c8c;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  word-break: break-all;
  transition: color 0.2s ease;
}

.vlb-event-external-link-footer:hover {
  color: #d65a95;
  text-decoration: underline;
}

/* Masquer les images de fond */
.proradio-post.tribe-event .proradio-bgimg {
  display: none !important;
}

/* Layout 4 colonnes pour les événements */
.tribe-events-pro-photo__events {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.tribe-events-pro-photo__events>li {
  margin: 0;
  width: 100%;
}

@media (max-width: 1200px) {
  .tribe-events-pro-photo__events {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Desktop : masquer le layout mobile, afficher le desktop */
@media (min-width: 769px) {
  .vlb-popup-mobile-layout {
    display: none !important;
  }

  .vlb-popup-desktop-layout {
    display: block !important;
  }
}

@media (max-width: 768px) {

  /* Masquer le layout desktop sur mobile */
  .vlb-popup-desktop-layout {
    display: none !important;
  }

  /* Afficher le layout mobile */
  .vlb-popup-mobile-layout {
    display: block;
  }

  .tribe-events-pro-photo__events {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .vlb-event-popup-content {
    max-width: 95%;
    max-height: 90vh;
  }

  .vlb-event-popup-header {
    padding: 24px 24px 16px;
  }

  .vlb-popup-mobile-layout .vlb-popup-title-row {
    margin-bottom: 12px;
  }

  .vlb-popup-mobile-layout h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    padding-right: 40px;
  }

  /* Ligne 1: Date (gauche) | Localité (droite) */
  .vlb-mobile-row-1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
  }

  #vlb-popup-dates-mobile {
    font-size: 14px;
    color: #374151;
    flex: 1;
  }

  #vlb-popup-venue-mobile {
    font-size: 14px;
    color: #374151;
    font-weight: 500;
    text-align: right;
    flex-shrink: 0;
  }

  /* Localité cliquable sur mobile */
  #vlb-popup-venue-mobile .vlb-venue-filter-link-mobile {
    color: #1a3c8c;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    border-bottom: 1px solid transparent;
  }

  #vlb-popup-venue-mobile .vlb-venue-filter-link-mobile:hover {
    color: #2d5aa0;
    border-bottom-color: #1a3c8c;
  }

  /* Lien adresse Google Maps sur mobile */
  #vlb-popup-address-mobile .vlb-address-maps-link {
    color: #6b7280;
    text-decoration: none;
    transition: all 0.2s ease;
    border-bottom: 1px dotted rgba(107, 114, 128, 0.3);
  }

  #vlb-popup-address-mobile .vlb-address-maps-link:hover {
    color: #1a3c8c;
    border-bottom-color: #1a3c8c;
  }

  /* Ligne 2: Adresse (gauche) | Prix (droite) */
  .vlb-mobile-row-2 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
  }

  #vlb-popup-address-mobile {
    font-size: 13px;
    color: #6b7280;
    flex: 1;
    line-height: 1.4;
  }

  #vlb-popup-cost-mobile {
    font-size: 14px;
    color: #374151;
    font-weight: 500;
    flex-shrink: 0;
    text-align: right;
  }

  /* Ligne 3: Tel | Mail | Plus d'infos */
  .vlb-mobile-row-3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid #e5e7eb;
  }

  /* Lien web à droite */
  #vlb-popup-url-mobile {
    margin-left: auto;
  }

  .vlb-mobile-row-3 .vlb-contact-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    border-radius: 8px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 1px solid rgba(26, 60, 140, 0.15);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 8px 16px;
    min-width: auto;
    gap: 4px;
    position: relative;
    overflow: hidden;
  }

  .vlb-mobile-row-3 .vlb-contact-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(26, 60, 140, 0.1) 0%, rgba(26, 60, 140, 0.05) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .vlb-mobile-row-3 .vlb-contact-item:hover {
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 6px 20px rgba(26, 60, 140, 0.25);
    border-color: rgba(26, 60, 140, 0.3);
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
  }

  .vlb-mobile-row-3 .vlb-contact-item:hover::before {
    opacity: 1;
  }

  .vlb-mobile-row-3 .vlb-contact-item:active {
    transform: translateY(0) scale(0.98);
    box-shadow: 0 2px 8px rgba(26, 60, 140, 0.2);
  }

  .vlb-mobile-row-3 .vlb-contact-icon {
    width: 14px;
    height: 14px;
    color: #1a3c8c;
    position: relative;
    z-index: 1;
    transition: all 0.3s ease;
  }

  .vlb-mobile-row-3 .vlb-contact-item:hover .vlb-contact-icon {
    color: #2d5aa0;
    transform: scale(1.1);
  }

  #vlb-popup-url-mobile .vlb-contact-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    min-width: auto;
    width: auto;
    height: auto;
    gap: 4px;
    border-radius: 8px;
  }

  #vlb-popup-url-mobile .vlb-contact-item .vlb-contact-icon {
    width: 14px;
    height: 14px;
  }

  .vlb-event-popup-header h2 {
    font-size: 22px;
    padding-right: 45px;
  }

  .vlb-event-popup-body {
    padding: 20px 24px;
  }

  .vlb-event-popup-footer {
    padding: 16px 24px;
  }

  .vlb-event-description {
    font-size: 15px;
  }

  /* Annuler la troncature dans la popup - le contenu doit être complet */
  .vlb-event-popup-body .vlb-event-description {
    display: block !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    overflow: visible !important;
    text-overflow: unset !important;
  }

  .vlb-event-card-header {
    padding: 8px 12px !important;
    min-height: 36px;
    font-size: 12px;
  }

  .vlb-event-venue-name {
    font-size: 11px !important;
  }

  .vlb-event-card-body {
    padding: 10px !important;
    min-height: 80px !important;
  }

  /* Réduire les éléments internes de la carte */
  .vlb-event-title-miniature {
    font-size: 14px !important;
    margin-bottom: 4px !important;
    line-height: 1.2 !important;
  }

  .vlb-event-dates-miniature {
    font-size: 11px !important;
    margin-bottom: 6px !important;
  }

  .vlb-event-description-wrapper {
    margin-top: 4px !important;
  }

  /* Limiter la troncature aux miniatures uniquement, pas à la popup */
  .vlb-event-card-body .vlb-event-description,
  .vlb-event-description-wrapper .vlb-event-description {
    font-size: 12px !important;
    line-height: 1.35 !important;
    /* Limiter à 2 lignes */
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .vlb-event-category {
    font-size: 14px;
    margin-bottom: 10px;
  }

  .vlb-event-date {
    font-size: 14px;
    margin-bottom: 10px;
  }

  .vlb-event-description {
    font-size: 13px;
  }

  .proradio-post.tribe-event.vlb-event-card-clickable {
    min-height: 100px !important;
    max-height: 180px !important;
    margin: 0;
  }
}

/* Desktop : masquer le layout mobile, afficher le desktop */
@media (min-width: 769px) {
  .vlb-popup-mobile-layout {
    display: none !important;
  }

  .vlb-popup-desktop-layout {
    display: block !important;
  }
}

@media (max-width: 480px) {
  .tribe-events-pro-photo__events {
    grid-template-columns: 1fr;
  }

  .vlb-event-popup-header {
    padding: 20px 20px 16px;
  }

  .vlb-popup-mobile-layout h2 {
    font-size: 18px;
  }

  .vlb-popup-title-row {
    gap: 10px;
    padding-right: 40px;
  }

  .vlb-popup-title-row .vlb-event-external-link {
    width: 28px;
    height: 28px;
  }

  .vlb-popup-title-row .vlb-event-external-link svg {
    width: 16px;
    height: 16px;
  }

  .vlb-event-info-line {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .vlb-event-venue-cost-group {
    gap: 8px;
  }

  .vlb-event-dates {
    font-size: 13px;
  }

  .vlb-event-venue {
    font-size: 13px;
  }

  .vlb-event-cost {
    font-size: 12px;
    padding: 5px 8px;
  }

  .vlb-event-popup-body {
    padding: 16px 20px 20px;
  }

  .vlb-event-description {
    font-size: 14px;
  }

  /* Annuler la troncature dans la popup - le contenu doit être complet */
  .vlb-event-popup-body .vlb-event-description {
    display: block !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    overflow: visible !important;
    text-overflow: unset !important;
  }
}