/* =============================================================
 * HostInstance WHMCS theme – brand fine-tuning
 * Loaded after css/all.min.css, css/theme.min.css and
 * includes/tt/hostingard/css/hostingard.css (see includes/head.tpl)
 * Purpose: shore up the remaining hard-coded WHMCS / hostingard
 * colours so the entire client-area reads as HostInstance brand.
 * ============================================================= */


/* ---------- 1. Bootstrap-4 brand-token override --------------- */

:root {
    /* hostingard theme.min.css ships with WHMCS BS4 :root vars
       defaulting to #336699 / #28a745 etc. Re-point them to the
       HostInstance palette so any built-in selector inheriting
       these tokens stays on-brand. */
    --primary: #57C3BC;
    --secondary: #213449;
    --success: #57C3BC;
    --info: #24E1E4;
    --warning: #FFA42F;
    --danger: #FD3246;
    --dark: #213449;
    /* Bootstrap RGB variants used by Bootstrap utilities */
    --bs-primary-rgb: 87, 195, 188;
}


/* ---------- 2. Body / heading typography --------------------- */

body {
    font-family: var(--font-family-sans-serif);
    color: var(--body-color);
    background-color: #ffffff;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--font-family-monospace);
    color: var(--heading-color);
    font-weight: 700;
    letter-spacing: -0.01em;
}

a {
    color: var(--primary);
}

a:hover,
a:focus {
    color: var(--primary-dark);
    text-decoration: none;
}


/* ---------- 3. Buttons -------------------------------------- */

.btn-primary,
.btn-info {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-info:hover,
.btn-info:focus {
    background-color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
}

.btn-success {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.btn-success:hover,
.btn-success:focus {
    background-color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
}

.btn-warning {
    background-color: var(--warning) !important;
    border-color: var(--warning) !important;
    color: #ffffff !important;
}

.btn-danger {
    background-color: var(--danger) !important;
    border-color: var(--danger) !important;
    color: #ffffff !important;
}

.btn-outline-primary {
    color: var(--primary) !important;
    border-color: var(--primary) !important;
    background: transparent;
}

.btn-outline-primary:hover {
    background: var(--primary) !important;
    color: #ffffff !important;
}


/* HostInstance lime "accent" button (matches marketing site CTA) */

.btn-accent,
.btn-tt-accent {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary-darker) !important;
    font-weight: 700;
}

.btn-accent:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}


/* ---------- 4. Text utilities ------------------------------- */

.text-primary {
    color: var(--primary) !important;
}

.text-success {
    color: var(--primary) !important;
}

.text-info {
    color: var(--info) !important;
}

.text-warning {
    color: var(--warning) !important;
}

.text-danger {
    color: var(--danger) !important;
}

.bg-primary {
    background-color: var(--primary) !important;
}

.bg-success {
    background-color: var(--primary) !important;
}

.bg-dark {
    background-color: var(--primary-darker) !important;
}

.bg-gradient {
    background: linear-gradient(279.3deg, var(--primary) 30.98%, var(--primary-darker) 70.6%) !important;
}

.border-primary {
    border-color: var(--primary) !important;
}


/* ---------- 5. Header / navbar ------------------------------ */

