/* ==========================================================================
   VLINK ASIA — TRIBE EVENTS CSS v6
   Scope  : .single-tribe_events  (trang single event)
            .tribe-events-view--list  (trang danh sách event)
   Ngày   : 23/04/2026

   Tất cả selector đều có root class ở trên → KHÔNG bao giờ đè trang khác.
   ========================================================================== */


/* ============================================================
   0. CONTAINER WIDTH — khớp với Flatsome container

   Flatsome bọc content trong: .row > .large-12.col
   Cả .row và .col đều có padding/max-width riêng.
   → Override cả 2 trong scope event để content = header width.
   ============================================================ */

/* Cho phép col cha full width, không padding (chỉ trong page event) */
.single-tribe_events #main .row > .col,
.single-tribe_events #main .row > [class*="large-"],
.single-tribe_events #main .row > [class*="medium-"],
.single-tribe_events #content .row > .col,
.single-tribe_events #content .row > [class*="large-"],
.single-tribe_events #content .row > [class*="medium-"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
  flex-basis: 100% !important;
  width: 100% !important;
}

/* Row cha: mở rộng max-width để bằng header */
.single-tribe_events #main > .row,
.single-tribe_events #content > .row,
.single-tribe_events #main .row-main,
.single-tribe_events #main .row-full-width {
  max-width: 1260px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* pg-template: để parent quyết định width */
.single-tribe_events #tribe-events-pg-template {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  box-sizing: border-box !important;
}

.single-tribe_events .tribe-events-pg-template {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Mobile: trả lại padding cho col để không chạm mép viewport */
@media (max-width: 849px) {
  .single-tribe_events #main .row > .col,
  .single-tribe_events #main .row > [class*="large-"],
  .single-tribe_events #content .row > .col,
  .single-tribe_events #content .row > [class*="large-"] {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}


/* ============================================================
   1. FEATURED IMAGE / PAGE TITLE BANNER (Flatsome)

   Không ẩn nữa — thu nhỏ lại max-height: 240px.
   Giữ ảnh hiển thị nhưng không chiếm cả viewport.
   ============================================================ */

/* Flatsome page-title banner (nếu có) — ẩn vì trùng với title Tribe */
.single-tribe_events .page-title,
.single-tribe_events .page-title-container,
.single-tribe_events .page-header {
  display: none !important;
}

/* Featured image trong content event — thu nhỏ */
.single-tribe_events .tribe-events-event-image,
.single-tribe_events .post-thumbnail,
.single-tribe_events .entry-image {
  max-height: 260px !important;
  overflow: hidden !important;
  margin: 0 auto 24px !important;
  border-radius: 14px !important;
  max-width: 900px !important;
  text-align: center !important;
  display: block !important;
}

.single-tribe_events .tribe-events-event-image img,
.single-tribe_events .post-thumbnail img,
.single-tribe_events .entry-image img,
.single-tribe_events img.wp-post-image,
.single-tribe_events #tribe-events-content > figure img,
.single-tribe_events #tribe-events-content .wp-block-image img {
  max-height: 260px !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 auto !important;
  border-radius: 12px !important;
}

/* Nếu featured image là block wp-block-image đứng độc lập ở đầu */
.single-tribe_events #tribe-events-content > .wp-block-image:first-child,
.single-tribe_events #tribe-events-content > figure:first-of-type {
  max-height: 260px !important;
  overflow: hidden !important;
  margin: 0 auto 24px !important;
  border-radius: 14px !important;
  max-width: 900px !important;
}

@media (max-width: 768px) {
  .single-tribe_events .tribe-events-event-image,
  .single-tribe_events .post-thumbnail,
  .single-tribe_events img.wp-post-image,
  .single-tribe_events #tribe-events-content .wp-block-image img {
    max-height: 180px !important;
  }
}


/* ============================================================
   2. CARD BỌC NỘI DUNG
   ============================================================ */

.single-tribe_events #tribe-events-content {
  background: #ffffff;
  border-radius: 20px;
  padding: 40px 40px;
  box-shadow: 0 2px 20px rgba(0, 8, 20, 0.07);
  border: 1px solid #edf0f5;
  box-sizing: border-box;
  margin-bottom: 32px;
  width: auto !important;
  max-width: 1300px !important;
  margin: auto;
  margin-top: 30px!important;
}

