:root {
            --xi-orange:    #0284c7;
            --xi-orange-d:  #E55E00;
            --xi-orange-lt: #FFF0E6;
            --xi-black:     #0D0D0D;
            --xi-dark:      #1C1C1E;
            --xi-dark2:     #2C2C2E;
            --xi-dark3:     #3A3A3C;
            --bg:           #F5F5F7;
            --surface:      #FFFFFF;
            --border:       #E5E5EA;
            --text:         #1C1C1E;
            --text-2:       #48484A;
            --text-3:       #8E8E93;
            --green:        #34C759;
            --green-lt:     #E8F8ED;
            --blue:         #007AFF;
            --blue-lt:      #E5F1FF;
            --yellow:       #FF9500;
            --yellow-lt:    #FFF5E6;
            --r:            8px;
            --r-lg:         12px;
            --shadow-xs:    0 1px 2px rgba(0,0,0,.05);
            --shadow-sm:    0 2px 8px rgba(0,0,0,.06);
            --shadow-md:    0 4px 16px rgba(0,0,0,.08);
        }
.results-container {
    border: 2px solid #D1D5DB; /* border-gray-300 */
    border-radius: 0.5rem; /* rounded-lg */
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* shadow-lg */
    height: 50vh; 
}

.results-visible {
    display: block; /* Show the results container */
}

.hidden2 {
    display: none; /* Hide the results container */
}

#search-results {
    left: 50%;
    transform: translateX(-50%);
}

.overflow-x-auto {
    scrollbar-width: thin;
}
div#miuiTable_info, div#miuiTable_paginate{
    margin:5px;
}

body {
    overflow-x: hidden; /* Prevent horizontal scrolling */
}
/* Dark Mode Styles */
body.dark {
    background-color: #1a202c; /* Dark background */
    color: #e2e8f0; /* Light text */
  }
  
  body.dark .text-gray-600 {
    color: #a0aec0; 
  }
body.dark div#miuiTable_filter, body.dark div#miuiTable_length, body.dark div#miuiTable_info, body.dark div#miuiTable_paginate{
    color:white;
}  
body.dark nav{
    color:white;
    background-color: #0284c7;
}
body.dark nav ul{
    background-color: #0284c7;
}
body.dark nav ul li a{
    color:white;
}

body.dark nav ul li a:hover {
    color: white;
    background-color: #0369a1;
}

body.dark .h2, 
body.dark .firm_card, 
body.dark .firm_card p, 
body.dark .bg-white.shadow-md.border.border-gray-400.rounded-lg.p-6.mb-6{
    color: #1a202c;
}

body.dark p {
    color: white; /* Change this to your desired color for all <p> elements */
}
body.dark .faq{
    background:#1a202c;
}
body.dark p.text-lg.font-semibold {
    color: white;
}

body.dark .firm_card .btn{
    background-color: orange;
}

body.dark p.text-gray-900.leading-none {
    color: #071662;
}

body.dark .dataTables_wrapper .dataTables_paginate .paginate_button{
    background-color: orange;
}
body.dark .dataTables_wrapper .dataTables_paginate .paginate_button:hover, body.dark a.paginate_button:hover{
    background-color: orangered;
}
body.dark a.paginate_button, body.dark button#dropdownNavbarLink{
    color:white;
}
body.dark ul#search-results li a{
    color:#1a202c
}
body.dark input#search-bar{
    color:orange;
}

body.dark footer, body.dark footer .headings, body.dark footer ul{
    background-color: rgb(194, 128, 4);
    color: white;
}
body.dark footer .copyright{
    background-color: rgb(1, 0, 2);
    color: white;
}
body.dark h2.text-3xl.md\:text-4xl.lg\:text-5xl.font-bold.mb-8.text-center.text-gray-800,
body.dark .faq{
    color:white;
}

.breadcrumb a{
    display: flex;
    align-items: center;
    gap: 2px;
}

.footer-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1rem;
    border-radius: 9999px;
    background-color: rgba(2, 132, 199, 0.12);
    color: #cfe8ff;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.footer-pill:hover {
    background-color: rgba(2, 132, 199, 0.2);
    transform: translateY(-1px);
}

.footer-link,
.footer-chip,
.footer-social {
    display: inline-flex;
    align-items: center;
    color: #cbd5e1;
    text-decoration: none;
    transition: color 0.2s ease, transform 0.2s ease;
}

.footer-link:hover,
.footer-chip:hover,
.footer-social:hover {
    color: #7dd3fc;
    transform: translateY(-1px);
}

.footer-chip {
    padding: 0.85rem 1rem;
    background: rgba(148, 163, 184, 0.1);
    border-radius: 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
}

.footer-social {
    width: 2.5rem;
    height: 2.5rem;
    justify-content: center;
    border-radius: 0.85rem;
    background: rgba(148, 163, 184, 0.08);
}

.footer-social svg {
    width: 1.25rem;
    height: 1.25rem;
}

.bg-sky-600 {
    background-color: #0284c7;
}