body {
    margin: 0;
    padding: 0;
    /*    width: 100vw;
    height: 100vh;*/
    /*    font-family: 'Muli', sans-serif;*/
    color: #fff;
    --menu-item-size: 50px;
    --green-color: #2F1741;
    --blue-color: #099c95;
    --dark-green-color: #fff;
    --white-color: #FFF;
    --gray-color: #9f7fb7;
    --container-width: 800px;
    --container-height: 300px;
    --line-offset: calc((100% - var(--container-height))/ 2 + var(--menu-item-size) + 0.6em);
}

h5, .h5 {
    font-size: 20px !important;
    /*    font-family: 'Muli', Sans-serif !important;*/
    font-weight: bold !important;
    color: #1cbaa0 !important;
    padding-top: 1%;
    padding-bottom: 15px !important;
}

h2, .h2 {
    font-size: 32px !important;
    /*    font-family: 'Muli', Sans-serif !important;*/
    font-weight: 800 !important;
    color: #242424 !important;
}


/* ======== Global CSS Start ======== */


body {
    margin: 0px;
    padding: 0;
    font-size: 12px;
    /*    font-family: 'Muli', sans-serif !important;*/
    letter-spacing: 0.5px;
}

ul {
    margin: 0px;
    padding: 0;
}

    ul li {
        list-style: none;
    }

* {
    padding: 0;
    margin: 0;
}

a:hover, a:focus {
    text-decoration: none;
    outline: none;
    color: #fff;
}

a {
    transition: all 0.5s ease 0s;
}

.white-hover:hover {
    color: #fff !important;
}

p:empty {
    display: none;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    /*    font-family: 'Barlow Semi Condensed', sans-serif;*/
}

/* Color CSS */

.white-text {
    color: #fff;
}

.primary-text {
    color: #fab400;
}

.secondary-text {
    color: #003666;
}

.primary-bg {
    background: #2F1741;
}

.secondary-bg {
    background: #003666;
}

.gray-light-bg {
    background: #fafafa;
}

.white-bg {
    background: #fff;
}

.gray-bg {
    background: #f9f9f9;
}

.dark-bg {
    background: #222;
}

.dark-text {
    color: #333;
}

.gray-text {
    color: #666;
}

.primary-bg-hover:hover {
    background: #fab400;
}

.primary-border {
    border: 1px solid #fab400;
}

.border-top-gray {
    border-top: 1px solid #eee;
}

.border-bottom-gray {
    border-bottom: 1px solid #eee;
}

.border {
    border: 1px solid #ddd;
}

.border-left {
    border-left: 1px solid #ddd;
}

.border-right {
    border-right: 1px solid #ddd;
}

.border-top {
    border-top: 1px solid #ddd;
}