@media (max-width: 768px) {
  .single-tribe_events #tribe-events-content {
    padding: 24px 18px;
    border-radius: 14px;
  }
}


/* ============================================================
   3. BACK LINK
   ============================================================ */

.single-tribe_events .tribe-events-back {
  display: block !important;
  margin-bottom: 24px !important;
  background: none !important;
}

.single-tribe_events .tribe-events-back a {
  display: inline-flex !important;
  align-items: center !important;
  color: #64748b !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  padding: 7px 14px !important;
  background: #f1f5f9 !important;
  border-radius: 8px !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}

.single-tribe_events .tribe-events-back a:hover {
  background: #e2e8f0 !important;
  color: #001f3f !important;
}


/* ============================================================
   4. TIÊU ĐỀ EVENT
   ============================================================ */

.single-tribe_events .tribe-events-single-event-title {
  color: #000814 !important;
  font-size: 32px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.6px !important;
  margin: 4px 0 16px 0 !important;
  padding-bottom: 18px !important;
  position: relative !important;
  display: block !important;
}

.single-tribe_events .tribe-events-single-event-title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 52px;
  height: 5px;
  background: linear-gradient(90deg, #001f3f 0%, #4facfe 100%);
  border-radius: 3px;
}

@media (max-width: 768px) {
  .single-tribe_events .tribe-events-single-event-title {
    font-size: 22px !important;
    letter-spacing: -0.2px !important;
  }
}


/* ============================================================
   5. NGÀY GIỜ
   ============================================================ */

.single-tribe_events .tribe-events-schedule {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: #eef6ff !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 10px !important;
  padding: 8px 16px !important;
  margin-bottom: 28px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1e40af !important;
  float: none !important;
}

.single-tribe_events .tribe-events-schedule::before {
  content: "📅";
  font-size: 13px;
  margin-right: 2px;
}

.single-tribe_events .tribe-events-schedule .tribe-event-date-start,
.single-tribe_events .tribe-events-schedule .tribe-event-date-end,
.single-tribe_events .tribe-events-schedule abbr {
  color: #1e40af !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-decoration: none !important;
}


/* ============================================================
   6. NỘI DUNG MÔ TẢ — typography
   ============================================================ */

.single-tribe_events .tribe-events-single-event-description {
  font-size: 16.5px !important;
  line-height: 1.75 !important;
  color: #374151 !important;
}

.single-tribe_events .tribe-events-single-event-description h2 {
  color: #001f3f !important;
  font-size: 22px !important;
  font-weight: 850 !important;
  margin: 36px 0 14px 0 !important;
  padding: 10px 16px !important;
  background: #f0f7ff !important;
  border-left: 5px solid #001f3f !important;
  border-radius: 0 10px 10px 0 !important;
  line-height: 1.3 !important;
}

.single-tribe_events .tribe-events-single-event-description h3 {
  color: #001f3f !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  margin: 30px 0 12px 0 !important;
  padding: 0 0 0 12px !important;
  border-left: 4px solid #4facfe !important;
  line-height: 1.3 !important;
  background: none !important;
  border-radius: 0 !important;
}

.single-tribe_events .tribe-events-single-event-description h4 {
  color: #001f3f !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  margin: 22px 0 10px 0 !important;
  padding-left: 10px !important;
  border-left: 3px solid #93c5fd !important;
  line-height: 1.3 !important;
  background: none !important;
}

.single-tribe_events .tribe-events-single-event-description p {
  font-size: 16.5px !important;
  line-height: 1.75 !important;
  color: #374151 !important;
  margin-bottom: 16px !important;
  white-space: normal !important;
}

.single-tribe_events .tribe-events-single-event-description strong {
  color: #001f3f !important;
  font-weight: 800 !important;
}

.single-tribe_events .tribe-events-single-event-description a {
  color: #1d4ed8 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-decoration-thickness: 1px !important;
}

.single-tribe_events .tribe-events-single-event-description a:hover {
  color: #ff6600 !important;
}