.tt-navbar,
.navbar.tt-navbar-dark,
.tt-header-fixed .tt-navbar {
    background-color: var(--primary-darker) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.tt-navbar .navbar-nav .nav-link,
.tt-navbar .navbar-brand,
.tt-navbar .tt-account-link {
    color: #ffffff !important;
}

.tt-navbar .navbar-nav .nav-link:hover,
.tt-navbar .navbar-nav .nav-link:focus,
.tt-navbar .navbar-nav .active>.nav-link {
    color: var(--primary) !important;
}

.tt-navbar.navbar-light .navbar-nav .nav-link {
    color: var(--heading-color) !important;
}

.tt-navbar.navbar-light .navbar-nav .nav-link:hover,
.tt-navbar.navbar-light .navbar-nav .active>.nav-link {
    color: var(--primary) !important;
}


/* "Cart" badge in the navbar */

.tt-navbar .badge-info,
.tt-navbar .cart-btn .badge {
    background-color: var(--primary) !important;
    color: #ffffff !important;
}


/* ---------- 6. Cards / panels ------------------------------- */

.card,
.panel,
.well,
.client-home-panels .panel {
    border: 1px solid var(--border-color);
    border-radius: var(--custom-radius);
    box-shadow: 0 2px 6px rgba(33, 52, 73, 0.06);
    transition: box-shadow 0.2s ease-in-out, transform 0.2s ease-in-out;
}

.card:hover,
.panel:hover,
.client-home-panels .panel:hover {
    box-shadow: 0 12px 24px -4px rgba(33, 52, 73, 0.10);
    transform: translateY(-2px);
    border-color: var(--border-primary-light);
}


/* ---------- 7. Forms --------------------------------------- */

.form-control,
select.form-control,
textarea.form-control {
    border-radius: 8px;
    border: 1px solid var(--border-color);
    color: var(--heading-color);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem rgba(87, 195, 188, 0.18);
}


/* ---------- 8. Tables -------------------------------------- */

.table thead th,
.table>thead>tr>th {
    background-color: var(--gray-light);
    color: var(--heading-color);
    border-bottom: 2px solid var(--border-color);
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.04em;
    font-family: var(--font-family-monospace);
}

.table tbody tr:hover {
    background-color: rgba(87, 195, 188, 0.04);
}


/* ---------- 9. Tabs & pills -------------------------------- */

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: var(--primary);
    border-bottom: 3px solid var(--primary);
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(--primary);
    color: #ffffff;
}


/* ---------- 10. Alerts & badges ---------------------------- */

.alert-success {
    background-color: var(--success-light);
    border-color: rgba(87, 195, 188, 0.25);
    color: #1F6F6A;
}

.alert-info {
    background-color: rgba(36, 225, 228, 0.10);
    border-color: rgba(36, 225, 228, 0.25);
    color: #0D7E80;
}

.alert-warning {
    background-color: var(--warning-light);
    border-color: rgba(255, 164, 47, 0.25);
    color: #A85F00;
}

.alert-danger {
    background-color: var(--danger-light);
    border-color: rgba(253, 50, 70, 0.25);
    color: #B51221;
}

.badge-info,
.label-info,
.badge-primary {
    background-color: var(--primary);
    color: #ffffff;
}

.badge-success,
.label-success {
    background-color: var(--primary);
    color: #ffffff;
}

.badge-warning,
.label-warning {
    background-color: var(--warning);
    color: #ffffff;
}

.badge-danger,
.label-danger {
    background-color: var(--danger);
    color: #ffffff;
}


/* ---------- 11. Pagination --------------------------------- */

.pagination .page-item.active .page-link {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #ffffff;
}

.pagination .page-link {
    color: var(--heading-color);
    border-color: var(--border-color);
}


/* ---------- 12. Sidebar (client area) ---------------------- */

.sidebar .list-group-item.active,
.sidebar .list-group-item:hover {
    background-color: rgba(87, 195, 188, 0.08);
    color: var(--primary);
}

.sidebar .panel,
.sidebar .list-group {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}


/* ---------- 13. Hero / domain search ----------------------- */

.tt-hero,
.tt-page-header,
.tt-domain-search,
.header-lined.bg-primary,
.header-lined .domain-search-container {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
    color: #ffffff;
    border-radius: var(--custom-radius);
}

.tt-hero h1,
.tt-hero h2,
.tt-page-header h1,
.tt-page-header h2 {
    color: #ffffff;
}


/* Search "Get Started" / Search button on hero uses accent lime */

.tt-domain-search .btn-primary,
.tt-hero .btn-primary {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary-darker) !important;
    font-weight: 700;
}

.tt-domain-search .btn-primary:hover,
.tt-hero .btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}


/* ---------- 14. Footer ------------------------------------- */

.tt-footer,
footer.tt-footer,
footer#footer {
    background-color: var(--primary-darker);
    color: #b3c1cc;
    border-top: 4px solid var(--primary);
}

.tt-footer a,
.tt-footer .nav-link,
footer#footer a {
    color: #d6dde6;
}

.tt-footer a:hover,
.tt-footer .nav-link:hover {
    color: var(--primary);
}


/* ---------- 15. Login / register / pwreset ----------------- */

.login-container,
.login-pages {
    background-color: #ffffff;
}

.tt-login-bg-image,
.tt-login-register-testimonial {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
}