.border-bottom {
    border-bottom: 1px solid #ddd;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.text-decoration-none {
    text-decoration: none;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-justify {
    text-align: center !important;
}

.display-table {
    display: table;
}

.display-block {
    display: block;
}

.display-inline-block {
    display: inline-block;
}

.display-inline {
    display: inline;
}

.display-inherit {
    display: inherit !important;
}

.relative {
    position: relative;
}

.uppercase {
    text-transform: uppercase;
}

.capitalize {
    text-transform: capitalize;
}

.z-index-9 {
    z-index: 9;
}

.z-index-1 {
    z-index: 1;
}

.width-40 {
    width: 40%;
}

.width-50 {
    width: 50%;
}

.width-60 {
    width: 60%;
}

.width-60 {
    width: 60%;
}

.width-70 {
    width: 70%;
}

.width-80 {
    width: 80%;
}

.width-90 {
    width: 90%;
}

.width-100 {
    width: 100%;
}

a:hover {
    text-decoration: none;
}

.line-right-primary {
    position: relative;
}

    .line-right-primary:after {
        position: absolute;
        content: "";
        right: auto;
        bottom: 6px;
        height: 1px;
        width: 80px;
        background: #fab400;
        margin: 0 0 0 10px;
    }

.line-right-white {
    position: relative;
}

    .line-right-white:after {
        position: absolute;
        content: "";
        right: auto;
        bottom: 6px;
        height: 1px;
        width: 80px;
        background: #fff;
        margin: 0 0 0 10px;
    }

/* Linehight CSS */

.line-height-20 {
    line-height: 20px;
}

.line-height-22 {
    line-height: 22px;
}

.line-height-24 {
    line-height: 24px;
}

.line-height-26 {
    line-height: 26px;
}

.line-height-28 {
    line-height: 28px;
}

.line-height-30 {
    line-height: 30px;
}

.line-height-32 {
    line-height: 32px;
}

.line-height-34 {
    line-height: 34px;
}

.line-height-36 {
    line-height: 36px;
}

.line-height-38 {
    line-height: 38px;
}

.line-height-40 {
    line-height: 40px;
}

/* Font Weight CSS */

.font-weight-100 {
    font-weight: 100;
}

.font-weight-200 {
    font-weight: 200;
}

.font-weight-300 {
    font-weight: 300;
}

.font-weight-400 {
    font-weight: 400;
}

.font-weight-500 {
    font-weight: 500;
}

.font-weight-600 {
    font-weight: 600;
}

.font-weight-700 {
    font-weight: 700;
}

/* Padding CSS */

.no-padding {
    padding: 0;
}

.padding-5 {
    padding: 5px;
}

.padding-10 {
    padding: 10px;
}

.padding-15 {
    padding: 15px;
}

.padding-20 {
    padding: 20px;
}

.padding-30 {
    padding: 30px;
}

.padding-40 {
    padding: 40px;
}

.padding-50 {
    padding: 50px;
}

.padding-top-bottom-5 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.padding-top-bottom-10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.padding-top-bottom-20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

.padding-right-left-5 {
    padding-left: 5px;
    padding-right: 5px;
}

.padding-right-left-10 {
    padding-left: 10px;
    padding-right: 10px;
}

.padding-right-left-20 {
    padding-left: 20px;
    padding-right: 20px;
}

.padding-top-5 {
    padding-top: 5px;
}

.padding-top-10 {
    padding-top: 10px;
}

.padding-top-15 {
    padding-top: 15px;
}

.padding-top-20 {
    padding-top: 20px;
}

.padding-top-30 {
    padding-top: 30px;
}

.padding-top-40 {
    padding-top: 40px;
}

.padding-top-50 {
    padding-top: 50px;
}

.padding-top-70 {
    padding-top: 70px;
}

.padding-bottom-5 {
    padding-bottom: 5px;
}

.padding-bottom-10 {
    padding-bottom: 10px;
}

.padding-bottom-15 {
    padding-bottom: 15px;
}

.padding-bottom-20 {
    padding-bottom: 20px;
}

.padding-bottom-24 {
    padding-bottom: 24px;
}

.padding-bottom-30 {
    padding-bottom: 30px;
}

.padding-bottom-40 {
    padding-bottom: 40px;
}

.padding-bottom-50 {
    padding-bottom: 50px;
}

.padding-bottom-60 {
    padding-bottom: 60px;
}

.padding-bottom-70 {
    padding-bottom: 70px;
}

.padding-bottom-100 {
    padding-bottom: 100px;
}

.padding-right-5 {
    padding-right: 5px;
}

.padding-right-10 {
    padding-right: 10px;
}

.padding-right-15 {
    padding-right: 15px;
}

.padding-right-20 {
    padding-right: 20px;
}

.padding-right-30 {
    padding-right: 30px;
}

.padding-right-40 {
    padding-right: 40px;
}

.padding-right-50 {
    padding-right: 50px;
}

.padding-left-5 {
    padding-left: 5px;
}

.padding-left-10 {
    padding-left: 10px;
}

.padding-left-15 {
    padding-left: 15px;
}

.padding-left-20 {
    padding-left: 20px;
}

.padding-left-30 {
    padding-left: 30px;
}

.padding-left-40 {
    padding-left: 40px;
}

.padding-left-50 {
    padding-left: 50px;
}

/* Margin CSS */

.margin-auto {
    margin: 0px auto;
}

.no-margin {
    margin: 0;
}

.margin-5 {
    margin: 5px;
}

.margin-10 {
    margin: 10px;
}

.margin-15 {
    margin: 15px;
}

.margin-20 {
    margin: 20px;
}

.margin-30 {
    margin: 30px;
}

.margin-40 {
    margin: 40px;
}

.margin-50 {
    margin: 50px;
}

.margin-top-minus-20 {
    margin-top: -20px;
}

.margin-top-5 {
    margin-top: 5px;
}

.margin-top-10 {
    margin-top: 10px;
}

.margin-top-15 {
    margin-top: 15px;
}

.margin-top-20 {
    margin-top: 20px;
}

.margin-top-30 {
    margin-top: 30px;
}

.margin-top-40 {
    margin-top: 40px;
}

.margin-top-50 {
    margin-top: 50px;
}

.margin-top-60 {
    margin-top: 60px;
}

.margin-top-70 {
    margin-top: 70px;
}

.margin-top-80 {
    margin-top: 80px;
}

.margin-top-90 {
    margin-top: 90px;
}

.margin-top-100 {
    margin-top: 100px;
}

.margin-bottom-5 {
    margin-bottom: 5px;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.margin-bottom-15 {
    margin-bottom: 15px;
}

.margin-bottom-20 {
    margin-bottom: 20px;
}

.margin-bottom-30 {
    margin-bottom: 30px;
}

.margin-bottom-40 {
    margin-bottom: 40px;
}

.margin-bottom-50 {
    margin-bottom: 50px;
}

.margin-bottom-60 {
    margin-bottom: 60px;
}

.margin-bottom-70 {
    margin-bottom: 70px;
}

.margin-right-5 {
    margin-right: 5px;
}

.margin-right-10 {
    margin-right: 10px;
}

.margin-right-15 {
    margin-right: 15px;
}

.margin-right-20 {
    margin-right: 20px;
}

.margin-right-30 {
    margin-right: 30px;
}

.margin-right-40 {
    margin-right: 40px;
}

.margin-right-50 {
    margin-right: 50px;
}

.margin-left-5 {
    margin-left: 5px;
}

.margin-left-10 {
    margin-left: 10px;
}

.margin-left-15 {
    margin-left: 15px;
}

.margin-left-20 {
    margin-left: 20px;
}

.margin-left-30 {
    margin-left: 30px;
}

.margin-left-40 {
    margin-left: 40px;
}

.margin-left-50 {
    margin-left: 50px;
}

.margin-left-minus-one {
    margin-left: -1px;
}

/* Font Size CSS */

.font-12 {
    font-size: 12px;
}

.font-13 {
    font-size: 13px;
}

.font-14 {
    font-size: 14px;
}

.font-15 {
    font-size: 15px;
}

.font-16 {
    font-size: 16px;
}

.font-18 {
    font-size: 18px;
}

.font-20 {
    font-size: 20px;
}

.font-22 {
    font-size: 22px;
}

.font-24 {
    font-size: 24px;
}

.font-26 {
    font-size: 26px;
}

.font-28 {
    font-size: 28px;
}

.font-30 {
    font-size: 30px;
}

.font-32 {
    font-size: 32px;
}

.font-34 {
    font-size: 34px;
}

.font-36 {
    font-size: 36px;
}

.font-38 {
    font-size: 38px;
}

.font-40 {
    font-size: 40px;
}

.font-42 {
    font-size: 42px;
}

.font-44 {
    font-size: 44px;
}

.font-46 {
    font-size: 46px;
}

.font-48 {
    font-size: 48px;
}

.font-50 {
    font-size: 50px;
}

.font-52 {
    font-size: 52px;
}

.font-54 {
    font-size: 54px;
}

.font-56 {
    font-size: 56px;
}

.font-58 {
    font-size: 58px;
}

.font-60 {
    font-size: 60px;
}

.font-80 {
    font-size: 80px;
}


/* ======== Global CSS End ======== */

.communicationContainer {
    height: 480px !important;
    overflow-y: scroll;
}

.filingAuthorizationContainer {
    height: 600px !important;
    overflow-y: scroll;
}

.input-fixed {
    height: 37px !important;
    width: 100% !important;
}

.ChangePass-form {
    padding-left: 25px !important;
    padding-right: 25px !important;
}

.forgot-btn{
    margin: 15px!important;
}
/*CHange password styles*/
.btnn.disabled {
    cursor: not-allowed;
    opacity: 0.65;
    box-shadow: none;
}

/*OTP Radio Styles*/

/* OTP Container */
.otp-container {
    text-align: center;
    padding: 30px;
}

/* Header */
.otp-header h2 {
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 10px;
}

.otp-header p {
    color: #6c757d;
    font-size: 14px;
}

/* Timer */
.otp-timer {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px 0;
    gap: 10px;
}

.circle {
    width: 40px;
    height: 40px;
    border: 5px solid #28a745;
    border-radius: 50%;
}

.time {
    font-size: 28px;
    font-weight: bold;
}

/* Input */
.otp-input-box {
    margin: 20px 0;
}

/* wrapper → horizontal layout */
.otp-timer-wrapper {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-left:35px !important;
}

/* circle container */
.otp-circle {
    width: 70px;
    height: 70px;
}

/* rotate start from top */
.progress-ring {
    transform: rotate(-90deg);
}

/* background circle */
.progress-ring__bg {
    fill: none;
    stroke: #e6e6e6;
    stroke-width: 6;
}

/* active progress */
.progress-ring__circle {
    fill: none;
    stroke: #28a745;
    stroke-width: 6;
    stroke-linecap: round;
    transition: stroke-dashoffset 1s linear;
}

/* text section */
.otp-time-text {
    display: flex;
    flex-direction: column;
}

    /* "Time remaining" */
    .otp-time-text .label {
        margin: 0;
        font-size: 14px;
        color: #6c757d;
    }

/* timer value */
#timer {
    font-size: 32px;
    font-weight: 600;
    color: #000;
    line-height: 1;
}
.otp-input {
    width: 100%;
    padding: 12px;
    font-size: 18px;
    border-radius: 6px;
    border: 1px solid #ccc;
    text-align: center;
}

/* Resend */
.otp-actions {
    text-align: left;
    margin-top: 20px;
}
.otp-email-display {
    text-align: left;
    margin-top: 5px;
    margin-left: 30px !important;
}

.otptext {
    font-size: 14px;
    color: #6c757d;
}

.trouble-text {
    margin-bottom: 12px;
    font-size: 14px;
    color: #666;
}

    .trouble-text strong {
        display: block;
        margin-bottom: 5px;
        font-size: 15px;
        color: #000;
    }

    .trouble-text p {
        margin: 0;
        font-size: 13px;
        line-height: 1.5;
    }

.highlight {
    color: #28a745;
    font-weight: 500;
}

/* Button spacing */

.resend-btn {
    display: flex;
    justify-content: center !important;
    align-items: center !important;
    width: 60%;
    margin-top: 15px;
    margin-bottom: 15px;
}


    .resend-btn:disabled {
        color: #999;
        cursor: not-allowed;
    }

.radio-row {
    display: flex;
    align-items: center;
    gap: 25px; /* spacing between SMS and Email */
    margin-bottom: 15px;
}

.radio-option {
    display: flex;
    align-items: center;
    gap: 6px; /* spacing between radio button & label text */
    font-size: 14px;
    cursor: pointer;
}

    .radio-option input[type="radio"] {
        cursor: pointer;
    }

    .radio-option span {
        /*        display: flex;
        align-items: center;*/
        margin-top: 5px;
    }


/*============
    Divider styles
    ====================*/

.header-with-line {
    position: relative;
    padding-bottom: 10px; /* space for the line */
    font-weight: 600;
}

    /* Thin line under the header */
    .header-with-line::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%; /* adjust line width */
        height: 1px; /* line thickness */
        background: #F1E7F7; /* modern blue line */

        border-radius: 2px;
    }

.btnn.btnResend {
    background-color: #fff !important;
    border: 1px solid #ccc !important;
    color: #093861 !important;
}

    .btnn.btnResend:hover {
        transform: translateY(-1px);
        /*        box-shadow: 0 12px 24px rgba(0, 0, 0, 0.22);*/
    }


/* ============================================
    Menu styles
*/
/* ===========================
   Header / Menu (White + Compact)
=========================== */

.navbar-brand {
    display: flex !important;
    align-items: center !important;
    padding: 0px !important;
}

.logo-main-head {
    height: 70px !important; /* Adjust this value */
    /*width: auto !important;*/ /* Keeps correct aspect ratio */
    object-fit: contain; /* Ensures it fits cleanly */
    margin-top: 5px; /* Optional centering */
    padding: 0px !important;
}


.header-home {
    background: #ffffff !important;
    border-bottom: 1px solid #e5e5e5;
    padding: 0px !important;
}

.menu {
    background: #ffffff !important;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 3px;
    padding-right: 3px;
    border-bottom: 2px solid #ccc;
}

.admin-menu {
    margin-top: -9px !important;
}
.admin-user-info {
    background: #ddd;
    margin-top: -1px !important;
    padding: 15px !important;
    pointer-events: none;
}

    .admin-user-info div {
        color: #242424 !important;
    }
.submenu {
    border: 1px solid #ddd !important; /* Visible border */
    border-radius: 8px !important;
    overflow: hidden; /* Makes border perfect */
}

