/* Tách từ app.R — box info, fileInput, DT, scrollbar, download */

      .box.box-solid.box-info {
        border-top-color: #d3d3d3 !important;
        border-left-color: #d3d3d3 !important;
        border-right-color: #d3d3d3 !important;
        border-bottom-color: #d3d3d3 !important;
      }
      
      .box.box-solid.box-info > .box-header {
        background-color: #d3d3d3 !important;
        border-bottom-color: #d3d3d3 !important;
      }
      
      .box.box-solid.box-info > .box-header .box-title {
        color: #333 !important;
      }
      
      .box.box-solid.box-info > .box-header .box-tools button,
      .box.box-solid.box-info > .box-header .box-tools a {
        background-color: #d3d3d3 !important;
        border-color: #d3d3d3 !important;
        color: #333 !important;
      }
      
      .box.box-solid.box-info > .box-header .box-tools button:hover,
      .box.box-solid.box-info > .box-header .box-tools a:hover {
        background-color: #c0c0c0 !important;
        border-color: #c0c0c0 !important;
      }
      
      .box.box-solid.box-info > .box-header .box-tools button i,
      .box.box-solid.box-info > .box-header .box-tools a i,
      .box.box-solid.box-info > .box-header .box-tools button:before,
      .box.box-solid.box-info > .box-header .box-tools a:before {
        color: #ffffff !important;
      }
      
      .box.box-solid.box-info > .box-header .box-tools .fa-plus,
      .box.box-solid.box-info > .box-header .box-tools .fa-minus {
        color: #ffffff !important;
      }
      
      /* ========== STYLING CHO BOX TITLE ========== */
      /* Chuyển tất cả box title thành chữ in hoa, không in đậm, font giống tab chính, căn giữa */
      .box .box-header,
      .box .box-header .box-title {
        text-align: center !important;
      }
      
      .box .box-title {
        text-transform: uppercase !important;
        font-weight: 400 !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
        font-size: 14px !important;
        letter-spacing: 0.5px !important;
        text-align: center !important;
        display: block !important;
        width: 100% !important;
      }
      
      /* ========== STYLING CHO TẤT CẢ CHỮ TRONG PHẦN THỐNG KÊ CƠ BẢN ========== */
      /* Áp dụng font chữ giống box title cho tất cả phần tử trong descriptive_view */
      #descriptive_view,
      #descriptive_view * {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
      }
      
      /* Giữ nguyên font-weight cho các phần tử cụ thể */
      #descriptive_view strong,
      #descriptive_view b {
        font-weight: 600 !important;
      }
      
      #descriptive_view h1, #descriptive_view h2, #descriptive_view h3,
      #descriptive_view h4, #descriptive_view h5, #descriptive_view h6 {
        font-weight: 600 !important;
      }
      
      /* CSS cho thông báo Upload complete - màu giống title TẢI DỮ LIỆU */
      .shiny-notification {
        background-color: #514945 !important;
        color: #ffffff !important;
        border: none !important;
        box-shadow: 0 2px 8px rgba(81, 73, 69, 0.3) !important;
      }
      
      .shiny-notification-message {
        background-color: #514945 !important;
        color: #ffffff !important;
      }
      
      .shiny-notification-success {
        background-color: #514945 !important;
        color: #ffffff !important;
      }
      
      /* CSS cho fileInput progress bar và complete message */
      .sh-file-input-progress {
        background-color: #514945 !important;
      }
      
      .sh-file-input-progress .progress-bar {
        background-color: #514945 !important;
      }
      
      .sh-file-input-progress .progress-bar-success {
        background-color: #514945 !important;
      }
      
      .sh-file-input-progress .progress-bar-info {
        background-color: #514945 !important;
      }
      
      /* CSS cho thông báo complete trong fileInput */
      .sh-file-input-progress .progress-text,
      .sh-file-input-progress .progress-complete {
        color: #514945 !important;
        background-color: #f0f0f0 !important;
      }
      
      /* CSS cho tất cả các element liên quan đến file upload progress */
      [class*="file-input"] .progress,
      [class*="file-input"] .progress-bar,
      [class*="upload"] .progress,
      [class*="upload"] .progress-bar {
        background-color: #514945 !important;
      }
      
      /* CSS cho Shiny fileInput wrapper */
      .shiny-file-input-progress {
        background-color: #514945 !important;
      }
      
      .shiny-file-input-progress .progress {
        background-color: #514945 !important;
      }
      
      .shiny-file-input-progress .progress-bar {
        background-color: #514945 !important;
      }
      
      /* CSS cho Bootstrap progress bar trong fileInput */
      .progress {
        background-color: #e0e0e0 !important;
      }
      
      .progress-bar {
        background-color: #514945 !important;
      }
      
      .progress-bar-success {
        background-color: #514945 !important;
      }
      
      .progress-bar-info {
        background-color: #514945 !important;
      }
      
      /* CSS cho text "Upload complete" hoặc tương tự */
      .sh-file-input-progress .text-success,
      .sh-file-input-progress .text-info,
      .sh-file-input-progress span[style*="color"],
      .sh-file-input-progress div[style*="color"] {
        color: #514945 !important;
      }
      
      /* CSS tổng quát cho tất cả progress bars và complete messages */
      div[id*="file"] .progress,
      div[id*="file"] .progress-bar,
      div[class*="progress"] {
        background-color: #514945 !important;
      }
      
      /* CSS cho Shiny fileInput container */
      .shiny-input-container .shiny-file-input-progress,
      .shiny-input-container .progress,
      .shiny-input-container .progress-bar {
        background-color: #514945 !important;
      }
      
      /* CSS cho tất cả các thông báo success trong fileInput area */
      .form-group .text-success,
      .form-group .alert-success,
      .form-group .badge-success {
        color: #514945 !important;
        background-color: #f0f0f0 !important;
        border-color: #514945 !important;
      }
      
      /* CSS cho tất cả các element có class chứa "complete" hoặc "success" */
      [class*="complete"],
      [id*="complete"],
      [class*="success"][class*="file"],
      [id*="success"][id*="file"] {
        color: #514945 !important;
      }
      
      /* CSS cho progress bar khi complete - màu nền */
      .progress-bar[style*="100%"],
      .progress-bar[aria-valuenow="100"] {
        background-color: #514945 !important;
      }
      
      /* ========== CSS CHO SCROLLBAR - MÀU SÁNG HƠN ========== */
      /* Webkit browsers (Chrome, Safari, Edge) */
      ::-webkit-scrollbar {
        width: 12px !important;
        height: 12px !important;
      }
      
      ::-webkit-scrollbar-track {
        background: #f1f1f1 !important;
        border-radius: 6px !important;
      }
      
      ::-webkit-scrollbar-thumb {
        background: #c1c1c1 !important;
        border-radius: 6px !important;
        border: 2px solid #f1f1f1 !important;
      }
      
      ::-webkit-scrollbar-thumb:hover {
        background: #a8a8a8 !important;
      }
      
      /* Firefox */
      * {
        scrollbar-width: thin !important;
        scrollbar-color: #c1c1c1 #f1f1f1 !important;
      }
      
      /* Tùy chỉnh scrollbar cho các box và container */
      .box,
      .sidebar-panel,
      .main-panel,
      .dataTables_wrapper,
      .DT-wrapper,
      .shiny-output-container {
        scrollbar-width: thin !important;
        scrollbar-color: #c1c1c1 #f1f1f1 !important;
      }
      
      .box::-webkit-scrollbar,
      .sidebar-panel::-webkit-scrollbar,
      .main-panel::-webkit-scrollbar,
      .dataTables_wrapper::-webkit-scrollbar,
      .DT-wrapper::-webkit-scrollbar,
      .shiny-output-container::-webkit-scrollbar {
        width: 12px !important;
        height: 12px !important;
      }
      
      .box::-webkit-scrollbar-track,
      .sidebar-panel::-webkit-scrollbar-track,
      .main-panel::-webkit-scrollbar-track,
      .dataTables_wrapper::-webkit-scrollbar-track,
      .DT-wrapper::-webkit-scrollbar-track,
      .shiny-output-container::-webkit-scrollbar-track {
        background: #f1f1f1 !important;
        border-radius: 6px !important;
      }
      
      .box::-webkit-scrollbar-thumb,
      .sidebar-panel::-webkit-scrollbar-thumb,
      .main-panel::-webkit-scrollbar-thumb,
      .dataTables_wrapper::-webkit-scrollbar-thumb,
      .DT-wrapper::-webkit-scrollbar-thumb,
      .shiny-output-container::-webkit-scrollbar-thumb {
        background: #c1c1c1 !important;
        border-radius: 6px !important;
        border: 2px solid #f1f1f1 !important;
      }
      
      .box::-webkit-scrollbar-thumb:hover,
      .sidebar-panel::-webkit-scrollbar-thumb:hover,
      .main-panel::-webkit-scrollbar-thumb:hover,
      .dataTables_wrapper::-webkit-scrollbar-thumb:hover,
      .DT-wrapper::-webkit-scrollbar-thumb:hover,
      .shiny-output-container::-webkit-scrollbar-thumb:hover {
        background: #a8a8a8 !important;
      }
      
      /* CSS cho nút xóa file trong fileInput - thay thành biểu tượng download */
      .shiny-file-input-progress button,
      .shiny-file-input-progress .btn,
      .sh-file-input-progress button,
      .sh-file-input-progress .btn {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
      }
      
      /* Ẩn biểu tượng x mặc định */
      .shiny-file-input-progress button:before,
      .shiny-file-input-progress .btn:before,
      .sh-file-input-progress button:before,
      .sh-file-input-progress .btn:before,
      .shiny-file-input-progress button .fa-times,
      .shiny-file-input-progress .btn .fa-times,
      .sh-file-input-progress button .fa-times,
      .sh-file-input-progress .btn .fa-times {
        display: none !important;
      }
      
      /* Thêm biểu tượng download */
      .shiny-file-input-progress button:after,
      .shiny-file-input-progress .btn:after,
      .sh-file-input-progress button:after,
      .sh-file-input-progress .btn:after {
        content: "\\f019" !important;
        font-family: "Font Awesome 6 Free" !important;
        font-weight: 900 !important;
        font-size: 16px !important;
        color: #514945 !important;
        display: inline-block !important;
      }
      
      /* CSS cho downloadButton - ẩn tất cả biểu tượng (hamburger menu và download) */
      #download,
      button[id="download"] {
        position: relative !important;
      }
      
      /* Ẩn tất cả biểu tượng trong downloadButton */
      #download:before,
      button[id="download"]:before,
      #download:after,
      button[id="download"]:after,
      #download .fa-bars,
      button[id="download"] .fa-bars,
      #download .fa-list,
      button[id="download"] .fa-list,
      #download .fa-download,
      button[id="download"] .fa-download,
      #download .fa-download-alt,
      button[id="download"] .fa-download-alt,
      #download i,
      button[id="download"] i,
      #download .glyphicon,
      button[id="download"] .glyphicon,
      #download span[class*="icon"],
      button[id="download"] span[class*="icon"] {
        display: none !important;
      }