@media (max-width: 768px) {
  .single-tribe_events .tribe-events-single-event-description h2 { font-size: 19px !important; }
  .single-tribe_events .tribe-events-single-event-description h3 { font-size: 17px !important; }
  .single-tribe_events .tribe-events-single-event-description p  { font-size: 15.5px !important; }
}


/* ============================================================
   7. FIX UL / LI HÀNG NGANG
   ============================================================ */

.single-tribe_events .tribe-events-single-event-description ul,
.single-tribe_events .tribe-events-single-event-description ol {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  column-count: 1 !important;
  columns: auto !important;
  grid-template-columns: unset !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px !important;
  padding: 18px 18px 18px 50px !important;
  margin: 18px 0 22px 0 !important;
  list-style: none !important;
  gap: 0 !important;
}

.single-tribe_events .tribe-events-single-event-description ul > li,
.single-tribe_events .tribe-events-single-event-description ol > li {
  display: block !important;
  flex: none !important;
  align-self: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  float: none !important;
  clear: both !important;
  position: relative !important;
  padding: 0 0 0 2px !important;
  margin: 0 0 11px 0 !important;
  font-size: 15.5px !important;
  line-height: 1.72 !important;
  color: #1e293b !important;
  font-weight: 500 !important;
  list-style: none !important;
  break-inside: avoid !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.single-tribe_events .tribe-events-single-event-description ul > li:last-child,
.single-tribe_events .tribe-events-single-event-description ol > li:last-child {
  margin-bottom: 0 !important;
}

.single-tribe_events .tribe-events-single-event-description ul > li::before {
  content: "✓" !important;
  position: absolute !important;
  left: -32px !important;
  top: 2px !important;
  color: #10b981 !important;
  font-weight: 900 !important;
  font-size: 15px !important;
}

.single-tribe_events .tribe-events-single-event-description ol {
  counter-reset: vlink-ol !important;
  padding-left: 56px !important;
}

.single-tribe_events .tribe-events-single-event-description ol > li {
  counter-increment: vlink-ol !important;
}

.single-tribe_events .tribe-events-single-event-description ol > li::before {
  content: counter(vlink-ol) !important;
  position: absolute !important;
  left: -40px !important;
  top: 1px !important;
  width: 25px !important;
  height: 25px !important;
  background: #001f3f !important;
  color: #fff !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  flex-shrink: 0 !important;
}

.single-tribe_events .tribe-events-single-event-description ul ul,
.single-tribe_events .tribe-events-single-event-description ol ol,
.single-tribe_events .tribe-events-single-event-description ul ol,
.single-tribe_events .tribe-events-single-event-description ol ul {
  background: transparent !important;
  border: none !important;
  padding: 6px 0 0 22px !important;
  margin: 4px 0 0 0 !important;
}

@media (max-width: 768px) {
  .single-tribe_events .tribe-events-single-event-description ul,
  .single-tribe_events .tribe-events-single-event-description ol {
    padding: 16px 16px 16px 44px !important;
  }
}


/* ============================================================
   8. TABLE  (Thông tin lớp)
   ============================================================ */

.single-tribe_events .tribe-events-single-event-description .overflow-x-auto {
  overflow-x: auto !important;
  margin: 20px 0 !important;
  padding: 0 !important;
  border-radius: 14px !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 2px 10px rgba(0, 8, 20, 0.05) !important;
}

.single-tribe_events .tribe-events-single-event-description table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 0 !important;
  background: #fff !important;
  font-size: 15px !important;
  display: table !important;
}