/* Fix submenu box styling */
.main-menu .submenu {
    border: 1px solid #ccc !important;
    border-radius: 8px !important;
    overflow: hidden !important; /* makes corners perfect */
    padding: 0 !important;
    background: #fff;
}


.main-menu {
    display: flex;
    list-style: none;
    gap: 7px; /* control spacing manually */
}

/* Fix each item inside submenu */
.main-menu .submenu li {
    border-bottom: 1px solid #e6e6e6;
}

    .main-menu > li {
        padding: 0 0.5%;
    }

        .main-menu .submenu li:last-child {
            border-bottom: none;
        }

/* Compact menu links */
.main-menu > li > a.logedin1 {
    color: #444 !important;
    font-size: 14px;
    font-weight: 600 !important;
    padding: 10px 8px;
    display: flex;
    align-items: center;
    gap: 2px;
    /*    font-family: "Segoe UI", Roboto, sans-serif;*/
    white-space: nowrap;
}

.main-menu > li > a:hover {
    color: #000 !important;
}

.main-menu li.with-submenu > ul.submenu {
    position: absolute !important;
}
/* ===========================
   Submenu (NO BACKGROUND)
=========================== */

.main-menu li.with-submenu {
    position: relative;
    overflow: visible !important;
}

    /* Remove purple */
    .main-menu li.with-submenu .submenu,
    .main-menu li.with-submenu .submenu li,
    .main-menu li.with-submenu .submenu li a {
        background-color: #fff !important;
        background: #fff !important;
        color: #000 !important;
    }

        /* ===========================
   🔥 FIX: Full-row hover effect
=========================== */
        .main-menu li.with-submenu .submenu li:hover {
            background-color: #e6e6e6 !important;
        }

            .main-menu li.with-submenu .submenu li:hover a {
                background-color: #e6e6e6 !important;
            }

/* FORCE ALL PARENTS TO STOP CUTTING THE SUBMENU */
header,
.header-home,
.navbar-wrapper,
.menu,
/*.row,*/
.col-md-2,
.col-md-7,
.navbar-header,
.main-menu,
.main-menu li,
.main-menu li.with-submenu {
    overflow: visible !important;
}


    .main-menu li.with-submenu .submenu {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        position: absolute !important;
        top: 110% !important;
        left: 0px !important; /* Align to left of menu item */
        right: auto !important; /* Prevent cutting on right */
        gap: 7px !important;
        background: #fff !important;
        border-right: 1px solid #ccc;
        border: 1px solid #ccc !important;
        border-radius: 6px !important;
        min-width: 150px !important;
        /*        padding: 10px 5px !important;*/
        z-index: 999 !important;
        box-shadow: 0 4px 12px rgba(30, 136, 229, 0.35);
        transition: opacity 0.2s ease-in-out;
    }

    .main-menu li.with-submenu:hover .submenu {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }



    /* No border inside list items */
    .main-menu li.with-submenu .submenu li {
        border: none;
    }

    /* Remove arrow */
    .main-menu li.with-submenu > a.logedin1::after {
        content: none !important;
    }

.submenu li.disabled {
    border-bottom: 1px solid #bfbfbf !important; /* thin line below */
    background: #e6e6e6 !important; /* highlight */
    font-weight: 600 !important; /* bold text */
    padding: 10px !important;
    padding-bottom: 18px !important; /* ← Adds space above the line */
}

    .submenu li.disabled div {
        text-align: center !important;
        padding-bottom: 10px !important; /* ← Adds space above the line */
        width: 100%;
        color: #093861;
    }

.submenu > li {
    background: #ffffff !important;
    border-bottom: 1px solid #ddd !important;
    color: #242424 !important;
    padding: 2px 10px !important;
    line-height: normal !important;
}

.submenu li {
    padding: 0 !important;
}

    .submenu li a {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        padding: 12px 15px;
    }

    .submenu li i {
        margin-right: 4px; /* extra spacing if needed */
        color: #093861 !important;
    }

.logout.main-menu > li {
    padding: 0 5em;
}

/* Align profile dropdown */
.logout .submenu {
    right: 0;
    left: 5px !important;
    padding: 5px !important;
}


/*============
    Create/add row styles
    ====================*/

/* Page-style replacement for modal */
.add-row-page {
    display: block !important;
    position: static !important;
    background: #fff;
    padding: 15px;
    border-radius: 6px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
    margin-top: 35px;
}

.page-header {
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
    padding-bottom: 10px;
}

.page-footer {
    margin-top: 25px;
}



/*============ Dashboard styles ====================*/

.login-text {
    margin-left: 60px;
    margin-top: 0px !important;
    margin-bottom: 20px !important;
}
#forgotAlert {
    margin-left: 20px;
    margin-bottom: 10px !important;
}

/* Equal height + alignment fix */
.row.align-items-stretch > div {
    display: flex;
}

/* Make both cards fill same height */
.efile-container {
    width: 100% !important;
    height: 100%;
    box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.15);
    background: #ffffff; /* clean white background */
    border: 1px solid #cfcfcf; /* lighter modal-style border */
    border-radius: 8px;
    padding: 20px; /* same feeling as modal body */
}
/* Fix spacing between left & right */
.headerRow .row {
    margin-left: 0;
    margin-right: 0;
    margin-top: 20px !important;
    gap: 0;
}

.manage-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 35px !important;
    margin-top: 35px !important;
}

/* Left title */
.manage-title {
    font-size: 20px;
    font-weight: 600;
    color: #2F1741;
    margin: 0;
}

/* Right text */
.last-login {
    font-size: 15px;
    color: #6b7280;
    white-space: nowrap;
}

.button-group {
    display: flex;
    justify-content: flex-start; /* left align like your image */
    gap: 15px;
    margin-top: 25px !important;
    margin-bottom: 25px !important;
}

/* Payer / Recipient buttons */
.dashboard-btn {
    display: inline-block;
    min-width: 210px;
    padding: 8px 10px !important;
    background: #093861;
    color: #fff;
    text-decoration: none;
    text-align: center;
    font-size: 17px !important;
    font-weight: 600;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
}

    .dashboard-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
    }

/* RIGHT SIDE TITLE */
.etax-title {
    font-size: 1rem;
    font-weight: 600;
    color: #222;
    margin-bottom: 10px;
}

/* Get Started button */
.etax-modern-btn {
    display: inline-block;
    padding: 12px 22px;
    background-color: #093861;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: 10px;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(30, 136, 229, 0.3);
    transition: all 0.2s ease;
}

    .etax-modern-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(22, 111, 187, 0.4);
    }


.fileStatus-container {
    border: 1px solid #cfcfcf; /* lighter modal-style border */
    border-radius: 8px; /* smoother curve like Bootstrap modals */
    background: #ffffff; /* clean white background */
    padding: 5px; /* same feeling as modal body */  
    /* modal-like shadow */
    /* Stronger but clean modal-like shadow */
    box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.15);
}

/* Container */
.status-overview {
    margin: 0;
}

/* Header */
.status-overview__header h2 {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 2px;
    color: #0f172a;
}

.status-overview__helper {
    font-size: 0.8rem;
    color: #6b7280;
    margin-bottom: 10px;
}

/* Card */
.status-card {
    display: block;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 16px 12px 16px 12px;
    text-decoration: none;
    position: relative;
    transition: all 0.15s ease;
}

    /* Hover */
    .status-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.06);
        border-color: #d1d5db;
    }

    /* Left color bar */
    .status-card::before {
        content: "";
        position: absolute;
        left: 0;
        top: 10px;
        bottom: 10px;
        width: 4px;
        border-radius: 4px;
    }

/* Top row */
.status-card__top {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 6px;
}

/* Label */
.status-card__label {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
}

/* Count */
.status-card__count {
    font-size: 20px;
    font-weight: 700;
    margin: 3px 0;
    line-height: 1.1;
}

/* Description */
.status-card__desc {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.2;
}

/* Chips */
.status-card__chip {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 999px;
    font-weight: 650;
    border: 1px solid transparent;
}

/* Submitted */
.status-card--submitted::before {
    background: #2563eb;
}

.status-card--submitted .status-card__count {
    color: #2563eb;
}

.chip--neutral {
    color: #1d4ed8;
    background: #dbeafe;
}

/* Accepted */
.status-card--accepted::before {
    background: #16a34a;
}

.status-card--accepted .status-card__count {
    color: #16a34a;
}

.chip--success {
    color: #15803d;
    background: #dcfce7;
}

/* Rejected */
.status-card--rejected::before {
    background: #dc2626;
}

.status-card--rejected .status-card__count {
    color: #dc2626;
}

.chip--danger {
    color: #b91c1c;
    background: #fee2e2;
}

/* Responsive spacing */
@media (max-width: 768px) {
    .status-card {
        padding: 10px;
    }
}



/* ----------- Responsive Adjustments ----------- */

