/* ============================================================
   EMBARQUE DASHBOARD — Modern UI Redesign
   Tema: Clean Corporate — Glass + Flat Hybrid
   Cobertura: Dashboard, Settings, Bookings, Wishlist, Inbox,
              Hotel/Tour/Activity/Car/Rental, Verifications

   Base: .page-wrapper.chiller-theme (wrapper único do dashboard)
   ============================================================ */

:root {
  --emb-primary: #4F46E5;
  --emb-primary-light: #6366F1;
  --emb-secondary: #0EA5E9;
  --emb-success: #10B981;
  --emb-warning: #F59E0B;
  --emb-danger: #EF4444;
  --emb-dark: #0F172A;
  --emb-gray-50: #F8FAFC;
  --emb-gray-100: #F1F5F9;
  --emb-gray-200: #E2E8F0;
  --emb-gray-300: #CBD5E1;
  --emb-gray-400: #94A3B8;
  --emb-gray-500: #64748B;
  --emb-gray-600: #475569;
  --emb-gray-700: #334155;
  --emb-shadow-sm: 0 1px 2px rgba(15,23,42,0.06);
  --emb-shadow: 0 1px 3px rgba(15,23,42,0.08), 0 1px 2px rgba(15,23,42,0.06);
  --emb-shadow-md: 0 4px 6px rgba(15,23,42,0.07), 0 2px 4px rgba(15,23,42,0.06);
  --emb-shadow-lg: 0 10px 15px rgba(15,23,42,0.08), 0 4px 6px rgba(15,23,42,0.05);
  --emb-radius: 12px;
  --emb-radius-sm: 8px;
  --emb-radius-xs: 6px;
}

/* Shorthand macro — all rules scoped under .page-wrapper.chiller-theme */

/* ============================================================
   1. PAGE CONTENT — Layout Base
   ============================================================ */
.page-wrapper.chiller-theme main.page-content {
  background: #F1F5F9 !important;
  min-height: 100vh;
  padding: 28px 32px !important;
}
.page-wrapper.chiller-theme .st_content { max-width: 1280px; margin: 0 auto; }
.page-wrapper.chiller-theme .st_content > * { animation: embFadeIn 0.4s ease; }

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

/* ============================================================
   2. PAGE TITLES
   ============================================================ */
.page-wrapper.chiller-theme .partner-page-title,
.page-wrapper.chiller-theme .st-create h2,
.page-wrapper.chiller-theme .st_content h1,
.page-wrapper.chiller-theme .st_content h3.st_tab_header {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--emb-dark) !important;
  letter-spacing: -0.3px;
  margin-bottom: 4px !important;
}
.page-wrapper.chiller-theme .st_content h4 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--emb-gray-700) !important;
  margin-bottom: 12px !important;
}

/* ============================================================
   3. DASHBOARD — Stats Cards (top row: Month / Balance / Earning)
   ============================================================ */
.page-wrapper.chiller-theme .row[style*="margin-top: 30px"]:first-of-type {
  /* This is the top stats row — DESTE MÊS + SEU SALDO + LUCRO */
  margin-top: 10px !important; /* override inline 30px */
}