/* ---------- 16. Modals ------------------------------------- */

.modal-content {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}

.modal-header {
    background-color: var(--gray-light);
    border-bottom: 1px solid var(--border-color);
    border-radius: var(--custom-radius) var(--custom-radius) 0 0;
}


/* ---------- 17. Misc ---------------------------------------- */

hr {
    border-top-color: var(--border-color);
}

.tt-rounded {
    border-radius: var(--custom-radius) !important;
}

::selection {
    background: rgba(87, 195, 188, 0.25);
    color: var(--heading-color);
}

.bg-secondary {
    --bs-bg-opacity: 1;
    background-color: rgba(241, 245, 249, 1) !important;
}sidebar .list-group-item:hover {
    background-color: rgba(87, 195, 188, 0.08);
    color: var(--primary);
}

.sidebar .panel,
.sidebar .list-group {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}


/* ---------- 13. Hero / domain search ----------------------- */

.tt-hero,
.tt-page-header,
.tt-domain-search,
.header-lined.bg-primary,
.header-lined .domain-search-container {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
    color: #ffffff;
    border-radius: var(--custom-radius);
}

.tt-hero h1,
.tt-hero h2,
.tt-page-header h1,
.tt-page-header h2 {
    color: #ffffff;
}


/* Search "Get Started" / Search button on hero uses accent lime */

.tt-domain-search .btn-primary,
.tt-hero .btn-primary {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary-darker) !important;
    font-weight: 700;
}

.tt-domain-search .btn-primary:hover,
.tt-hero .btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}


/* ---------- 14. Footer ------------------------------------- */

.tt-footer,
footer.tt-footer,
footer#footer {
    background-color: var(--primary-darker);
    color: #b3c1cc;
    border-top: 4px solid var(--primary);
}

.tt-footer a,
.tt-footer .nav-link,
footer#footer a {
    color: #d6dde6;
}

.tt-footer a:hover,
.tt-footer .nav-link:hover {
    color: var(--primary);
}


/* ---------- 15. Login / register / pwreset ----------------- */

.login-container,
.login-pages {
    background-color: #ffffff;
}

.tt-login-bg-image,
.tt-login-register-testimonial {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
}


/* ---------- 16. Modals ------------------------------------- */

.modal-content {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}

.modal-header {
    background-color: var(--gray-light);
    border-bottom: 1px solid var(--border-color);
    border-radius: var(--custom-radius) var(--custom-radius) 0 0;
}


/* ---------- 17. Misc ---------------------------------------- */

hr {
    border-top-color: var(--border-color);
}

.tt-rounded {
    border-radius: var(--custom-radius) !important;
}

::selection {
    background: rgba(87, 195, 188, 0.25);
    color: var(--heading-color);
}

.bg-secondary {
    --bs-bg-opacity: 1;
    background-color: rgba(241, 245, 249, 1) !important;
}sidebar .list-group-item:hover {
    background-color: rgba(87, 195, 188, 0.08);
    color: var(--primary);
}

.sidebar .panel,
.sidebar .list-group {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}


/* ---------- 13. Hero / domain search ----------------------- */

.tt-hero,
.tt-page-header,
.tt-domain-search,
.header-lined.bg-primary,
.header-lined .domain-search-container {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
    color: #ffffff;
    border-radius: var(--custom-radius);
}

.tt-hero h1,
.tt-hero h2,
.tt-page-header h1,
.tt-page-header h2 {
    color: #ffffff;
}


/* Search "Get Started" / Search button on hero uses accent lime */

.tt-domain-search .btn-primary,
.tt-hero .btn-primary {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary-darker) !important;
    font-weight: 700;
}

.tt-domain-search .btn-primary:hover,
.tt-hero .btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}


/* ---------- 14. Footer ------------------------------------- */

.tt-footer,
footer.tt-footer,
footer#footer {
    background-color: var(--primary-darker);
    color: #b3c1cc;
    border-top: 4px solid var(--primary);
}

.tt-footer a,
.tt-footer .nav-link,
footer#footer a {
    color: #d6dde6;
}

.tt-footer a:hover,
.tt-footer .nav-link:hover {
    color: var(--primary);
}


/* ---------- 15. Login / register / pwreset ----------------- */

