/*----------------------------------------------------
  Custom site styles
----------------------------------------------------*/

/* Wrapper for page content: margins, padding, optional scrolling */
.page-body {
    margin: 80px 240px 60px 240px;
    padding: 0 100px 100px;
    overflow-y: auto;
  }
  
  /*----------------------------------------------------
    Owl Carousel overrides
  ----------------------------------------------------*/
  .owl-carousel .item {
    font-size: 24px;
    text-align: center;
    margin-top: 20px;
    transition: transform .5s ease;
  }
  .owl-carousel .item:hover {
    transform: scale(1.1);
  }
  .owl-prev, .owl-next {
    font-size: 24px;
    font-weight: bold;
  }
  .owl-prev { float: left; }
  .owl-next { float: right; }
  
  /*----------------------------------------------------
    Background gradients
  ----------------------------------------------------*/
  /* "Buttermilk" card style */
  .bg-gradient-buttermilk {
    background: linear-gradient(#fff7ef, #fff);
    border: 1px solid #efe8e1;
    padding: 50px 40px 20px;
  }
  
  /* Soft purple-tint background */
  .bg-light-gradient {
    background: linear-gradient(rgba(110, 69, 143, 0.1), #fff);
  }
  
  /* Soft blue-tint background */
  .bg-primary-gradient {
    background: linear-gradient(rgba(10, 77, 123, 0.1), #fff);
  }
  
  /*----------------------------------------------------
    Responsive images
  ----------------------------------------------------*/
  .goodnessseccont img {
    width: 100%;
    height: auto;
    display: block;
  }
  
  /*----------------------------------------------------
    Text utility
  ----------------------------------------------------*/
  .mlkpro {
    color: #636362;
    font-size: 22px;
    line-height: 1.2;
    margin: 0 auto 15px;
    text-align: center;
    max-width: 600px;
  }
  
  /*----------------------------------------------------
    Styled tables (e.g. device lists)
  ----------------------------------------------------*/
  .table-smoke {
    border-collapse: collapse;
    width: 100%;
  }
  .table-smoke th,
  .table-smoke td {
    border: 1px solid #111;
    padding: 6px;
  }
  .table-smoke th {
    background-color: #04AA6D;
    color: #fff;
    text-align: left;
  }
  .table-smoke tr:nth-child(even) {
    background-color: #f2f2f2;
  }
  .table-smoke tr:hover {
    background-color: #ddd;
  }
  
  /*----------------------------------------------------
    Form error flashes
  ----------------------------------------------------*/
  ul li.error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
    padding: 10px;
    margin: 10px 0;
    border-radius: 5px;
    font-weight: bold;
    animation: blink 1s step-start infinite;
  }
  @keyframes blink {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0; }
  }
  
  /*----------------------------------------------------
    Custom checkbox styles
  /* 1. Override kích thước */
  .big-checkbox {
    width: 1.5rem !important;
    height: 1.5rem !important;
  }

  /* 2. Override màu nền và viền khi checked */
  .big-checkbox:checked {
    background-color: #dc3545 !important;  /* màu đỏ đậm */
    border-color:     #dc3545 !important;
  }

  /* 3. Override màu dấu tick (Chrome/Firefox mới) */
  .big-checkbox {
    accent-color: #dc3545 !important;
  }

  /* 4. (Nếu muốn viền dày hơn cả khi unchecked) */
  .big-checkbox {
    border: 2px solid #dc3545 !important;
    border-radius: 0.25rem !important;
    background-color: transparent !important;
  }

  /* 5. Bỏ shadow mặc định nếu có */
  .big-checkbox:focus {
    box-shadow: none !important;
  }