/*
Theme Name: KiotViet J88 Flatsome Child
Theme URI: https://zj88.net/
Description: Flatsome Child Theme chuẩn UX Builder kéo thả cho KiotViet J88
Author: J88 Team
Template: flatsome
Version: 1.0.0
*/

/* ========================================================
   J88 FLATSOME CUSTOM STYLES (THEME CHUẨN UX BUILDER)
   ======================================================== */

:root {
  --primary-color: #cb2320 !important;
  --fs-color-primary: #cb2320 !important;
  --fs-color-alert: #cb2320 !important;
  --fs-color-secondary: #ffb800 !important;
}

/* J88 Floating Animation */
@keyframes j88Float {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-10px) rotate(0.6deg); }
}

.j88-floating-dragon {
  animation: j88Float 3.8s ease-in-out infinite;
  transition: transform 0.3s ease;
}

.j88-floating-dragon:hover {
  transform: scale(1.03) translateY(-6px);
}

/* Header & Nav */
.header-main {
  background: #ffffff !important;
  border-bottom: 1px solid rgba(203, 35, 32, 0.12) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important;
}

/* Topbar Wine Red */
.top-bar {
  background: #7a0000 !important;
  color: #ffffff !important;
  font-size: 13px !important;
}

/* Red Capsule Navigation Bar */
.nav > li > a {
  font-weight: 700 !important;
  color: #1a0505 !important;
  text-transform: uppercase !important;
}

.nav > li.active > a, .nav > li:hover > a {
  color: #cb2320 !important;
}

/* J88 Red Buttons */
.button.alert, .button.primary {
  background: linear-gradient(135deg, #e52d27 0%, #cb2320 100%) !important;
  border-radius: 99px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 15px rgba(203, 35, 32, 0.35) !important;
  border: none !important;
  transition: all 0.25s ease !important;
}

.button.alert:hover, .button.primary:hover {
  background: linear-gradient(135deg, #ff3d3d 0%, #b91c1c 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(203, 35, 32, 0.5) !important;
}

/* Card Styling */
.j88-sol-card {
  border: 1px solid rgba(203, 35, 32, 0.12) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.04) !important;
  transition: all 0.3s ease !important;
  background: #ffffff !important;
}

.j88-sol-card:hover {
  transform: translateY(-5px) !important;
  border-color: #cb2320 !important;
  box-shadow: 0 10px 25px rgba(203, 35, 32, 0.18) !important;
}

/* Footer Vibrant Red */
.footer-wrapper {
  background: #cb2320 !important;
  color: #ffffff !important;
}
.footer-wrapper * {
  color: #ffffff !important;
}
.absolute-footer {
  background: #7a0000 !important;
  color: rgba(255, 255, 255, 0.85) !important;
}