.page-wrapper.chiller-theme .item-st-month {
  margin-bottom: 24px;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new {
  background: linear-gradient(135deg, #ffffff 0%, #F8FAFC 100%) !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow-md) !important;
  border: 1px solid var(--emb-gray-200) !important;
  padding: 28px 32px !important;
  /* IMPORTANT: Keep min-height so .st-wrap-box absolute centering works */
  min-height: 154px !important;
  position: relative !important;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new::before {
  /* Animated gradient bar at the top */
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  border-radius: var(--emb-radius) var(--emb-radius) 0 0;
  transition: height 0.3s ease;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new:hover::before {
  height: 6px;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new:hover {
  box-shadow: 0 12px 28px rgba(15,23,42,0.1), 0 4px 8px rgba(15,23,42,0.05) !important;
  transform: translateY(-3px) !important;
  border-color: var(--emb-gray-300) !important;
}

/* Colored top bars per card */
.page-wrapper.chiller-theme .st-month-1::before {
  background: linear-gradient(90deg, #4F46E5, #818CF8) !important;
}
.page-wrapper.chiller-theme .st-month-2::before {
  background: linear-gradient(90deg, #0EA5E9, #38BDF8) !important;
}
.page-wrapper.chiller-theme .st-month-3::before {
  background: linear-gradient(90deg, #10B981, #34D399) !important;
}

/* Fix .st-wrap-box absolute centering (original Traveler uses position:absolute translate) */
.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new .st-wrap-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% - 64px);
  text-align: center;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new .title {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--emb-gray-400) !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  margin-bottom: 10px !important;
  text-align: center !important;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new .details {
  text-align: center !important;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.st-dashboard-new .details .number {
  font-size: 40px !important;
  font-weight: 800 !important;
  color: var(--emb-dark) !important;
  letter-spacing: -1px !important;
  line-height: 1.1 !important;
  text-align: center !important;
}

/* ============================================================
   3b. HEADER DASHBOARD — Sales per service (blue/green/yellow cards)
   ============================================================ */
.page-wrapper.chiller-theme .item-st-month.padding-15 {
  padding: 0 15px !important;
}

/* The full-width header bar "Sales Earning ... for each service" */
.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.head_reports.bg-warning {
  background: linear-gradient(135deg, #1E293B 0%, #0F172A 100%) !important;
  border-radius: var(--emb-radius) var(--emb-radius) 0 0 !important;
  min-height: auto !important;
  padding: 20px 32px !important;
  margin-bottom: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.head_reports.bg-warning .head_control {
  margin-bottom: 0 !important;
}

.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.head_reports .head_time span {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #E2E8F0 !important;
  text-transform: none !important;
  letter-spacing: 0.3px !important;
  font-family: inherit !important;
}

/* The service cards row container (Hotel, Room, Tour, etc.) */
.page-wrapper.chiller-theme .item-st-month .st-dashboard-stat.head_reports.list-st {
  background: #fff !important;
  border-radius: 0 0 var(--emb-radius) var(--emb-radius) !important;
  box-shadow: var(--emb-shadow-md) !important;
  border: 1px solid var(--emb-gray-200) !important;
  border-top: none !important;
  padding: 24px 17px !important;
  min-height: auto !important;
  display: flex !important;
  flex-wrap: wrap !important;
}

/* Service cards (Hotel, Room, Tour, Activity, Rental, Car) */
.page-wrapper.chiller-theme .st-bg-dashboard {
  padding: 8px !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single {
  border-radius: var(--emb-radius-sm) !important;
  box-shadow: var(--emb-shadow-sm) !important;
  border: 1px solid var(--emb-gray-200) !important;
  transition: all 0.3s ease !important;
  overflow: hidden !important;
  background: transparent !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single:hover {
  box-shadow: var(--emb-shadow-md) !important;
  transform: translateY(-2px) !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading {
  padding: 20px 16px !important;
  min-height: 120px !important;
  display: flex !important;
  align-items: center !important;
  border-radius: var(--emb-radius-sm) !important;
  background: #fff !important;
  border-left: 4px solid var(--emb-primary) !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Accent borders for each service type */
.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading {
  border-left-color: var(--emb-primary) !important; /* Hotel default */
}
.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading.red-st {
  border-left-color: var(--emb-secondary) !important; /* Room */
}
.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading.green-st {
  border-left-color: var(--emb-success) !important; /* Tour */
}
.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading.st-yellow {
  border-left-color: var(--emb-warning) !important; /* Activity */
}
.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading.turquoise-st {
  border-left-color: #06B6D4 !important; /* Rental */
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .row {
  width: 100% !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .title {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  color: var(--emb-gray-400) !important;
  margin-bottom: 6px !important;
  font-family: inherit !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .huge {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: var(--emb-dark) !important;
  letter-spacing: -0.5px !important;
  margin-bottom: 10px !important;
  font-family: inherit !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .st_view {
  position: absolute !important;
  bottom: 0 !important;
  right: 0 !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .st_view a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: var(--emb-radius-sm) 0 var(--emb-radius-sm) 0 !important;
  background: var(--emb-gray-100) !important;
  transition: all 0.25s ease !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .st_view a:hover {
  background: var(--emb-primary) !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .st_view a img {
  width: 12px !important;
  height: 12px !important;
  opacity: 0.5 !important;
  transition: opacity 0.2s ease !important;
}

.page-wrapper.chiller-theme .st-bg-dashboard .panel-single .panel-heading .st_view a:hover img {
  opacity: 1 !important;
  filter: brightness(10) !important;
}

/* ============================================================
   4. SETTINGS — Forms & Tabs
   ============================================================ */
.page-wrapper.chiller-theme .infor-st-setting {
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
  padding: 28px !important;
  margin-bottom: 20px !important;
}
.page-wrapper.chiller-theme .infor-st-setting .nav-tabs {
  border-bottom: 2px solid var(--emb-gray-200) !important;
  margin-bottom: 24px !important;
  display: flex !important;
  gap: 4px !important;
}
.page-wrapper.chiller-theme .infor-st-setting .nav-tabs li { margin-bottom: -2px !important; }
.page-wrapper.chiller-theme .infor-st-setting .nav-tabs li a {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--emb-gray-500) !important;
  padding: 12px 20px !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  transition: all 0.2s ease !important;
  background: transparent !important;
}
.page-wrapper.chiller-theme .infor-st-setting .nav-tabs li a:hover {
  color: var(--emb-primary) !important;
  border-bottom-color: var(--emb-gray-300) !important;
  background: var(--emb-gray-50) !important;
}
.page-wrapper.chiller-theme .infor-st-setting .nav-tabs li.active a {
  color: var(--emb-primary) !important;
  border-bottom-color: var(--emb-primary) !important;
  font-weight: 600 !important;
}
.page-wrapper.chiller-theme .infor-st-setting .form-group { margin-bottom: 20px !important; }
.page-wrapper.chiller-theme .infor-st-setting .form-group label:not(.i-check):not(.i-radio),
.page-wrapper.chiller-theme .st-create .form-group label:not(.i-check):not(.i-radio),
.page-wrapper.chiller-theme .booking-meta .form-group label:not(.i-check):not(.i-radio),
.page-wrapper.chiller-theme .st_content label.st-form-label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--emb-gray-700) !important;
  margin-bottom: 6px !important;
  display: block !important;
}
/* Inputs globais */
.page-wrapper.chiller-theme .form-group input[type="text"],
.page-wrapper.chiller-theme .form-group input[type="email"],
.page-wrapper.chiller-theme .form-group input[type="password"],
.page-wrapper.chiller-theme .form-group input[type="number"],
.page-wrapper.chiller-theme .form-group input[type="url"],
.page-wrapper.chiller-theme .form-group textarea,
.page-wrapper.chiller-theme .form-group select {
  width: 100% !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  border: 1.5px solid var(--emb-gray-300) !important;
  border-radius: var(--emb-radius-sm) !important;
  background: #fff !important;
  color: var(--emb-dark) !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}
.page-wrapper.chiller-theme .form-group input:focus,
.page-wrapper.chiller-theme .form-group textarea:focus,
.page-wrapper.chiller-theme .form-group select:focus {
  outline: none !important;
  border-color: var(--emb-primary) !important;
  box-shadow: 0 0 0 3px rgba(79,70,229,0.1) !important;
}

/* Checkbox & Radio */
.page-wrapper.chiller-theme .i-check,
.page-wrapper.chiller-theme .i-radio {
  width: 20px !important;
  height: 20px !important;
  border-radius: 4px !important;
  border: 2px solid var(--emb-gray-300) !important;
  background: #fff !important;
  transition: all 0.2s ease !important;
}
.page-wrapper.chiller-theme .i-check.checked,
.page-wrapper.chiller-theme .i-radio.checked {
  background: var(--emb-primary) !important;
  border-color: var(--emb-primary) !important;
}

/* ============================================================
   5. BUTTONS — Global
   ============================================================ */
.page-wrapper.chiller-theme .btn-primary,
.page-wrapper.chiller-theme .btn-default.pull-right,
.page-wrapper.chiller-theme .st_button_send_mail,
.page-wrapper.chiller-theme input[name="st_btn_update"],
.page-wrapper.chiller-theme input[name="btn_update_pass"] {
  background: var(--emb-primary) !important;
  border: none !important;
  color: #fff !important;
  padding: 10px 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: var(--emb-radius-sm) !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 1px 3px rgba(79,70,229,0.3) !important;
  letter-spacing: 0.2px !important;
}
.page-wrapper.chiller-theme .btn-primary:hover,
.page-wrapper.chiller-theme .btn-default.pull-right:hover {
  background: var(--emb-primary-light) !important;
  box-shadow: 0 4px 12px rgba(79,70,229,0.4) !important;
  transform: translateY(-1px) !important;
}
.page-wrapper.chiller-theme .btn-success { background: var(--emb-success) !important; border-color: var(--emb-success) !important; color: #fff !important; }
.page-wrapper.chiller-theme .btn-success:hover { background: #059669 !important; border-color: #059669 !important; }
.page-wrapper.chiller-theme .btn-info,
.page-wrapper.chiller-theme .btn-info-booking {
  background: var(--emb-secondary) !important;
  border-color: var(--emb-secondary) !important;
  color: #fff !important;
}
.page-wrapper.chiller-theme .btn-warning,
.page-wrapper.chiller-theme .btn-danger {
  border-radius: var(--emb-radius-sm) !important;
}
.page-wrapper.chiller-theme .btn-sm,
.page-wrapper.chiller-theme .btn-xs {
  padding: 6px 14px !important;
  font-size: 12px !important;
  border-radius: var(--emb-radius-xs) !important;
}

/* ============================================================
   6. BOOKING HISTORY — Table
   ============================================================ */
.page-wrapper.chiller-theme table.table-booking-history,
.page-wrapper.chiller-theme #data_history_book table,
.page-wrapper.chiller-theme .infor-st-setting table.table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
}
.page-wrapper.chiller-theme table.table-booking-history thead th,
.page-wrapper.chiller-theme #data_history_book thead th {
  background: var(--emb-gray-50) !important;
  color: var(--emb-gray-600) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  padding: 14px 16px !important;
  border-bottom: 2px solid var(--emb-gray-200) !important;
  border-right: 1px solid var(--emb-gray-100) !important;
}
.page-wrapper.chiller-theme table.table-booking-history tbody td,
.page-wrapper.chiller-theme #data_history_book tbody td {
  padding: 14px 16px !important;
  font-size: 13px !important;
  color: var(--emb-gray-700) !important;
  border-bottom: 1px solid var(--emb-gray-100) !important;
  border-right: 1px solid var(--emb-gray-100) !important;
  vertical-align: middle !important;
}
.page-wrapper.chiller-theme table.table-booking-history tbody tr:hover td,
.page-wrapper.chiller-theme #data_history_book tbody tr:hover td {
  background: var(--emb-gray-50) !important;
}
.page-wrapper.chiller-theme table.table-booking-history tbody tr:last-child td { border-bottom: none !important; }
.page-wrapper.chiller-theme .booking-history-type i {
  font-size: 22px !important;
  color: var(--emb-primary) !important;
}

/* ============================================================
   7. SERVICE LIST CARDS — Hotel/Tour/Activity/Car/Rental
   ============================================================ */
.page-wrapper.chiller-theme .st_content .style-list .item-service {
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
  transition: all 0.3s ease !important;
  overflow: hidden !important;
  margin-bottom: 16px !important;
}
.page-wrapper.chiller-theme .st_content .style-list .item-service:hover {
  box-shadow: var(--emb-shadow-md) !important;
  border-color: var(--emb-primary-light) !important;
  transform: translateY(-2px) !important;
}
.page-wrapper.chiller-theme .st_content .style-list .item-service .service-title a {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--emb-dark) !important;
  transition: color 0.2s ease !important;
}
.page-wrapper.chiller-theme .st_content .style-list .item-service .service-title a:hover {
  color: var(--emb-primary) !important;
}
.page-wrapper.chiller-theme .st_content .style-list .item-service .section-footer .service-price .price {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--emb-primary) !important;
}
.page-wrapper.chiller-theme .st_content .style-list .item-service .thumb {
  border-radius: var(--emb-radius-sm) !important;
  overflow: hidden !important;
}

/* ============================================================
   8. WISHLIST
   ============================================================ */
.page-wrapper.chiller-theme .st_content #data_whislist h1 {
  font-size: 22px !important;
  font-weight: 700 !important;
}
.page-wrapper.chiller-theme .st_content .style-list .booking-item-wishlist-remove {
  width: 32px !important;
  height: 32px !important;
  line-height: 32px !important;
  text-align: center !important;
  border-radius: 50% !important;
  background: rgba(239,68,68,0.1) !important;
  color: var(--emb-danger) !important;
  transition: all 0.2s ease !important;
}
.page-wrapper.chiller-theme .st_content .style-list .booking-item-wishlist-remove:hover {
  background: var(--emb-danger) !important;
  color: #fff !important;
}

/* ============================================================
   9. INBOX — Messages
   ============================================================ */
.page-wrapper.chiller-theme .inbox-list-message .message-item {
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
  padding: 16px !important;
  margin-bottom: 12px !important;
  transition: all 0.25s ease !important;
  cursor: pointer !important;
}
.page-wrapper.chiller-theme .inbox-list-message .message-item:hover {
  border-color: var(--emb-primary-light) !important;
  box-shadow: var(--emb-shadow-md) !important;
}
.page-wrapper.chiller-theme .inbox-list-message .message-item .user-avatar img {
  border-radius: 50% !important;
  border: 2px solid var(--emb-gray-200) !important;
}
.page-wrapper.chiller-theme .inbox-list-message .message-item .btn_remove_message {
  width: 28px !important;
  height: 28px !important;
  line-height: 28px !important;
  text-align: center !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--emb-gray-400) !important;
  transition: all 0.2s ease !important;
}
.page-wrapper.chiller-theme .inbox-list-message .message-item .btn_remove_message:hover {
  background: rgba(239,68,68,0.1) !important;
  color: var(--emb-danger) !important;
}
.page-wrapper.chiller-theme .inbox-list-message .message-item .booking-item-wishlist-title {
  font-weight: 600 !important;
  color: var(--emb-dark) !important;
}
.page-wrapper.chiller-theme .st-inbox-body-detail {
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
  padding: 24px !important;
}
.page-wrapper.chiller-theme .st-inbox-body-detail .message-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--emb-dark) !important;
}

/* ============================================================
   10. CREATE/EDIT FORMS — All service types
   ============================================================ */
.page-wrapper.chiller-theme .st-create {
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
  padding: 28px !important;
  margin-bottom: 20px !important;
}
.page-wrapper.chiller-theme .st-create .st-form-group-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--emb-dark) !important;
  padding-bottom: 12px !important;
  margin-bottom: 20px !important;
  border-bottom: 1px solid var(--emb-gray-200) !important;
  letter-spacing: -0.2px !important;
}

/* ============================================================
   11. VERIFICATIONS
   ============================================================ */
.page-wrapper.chiller-theme .st-create span.verify-status {
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  display: inline-block !important;
}
.page-wrapper.chiller-theme .st-create span.verify-status.none {
  background: #FEF3C7 !important;
  color: #92400E !important;
}
.page-wrapper.chiller-theme .passport-photo .passport-photo-item {
  border-radius: var(--emb-radius-sm) !important;
  border: 2px dashed var(--emb-gray-300) !important;
  background: var(--emb-gray-50) !important;
  transition: all 0.2s ease !important;
}
.page-wrapper.chiller-theme .passport-photo .passport-photo-item:hover {
  border-color: var(--emb-primary-light) !important;
  background: rgba(79,70,229,0.04) !important;
}

/* ============================================================
   12. PAGINATION
   ============================================================ */
.page-wrapper.chiller-theme .loop-pagination.pagination .page-numbers {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: var(--emb-radius-xs) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--emb-gray-600) !important;
  background: #fff !important;
  border: 1px solid var(--emb-gray-200) !important;
  margin: 0 3px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}
.page-wrapper.chiller-theme .loop-pagination.pagination .page-numbers.current {
  background: var(--emb-primary) !important;
  color: #fff !important;
  border-color: var(--emb-primary) !important;
  font-weight: 600 !important;
}
.page-wrapper.chiller-theme .loop-pagination.pagination .page-numbers:hover:not(.current):not(.dots) {
  border-color: var(--emb-primary-light) !important;
  color: var(--emb-primary) !important;
  background: rgba(79,70,229,0.05) !important;
}

/* ============================================================
   13. SEARCH / FILTER BAR
   ============================================================ */
.page-wrapper.chiller-theme .partner-search-form {
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
  padding: 16px !important;
  margin-bottom: 20px !important;
}

/* ============================================================
   14. HEADER FILTERS & CHART AREA — Date pickers, time tabs, chart headers
   ============================================================ */
/* Chart section header bar (All Time, This Month, etc.) */
.page-wrapper.chiller-theme .st_div_canvas {
  margin-top: 30px;
}

.page-wrapper.chiller-theme .st_div_canvas .head_reports.bg-green {
  background: linear-gradient(135deg, #1E293B 0%, #0F172A 100%) !important;
  border-radius: var(--emb-radius) var(--emb-radius) 0 0 !important;
  padding: 18px 28px !important;
  min-height: auto !important;
  display: block !important;
  width: 100% !important;
}

.page-wrapper.chiller-theme .st_div_canvas .head_reports.bg-green .head_control {
  margin-bottom: 0 !important;
}

.page-wrapper.chiller-theme .head_time.bc_all_time {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #E2E8F0 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

/* Chart canvas wrapper */
.page-wrapper.chiller-theme .st_div_item_canvas_year,
.page-wrapper.chiller-theme .st_div_item_canvas_month {
  background: #fff !important;
  border: 1px solid var(--emb-gray-200) !important;
  border-top: none !important;
  border-radius: 0 0 var(--emb-radius) var(--emb-radius) !important;
  padding: 24px !important;
  box-shadow: var(--emb-shadow) !important;
}

/* Time filter tabs — ALL TIME, YEAR, MONTH pills */
.page-wrapper.chiller-theme .head_time.bc_all_time span,
.page-wrapper.chiller-theme .head_time.bc_single span {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--emb-gray-500) !important;
  padding: 8px 16px !important;
  border-radius: 20px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  margin-right: 4px !important;
}
.page-wrapper.chiller-theme .head_time.bc_all_time span:hover,
.page-wrapper.chiller-theme .head_time.bc_single span:hover {
  background: var(--emb-gray-100) !important;
}
.page-wrapper.chiller-theme .head_time.bc_all_time span.active,
.page-wrapper.chiller-theme .head_time.bc_single span.active {
  background: var(--emb-primary) !important;
  color: #fff !important;
  font-weight: 600 !important;
}

/* Details table under chart */
.page-wrapper.chiller-theme .st_bortlet.box {
  background: #fff !important;
  border-radius: var(--emb-radius) !important;
  box-shadow: var(--emb-shadow) !important;
  border: 1px solid var(--emb-gray-200) !important;
  margin-top: 20px !important;
  overflow: hidden !important;
}

.page-wrapper.chiller-theme .st_bortlet-title {
  padding: 16px 24px !important;
  background: var(--emb-gray-50) !important;
  border-bottom: 1px solid var(--emb-gray-200) !important;
}

.page-wrapper.chiller-theme .st_bortlet-title .caption {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--emb-dark) !important;
}

.page-wrapper.chiller-theme .st_bortlet-body {
  padding: 16px 24px !important;
}

/* Year links inside the details table */
.page-wrapper.chiller-theme .btn_all_time_show_month_by_year {
  color: var(--emb-primary) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.page-wrapper.chiller-theme .btn_all_time_show_month_by_year:hover {
  color: var(--emb-primary-light) !important;
}

/* ============================================================
   15. ALERT BOXES
   ============================================================ */
.page-wrapper.chiller-theme .alert-user-package.user-alert {
  background: linear-gradient(135deg, #FEF3C7, #FDE68A) !important;
  border: 1px solid #FCD34D !important;
  border-radius: var(--emb-radius) !important;
  color: #92400E !important;
  padding: 16px 20px !important;
  margin-top: 20px !important;
  font-weight: 500 !important;
}

/* Chart details table */
.page-wrapper.chiller-theme .st_bortlet-body table.st_table_partner {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.page-wrapper.chiller-theme .st_bortlet-body table.st_table_partner thead th {
  background: var(--emb-gray-50) !important;
  color: var(--emb-gray-600) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  padding: 12px 16px !important;
  border-bottom: 2px solid var(--emb-gray-200) !important;
}

.page-wrapper.chiller-theme .st_bortlet-body table.st_table_partner tbody td {
  padding: 12px 16px !important;
  font-size: 13px !important;
  color: var(--emb-gray-700) !important;
  border-bottom: 1px solid var(--emb-gray-100) !important;
  vertical-align: middle !important;
}

.page-wrapper.chiller-theme .st_bortlet-body table.st_table_partner tbody tr:hover td {
  background: var(--emb-gray-50) !important;
}

/* ============================================================
   16. SELECT2
   ============================================================ */
.page-wrapper.chiller-theme .select2-container .select2-selection--single {
  height: 42px !important;
  padding: 8px 14px !important;
  border: 1.5px solid var(--emb-gray-300) !important;
  border-radius: var(--emb-radius-sm) !important;
  background: #fff !important;
}
.page-wrapper.chiller-theme .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 40px !important;
}

/* ============================================================
   17. BADGES / STATUS TAGS
   ============================================================ */
.page-wrapper.chiller-theme .badge {
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 4px 12px !important;
  border-radius: 20px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
}

/* ============================================================
   18. WITHDRAWAL
   ============================================================ */
.page-wrapper.chiller-theme .st_content .btn_load_his_withdrawal {
  background: var(--emb-primary) !important;
  color: #fff !important;
  border: none !important;
  padding: 10px 20px !important;
  border-radius: var(--emb-radius-sm) !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
}

/* ============================================================
   19. FOOTER
   ============================================================ */
.page-wrapper.chiller-theme .st-footer-wrap {
  margin-top: 32px !important;
  padding: 16px 0 !important;
  color: var(--emb-gray-400) !important;
  font-size: 12px !important;
  border-top: 1px solid var(--emb-gray-200) !important;
}

/* ============================================================
   20. MAP CONTAINER
   ============================================================ */
.page-wrapper.chiller-theme .st_mapbox_custom {
  position: relative !important;
  min-height: 200px !important;
  border-radius: var(--emb-radius) !important;
  overflow: hidden !important;
  border: 1px solid var(--emb-gray-200) !important;
  box-shadow: var(--emb-shadow) !important;
  background: var(--emb-gray-100) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ============================================================
   21. RESPONSIVE
   ============================================================ */
@media (max-width: 768px) {
  .page-wrapper.chiller-theme main.page-content { padding: 16px !important; }
  .page-wrapper.chiller-theme .st_content { max-width: 100%; }
  .page-wrapper.chiller-theme .infor-st-setting,
  .page-wrapper.chiller-theme .st-create { padding: 16px !important; }
  .page-wrapper.chiller-theme table.table-booking-history { font-size: 12px !important; }
}

/* ============================================================
   22. SCROLLBAR
   ============================================================ */
.page-wrapper.chiller-theme main.page-content::-webkit-scrollbar { width: 6px !important; }
.page-wrapper.chiller-theme main.page-content::-webkit-scrollbar-track { background: transparent !important; }
.page-wrapper.chiller-theme main.page-content::-webkit-scrollbar-thumb {
  background: var(--emb-gray-300) !important;
  border-radius: 3px !important;
}
.page-wrapper.chiller-theme main.page-content::-webkit-scrollbar-thumb:hover {
  background: var(--emb-gray-400) !important;
}