/* Tablets */
@media (max-width: 992px) {
    .dashboard-btn {
        font-size: 20px;
        padding: 16px 20px;
    }
}

/* Large Mobile */
@media (max-width: 768px) {
    .dashboard-btn {
        font-size: 18px;
        padding: 15px 18px;
        border-radius: 12px;
    }

    .logo-main-head {
        position: absolute;
        width: 50%;
    }

    .logo-main-head {
        padding: 3px 0px;
    }
}


/* Small Mobile */
@media (max-width: 576px) {
    .dashboard-btn {
        font-size: 17px;
        padding: 14px 16px;
        border-radius: 10px;
    }
}

/* Responsive styling */
@media (max-width: 576px) {
    .etax-modern-btn {
        font-size: 18px;
        padding: 14px 20px;
        border-radius: 12px;
    }
}

/*============
    Choosen tax file styles
    ====================*/

.chosen-container-single .chosen-single {
    height: 34px !important;
    line-height: 30px !important;
    width: 268px !important;
}

.chosen-container ul.chosen-results li.highlighted {
    background-color: #4f4bdb;
    background-image: none;
}

.chosen-container-single .chosen-single div b {
    display: none;
    width: 100%;
    height: 100%;
/*    background: url('chosen-sprite.png') no-repeat 0px 2px;*/
}

#AddRowModal .chosen-container {
    width: 100% !important;
}

#AddRowModal .chosen-container-single .chosen-single {
    height: 34px !important;
    line-height: 32px !important;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
}

#AddRowModal .chosen-container-active .chosen-single {
    border-color: #66afe9;
    box-shadow: 0 0 8px rgba(102, 175, 233, 0.6);
}

#AddRowModal .chosen-container-single .chosen-search input[type="text"] {
    height: 30px;
    line-height: 30px;
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
   
}

#AddRowModal .chosen-container .chosen-drop {
    border: 1px solid #ccc;
    border-top: 0;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

#AddRowModal .chosen-container .chosen-results li.highlighted {
    background-color: #4f4bdb;
    background-image: none;
    color: #fff;
}


.DownloadTemplateBtn {
    display: flex;
    justify-content: flex-end;
}
.downloadTemplateLink {
    text-decoration: underline;
}

span.ui-helper-hidden-accessible {
    display: none;
}

.taxtextbox[disabled],
.taxtextbox {
    background-color: #edf5ff;
}

td, th {
    border: 1px solid grey;
}

.chosen-container-single .chosen-single {
    height: 34px !important;
    line-height: 30px !important;
    width: 268px !important;
}

.chosen-container ul.chosen-results li.highlighted {
    background-color: #4f4bdb;
    background-image: none;
}

.chosen-container-single .chosen-single div b {
    display: none;
    width: 100%;
    height: 100%;
/*    background: url('chosen-sprite.png') no-repeat 0px 2px;*/
}

.col-sm {
    padding: 0 !important;
}

.paddingleft {
    padding-left: 5px !important;
}

.paddingright {
    padding-right: 5px !important;
}

.misexp {
    padding-right: 70px !important;
    padding-top: 26px !important;
}

.taxtxtarea {
    width: 97%;
    height: 110px;
    background-color: aliceblue;
    border: none;
}

.taxtxtarea2 {
    width: 90%;
    height: 75px;
    background-color: aliceblue;
    border: none;
}

.taxtextbox {
    width: 90%;
    height: 30px;
    background-color: aliceblue;
    border: none;
}

.dangeralert {
    z-index: 1500;
    position: fixed;
    left: 50px;
    bottom: 30px;
}

#paginationContainer .btn-default,
#paginationContainerBottom .btn-default {
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 5px 10px;
    transition: all 0.2s;
}

    #paginationContainer .btn-default:hover:not(:disabled),
    #paginationContainerBottom .btn-default:hover:not(:disabled) {
        background-color: #4f4bdb;
        border-color: #4f4bdb;
        color: #fff;
    }

    #paginationContainer .btn-default:disabled,
    #paginationContainerBottom .btn-default:disabled {
        opacity: 0.4;
        cursor: not-allowed;
    }

#pageNumberInput {
    font-family: inherit;
}

    #pageNumberInput:focus {
        outline: none;
        border-color: #4f4bdb;
        box-shadow: 0 0 0 2px rgba(250, 180, 0, 0.2);
    }

/* New Modal Styles */
.add-row-modal .modal-dialog {
    max-width: 800px;
}

.add-row-modal .form-group {
    margin-bottom: 15px;
}

.add-row-modal label {
    font-weight: 600;
    margin-bottom: 5px;
    display: block;
}

.add-row-modal .required {
    color: red;
}

.small-btn {
    font-size: 12px; /* Reduce text size */
    padding: 10px 10px; /* Reduce button size */
    height: auto !important;
}

    .small-btn i {
        font-size: 13px; /* Reduce icon size */
    }

.exportBtn {
    font-weight: 700;
    background-color: #fff !important;
    color: #093861 !important; /* TEXT COLOR */
    border: 2px solid #093861 !important; /* BORDER COLOR */
    border-radius: 10px;
    height: 38px;
    padding: 6px 18px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 6px rgba(154, 77, 196, 0.3);
}

    /*  Make icons same color */
    .exportBtn i {
        color: #093861 !important;
        font-size: 18px !important;
    }

    /*  Hover effect (optional but looks premium) */
    .exportBtn:hover {
        transform: translateY(-1px);
    }


#AddRowModal .chosen-container {
    width: 100% !important;
}

#AddRowModal .chosen-container-single .chosen-single {
    height: 34px !important;
    line-height: 32px !important;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
}

#AddRowModal .chosen-container-active .chosen-single {
    border-color: #66afe9;
    box-shadow: 0 0 8px rgba(102, 175, 233, 0.6);
}

#AddRowModal .chosen-container-single .chosen-search input[type="text"] {
    height: 30px;
    line-height: 30px;
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

#AddRowModal .chosen-container .chosen-drop {
    border: 1px solid #ccc;
    border-top: 0;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

#AddRowModal .chosen-container .chosen-results li.highlighted {
    background-color: #4f4bdb;
    background-image: none;
    color: #fff;
}

.tfr-edit-column {
    width: 70px;
}
.status-column {
    position: sticky;
    right: 0;
    background: #fff;
    text-align: center;
    min-width: 60px;
    z-index: 5;
}

/*============
    Table header and button styles
    ====================*/
/*Total report button alignemnt*/
.ReportButton {
    margin: 4px !important;
    display: flex;
    justify-content: flex-end;
    margin-right: 15px !important;
    gap: 10px !important;
}
.buttons-row {
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    align-items: flex-end;
}

    .buttons-row > button,
    .buttons-row > a {
        flex: 1;
        min-width: 0;
        margin: 0;
        height: 38px;
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
        white-space: nowrap;
    }



.quick1099-header .btnn.btnnAddNew {
    width: auto !important;
    /*    font-family: "Muli", sans-serif;*/
    font-weight: 700;
    background-color: #093861 !important;
    border: none; /* remove all borders */
    border-radius: 10px; /* smooth rounded corners */
    color: #fff !important;
    height: 33px;
    padding: 6px 15px !important;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 6px rgba(154, 77, 196, 0.3); /* subtle glow */
    text-decoration: none;
}


/* Hover effect – keep color but polish */
.quick1099-header.btnn:hover {
    background-color: #093861 !important;
    /*        box-shadow: 0 4px 10px rgba(154, 77, 196, 0.4);*/
    transform: translateY(-1px);
}

/* ============================================================
   UNIVERSAL RESPONSIVE TABLE CONTAINER (YOUR REQUESTED VERSION)
   ============================================================ */

/*.track-wrapper {
    max-width: 1400px;*/ /* Hard limit so it never gets too wide */
/*width: 100%;
    margin: 0 auto;*/ /* Centers the content */
/*padding: 0 15px;*/ /* Add side spacing on tablets/phones */
/*}*/


.container {
    width: 95% !important;
    overflow-x: auto !important; /* Enables scroll when needed */
    -webkit-overflow-scrolling: touch;
    display: block !important;
    padding-bottom: 10px;
}

    /* Table inside any .container becomes responsive */
    .container table {
        width: 100% !important;
        /*table-layout: fixed !important;*/ /* Prevents overflow */
        border-collapse: collapse;
    }

    Cells wrap instead of stretching container
    .container th,
    .container td {
        word-break: break-word !important;
        white-space: normal !important;
        min-width: 80px;
    }

    Buttons/anchors inside table should also wrap
    .container .btn,
    .container button,
    .container a {
        white-space: normal !important;
    }

/* ============================================================
   SPECIAL FIX — Prevent overflow on Nest Hub 1024 × 600
   ============================================================ */