.single-tribe_events .tribe-events-single-event-description table thead {
  background: linear-gradient(135deg, #001f3f 0%, #0d2b4e 100%) !important;
}

.single-tribe_events .tribe-events-single-event-description table thead th {
  color: #fff !important;
  font-weight: 800 !important;
  padding: 13px 18px !important;
  text-align: left !important;
  font-size: 12.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border: none !important;
}

.single-tribe_events .tribe-events-single-event-description table tbody td {
  padding: 11px 18px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  vertical-align: top !important;
  color: #374151 !important;
  word-break: normal !important;
}

.single-tribe_events .tribe-events-single-event-description table tbody tr:last-child td {
  border-bottom: none !important;
}

.single-tribe_events .tribe-events-single-event-description table tbody tr:nth-child(even) {
  background: #f8fafc !important;
}

.single-tribe_events .tribe-events-single-event-description table tbody tr:hover {
  background: #eff6ff !important;
}

.single-tribe_events .tribe-events-single-event-description table tbody td:first-child {
  font-weight: 700 !important;
  color: #001f3f !important;
  width: 34% !important;
}


/* ============================================================
   9. BUTTON PRIMARY / ALT
   ============================================================ */

.single-tribe_events .tribe-events-single-event-description .button.primary,
.single-tribe_events .tribe-events-single-event-description a.button.primary {
  display: inline-block !important;
  background: linear-gradient(135deg, #001f3f 0%, #0d2b4e 100%) !important;
  color: #fff !important;
  padding: 15px 38px !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: 0 8px 20px rgba(0, 31, 63, 0.2) !important;
  transition: all 0.25s ease !important;
  margin: 14px 0 !important;
  cursor: pointer !important;
}

.single-tribe_events .tribe-events-single-event-description .button.primary:hover {
  transform: translateY(-2px) !important;
  background: linear-gradient(135deg, #ff6600 0%, #e05500 100%) !important;
  box-shadow: 0 12px 28px rgba(0, 31, 63, 0.25) !important;
  color: #fff !important;
}

.single-tribe_events .tribe-events-single-event-description .button.alt,
.single-tribe_events .tribe-events-single-event-description a.button.alt {
  display: inline-block !important;
  background: linear-gradient(135deg, #ff6600 0%, #e05500 100%) !important;
  color: #fff !important;
  padding: 13px 32px !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: 0 6px 18px rgba(255, 102, 0, 0.22) !important;
  transition: all 0.25s ease !important;
  margin: 10px 0 !important;
}

@media (max-width: 768px) {
  .single-tribe_events .tribe-events-single-event-description .button.primary,
  .single-tribe_events .tribe-events-single-event-description a.button.primary {
    width: 100% !important;
    text-align: center !important;
    display: block !important;
  }
}


/* ============================================================
   10. DROPDOWN THÊM VÀO LỊCH
   ============================================================ */

.single-tribe_events .tribe-events-c-subscribe-dropdown__container {
  margin: 24px 0 !important;
}

.single-tribe_events .tribe-common-c-btn-border.tribe-events-c-subscribe-dropdown__button {
  background: #001f3f !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 10px 20px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: background 0.2s ease !important;
}

.single-tribe_events .tribe-events-c-subscribe-dropdown__button-text {
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  padding: 0 !important;
}

.single-tribe_events .tribe-common-c-btn-border.tribe-events-c-subscribe-dropdown__button:hover {
  background: #ff6600 !important;
}

.single-tribe_events .tribe-events-c-subscribe-dropdown__export-icon path,
.single-tribe_events .tribe-events-c-subscribe-dropdown__button-icon path {
  fill: #fff !important;
}

.single-tribe_events .tribe-events-c-subscribe-dropdown__content {
  background: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 36px rgba(0, 8, 20, 0.10) !important;
  border: 1px solid #e2e8f0 !important;
  padding: 6px 0 !important;
  min-width: 180px !important;
}

.single-tribe_events .tribe-events-c-subscribe-dropdown__list-item-link {
  padding: 10px 18px !important;
  display: block !important;
  color: #374151 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  transition: background 0.15s ease !important;
}

.single-tribe_events .tribe-events-c-subscribe-dropdown__list-item-link:hover {
  background: #f8fafc !important;
  color: #001f3f !important;
}


/* ============================================================
   11. META BLOCK
   ============================================================ */

.single-tribe_events .tribe-events-single-section.tribe-events-event-meta {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 24px !important;
  background: #f8fafc !important;
  border: 1px solid #edf0f5 !important;
  border-radius: 18px !important;
  padding: 28px 32px !important;
  margin: 30px 0 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  float: none !important;
  clear: both !important;
}

.single-tribe_events .tribe-events-single-section.tribe-events-event-meta::before,
.single-tribe_events .tribe-events-single-section.tribe-events-event-meta::after {
  display: none !important;
}

.single-tribe_events .tribe-events-single-section.tribe-events-event-meta .tribe-events-meta-group {
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  float: none !important;
  width: auto !important;
}

.single-tribe_events .tribe-events-single-section.tribe-events-event-meta.secondary .tribe-events-venue-map {
  border-radius: 12px !important;
  overflow: hidden !important;
  min-height: 220px !important;
  border: 3px solid #fff !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06) !important;
  align-self: start !important;
}

.single-tribe_events .tribe-events-single-section.tribe-events-event-meta.secondary .tribe-events-venue-map iframe {
  width: 100% !important;
  height: 100% !important;
  min-height: 220px !important;
  display: block !important;
  border: 0 !important;
  filter: grayscale(0.6) !important;
  transition: filter 0.3s ease !important;
}

.single-tribe_events .tribe-events-single-section.tribe-events-event-meta.secondary .tribe-events-venue-map iframe:hover {
  filter: grayscale(0) !important;
}

.single-tribe_events .tribe-events-single-section-title {
  color: #001f3f !important;
  font-weight: 900 !important;
  font-size: 11.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  border-bottom: 2px solid #e2e8f0 !important;
  padding: 0 0 8px 0 !important;
  margin: 0 0 16px 0 !important;
  word-break: keep-all !important;
  white-space: normal !important;
  background: none !important;
  border-left: none !important;
  border-radius: 0 !important;
  border-top: none !important;
  border-right: none !important;
}

.single-tribe_events .tribe-events-event-meta .tribe-events-meta-list {
  display: block !important;
  flex-direction: unset !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  column-count: 1 !important;
  gap: 0 !important;
}

.single-tribe_events .tribe-events-event-meta .tribe-events-meta-item {
  display: block !important;
  flex: none !important;
  width: 100% !important;
  border-bottom: 1px solid #f1f5f9 !important;
  padding: 8px 0 !important;
  margin: 0 !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  background: transparent !important;
}

.single-tribe_events .tribe-events-event-meta .tribe-events-meta-item:last-child {
  border-bottom: none !important;
}

.single-tribe_events .tribe-events-event-meta .tribe-events-meta-item::before {
  display: none !important;
  content: none !important;
}

.single-tribe_events .tribe-events-meta-label {
  display: block !important;
  font-weight: 800 !important;
  color: #000814 !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin-bottom: 2px !important;
  word-break: normal !important;
  white-space: normal !important;
}

.single-tribe_events .tribe-events-meta-value,
.single-tribe_events .tribe-events-address {
  color: #4b5563 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
  hyphens: none !important;
}

.single-tribe_events .tribe-events-meta-value a,
.single-tribe_events .tribe-events-address a,
.single-tribe_events .tribe-events-gmap {
  color: #1d4ed8 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-weight: 600 !important;
}

.single-tribe_events .tribe-events-meta-value a:hover,
.single-tribe_events .tribe-events-address a:hover,
.single-tribe_events .tribe-events-gmap:hover {
  color: #ff6600 !important;
}

@media (max-width: 768px) {
  .single-tribe_events .tribe-events-single-section.tribe-events-event-meta {
    grid-template-columns: 1fr !important;
    padding: 20px !important;
    gap: 18px !important;
  }
}


/* ============================================================
   12. NAVIGATION TRƯỚC / SAU
   ============================================================ */

.single-tribe_events .tribe-events-sub-nav {
  display: flex !important;
  justify-content: space-between !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 24px 0 !important;
  background: transparent !important;
  border: none !important;
  gap: 0 !important;
  flex-direction: row !important;
}

.single-tribe_events .tribe-events-sub-nav::before,
.single-tribe_events .tribe-events-sub-nav::after {
  display: none !important;
}

.single-tribe_events .tribe-events-sub-nav li {
  display: block !important;
  flex: none !important;
  width: auto !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.single-tribe_events .tribe-events-sub-nav li::before {
  display: none !important;
  content: none !important;
}

.single-tribe_events .tribe-events-nav-previous a,
.single-tribe_events .tribe-events-nav-next a {
  display: inline-flex !important;
  align-items: center !important;
  color: #64748b !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  padding: 7px 14px !important;
  background: #f1f5f9 !important;
  border-radius: 8px !important;
  transition: background 0.2s ease, color 0.2s ease !important;
  max-width: 280px !important;
}

.single-tribe_events .tribe-events-nav-previous a:hover,
.single-tribe_events .tribe-events-nav-next a:hover {
  background: #e2e8f0 !important;
  color: #001f3f !important;
}


/* ============================================================
   13. UTILITY CLASSES (dùng trong block Custom HTML)
   ============================================================ */

.single-tribe_events .vlink-cta {
  background: linear-gradient(135deg, #ff6600 0%, #e05500 100%) !important;
  color: #fff !important;
  padding: 22px 26px !important;
  border-radius: 16px !important;
  margin: 26px 0 !important;
  box-shadow: 0 8px 24px rgba(255, 102, 0, 0.18) !important;
}

.single-tribe_events .vlink-cta h2,
.single-tribe_events .vlink-cta h3,
.single-tribe_events .vlink-cta h4 {
  color: #fff !important;
  background: none !important;
  border-left: none !important;
  padding-left: 0 !important;
  margin-top: 0 !important;
}

.single-tribe_events .vlink-cta ul { background: rgba(255,255,255,0.14) !important; border-color: rgba(255,255,255,0.2) !important; }
.single-tribe_events .vlink-cta ul > li,
.single-tribe_events .vlink-cta p   { color: #fff !important; }
.single-tribe_events .vlink-cta ul > li::before { color: #fff !important; }
.single-tribe_events .vlink-cta a   { color: #fff !important; font-weight: 800 !important; }

.single-tribe_events .vlink-callout {
  background: linear-gradient(135deg, #001f3f 0%, #000a1a 100%) !important;
  color: #e2e8f0 !important;
  padding: 22px 26px !important;
  border-radius: 16px !important;
  margin: 26px 0 !important;
}

.single-tribe_events .vlink-callout h2,
.single-tribe_events .vlink-callout h3,
.single-tribe_events .vlink-callout h4 {
  color: #4facfe !important;
  background: none !important;
  border-left: none !important;
  padding-left: 0 !important;
  margin-top: 0 !important;
}

.single-tribe_events .vlink-callout ul  { background: rgba(255,255,255,0.07) !important; border-color: rgba(255,255,255,0.12) !important; }
.single-tribe_events .vlink-callout ul > li,
.single-tribe_events .vlink-callout p   { color: #e2e8f0 !important; }
.single-tribe_events .vlink-callout a   { color: #4facfe !important; }

.single-tribe_events .vlink-softbox {
  background: #fff7ed !important;
  border: 1px solid #fed7aa !important;
  padding: 18px 22px !important;
  border-radius: 14px !important;
  margin: 18px 0 !important;
}

.single-tribe_events .vlink-course-compare {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 18px !important;
  margin: 18px 0 !important;
}

.single-tribe_events .vlink-course-compare > div {
  background: #fff !important;
  border: 2px solid #e2e8f0 !important;
  border-radius: 14px !important;
  padding: 20px !important;
  transition: border-color 0.2s ease !important;
}

.single-tribe_events .vlink-course-compare > div:hover {
  border-color: #4facfe !important;
}

.single-tribe_events .vlink-course-compare h4 {
  margin-top: 0 !important;
  color: #001f3f !important;
  border-left: none !important;
  padding-left: 0 !important;
}

@media (max-width: 640px) {
  .single-tribe_events .vlink-course-compare {
    grid-template-columns: 1fr !important;
  }
}


/* ============================================================
   14. TRANG DANH SÁCH EVENT  (.tribe-events-view--list)
   Scope này chỉ có khi vào trang list, không ảnh hưởng trang khác
   ============================================================ */

.tribe-events-view--list .tribe-events-calendar-list__event-row {
  background: #fff !important;
  border: 1px solid #f1f5f9 !important;
  border-radius: 18px !important;
  margin-bottom: 14px !important;
  padding: 20px 24px !important;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-row:hover {
  transform: translateX(7px) !important;
  border-color: #001f3f !important;
  box-shadow: 10px 0 28px rgba(0, 31, 63, 0.06) !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-title {
  font-size: 17px !important;
  font-weight: 800 !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-title a {
  color: #001f3f !important;
  text-decoration: none !important;
}

.tribe-events-view--list .tribe-events-calendar-list__event-title a:hover {
  color: #ff6600 !important;
}


/* ============================================================
   HẾT FILE — vlink-tribe-events.css v6
   ============================================================ */