.login-container,
.login-pages {
    background-color: #ffffff;
}

.tt-login-bg-image,
.tt-login-register-testimonial {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
}


/* ---------- 16. Modals ------------------------------------- */

.modal-content {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}

.modal-header {
    background-color: var(--gray-light);
    border-bottom: 1px solid var(--border-color);
    border-radius: var(--custom-radius) var(--custom-radius) 0 0;
}


/* ---------- 17. Misc ---------------------------------------- */

hr {
    border-top-color: var(--border-color);
}

.tt-rounded {
    border-radius: var(--custom-radius) !important;
}

::selection {
    background: rgba(87, 195, 188, 0.25);
    color: var(--heading-color);
}

.bg-secondary {
    --bs-bg-opacity: 1;
    background-color: rgba(241, 245, 249, 1) !important;
}sidebar .list-group-item.active,
.sidebar .list-group-item:hover {
    background-color: rgba(87, 195, 188, 0.08);
    color: var(--primary);
}

.sidebar .panel,
.sidebar .list-group {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}


/* ---------- 13. Hero / domain search ----------------------- */

.tt-hero,
.tt-page-header,
.tt-domain-search,
.header-lined.bg-primary,
.header-lined .domain-search-container {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
    color: #ffffff;
    border-radius: var(--custom-radius);
}

.tt-hero h1,
.tt-hero h2,
.tt-page-header h1,
.tt-page-header h2 {
    color: #ffffff;
}


/* Search "Get Started" / Search button on hero uses accent lime */

.tt-domain-search .btn-primary,
.tt-hero .btn-primary {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary-darker) !important;
    font-weight: 700;
}

.tt-domain-search .btn-primary:hover,
.tt-hero .btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}


/* ---------- 14. Footer ------------------------------------- */

.tt-footer,
footer.tt-footer,
footer#footer {
    background-color: var(--primary-darker);
    color: #b3c1cc;
    border-top: 4px solid var(--primary);
}

.tt-footer a,
.tt-footer .nav-link,
footer#footer a {
    color: #d6dde6;
}

.tt-footer a:hover,
.tt-footer .nav-link:hover {
    color: var(--primary);
}


/* ---------- 15. Login / register / pwreset ----------------- */

.login-container,
.login-pages {
    background-color: #ffffff;
}

.tt-login-bg-image,
.tt-login-register-testimonial {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
}


/* ---------- 16. Modals ------------------------------------- */

.modal-content {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}

.modal-header {
    background-color: var(--gray-light);
    border-bottom: 1px solid var(--border-color);
    border-radius: var(--custom-radius) var(--custom-radius) 0 0;
}


/* ---------- 17. Misc ---------------------------------------- */

hr {
    border-top-color: var(--border-color);
}

.tt-rounded {
    border-radius: var(--custom-radius) !important;
}

::selection {
    background: rgba(87, 195, 188, 0.25);
    color: var(--heading-color);
}

.bg-secondary {
    --bs-bg-opacity: 1;
    background-color: rgba(241, 245, 249, var(--bs-bg-opacity)) !important;
}sidebar .list-group-item.active,
.sidebar .list-group-item:hover {
    background-color: rgba(87, 195, 188, 0.08);
    color: var(--primary);
}

.sidebar .panel,
.sidebar .list-group {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}


/* ---------- 13. Hero / domain search ----------------------- */

.tt-hero,
.tt-page-header,
.tt-domain-search,
.header-lined.bg-primary,
.header-lined .domain-search-container {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
    color: #ffffff;
    border-radius: var(--custom-radius);
}

.tt-hero h1,
.tt-hero h2,
.tt-page-header h1,
.tt-page-header h2 {
    color: #ffffff;
}


/* Search "Get Started" / Search button on hero uses accent lime */

.tt-domain-search .btn-primary,
.tt-hero .btn-primary {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary-darker) !important;
    font-weight: 700;
}

.tt-domain-search .btn-primary:hover,
.tt-hero .btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}


/* ---------- 14. Footer ------------------------------------- */

.tt-footer,
footer.tt-footer,
footer#footer {
    background-color: var(--primary-darker);
    color: #b3c1cc;
    border-top: 4px solid var(--primary);
}

.tt-footer a,
.tt-footer .nav-link,
footer#footer a {
    color: #d6dde6;
}