@media (max-width: 1050px) {
    .quick1099-table .table {
        min-width: 900px !important; /* Enables scroll instead of stretching */
        white-space: pre-wrap !important
    }
}

/* Fix top cut-off issue on mobile */
@media (max-width: 576px) {
    .modal-dialog {
        margin: 10px auto !important;
        padding-top: 0 !important;
        width: 95% !important;
        max-width: 95% !important;
    }

    .modal-content {
        border-radius: 10px;
    }

    .container {
        padding: 5px !important;
        margin-top: 10px !important;
    }
}

/* Desktop & Big screens - Button stays right */
.add-btn-wrapper {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
}

/* Medium screens < 1200px - Button moves to left */
@media (max-width: 1200px) {
    .add-btn-wrapper {
        justify-content: flex-start;
        margin-top: 10px;
    }
}

/* Small screens < 768px - Button becomes full-width */
@media (max-width: 768px) {
    .btnnAddNew {
        width: 100% !important;
        text-align: center !important;
        display: block !important;
    }
}

/* Extra small < 480px - More spacing */
@media (max-width: 480px) {
    .add-btn-wrapper {
        margin-top: 12px;
    }
}


/* =======================================
  Table pagination container
   ======================================= */


/* Table caption positioning */
table caption {
    caption-side: top;
    padding: 0;
    margin-bottom: 5px;
}

/* Toolbar container */
.table-toolbar {
    display: block;
    margin-bottom: 15px;
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-radius: 6px;
    border: 1px solid #e1e1e1;
}

/* Flex wrapper */
.table-toolbar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

/* Left section */
.table-toolbar-left {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Label */
.table-toolbar-label {
    font-size: 14px;
    color: #555;
    margin: 0;
    white-space: nowrap;
}

/* Select */
.table-toolbar-select {
    width: auto;
    min-width: 70px;
    padding: 4px 8px;
    font-size: 14px;
    cursor: pointer;
}

/* Center info */
.table-toolbar-center {
    display: flex;
    align-items: center;
}

.table-toolbar-info {
    font-size: 14px;
    color: #333;
    font-weight: 500;
}

/* Right section */
.table-toolbar-right {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Page info text */
.table-toolbar-pageinfo {
    margin: 0 10px;
    font-size: 14px;
    font-weight: 500;
    color: #333;
    white-space: nowrap;
}

/* Buttons */
.table-toolbar-btn {
    padding: 4px 8px;
    min-width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Responsive handling */
@media (max-width: 768px) {
    .table-toolbar-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .table-toolbar-right {
        justify-content: center;
        width: 100%;
    }
}


/* =======================================
   CSV Bulk Styles
   ======================================= */

.bulkTableHead {
    
    position: sticky;
    top: 0;
    z-index: 10;
}
.bulkTableRow {
    background-color: #1cbaa0 !important;
    color: #fff;
}
.bulkTableHead th {
    background-color: #1cbaa0 !important;
    color: #fff !important; /* text color */
/*    font-weight: 600;*/
}

/* =======================================
   New Table View Styles (quick1099.css)
   ======================================= */
.quick1099-table {
    background: #fff;
    border-radius: 12px;
    padding: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    /*        font-family: 'Inter', 'Segoe UI', sans-serif;*/
}


    /* --- Table Styles --- */
    .quick1099-table .table {
        width: 100%;
        border: 1px solid #ccc !important; /* Remove any outer border */
        border-collapse: separate !important; /* for rounded corners */
        border-spacing: 0;
        background: #fff !important; /* Plain white table */
        margin-top: 0px;
        border-radius: 12px !important;
        box-shadow: 0 0px 10px rgba(0, 0, 0, 0.05);
    }

        /* ✅ Plain white header with only bottom border */
        .quick1099-table .table thead th {
            border-bottom: 2px solid #d9d9d9 !important; /* subtle divider */
            border-top: none !important;
            border-left: none !important;
            border-right: none !important;
            background-color: #1cbaa0 !important; /* white header */
            color: #fff !important;
            font-weight: 700 !important;
            text-align: left;
            padding: 7px !important;
            font-size: 15px !important;
            vertical-align: middle !important;
        }

        /* ✅ Remove all other borders */
        .quick1099-table .table th,
        .quick1099-table .table td {
            white-space: nowrap !important;
            /*                font-family: 'Exo', sans-serif !important;*/
            border: none !important;
            background-color: #ffffff !important; /* keep cells plain white */
        }


        /* ✅ Body rows — no shading */
        .quick1099-table .table > tbody > tr > td {
            padding: 12px 14px !important;
            font-size: 14px;
            color: #242323 !important;
            vertical-align: middle !important;
            background-color: #ffffff !important; /* plain white cells */
        }

        /* ✅ Optional hover (slight background only) */
        .quick1099-table .table > tbody > tr:hover {
            background-color: #fafafa !important; /* very light gray hover */
            transition: 0.15s ease;
        }

        .quick1099-table .table > tbody > tr > td {
            padding: 12px 14px !important;
            font-size: 14px;
            color: #242323 !important;
            vertical-align: middle !important;
        }

        .quick1099-table .table > tbody > tr:hover {
            background-color: #fafaff !important;
            transition: 0.15s ease;
        }

    .quick1099-table table tbody tr:nth-child(even) td {
        background-color: #F8F9FF !important;
    }

    .quick1099-table table tbody tr:hover td {
        background-color: #ECEEFF !important; /* hover color */
        cursor: pointer;
    }


    /* ✅ Rounded top corners on thead */
    .quick1099-table .table thead tr:first-child th:first-child {
        border-top-left-radius: 12px;
        /*                background-color: none !important;*/
    }

    .quick1099-table .table thead tr:first-child th:last-child {
        border-top-right-radius: 12px;
        /*                background-color: none !important;*/
    }

    /* ✅ Rounded bottom corners on tbody */
    .quick1099-table .table tbody tr:last-child td:first-child {
        border-bottom-left-radius: 12px;
        /*                background-color: none !important;*/
    }

    .quick1099-table .table tbody tr:last-child td:last-child {
        border-bottom-right-radius: 12px;
        /*                background-color: none !important;*/
    }


    /* --- Header (no visible sort icons, but still clickable) --- */
    .quick1099-table .table > thead > tr > th {
        color: #333;
        font-weight: 600;
        text-align: left;
        padding: 14px;
        font-size: 14px;
        vertical-align: middle !important;
        border-bottom: 1px solid #eee !important;
        cursor: pointer; /* Sorting still works */
    }

    /* --- Table Body --- */
    .quick1099-table .table > tbody > tr > td {
        padding: 12px 14px !important;
        font-size: 14px;
        color: #333;
        vertical-align: middle !important;
        text-align: left;
        border-top: none !important; /* No internal borders */
    }

    .quick1099-table .table > tbody > tr:hover {
        background-color: #fafaff !important;
        transition: 0.15s ease;
    }

    /* --- Action Buttons --- */
    .quick1099-table .fa-icon {
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        background: #fff;
        padding: 6px 8px;
        margin: 0 2px;
        transition: 0.2s ease;
        font-size: 15px;
    }

        .fa-hover:hover {
            transform: translateY(-2px);
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
        }
        .quick1099-table .fa-hover:hover {
            transform: translateY(-2px);
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
        }

    /* ✅ Polished hover states and color logic */
    .quick1099-table .fa-icon.edit {
            color: #000; /* Edit = black */
        }

        .quick1099-table .fa-icon.delete {
            color: #e74c3c; /* Delete = red */
        }

        .quick1099-table .fa-icon:hover {
            transform: translateY(-2px);
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
        }

        .quick1099-table .fa-icon.edit:hover {
            color: #7a2ef6;
            border-color: #cbb9ff;
        }

        .quick1099-table .fa-icon.delete:hover {
            background: #ffe9e7;
            border-color: #f5b1a8;
        }

    /* --- Pagination --- */
    .quick1099-table .dataTables_paginate {
        text-align: center;
        padding: 10px 10px;
    }

    .quick1099-table .dataTables_wrapper .dataTables_paginate .paginate_button {
        border-radius: 8px;
        border: none !important;
        background: transparent !important;
        color: #555 !important;
        margin: 0 2px;
        transition: all 0.2s ease;
    }

        .quick1099-table .dataTables_wrapper .dataTables_paginate .paginate_button.current {
            /*            background: #7a2ef6 !important;
            color: #fff !important;*/
            display: none;
        }

        .quick1099-table .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
            background: #ece8ff !important;
        }

    /* --- Info text --- */
    .quick1099-table .dataTables_info {
        color: #666;
        font-size: 14px;
        padding-top: 10px;
    }

    /* --- Dropdown & Entries --- */
    .quick1099-table .dataTables_length select {
        border-radius: 6px;
        border: 1px solid #ddd;
        padding: 6px 8px;
        font-size: 13px;
        color: #333;
    }

    .quick1099-table .dataTables_length label {
        font-size: 13px;
        color: #444;
        font-weight: 500;
    }


/* =======================================
   DataTable Header (Search + Length)
   ======================================= */

/* ✅ Arrange search and length controls side by side */
.dataTables-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
    gap: 10px;
}

/* ✅ Stylish search input */
#tablegrid_filter, #gridTable_filter, #invoicegrid_filter, #tblAccounts_filter {
    /*    margin-bottom: 0px !important;*/
    text-align: left !important;
    padding: 0;
    margin: 0;
}

    #tablegrid_filter input.search-box-custom,
    #gridTable_filter input.search-box-custom,
    #invoicegrid_filter input.search-box-custom,
    tblAccounts_filter input.search-box-custom {
        width: 420px !important;
        height: 38px !important;
        border-radius: 10px;
        padding: 10px 16px 10px 42px;
        font-size: 15px;
        font-weight: 400;
        border: 1px solid #d1d1d1;
        outline: none;
        color: #333;
        background: #fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="%23999" viewBox="0 0 512 512"><path d="M505 442.7l-99.7-99.7c28.4-34.9 45.7-79 45.7-127.1C451 98 353 0 229.5 0S8 98 8 215.9s98 215.9 221.5 215.9c48.1 0 92.2-17.3 127.1-45.7l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l14.8-14.8c9.4-9.3 9.4-24.5 0-33.8zM229.5 367.9c-83.9 0-152-68.1-152-152s68.1-152 152-152 152 68.1 152 152-68.1 152-152 152z"/></svg>') no-repeat 14px center;
        background-size: 18px;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }

    /* Placeholder — light gray, thin font */
    #tablegrid_filter input::placeholder,
    #gridTable_filter input::placeholder,
    #invoicegrid_filter input::placeholder,
    #tblAccounts_filter input::placeholder {
        color: #aaa;
        font-weight: 400;
        font-size: 15px;
    }

    /* Focus effect — subtle purple glow */
    #tablegrid_filter input:focus,
    #gridTable_filter input:focus,
    #invoicegrid_filter input:focus,
    #tblAccounts_filter input:focus {
        border-color: #7a2ef6;
        box-shadow: 0 0 4px rgba(122, 46, 246, 0.25);
    }

