/**
 * Design System Complete Override
 * Override toàn bộ với specificity cao nhất
 * Áp dụng design tokens từ soicau247s.org
 */

/* ============================================
   CRITICAL OVERRIDES - Highest Priority
   ============================================ */

html body {
  font-family: Arial, sans-serif !important;
  color: #1d1d1d !important;
  background-color: #ffffff !important;
  line-height: 1.5 !important;
}

/* Header Override */
body .header,
html body .header {
  background-color: #ffffff !important;
  border-bottom: 1px solid #dee2e6 !important;
}

body .header-logo-img,
html body .header-logo-img {
  max-height: 59px !important;
  height: auto !important;
}

body .header-time,
html body .header-time {
  color: #3e3f42 !important;
  font-size: 15px !important;
  font-family: Arial, sans-serif !important;
}

/* Navigation Override - Màu đỏ chủ đạo */
body .nav_header,
html body .nav_header {
  background: #ed1c24 !important;
}

body .menu_a,
html body .menu_a {
  font-family: Arial, sans-serif !important;
  font-size: 14px !important;
  color: #ffffff !important;
  font-weight: 700 !important;
}

body .menu_a:hover,
body .menu_a.active,
html body .menu_a:hover,
html body .menu_a.active {
  background: #ed1c24 !important;
  color: #ffffff !important;
}

body .nav-bottom-item,
html body .nav-bottom-item {
  color: #000000 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  font-family: Arial, sans-serif !important;
}

body .nav-bottom-item:hover,
html body .nav-bottom-item:hover {
  color: #ed1c24 !important;
}

/* Typography Override */
body h1,
body .h1,
html body h1,
html body .h1 {
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.82 !important;
  color: #1d1d1d !important;
  font-family: Arial, sans-serif !important;
}

body h2,
body .h2,
html body h2,
html body .h2 {
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.69 !important;
  color: #1d1d1d !important;
  font-family: Arial, sans-serif !important;
}

body h3,
body .h3,
html body h3,
html body .h3 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #1d1d1d !important;
  font-family: Arial, sans-serif !important;
}

body p,
body .body-text,
html body p,
html body .body-text {
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: #1d1d1d !important;
  font-family: Arial, sans-serif !important;
}