.tt-footer a:hover,
.tt-footer .nav-link:hover {
    color: var(--primary);
}


/* ---------- 15. Login / register / pwreset ----------------- */

.login-container,
.login-pages {
    background-color: #ffffff;
}

.tt-login-bg-image,
.tt-login-register-testimonial {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
}


/* ---------- 16. Modals ------------------------------------- */

.modal-content {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}

.modal-header {
    background-color: var(--gray-light);
    border-bottom: 1px solid var(--border-color);
    border-radius: var(--custom-radius) var(--custom-radius) 0 0;
}


/* ---------- 17. Misc ---------------------------------------- */

hr {
    border-top-color: var(--border-color);
}

.tt-rounded {
    border-radius: var(--custom-radius) !important;
}

::selection {
    background: rgba(87, 195, 188, 0.25);
    color: var(--heading-color);
}

.bg-secondary {
    --bs-bg-opacity: 1;
    background-color: rgba(241, 245, 249, var(--bs-bg-opacity)) !important;
}sidebar .list-group-item.active,
.sidebar .list-group-item:hover {
    background-color: rgba(87, 195, 188, 0.08);
    color: var(--primary);
}

.sidebar .panel,
.sidebar .list-group {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}


/* ---------- 13. Hero / domain search ----------------------- */

.tt-hero,
.tt-page-header,
.tt-domain-search,
.header-lined.bg-primary,
.header-lined .domain-search-container {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
    color: #ffffff;
    border-radius: var(--custom-radius);
}

.tt-hero h1,
.tt-hero h2,
.tt-page-header h1,
.tt-page-header h2 {
    color: #ffffff;
}


/* Search "Get Started" / Search button on hero uses accent lime */

.tt-domain-search .btn-primary,
.tt-hero .btn-primary {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary-darker) !important;
    font-weight: 700;
}

.tt-domain-search .btn-primary:hover,
.tt-hero .btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}


/* ---------- 14. Footer ------------------------------------- */

.tt-footer,
footer.tt-footer,
footer#footer {
    background-color: var(--primary-darker);
    color: #b3c1cc;
    border-top: 4px solid var(--primary);
}

.tt-footer a,
.tt-footer .nav-link,
footer#footer a {
    color: #d6dde6;
}

.tt-footer a:hover,
.tt-footer .nav-link:hover {
    color: var(--primary);
}


/* ---------- 15. Login / register / pwreset ----------------- */

.login-container,
.login-pages {
    background-color: #ffffff;
}

.tt-login-bg-image,
.tt-login-register-testimonial {
    background: linear-gradient(135deg, var(--primary-darker) 0%, #1B2D2C 100%) !important;
}


/* ---------- 16. Modals ------------------------------------- */

.modal-content {
    border-radius: var(--custom-radius);
    border: 1px solid var(--border-color);
}

.modal-header {
    background-color: var(--gray-light);
    border-bottom: 1px solid var(--border-color);
    border-radius: var(--custom-radius) var(--custom-radius) 0 0;
}


/* ---------- 17. Misc ---------------------------------------- */

hr {
    border-top-color: var(--border-color);
}

.tt-rounded {
    border-radius: var(--custom-radius) !important;
}

::selection {
    background: rgba(87, 195, 188, 0.25);
    color: var(--heading-color);
}

.bg-secondary {
    --bs-bg-opacity: 1;
    --bs-secondary-rgb: 241, 245, 249;
    background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
}
@media (min-width: 992px) {
    .pt-60 {
        --_pt: 60px;
    }
}
.pb-5 {
    padding-bottom: 1.25rem !important;
}
.mb-8 {
    margin-bottom: 2rem !important;
}
.mt-10 {
    margin-top: 2.5rem !important;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}
.fs-16 {
    font-size: 1rem;
}
.mb-10 {
    margin-bottom: 2.5rem !important;
}
.gap-2 {
    gap: 0.5rem !important;
}
.flex-column {
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
}
.d-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}
.list-unstyled {
    padding-left: 0;
    list-style: none;
}
.fs-14 {
    font-size: 0.875rem;
}
.text-body {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-body-color-rgb), var(--bs-text-opacity)) !important;
}
.text-decoration-none {
    text-decoration: none !important;
}