/* ✅ “Show entries” section on the right */
#tablegrid_length, #gridTable_length, #invoicegrid_length, #tblAccounts_length {
    text-align: right !important;
    font-size: 14px;
}

    /* Dropdown styling */
    #tablegrid_length select, #gridTable_length select, #invoicegrid_length select, #tblAccounts_length select {
        border-radius: 8px;
        padding: 8px 12px;
        border: 1px solid #d1d1d1;
        height: 37px;
        width: 90px !important;
        font-size: 15px;
        color: #333;
        background-color: #fff;
        outline: none;
        transition: all 0.2s ease;
    }

        /* Focus state for dropdown */
        #tablegrid_length select:focus,
        #gridTable_length select:focus,
        #invoicegrid_length select:focus,
        #tblAccounts_length select:focus {
            border-color: #7a2ef6;
            box-shadow: 0 0 4px rgba(122, 46, 246, 0.25);
        }

    /* Label next to dropdown */
    #tablegrid_length label,
    #gridTable_length label,
    #invoicegrid_length label,
    #tblAccounts_length label{
        margin-bottom: 0;
        color: #666;
        font-weight: 400;
        font-size: 14px;
    }

/*Table header filtration styles*/
.tblfilter {
    display: block;
    margin-top: 4px;
    padding: 1px;
    width: 75px;
    border-radius: 5px;
    border: 1px solid #ccc;
}

/* ===========================
   📱 Responsive Tweaks
   =========================== */

/* Mobile */
@media (max-width: 768px) {

    .dataTables-header-row {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    #tablegrid_filter input.search-box-custom,
    #tblAccounts_filter input.search-box-custom,
    #auditGridTable_filter input.search-box-custom {
        width: 100% !important;
        margin-bottom: 10px;
    }

    #tablegrid_length,
    #tblAccounts_length,
    #auditGridTable_length {
        text-align: left !important;
    }
}

/* Desktop */
@media (min-width: 1200px) {

    .dataTables-header-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        max-width: 100%;
        padding: 0 10px;
    }

    #tablegrid_filter input.search-box-custom,
    #tblAccounts_filter input.search-box-custom,
    #auditGridTable_filter input.search-box-custom {
        width: 550px !important;
        height: 44px !important;
        font-size: 16px;
    }

    #tablegrid_length select,
    #tblAccounts_length select,
    #auditGridTable_length select {
        width: 100px;
        font-size: 16px;
    }

    #tablegrid_length label,
    #tblAccounts_length label,
    #auditGridTable_length label {
        font-size: 15px;
    }
}

/* Hide all default DataTables icons */
.quick1099-table table.dataTable thead th.sorting:before,
.quick1099-table table.dataTable thead th.sorting:after,
.quick1099-table table.dataTable thead th.sorting_asc:before,
.quick1099-table table.dataTable thead th.sorting_asc:after,
.quick1099-table table.dataTable thead th.sorting_desc:before,
.quick1099-table table.dataTable thead th.sorting_desc:after {
    color: black !important;
    display: none !important;
    /*    content: none !important;*/
    /*    visibility: hidden !important;*/
}

/* Add custom down arrow only on hover or when active */
.quick1099-table table.dataTable thead th.sorting:hover::after,
.quick1099-table table.dataTable thead th.sorting_asc::after,
.quick1099-table table.dataTable thead th.sorting_desc::after {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    content: "\f078"; /* fa-chevron-down */
    display: inline-block !important;
    margin-left: 6px;
    color: black !important;
    font-size: 11px;
    vertical-align: middle;
    opacity: 0.9;
}

/* Flip the icon if sorted descending */
.quick1099-table table.dataTable thead th.sorting_desc::after {
    transform: rotate(180deg);
}


/* =======================================
   New Form View Styles (quick1099.css)
   ======================================= */

.form-container {
    margin-top: 80px !important; /* Adjust 60–100px as needed */
}

.modal-header {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.modal-body {
    padding-top: 0.2rem !important; /* reduce default spacing */
}

.asterick {
    color: black;
    font-size: 15px;
    margin: -5px 0px 0px 5px;
}


.input-container {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    width: 100%;
    margin-bottom: 15px;
}

/* Apply the same style to both inputs and selects */
.quick1099-form .input-field.widd,
.quick1099-form select.widd {
    width: 100% !important;
    height: 38px;
    border: 1px solid #d9dbde !important;
    border-radius: 5px;
    padding: 8px 12px;
    font-size: 14px;
    background-color: #ffffff;
    color: #111827;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.02);
    transition: all 0.2s ease;
    box-sizing: border-box;
    appearance: none; /* Removes default browser dropdown arrow style */
}

    /* Focus effect */
    .quick1099-form .input-field.widd:focus,
    select.widd:focus {
        border-color: #a78bfa;
        box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.2);
        outline: none;
    }

/* Placeholder color for inputs */
.quick1099-form input-field.widd::placeholder {
    color: #9ca3af;
    opacity: 1;
}