/* Section Headers */
body .section-header h1,
body .section-header h2,
html body .section-header h1,
html body .section-header h2 {
  font-family: Arial, sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

body .section-header h2 > a,
html body .section-header h2 > a {
  color: #ed1c25 !important;
}

body .section-header h2 > a:hover,
html body .section-header h2 > a:hover {
  color: #004593 !important;
}

body .section-header2 h1,
body .section-header2 h2,
html body .section-header2 h1,
html body .section-header2 h2 {
  font-size: 16px !important;
  font-weight: 700 !important;
  font-family: Arial, sans-serif !important;
}

body .section-header2 h2 > a,
html body .section-header2 h2 > a {
  color: #ed1c25 !important;
}

body .section-header2 h2 > a:hover,
html body .section-header2 h2 > a:hover {
  color: #004593 !important;
}

/* Buttons */
body .btn,
html body .btn {
  font-family: Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border-radius: 3.75px !important;
  transition: all 0.3s ease !important;
}

body .btn-primary,
html body .btn-primary {
  background-color: #ed1c24 !important;
  color: #ffffff !important;
  border-color: #ed1c24 !important;
}

body .btn-primary:hover,
html body .btn-primary:hover {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 2px solid rgb(243, 138, 8) !important;
  box-shadow: rgb(0, 0, 0) 0px 0px 12px !important;
}

body .btn-danger,
body .btn-danger2,
body .btn-danger3,
html body .btn-danger,
html body .btn-danger2,
html body .btn-danger3 {
  background-color: #ed1c25 !important;
  color: #ffffff !important;
  border-radius: 3.75px !important;
}

body .btn-danger:hover,
html body .btn-danger:hover {
  background-color: #d0021b !important;
  opacity: 0.9 !important;
}

/* Links */
body a,
html body a {
  color: #004593 !important;
  transition: color 0.15s ease !important;
}

body a:hover,
html body a:hover {
  color: #cccccc !important;
}

body a.color_red,
body .color_red,
html body a.color_red,
html body .color_red {
  color: #ed1c25 !important;
}

body a.color_red:hover,
html body a.color_red:hover {
  color: #d0021b !important;
}

/* Tables - Kết quả xổ số */
body .table-result th,
body .table-loto th,
html body .table-result th,
html body .table-loto th {
  background-color: #f0f8ff !important;
  font-weight: 500 !important;
  font-family: Arial, sans-serif !important;
}

body .table-result td,
body .table-loto td,
html body .table-result td,
html body .table-loto td {
  border: 1px solid #dee2e6 !important;
  font-family: Arial, sans-serif !important;
}

body .code-DB1,
body .code-DB2,
body .code-DB3,
body .code-DB4,
body .code-DB5,
body .special-prize,
body .prize1,
body .prize2,
body .prize3,
body .prize4,
body .prize5,
body .prize6,
body .prize7,
body .xs_prize1,
body .xs_prize2,
body .xs_prize3,
body .xs_prize4,
body .number_DB,
html body .code-DB1,
html body .code-DB2,
html body .code-DB3,
html body .code-DB4,
html body .code-DB5,
html body .special-prize,
html body .prize1,
html body .prize2,
html body .prize3,
html body .prize4,
html body .prize5,
html body .prize6,
html body .prize7,
html body .xs_prize1,
html body .xs_prize2,
html body .xs_prize3,
html body .xs_prize4,
html body .number_DB {
  color: #ed1c25 !important;
  font-weight: 700 !important;
  font-family: Arial, sans-serif !important;
}

/* Post Titles */
body .post-title,
body .post-title2,
body .article-title,
html body .post-title,
html body .post-title2,
html body .article-title {
  font-family: Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #000000 !important;
}

body .post-title a,
body .post-title2 a,
body .article-title a,
html body .post-title a,
html body .post-title2 a,
html body .article-title a {
  color: #000000 !important;
}

body .post-title a:hover,
body .post-title2 a:hover,
body .article-title a:hover,
html body .post-title a:hover,
html body .post-title2 a:hover,
html body .article-title a:hover {
  color: #ed1c25 !important;
}

/* Widgets */
body .widget-title,
html body .widget-title {
  background: #f0f8ff !important;
  font-family: Arial, sans-serif !important;
  font-weight: 700 !important;
}

body .widget-title h3,
html body .widget-title h3 {
  font-size: 13px !important;
  font-family: Arial, sans-serif !important;
  font-weight: 700 !important;
}

/* Footer */
body .footer,
html body .footer {
  background: #f0f8ff !important;
  border-top: solid 1px #dddfe2 !important;
}

body .footer a,
html body .footer a {
  color: #000000 !important;
}

body .footer a:hover,
html body .footer a:hover {
  color: #ed1c25 !important;
}

/* Sections */
body .section,
html body .section {
  box-shadow: rgba(0, 0, 0, 0.25) 0px 2px 4px 0px !important;
  border-radius: 4px !important;
}

body .section-header,
html body .section-header {
  background: #FFFFFF !important;
  border: solid 1px #dddfe2 !important;
}

body .section-header2,
html body .section-header2 {
  background: #f0f8ff !important;
  border: solid 1px #dddfe2 !important;
}

/* Forms */
body input[type="text"],
body input[type="number"],
body input[type="email"],
body select,
body textarea,
html body input[type="text"],
html body input[type="number"],
html body input[type="email"],
html body select,
html body textarea {
  font-family: Arial, sans-serif !important;
  font-size: 15px !important;
  border: solid 1px #b3b3b3 !important;
  border-radius: 3.75px !important;
}

body input:focus,
body select:focus,
body textarea:focus,
html body input:focus,
html body select:focus,
html body textarea:focus {
  border: solid 1px #007bff !important;
  box-shadow: rgba(0, 123, 255, 0.25) 0px 0px 0px 0.2rem !important;
}

/* Utility Classes */
body .text-danger,
body .danger-color,
html body .text-danger,
html body .danger-color {
  color: #ed1c25 !important;
}

body .color_red,
html body .color_red {
  color: #ed1c25 !important;
}

body .color_blue,
body .primary-color,
html body .color_blue,
html body .primary-color {
  color: #004593 !important;
}

/* Responsive */
@media only screen and (max-width: 960px) {
  body .header-logo-img,
  html body .header-logo-img {
    max-height: 48px !important;
  }
  
  body h1,
  body .h1,
  html body h1,
  html body .h1 {
    font-size: 20px !important;
  }
  
  body h2,
  body .h2,
  html body h2,
  html body .h2 {
    font-size: 18px !important;
  }
}

@media only screen and (max-width: 768px) {
  body h1,
  body .h1,
  html body h1,
  html body .h1 {
    font-size: 18px !important;
  }
  
  body h2,
  body .h2,
  html body h2,
  html body .h2 {
    font-size: 16px !important;
  }
}