/* Custom dropdown arrow for select (optional) */
.quick1099-form select.widd {
    background-image: url("data:image/svg+xml;utf8,<svg fill='gray' height='12' viewBox='0 0 24 24' width='12' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 12px;
    padding-right: 30px; /* to make space for arrow */
    cursor: pointer;
}

/* Check box */
.quick1099-form .input-field.widcheck {
    width: auto !important;
    height: 18px; /* standard radio size */
    margin: 4px 10px 4px 2px !important; /* top right bottom left */
    vertical-align: middle; /* aligns radio vertically with text */
    accent-color: #093861; /* optional: custom color */
    padding: 5px !important;
}

/* Save and Cancel button styles */

.btnn {
    /*    font-family: "Muli", sans-serif;*/
    font-weight: 700;
    background-color: #093861;
    border: none; /* remove all borders */
    border-radius: 10px; /* smooth rounded corners */
    color: #fff !important;
    height: 38px;
    padding: 6px 20px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 6px rgba(154, 77, 196, 0.3); /* subtle glow */
}

    .btnn:hover {
        background-color: #093861;
        transform: translateY(-1px);
    }

    .btnn.btnSubmit {
        width: 18%;
    }

.btnCancel {
    /*    font-family: "Muli", sans-serif;*/
    font-weight: 700;
    background-color: #fff !important;
    color: #6c757d !important;
    border: 1px solid #ccc !important;
    border-radius: 8px;
    height: 38px;
    padding: 6px 20px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

    .btnCancel:hover {
        background-color: #f0f0f0 !important;
        color: #4a4a4a !important;
    }


/*The cancel which is inside the form*/
.quick1099-form .btnCancel {
    /*        font-family: "Muli", sans-serif;*/
    font-weight: 700;
    background-color: #fff !important;
    color: #6c757d !important; /* softer gray text */
    border: 1px solid #ccc;
    border-radius: 8px;
    height: 38px;
    padding: 6px 20px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}
.quick1099-form .btnInnerSingle {
    /*        font-family: "Muli", sans-serif;*/
    font-weight: 700;
    background-color: #093861 !important;
    color: #fff !important; /* softer gray text */
    border: 1px solid #ccc;
    border-radius: 8px;
    height: 38px;
    padding: 6px 20px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}
.quick1099-form .btnInnerBulk {
    /*        font-family: "Muli", sans-serif;*/
    font-weight: 700;
    background-color: #1cbaa0 !important;
    color: #fff !important; /* softer gray text */
    border: 1px solid #ccc;
    border-radius: 8px;
    height: 38px;
    padding: 6px 20px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

    .quick1099-form .btnCancel:hover, .btnInner:hover {
        background-color: #f0f0f0 !important; /* light gray hover */
        color: #4a4a4a !important; /* darker gray on hover */
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    }

    .quick1099-form .btnCancel:active, .btnInner:active {
        transform: translateY(0);
        background-color: #e2e2e2 !important;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    }

    .quick1099-form .btnCancel:focus, .btnInner:focus {
        outline: none;
        box-shadow: 0 0 0 3px rgba(108, 117, 125, 0.2);
    }

/*===============================
    INVOICE Screen Styles
    ============================================*/

#invoicegrid {
    display: none;
}

.irsfilter {
    margin-bottom: 10px !important;
}

.form-vertical {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px;
    width: 100%;
}

    .form-vertical label {
        margin-bottom: 2px;
        font-weight: 500;
        white-space: normal;
    }

    .form-vertical input,
    .form-vertical select,
    .form-vertical a,
    .form-vertical button {
        width: 100% !important;
    }

    .form-vertical a,
    .form-vertical button {
        width: 60% !important;
    }

.btn-group-inline {
    display: flex;
    gap: 10px;
}

    .btn-group-inline .btnn {
        flex: 1; /* both buttons same width */
    }



.page-size-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap; /* makes it responsive */
    gap: 8px; /* space between label and dropdown */
    padding: 15px !important;
}

/* Label */
.page-size-label {
    margin: 0;
    font-weight: 500;
}

/* Dropdown */
.page-size-dropdown {
    width: 80px !important; /* same width as you used */
    padding: 5px;
    border-radius: 8px;
}

/* Mobile Responsive */
@media (max-width: 576px) {
    .page-size-container {
        justify-content: flex-start; /* align left on mobile */
    }

    .page-size-dropdown {
        width: 100%; /* full width on mobile */
    }
}


/*Invioce */

.invioceContainer {
    width: 93% !important;
    margin: 0 auto; /* Centers the container */
    /*padding: 20px 25px;*/ /* Inner spacing */

    background: #ffffff; /* White background */
    /*border-radius: 12px;*/ /* Smooth rounded corners */
    /*box-shadow: 0 2px 10px rgba(0,0,0,0.08);*/ /* Soft shadow */
}


.invoiceForm-container {
    margin-top: 100px !important;
    margin-bottom: 50px !important;
}

.invoiceBtnContainer {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px;
    margin: 15px !important;
}

/* Date column */
.quick1099-table table thead th.invoiceDate {
    min-width: 90px;
}

/* Base Price Amount */
.quick1099-table table thead th.invoicePrice {
    min-width: 140px;
}

/* Print / Download */
.quick1099-table table thead th.invoiceprintbtn {
    min-width: 160px;
}
/* Date column */
.quick1099-table table thead th.invoiceDate {
    min-width: 60px !important;
    max-width: 70px;
    white-space: nowrap;
    text-align: center;
}

/* No Of Forms column */
.quick1099-table table thead th.invoiceForm {
    min-width: 70px !important;
    max-width: 90px;
    white-space: nowrap;
    text-align: center;
}
/* Invoice NO column */
.quick1099-table table thead th.invoiceNo {
    min-width: 40px !important;
    max-width: 40px;
    white-space: nowrap;
    text-align: center;
}

/* amount column */
.quick1099-table table thead th.invoiceAmount {
    min-width: 90px !important;
    max-width: 90px;
    /*            white-space: nowrap;*/
    text-align: center;
}

/* amount column */
.quick1099-table table thead th.customerName {
    min-width: 105px !important;
    max-width: 105px;
    white-space: nowrap;
    text-align: center;
}

/*Payment card issue*/
#card-container {
    width: 500px;
    margin: 0 auto;
    padding: 15px;
}

/* Wrapper (optional but recommended) */
.payment-actions {
    display: flex;
    justify-content: center;
    gap: 12px; /* spacing between buttons */
    align-items: center;
    margin-bottom: 5px !important;
}

/* Common button base */
/*.btnn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 10px 20px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.25s ease;
}*/

    /* Pay button */
    .btnn.btnPay {
        background-color: #093861 !important;
        color: #fff !important;
        border: none;
    }

        .btnn.btnPay:hover {
            background-color: #093861 !important;
            transform: translateY(-1px);
        }

    /* Cancel button */
    .btnn.btnPaymentCancel {
        background-color: #fff !important;
        color: #6c757d !important;
        border: 1px solid #ccc !important;
        font-weight: 700;
        height: 38px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    }

        .btnn.btnPaymentCancel:hover {
            background-color: #f0f0f0 !important;
            color: #4a4a4a !important;
            transform: translateY(-1px);
        }

#processingScreen {
    margin-top : 70px !important;
}

.paymentLoader {
    width: 50px;
    height: 50px;
    border: 5px solid #e5e7eb; /* light gray background */
    border-top: 5px solid #1cbaa0; /* blue spinner */
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 55px auto; /* center horizontally */
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}



.quick1099-table .printbtn {
    padding-left: 20px;
    width: 175px !important;
    max-width: 175px !important;
}

.quick1099-table .invoiceprintbtn {
    padding-left: 20px;
    width: 175px !important;
    max-width: 175px !important;
}

.quick1099-table .invoiceDate {
    width: 80px !important;
    max-width: 80px !important;
}

.quick1099-table .invoicePrice {
    width: 80px !important;
    max-width: 80px !important;
}

/* ==================================================
    Footer styles
    =================================================
*/

.footer-home-one {
    background: #1cbaa0 !important;
    position: relative;
}

    .footer-home-one:before {
        position: absolute;
        content: "";
        /*        background: #000;*/
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        opacity: 0.7;
    }

    .footer-home-one h5 {
        margin: 40px 0 0;
    }

    .footer-home-one .footer-line-one {
        width: 40px;
        height: 1px;
        background: #fff;
        border: none;
    }

    .footer-home-one ul.social-link-h-one {
        margin: 0;
    }

        .footer-home-one ul.social-link-h-one li {
            list-style: none;
            float: left;
        }

            .footer-home-one ul.social-link-h-one li a {
                background: #fff;
                width: 40px;
                height: 40px;
                text-align: center;
                color: #4f4bdb;
                -webkit-transition: all 0.4s ease;
                -moz-transition: all 0.4s ease;
                position: relative;
                display: inline-block;
                line-height: 40px;
                transition: all 0.4s ease;
            }

                .footer-home-one ul.social-link-h-one li a i {
                    line-height: 40px;
                }

                .footer-home-one ul.social-link-h-one li a:before {
                    transition: all 0.4s;
                    content: "";
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    border: 1px solid #ffffff;
                }

                .footer-home-one ul.social-link-h-one li a:hover:before {
                    width: 60px;
                    height: 60px;
                    top: -10px;
                    left: -10px;
                    border: 10px solid rgba(255, 255, 255, 0.1);
                }

                .footer-home-one ul.social-link-h-one li a:hover {
                    background: #fab400;
                    color: #fff;
                    transition: all 0.4s;
                    background: -moz-linear-gradient(top, #fab400 0%, #fab400 100%);
                    background: -webkit-gradient(left top, left bottom, color-stop(0%, #fab400), color-stop(100%, #fab400));
                    background: -webkit-linear-gradient(top, #fab400 0%, #fab400 100%);
                    background: -o-linear-gradient(top, #fab400 0%, #fab400 100%);
                    background: -ms-linear-gradient(top, #fab400 0%, #fab400 100%);
                    background: linear-gradient(to bottom, #fab400 0%, #fab400 100%);
                }

        .footer-home-one ul.social-link-h-one li {
            margin-right: 10px;
        }

            .footer-home-one ul.social-link-h-one li:last-child {
                margin: 0;
            }

    .footer-home-one .footer-link-pages li {
        list-style: square inside;
        padding: 0 0 10px;
        font-size: 16px;
        color: #fff;
    }

        .footer-home-one .footer-link-pages li a {
            color: #fff;
        }

        .footer-home-one .footer-link-pages li:hover a {
            margin-left: 4px;
            color: #fab400;
        }

        .footer-home-one .footer-link-pages li:hover {
            color: #fab400;
        }

        .footer-home-one .footer-link-pages li a:hover {
            text-decoration: none;
        }

        .footer-home-one .footer-link-pages li:hover:before {
            color: #fab400;
        }

    .footer-home-one .footer-home-one-newsletter {
        margin: 30px 0 0;
    }

        .footer-home-one .footer-home-one-newsletter input[type="text"] {
            border: none;
            background: #fff;
            padding: 10px 20px;
            width: 80%;
            float: left;
            height: 42px;
        }

        .footer-home-one .footer-home-one-newsletter input[type="submit"] {
            background: url(../images/home-one-newsletter-icon.png);
            background-color: #fab400;
            border: none;
            background-repeat: no-repeat;
            padding: 10px 20px;
            background-position: center;
            text-indent: -9999em;
            width: 20%;
            height: 42px;
        }



/* =================================================================
    Loading indicator styles
    ================================================================
*/


/* Full screen overlay */
.loader-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

/* White box */
.loader-box {
    background: #ffffff;
    padding: 30px 50px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

/* Spinner */
.spinner {
    width: 45px;
    height: 45px;
    border: 5px solid #1cbaa0;
    border-top: 5px solid #ffffff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin: 0 auto 15px;
}

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}


/* =================================================================
    New fonts area
    ================================================================
*/

body, h1, h2, h3, h4, h5, h6, p, a, button, input, select, table,
.quick1099-table .table th, .quick1099-table .table td, #tablegrid_length, #gridTable_length, #invoicegrid_length {
    font-family: 'Exo', sans-serif !important;
}

/* Fix thin typing issue in input fields */
input, textarea, select {
    font-weight: 500 !important; /* <-- make typed text thicker */
    color: #333 !important; /* <-- improves clarity */
}
    /* Make typed text readable */
    input:not(:placeholder-shown),
    textarea:not(:placeholder-shown) {
        font-weight: 500 !important;
        color: #333 !important;
    }

    input::placeholder {
        font-weight: 400;
        opacity: 0.8;
    }

.form-filing-create-page {
    margin-top: calc(100px + 2rem);
}

.no-records {
    text-align: center;
    vertical-align: middle;
    padding: 20px;
    font-weight: 500;
    color: #666;
}



/*=================================================================================
    Admin screens styles starts
    ===============================================================================
*/

/*=================================================================================
    Admin TAX FILE MANAGEMENT MODULE styles starts
    ===============================================================================
*/
#modalFileName {
    font-size: 14px !important;
    /*    font-family: 'Muli', Sans-serif !important;*/
    font-weight: bold !important;
    color: dimgray !important;
}

.irsmgtGrid {
    margin-top: 10px;
    margin-bottom: 20px;
}

.modal-xxl {
    margin-top: 100px !important;
    max-width: 95% !important;
    width: 95% !important;
}

#fileModal .modal-body {
    height: auto;
    overflow: auto;
}

#fileContent {
    font-size: 13px;
    white-space: pre; /* important for IRS formatting */
}

.admin-tool-text {
    font-size: 20px !important;
    /*    font-family: 'Muli', Sans-serif !important;*/
    font-weight: bold !important;
    color: #1cbaa0 !important;
    padding-top: 1%;
    padding-bottom: 5px !important;
    white-space: nowrap; /* prevents wrapping */
}


.admin-profile-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
}

    /* Hide */
    .admin-profile-header .submenu {
        display: none;
        position: absolute;
        top: 60px;
        right: 0;
    }

    /* Show ONLY on image hover */
    .admin-profile-header img:hover + .admin-tool-text + .submenu {
        display: block;
    }

/* ===== Pagination Container ===== */
.batch-pagination-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
    padding: 10px 15px;
    border-top: 1px solid #ddd;
    background-color: #fafafa;
}

/* ===== LEFT: Page Info ===== */
.batch-pagination-left {
    font-size: 14px;
    font-weight: 500;
}

/* ===== CENTER: Navigation Buttons ===== */
.batch-pagination-center {
    display: flex;
    align-items: center;
    gap: 10px;
}

.batch-pagination-btn {
    padding: 5px 12px;
    border: 1px solid #ccc;
    background-color: #fff;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
}

    .batch-pagination-btn:hover {
        background-color: #007bff;
        color: #fff;
        border-color: #007bff;
    }

    .batch-pagination-btn:disabled {
        background-color: #eee;
        color: #999;
        cursor: not-allowed;
    }

/* ===== RIGHT: Page Size ===== */
.batch-pagination-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.batch-pagination-select {
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.action-cell {
    display: flex;
    gap: 10px; /* space between buttons */
}

/* Common button style */
.btn-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 13px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

/* Skip Button */
/* Skip Button */
.btn-skip {
    background-color: #fff;
    border: 1px solid #dcdcdc; /* light gray border */
    color: #093861 !important;
    height: 38px;
    padding: 6px 12px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    /* Hover */
    .btn-skip:hover {
        background-color: #f8f9fa; /* subtle gray */
        border-color: #cfcfcf;
        transform: translateY(-1px);
    }

    /* Active (click feel) */
    .btn-skip:active {
        transform: translateY(0);
        background-color: #f1f1f1;
    }

.btn-remove {
    background-color: #fff;
    border: 1px solid #dcdcdc;
    color: orangered;
    height: 38px;
    padding: 6px 12px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-remove:hover {
        background-color: #fff5f3;
        border-color: #ffb3a7;
    }

    .btn-remove:active {
        transform: translateY(0);
        background-color: #f1f1f1;
    }

/* Icon size alignment */
.btn-action i {
    font-size: 12px;
}

/* Row highlight */
#batchTable tbody tr.row-skipped td {
    background-color: #fff3cd !important;
    color: #856404;
    font-weight: 500;
}

#batchTable tbody tr.row-removed td {
    background-color: #f8d7da !important;
    color: #721c24;
    font-weight: 500;
}

/* Undo button */
.btn-undo {
    background-color: #6c757d;
    color: #fff;
}

    .btn-undo:hover {
        background-color: #5a6268;
    }

.modal-footer-actions {
    display: flex;
    gap: 12px;
    margin-top: 15px;
}

/* Primary */
.btn-primary-action {
    background-color: #093861;
    color: #fff;
    border: none;
    padding: 8px 18px;
    border-radius: 6px;
    cursor: pointer;
}

/* Cancel */
.btn-secondary-action {
    background-color: #f1f1f1;
    color: #333;
    border: 1px solid #ccc;
    padding: 8px 18px;
    border-radius: 6px;
    cursor: pointer;
}

/* Download */
.btn-download-action {
    background-color: #ffffff;
    color: #093861;
    border: 1px solid #dcdcdc;
    padding: 8px 18px;
    border-radius: 6px;
    cursor: pointer;
}

.parent-info-icon {
    color: #093861 !important; 
    margin-left: 6px;
    cursor: pointer;
    font-size: 21px !important;
    vertical-align: middle;
}

    .parent-info-icon:hover {
        color: #093861; /* darker on hover */
        transform: scale(1.15);
        transition: all 0.2s ease-in-out;
    }

.primary-box-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
}

.primary-box-actions {
    display: flex;
    gap: 5px;
}

.primary-box-input {
    height: 32px;
    padding: 4px 8px;
}
.btn-action-amount {
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 4px 6px;
    font-size: 18px;
    transition: all 0.2s ease;
}

/* Edit */
.btn-edit {
    color: #0d6efd;
}

    .btn-edit:hover {
        color: #0b5ed7;
        transform: scale(1.1);
    }

/* Save */
.btn-save {
    color: #198754;
}

    .btn-save:hover {
        color: #157347;
        transform: scale(1.1);
    }

/* Cancel */
.btn-cancel {
    color: #dc3545;
}

    .btn-cancel:hover {
        color: #bb2d3b;
        transform: scale(1.1);
    }
/*===============================================
    Change batch file styles
    =============================================
*/

.accountlock-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 15px !important;
}

    .accountlock-header h5 {
        margin: 0;
    }

    .accountlock-header .close {
        background: none;
        border: none;
        font-size: 24px;
        cursor: pointer;
        padding: 0;
    }
.status-row {
    display: flex;
    align-items: center;
    justify-content: center; /* centers horizontally */
    gap: 20px; /* spacing between dropdown & button */
    margin: 20px 0;
}