.btn-small {
    height: 30px;
    padding: 0;
    margin: 0;
    padding-left: 5px;
    padding-right: 5px;
}

.bg-primary {
   /* background-color:#b48484 !important;*/
    background-color: #f5f3eb !important;
}

#sidebar {
    width:22%;
    min-width:250px;
    background-color:#efe9e1;
    padding-top: 10px !important;
    color:#5e6278;
}
.menu-category {
    /*opacity:0.5;*/
    /*opacity:0.7;*/
    opacity:0.9;
    color:#7e8299;
    /*font-size:15px;*/
    font-size:12px;
    font-weight: bold;
}
#sidebar .sidebar-links {
    color:#5e6278;
}

.sidebar-icons {
    margin-right:10px;
    color:#5e6278;
}
.sidebar-icons:hover {
    color:#181c32;
}

#sidebar a[data-toggle="collapse"]:hover, #sidebar ul li a:hover {
  /*opacity:1;
  text-decoration-color: #007c89;
  color: #007c89!important;
  font-weight:bold;*/
  text-decoration-line: none;
  /*font-weight: bold;*/
    color:#181c32;
}
div#app {
    /*padding-top:85px;
    left: 15%;
    position: absolute;
    width: 85%;*/
    /*position: relative;*/
    position: absolute;
    left: 22%;
    /*left: 9%;*/
    width: 78%;
    padding-top:0px;
}

.sidebar_user_box {
    /*border-top:1px solid #ccc;
    border-bottom:1px solid #ccc;*/
    padding-top: 12px;
    padding-bottom: 12px;
    margin-top: 12px;
    margin-bottom: 25px;
    text-align:center;
    margin-left:-16%;
}
.sidebar_user_box img {
    display:block;
    margin-left:auto;
    margin-right:auto;
    height:60px;
    width:60px;
    margin-bottom:10px;
}

#sidebar {
    position:fixed;
}
.sidebar-header {
    /*height:25vh;*/
    height:7vh;
}

.sidebar-neck {
    height:5vh;
}

.sidebar-body {
    margin-top:25px;
    /*height:75vh;*/
    /*height:72vh;*/
    height:62vh;
    overflow-y:scroll;
    padding-bottom:20px;
    margin-bottom:40px;
    flex-grow: 1; /* Pushes the footer to the bottom */
    overflow-y: auto;
    padding-top: 10px; /* Reduce space above menu */
}

#sidebar .sidebar-links {
    padding:0
}
#sidebar {
    border-left:8px solid #D9214E;
}
#acc_username {
    color:#181c32;
    font-weight:bold;
    font-size:14px;
}

:root {
    --primary: #f1416c;
}

.btn-primary {
  background-color: #f1416c;
  border-color: #f1416c;
}

.btn-primary:focus,
.btn-primary:hover,
.btn-primary:focus {
  background-color: #D9214E !important;
  border-color: #D9214E !important;
}



.btn-sm:focus{
    background-color: #D9214E;
    color: #000;
}



.btn-primary:disabled{
    background-color: #D9214E;
    border-color: #D9214E;
    opacity:0.4;
}
.btn-secondary {
  border-color: #D9214E;
  color: #D9214E;
}

.btn-secondary:hover {
    border: 1px solid #D9214E;
    background-color: #FBDEE5;
    color: #D9214E;
}

.btn-secondary:focus {
    border: 1px solid #D9214E;
    background-color: #FBDEE5;
    color: #D9214E;
}

/*
.btn-secondary:focus {
  background-color: #EF305E;
  border-color: #f1416c !important;
}
*/

.btn-secondary:focus {
  /*border-radius: 0rem;*/
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.1rem rgba(242,98,134, 0.5);
}

.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show > .btn-secondary.dropdown-toggle {
    color: #D9214E;
    background-color: #FBDEE5;
    border-color: #D9214E;
}

.btn-secondary:focus, .btn-secondary.focus {
  /*color: #fff;
  background-color: #f1416c;
  border-color: #f1416c;*/
  box-shadow: 0 0 0 0.1rem rgba(242,98,134, 0.5);
}




body {
    font-family:Poppins,Helvetica,sans-serif;
    background-color:#F9FAFB !important;
}

.panel {
    padding:40px;
}
.panel-heading {
    height:58px;
}
.panel-title {
    font-size:23px !important;
    line-height:27px;
    font-weight:600;
}
.panel-body {
    background-color:#fff;
    padding-left:50px;
    padding-right:50px;
    padding-top:20px;
    padding-bottom:20px;
    border-radius:10px;
    margin-top:40px;
}
.custom-breadcrumb {
    font-weight:500;
    color:#A1A5B7;
    font-size:13px;
    line-height:10px;
    text-transform: capitalize;
}

/*
.card {
    background-color:#fff;
    padding-left:50px;
    padding-top:20px;
    border-radius:10px;
    margin-top:40px;
    border:1px solid red;
}
.card-header {
    background-color:#fff;
}
.card-title h2 {
    font-size:20px;
    font-weight:600;
    line-height:23px;
}
*/

.panel-body h2 {
    font-size:20px;
    font-weight:600;
    line-height:23px;
    min-height:35px;
}

.panel-body-subheading {
    color:#a1a5b7;
    font-weight:500;
    font-size:15px;
}

#filename {
    border:none;
    border:1px solid #EFF2F5;
    padding:7px;
    background-color:#F5F8FA;
}
.notes strong {
    font-weight:600;
    font-size:16px;
    line-height:20px;
    color:#3F4254;
}
.notes ol li {
    font-weight:500;
    font-size:14px;
    line-height:21px;
    color:#7e8299;
}
.notes ol {
    margin:0;
    padding:11px;
}

.table-listclean th {
    text-transform: uppercase;
    border:none;
    font-size:12px;
    line-height:19px;
    font-weight:600;
    color:#b5b5c3;
    border-bottom:1px solid #eff2f5 !important;
}
.btn-refresh,
.btn-refresh:hover {
    cursor:pointer;
    border:none;
    background-color:none;
}

.badge-success {
    color: #fff;
    background-color:#50cd89;
    font-weight:400;
    font-size:11px !important;
    line-height:11px;
}

.badge-light-success {
    color: #50cd89;
    background-color: #e8fff3;
}

/*
.badge-light-warning {
    color: #ffc700;
    background-color:#fff8dd;
}*/ 
.badge-warning {
    color: #fff;
    background-color:#ffc700;
    font-weight:400;
    font-size:11px !important;
    line-height:11px;
}
.badge-dark {
    color: #ffffff;
    background-color:#343a40;
    font-weight:400;
    font-size:11px !important;
    line-height:11px;
}
.badge-danger {
    color: #fff;
    background-color:#f1416c;
    font-weight:400;
    font-size:11px !important;
    line-height:11px;
}


.badge-light-danger- {
    color: #ffffff;
    background-color: #f1416c;
}

.badge-light-danger {
    color: #d9214e;
    background-color: #ffe8e8;
}



.badge-light-gray {
    color: #252F4A;
    background-color: #B5B5C3;
}

.badge-info {
    color: #fff;
    background-color:#17a2b8;
    font-weight:400;
    font-size:11px !important;
    line-height:11px;
}
.badge-warning {
    color: #fff;
    background-color:#ffc107;
    font-weight:400;
    font-size:11px !important;
    line-height:11px;
}
.badge-secondary {
    color: #fff;
    background-color:#6c757d;
    font-weight:400;
    font-size:11px !important;
    line-height:11px;
}

.table-details,
.table-details  tr,
.table-details  tr th ,
.table-details  tr td {
    border:none !important;
}

#upload_img ,
#upload_img:focus,
#upload_img:active {
    /*border:1px solid #f1416c;*/
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    background-color:transparent;
    border:none;
    min-height:100px;
}

.upload_box {
    box-shadow: var(--lc-shadow, 0 8px 22px rgba(22, 20, 16, 0.045));
    margin-bottom:25px;
}

.graph_box {
    box-shadow: var(--lc-shadow, 0 8px 22px rgba(22, 20, 16, 0.045));
    margin-bottom:25px;
    border: 0px;
}

@media (max-width:767px){
     #app{
          padding-left:30px;
          width:100%;
          left:0!important;
          padding-right: 30px;  
        
       }

    div#app {
        left: 22%;
        width: 100%;
        padding-top: 0px;
    }



    .panel {
        padding: 0px!important;
        margin-top: 80px !important;
    }

    .panel-body h2{
        font-size: 20px!important;
    }

    .panel-body {
        background-color: #fff;
        padding-left: 20px;
        padding-top: 20px;
        padding-bottom: 20px;
        border-radius: 10px;
        margin-top: 40px;
        padding-right: 20px;
    }

    td{
        padding-left: 5% !important;
    }

   .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11{
        max-width:100%;
        margin-top: 30px;
   }
 
   .row {
       display: block;
   }

   .card {
       margin-top:15%;
       margin-bottom: 10%; 
   } 

   .down_w{
        width:100% !important;
   }

    
   .offer-noti {
    margin-bottom: 0rem;
    font-size:12px;    
   }
    
   .offer-code-in {
    width: 50% !important;
   }
 
}

.cus-fw-500{
    font-weight: 500;
}
 
.down_w{
    width:30%;
}

#uploadError {
    color:red;
    background-color:#efd8dc;
}

.primary-color {
    color: #D9214E;
}

a {
    color: #EF305E;
    text-decoration: none;
    background-color: transparent;
}

a:hover {
  color: #f1416c;
  text-decoration: none;
}

.enabled-icon {
    color:#EF305E;
}

.disabled-icon {
    color:#f1416c;
    opacity: .65;
}

.enabled-icon:hover {
    color:#f1416c;
}

.btn-link:focus {
    color: #f1416c;
    background-color: transparent;
    /*border-color: #004e56;*/
    border-color: transparent;
    box-shadow: 0 0 0 0.0rem rgba(242, 98, 134, 0.5);
    text-decoration: none;
}


.btn-primary:focus,
.btn-primary:hover,
.btn-primary:focus {
  background-color: #EF305E;
  border-color: #f1416c;
  /*border-radius: 0rem;*/
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.1rem rgba(242,98,134, 0.5);
}


.btn-primary:focus, .btn-primary.focus {
  color: #fff;
  background-color: #f1416c;
  border-color: #f1416c;
  box-shadow: 0 0 0 0.1rem rgba(242,98,134, 0.5);
}

.text-danger {
    color: darkred !important;
}

.text-success {
    color: darkgreen !important;
}

.sub-text-custom{
    font-size:14px;
    color:#A1A5B7;
    line-height: 1;
}

.download-button-custom-1 {
    font-size: 30px;
    padding-top: 15px;
    cursor: pointer;
}


.download-button-custom-1:hover {
    color: #D9214E !important;
}

.btn-redeem {
    background-color: transparent;
    border-color: #045702;
    color: #045702;
}


.btn-redeem:hover {
    background-color: #045702;
    border-color: #045702;
    color: #ffffff;
}

.btn-redeem:disabled {
    background-color: #D9214E;
    border-color: #D9214E;
    opacity:0.4;
    cursor: not-allowed !important;
}

/** card classes */
.list-clean.card .card-head {
    font-weight:bold;
    padding-top:10px;
} 

.list-clean.card .card-body {
    font-size:14px;
    height:125px;
} 

.list-clean.currency-selection {
    font-size:18px;  
}


.file-title{
    font-size: 12px;
    text-transform: uppercase;
    color:#b5b5c3 !important;
    font-weight: 600;
}
.billing-table select, 
.billing-table textarea, 
.billing-table input {
    /*width:290px;*/
    width:80%;
}

table.billing-table td{
    padding-top: 0px;
}

.custom-label-acc {
    width: 105px;
}

.billing_info{
    font-size:14px;
} 


textarea, input[type="text"], input[type="password"], input[type="file"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .faux-file {
    margin-bottom: 0px;
}


tr.usd_payment_methods td{
    padding-top: 0px;
}
tr.inr_payment_methods td{
    padding-top: 0px;
}

.sidebar-footer .dropdown-menu {
    padding:10px;
    /*position: absolute !important;*/ /* Force absolute positioning */
    /*z-index: 9999 !important; */ /* Ensure it appears on top */
    left: auto; /* Adjust alignment if necessary */
    right: 0;
    transform: translateY(5px); /* Small offset for better appearance */
}
.sidebar-footer .btn-link {
    color:#5e6278;
}

.dropdown-item.active, .dropdown-item:active {
    color: #D9214E;
    text-decoration: none;
    background-color: #FBDEE5;
}

.single-email-verification td {
    text-transform: capitalize;
}
.single-email-verification td.clean {
    color:darkgreen !important;
}
.single-email-verification td.dirty {
    color:darkred !important;
}

.badge-warning {
    color: #212529;
    background-color: #ffc107;
}
.badge-light-warning {
    color: #f1bc00;
    background-color: #fff8dd;
}
.badge-pill {
    padding-right: .6em;
    padding-left: .6em;
    border-radius: 10rem;
}
.badge {
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
}

.offer_code_link {
    /*width: 100%;*/
    /*color: rgb(239, 48, 94);*/
    text-align: left;
    /*padding: 0;*/
    /*margin-top: -22px;*/
    font-size: 16px;
    color:#EF305E;
}

.offer_code_link:hover {
    color:#D9214E;
}

.help-icons {
    margin-right:10px;
    color:#e1e1e1;
}
.help-icons:hover {
    color:#181c32;
}



.blink {
 /*   width: 220px;*/
  /*  height: 50px;*/
/*    line-height: 50px;*/
}
.blink-td {
    /*font-size: 26px;*/
    /*font-family: cursive;*/
    /*color: #fff;*/
    animation: blink 2.5s linear infinite;
}
@keyframes blink {
    0% {
     opacity: 0;
    }
    50% {
     opacity: 2;
    }
    100% {
     opacity: 1;
    }
}

.offer-noti {
    margin-bottom: 0rem;
}

.offer-code-in {
    width:20% !important;
    /*width:20%;*/
    min-width:none; 
    font-size:14px;
}


.font-weight-int{
    font-weight: 500!important;
}

.offer_notibox {
    /*background-color: #740089;*/
    /*color: #ffffff;*/
    /*background-color: #edcff2;*/
    /*background-color: #FFD700;*/
    color: #000000;
}

.timer {
    color: black;
    background-color: #FFE01B;
    margin: 5px;
    padding: 5px;
}

.btn-yellow {
    background-color: #FFE01B;
    border-color: #FFE01B;
    color: #000000;    
}


.btn-yellow:hover {
    background-color: #ffe960;
    border-color: #ffe960;
    color: #000000;    
}


.custom-card {
    font-size: 2.1rem!important;
    line-height: 1!important;
    letter-spacing: -.115rem!important;
    font-weight: 500!important;
    margin-right: 0.5rem!important;
}


.custom-text-gray {
    font-size: 1.075rem!important;
    color: #B5B5C3!important;
}

.custom-semibold {
    font-weight: 500!important;
}


.custom-date-inputbox {
    border: 0px !important;
    text-align: left !important;
    max-width: 20% !important;
    text-decoration: underline !important;
    color: #f1416c !important;
}


.custom-date-icon-new {
    line-height: 2;
    color: #f1416c;
}

.custom-arrow-icon {
    line-height: 2;
    color: #f1416c;
}


.custom-btn-apply {
    padding: 0.175rem 0.85rem;
}

.popular_plan {
    /*position: absolute;*/
    top: -12px;
    right: 20px;
    font-size: 12px;
    background-color: #f6ff00;
    display: inline;
    padding: 4px 8px;
    margin: 0 0 0 8px;
    line-height: normal;
    letter-spacing: .4px;
    color: #000000;
    text-transform: uppercase;
    border-radius: 3px;
    box-shadow: 0 7px 11px -4px rgba(0,23,62,.2),0 0 1px 0 #a8b9d5;
    font-weight: 700;
    font-style: normal;
    text-decoration: underline;
}

.pagination {
    list-style-type: none;
}
.pagination-item {
   display: inline-block;
}
.pagination-item .active {
   background-color: #4AAE9B;
   color: #ffffff;
}
.pagination-item .btn-link.a {
   color: #EF305E !important;
}

.dropdown-menu {
    z-index: 9999 !important;  /* Ensure it's on top */
    float: left;
    min-width: 15rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    border: .1px solid #f1f1f4;
    border-radius: .65rem;
    box-shadow: 0 3px 4px 0 #f1f1f4;
    top: 100% !important;  /* Position below the button */
    position: absolute !important;
}

.sidebar-footer {
    position: sticky;
/*    bottom: 0;
    position: relative;
    z-index: 1000;*/

    position: relative !important;
    overflow: visible !important;
    z-index: 1000 !important;


}

.dropdown-menu {
    /*max-height: 200px;*/
    overflow-y: auto;
    position: absolute;
    z-index: 1000;
}
.selected-items {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 5px;
}
.badge {
    padding: 5px 10px;
    font-size: 14px;
    /* background-color: #007bff; */
   /* color: white;*/
    border-radius: 5px;
}
.btn-close {
    background: none;
    border: none;
    color: black;
    cursor: pointer;
    font-size: 14px;
    margin-left: 5px;
}


/* Multi Select with Chips */
.multi-select {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #fff;
}

.selected-item {
    background: #f1416c;
    color: #fff;
    padding: 5px 10px;
    border-radius: 20px;
    font-size: 14px;
}

.close-btn {
    background: none;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    margin-left: 8px;
}

/* Count Section */
.count-section h4 {
    font-size: 22px;
    font-weight: 500;
    color: #555;
}

.count-value {
    color: #f1416c;
    font-weight: 600;
    font-size: 22px;
    margin-bottom: 8px;
}

/* Input Group */
.input-group-1 {
    margin-top: 20px;
}

.custom-label {
    font-size: 18px;
    font-weight: 500;
    color: #444;
    display: block;
    margin-bottom: 8px;
}

/* Table Styling */
.table-container {
    margin-top: 30px;
}

.people-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
}

.people-table th, .people-table td {
    padding: 15px;
    border-bottom: 1px solid #ddd;
    text-align: left;
}

.people-table th {
    background: #f1416c;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
}

.people-table tbody tr:hover {
    background: #fdf1f4;
}

.people-table tbody tr:last-child td {
    border-bottom: none;
}


.pf-header {
    background: #fff;
    /*padding: 25px;*/
    /*border-radius: 12px;*/
    /*box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);*/
    /*box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.08);*/
    margin-bottom: 20px;
}

.pf-header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pf-text-content {
    max-width: 65%;
}

.pf-title {
    font-size: 26px;
    font-weight: 700;
    color: #222;
}

.pf-subheading {
    font-size: 16px;
    color: #666;
    margin-top: 4px;
}


.pf-count-container {
    display: flex;
    align-items: center;
    background: linear-gradient(90deg, #ff416c, #ff4b2b);
    color: white;
    font-size: 22px;
    font-weight: bold;
    padding: 10px 18px;
    border-radius: 8px;
    box-shadow: 0px 6px 14px rgba(255, 65, 108, 0.3);
}

.pf-count-icon {
    font-size: 24px;
    margin-right: 8px;
}

.pf-count {
    font-size: 28px;
    font-weight: 800;
}


.modal-overlay-terms {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}



.modal-terms {
    background: white;
    padding: 20px;
    width: 400px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    position: relative;
    opacity: 1;  /* Ensure visibility */
    display: block;
}

.close-icon {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 20px;
    cursor: pointer;
    font-weight: bold;
    color: #333;
}


.selection-bar {
    position: absolute;
    top: -40px; /* Moves it right above the table header */
    left: 0;
    width: 100%;
    background: white;
    border: 1px solid #ccc;
    padding: 10px 20px;
    border-radius: 8px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    z-index: 10;
}

.select-all-container {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.select-dropdown {
    position: absolute;
    /*top: 100%;*/
    /*left: 0;*/
    background: white;
    border: 1px solid #ccc;
    padding: 10px;
    z-index: 10;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    min-width: 300px;
    color: #000000;
    font-weight: normal;
    gap: 10px;
    display: inline-grid;

}

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

.select-all-label {
    display: flex;
    align-items: center;
    gap: 5px; /* Spacing between checkbox and icon */
    cursor: pointer;
}

.select-all-label i {
    cursor: pointer;
}



.pf-dropdown-menu {
    position: absolute;
    width: 100%;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 100;
    max-height: 200px;
    overflow-y: auto;
    padding: 10px;
}

.pf-dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px;
    cursor: pointer;
}

.pf-dropdown-item:hover {
    background: #f5f5f5;
}

.pf-filter-card-container.one-line {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    margin-top: 20px;
    justify-content: space-between;
}

.pf-filter-card {
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    flex: 1;
    min-width: 250px;
}

.pf-filter-card h4 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
}

.pf-selected-items {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 5px;
}

.pf-selected-item {
    background: #f1416c;
    color: white;
    padding: 5px 10px;
    border-radius: 15px;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.pulse-badge {
  display: inline-block;
  background-color: #28a745;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 12px;
  position: relative;
  animation: pulse 2s infinite;
  margin-left: 5px;
}

.pulse-badge i {
  margin-right: 4px;
}

/* =========================================
   Secure Checkout: remove left shift + scroll
========================================= */

/* Hide sidebar only on checkout */
body:has(.lc-checkout) #sidebar{
  display:none !important;
}

/* Reset #app layout (this is causing left:22% scroll) */
body:has(.lc-checkout) #app{
  position: relative !important;
  left: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Kill any horizontal scroll */
body:has(.lc-checkout),
body:has(.lc-checkout) .wrapper,
body:has(.lc-checkout) #app{
  overflow-x: hidden !important;
}

/* Center checkout nicely */
body:has(.lc-checkout) .lc-checkout{
  max-width: 1150px;
  margin: 28px auto 80px auto !important;
  padding: 0 16px;
}

.sidebar-buy-credits {
  padding: 10px;
}

.sidebar-buy-credits-btn {
  display: flex;
  align-items: center;
  gap: 10px;

  padding: 12px 14px;
  border-radius: 10px;

  background: #f1416c;
  color: #fff !important;
  font-weight: 700;
  text-decoration: none;
}

.sidebar-buy-credits-btn:hover {
  filter: brightness(0.95);
  text-decoration: none;
}

/*Side bar improvementz*/

/* =========================
   Results List
   Desktop: flex row  |  Mobile < 768px: card grid
========================== */

/* ===== Panel ===== */
.lc-lists-results-panel { border-radius: 14px; }
.lc-lists-heading-crumb { color: #7e8299; margin: 0; }

/* ===== Top bar ===== */
.lc-lists-results-head {
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #EFF2F5;
  gap: 12px;
}
.lc-lists-results-h2  { margin: 0; font-size: 18px; }
.lc-lists-results-sub { margin-top: 4px; color: #7e8299; font-size: 13px; }

.lc-lists-refresh-btn {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  flex-shrink: 0;
  font-weight: 700;
  border-radius: 12px;
  padding: 8px 14px;
  background: #fff;
  border: 1px solid #E9ECEF !important;
  color: #3F4254;
}
.lc-lists-refresh-btn:hover { background: #FCFCFD; }
.lc-lists-state-text { color: #7e8299; }

/* ===== Wrapper ===== */
.lc-lists-table-wrap {
  border: 1px solid #EFF2F5;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.04);
  width: 100%;
  margin-bottom: 16px;
}

/* ===== Shared column layout ===== */
.lc-lists-thead,
.lc-lists-card {
  display: flex;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  padding-left: 4px;
  padding-right: 4px;
}

.lc-lists-col-id       { flex: 0 0 80px;  padding: 0 10px; min-width: 0; }
.lc-lists-col-file     { flex: 1 1 0;     padding: 0 10px; min-width: 0; overflow: hidden; }
.lc-lists-col-metric   { flex: 0 0 96px;  padding: 0 8px;  min-width: 0; }
.lc-lists-col-download { flex: 0 0 136px; padding: 0 10px; min-width: 0; }

/* ===== Desktop header ===== */
.lc-lists-thead {
  background: #F9FAFB;
  border-bottom: 1px solid #EFF2F5;
  position: sticky;
  top: 0;
  z-index: 2;
}
.lc-lists-th {
  font-size: 11px;
  font-weight: 800;
  color: #3F4254;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding-top: 12px;
  padding-bottom: 12px;
}
.lc-lists-col-metric,
.lc-lists-col-download { border-left: 1px solid #F5F6F7; }

/* ===== Card row ===== */
.lc-lists-card {
  border-bottom: 1px solid #EFF2F5;
  padding-top: 14px;
  padding-bottom: 14px;
  align-items: flex-start;
  transition: background 0.12s ease;
}
.lc-lists-card:last-child { border-bottom: none; }
.lc-lists-card:hover      { background: #FCFCFD; }

/* ===== ID ===== */
.lc-lists-id-tag {
  font-size: 10px; font-weight: 700; color: #a1a5b7;
  text-transform: uppercase; letter-spacing: 0.3px;
}
.lc-lists-id-val { font-weight: 700; color: #3F4254; font-size: 14px; white-space: nowrap; }

/* ===== Filename link ===== */
.lc-lists-file-link {
  display: block; text-decoration: none; color: #111827; min-width: 0; overflow: hidden;
}
.lc-lists-file-link:hover { text-decoration: none; }

.lc-lists-file-top {
  display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden;
}
.lc-lists-status-slot  { display: inline-flex; align-items: center; flex-shrink: 0; }
.lc-lists-status-icon  { font-size: 16px; line-height: 1; }

.lc-lists-file-name {
  font-weight: 500; color: #f1416c;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  min-width: 0; flex: 1 1 0;
}
.lc-lists-file-link:hover .lc-lists-file-name { color: #C81D4E; text-decoration: underline; }

.lc-lists-open-hint {
  margin-left: 6px; color: #c4c4c4; flex-shrink: 0;
  opacity: 0; transition: opacity 0.12s ease;
}
.lc-lists-file-link:hover .lc-lists-open-hint { opacity: 1; }

/* ===== File meta row ===== */
.lc-lists-file-meta {
  margin-top: 6px; display: flex; align-items: center;
  gap: 8px; flex-wrap: wrap; color: #7e8299; font-size: 12px;
}
.lc-lists-meta-item { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.lc-lists-meta-sep  { color: #c4c4c4; }

/* Duplicate count — same muted tone as other meta, no highlight */
.lc-lists-meta-dup {
  color: #9ca3af;
  font-weight: 500;
}

.lc-lists-open-pill {
  padding: 2px 8px; border-radius: 999px;
  background: #F9FAFB; border: 1px solid #EFF2F5;
  color: #7e8299; font-weight: 700; font-size: 11px;
  white-space: nowrap; opacity: 0; transition: opacity 0.12s ease;
}
.lc-lists-file-link:hover .lc-lists-open-pill { opacity: 1; }

/* ===== Stop button — inline in meta row, shown on card hover only ===== */
.lc-lists-stop-sep,
.lc-lists-stop-btn {
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
.lc-lists-card:hover .lc-lists-stop-sep,
.lc-lists-card:hover .lc-lists-stop-btn {
  opacity: 1;
  pointer-events: auto;
}
/* Always show when in stopping state (disabled) so user sees feedback */
.lc-lists-stop-btn:disabled {
  opacity: 1 !important;
  pointer-events: none;
}

.lc-lists-stop-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 10px;
  border-radius: 6px;
  border: 1px solid #fca5a5;
  background: #fff5f5;
  color: #dc2626;
  font-size: 11px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.6;
  transition: background 0.15s, border-color 0.15s, opacity 0.15s;
}
.lc-lists-stop-btn:hover:not(:disabled) {
  background: #fee2e2;
  border-color: #f87171;
}
.lc-lists-stop-btn i { font-size: 11px; }

/* ===== Metrics ===== */
.lc-lists-metric-label {
  font-size: 10px; font-weight: 700; color: #a1a5b7;
  text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 3px;
}
.lc-lists-metric-count { font-weight: 800; font-size: 15px; line-height: 1.1; }
.lc-lists-metric-perc  { color: #7e8299; font-size: 11px; margin-top: 3px; opacity: 0.85; }

/* ===== Download button ===== */
.lc-lists-download-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 6px; padding: 8px 14px; border-radius: 10px;
  font-weight: 700; font-size: 12px; text-decoration: none;
  white-space: nowrap; width: 116px; box-sizing: border-box;
}
.lc-lists-download-text { font-size: 12px; }

.lc-lists-download-enabled {
  background: #fff; border: 1px solid #E9ECEF; color: #3F4254;
}
.lc-lists-download-enabled:hover {
  background: #FFF5F7; border-color: #ffb6c6; color: #f1416c; text-decoration: none;
}
.lc-lists-download-disabled {
  background: #F9FAFB; border: 1px solid #EFF2F5; color: #a1a5b7;
  cursor: not-allowed; pointer-events: none; opacity: 0.5;
}

/* ===== Delete button — inline in meta row, shown on card hover only ===== */
.lc-lists-delete-sep,
.lc-lists-delete-btn {
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
.lc-lists-card:hover .lc-lists-delete-sep,
.lc-lists-card:hover .lc-lists-delete-btn {
  opacity: 1;
  pointer-events: auto;
}
.lc-lists-delete-btn:disabled {
  opacity: 1 !important;
  pointer-events: none;
}

.lc-lists-delete-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 10px;
  border-radius: 6px;
  border: 1px solid #d1d5db;
  background: #f9fafb;
  color: #6b7280;
  font-size: 11px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.6;
  transition: background 0.15s, border-color 0.15s, color 0.15s, opacity 0.15s;
}
.lc-lists-delete-btn:hover:not(:disabled) {
  background: #fee2e2;
  border-color: #f87171;
  color: #dc2626;
}
.lc-lists-delete-btn i { font-size: 11px; }


/* ==============================================
   MOBILE  < 768px
============================================== */
@media (max-width: 767px) {
  .lc-lists-thead { display: none !important; }

  .lc-lists-card {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr auto;
    grid-template-areas:
      "id      id      id      dl"
      "file    file    file    dl"
      "clean   dirty   unknown unknown";
    column-gap: 10px;
    row-gap: 8px;
    padding: 14px 12px;
    align-items: start;
  }

  .lc-lists-col-id       { grid-area: id;      padding: 0; flex: none; border: none; }
  .lc-lists-col-file     { grid-area: file;    padding: 0; flex: none; border: none; overflow: hidden; min-width: 0; }
  .lc-lists-col-download { grid-area: dl;      padding: 0; flex: none; border: none; }

  .lc-lists-col-metric {
    flex: none; padding: 8px 10px;
    border: 1px solid #EFF2F5; border-left: 1px solid #EFF2F5 !important;
    border-radius: 8px; background: #F9FAFB; min-width: 0; text-align: center;
  }
  .lc-lists-col-metric.lc-lists-metric-clean   { grid-area: clean; }
  .lc-lists-col-metric.lc-lists-metric-dirty   { grid-area: dirty; }
  .lc-lists-col-metric.lc-lists-metric-unknown { grid-area: unknown; }

  .lc-lists-metric-label { display: block; }
  .lc-lists-metric-count { font-size: 13px; }
  .lc-lists-metric-perc  { font-size: 10px; }
  .lc-lists-id-val       { font-size: 13px; }

  .lc-lists-download-btn { width: auto; padding: 8px 10px; }
  .lc-lists-file-name    { max-width: 100%; }

  /* Stop button full width on mobile */
  .lc-lists-card:hover .lc-lists-stop-sep,
  .lc-lists-card:hover .lc-lists-stop-btn { opacity: 1; pointer-events: auto; }
  .lc-lists-stop-btn { justify-content: center; }
}


/* =============================================
   lists_view all classes prefixed lv-
   ============================================= */

.lv-inner { width: 100%; }
.lv-loading { color: #7e8299; font-size: 14px; padding: 20px 0; }

/* ===== Top bar — lives inside panel-heading ===== */
.lv-topbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; width: 100%; }
.lv-topbar-left .panel-title { margin: 0; }
.lv-topbar-left { display: flex; align-items: center; gap: 10px; }
.lv-topbar-right { display: flex; align-items: center; gap: 8px; }

.lv-back-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 10px;
  border: 1px solid #E9ECEF; background: #fff;
  color: #5e6278; font-size: 13px; font-weight: 700;
  text-decoration: none; cursor: pointer;
}
.lv-back-btn:hover { background: #F9FAFB; text-decoration: none; color: #3F4254; }

.lv-breadcrumb { font-size: 13px; color: #a1a5b7; }
.lv-breadcrumb strong { color: #3F4254; }

.lv-icon-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 10px;
  border: 1px solid #E9ECEF; background: #fff;
  color: #5e6278; font-size: 13px; font-weight: 700; cursor: pointer;
  font-family: inherit;
}
.lv-icon-btn:hover { background: #F9FAFB; color: #3F4254; }
.lv-icon-btn--danger { border-color: #fca5a5; color: #dc2626; background: #fff5f5; }
.lv-icon-btn--danger:hover { background: #fee2e2; }

/* ===== File card ===== */
.lv-file-card {
  background: #fff; border: 1px solid #EFF2F5;
  border-radius: 16px; padding: 20px 24px; margin-bottom: 14px;
}
.lv-file-top {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 16px;
  padding-bottom: 16px; margin-bottom: 14px;
  border-bottom: 1px solid #EFF2F5; flex-wrap: wrap;
}
.lv-file-identity { display: flex; align-items: flex-start; gap: 14px; flex: 1; min-width: 0; }
.lv-file-icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: #FFF5F7; display: flex; align-items: center;
  justify-content: center; flex-shrink: 0;
}
.lv-file-icon svg { width: 22px; height: 22px; stroke: #f1416c; }
.lv-file-name { font-size: 15px; font-weight: 700; color: #1e1e2d; margin-bottom: 3px; word-break: break-all; }
.lv-file-sub { font-size: 12px; color: #7e8299; }

/* Status + actions row */
.lv-status-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }

.lv-status-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 12px; border-radius: 20px;
  font-size: 12px; font-weight: 700; white-space: nowrap;
}
.lv-status-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.lv-status-dot--blink { animation: lv-blink 1.2s ease-in-out infinite; }
@keyframes lv-blink { 0%,100%{opacity:1;} 50%{opacity:0.25;} }

.lv-status-pill--completed { background: #e8f8f0; color: #0f6e56; }
.lv-status-pill--completed .lv-status-dot { background: #1D9E75; }
.lv-status-pill--inprocess { background: #fff8ec; color: #854F0B; }
.lv-status-pill--inprocess .lv-status-dot { background: #EF9F27; }
.lv-status-pill--submitted { background: #F1EFE8; color: #5F5E5A; }
.lv-status-pill--submitted .lv-status-dot { background: #888780; }
.lv-status-pill--suspended { background: #FCEBEB; color: #A32D2D; }
.lv-status-pill--suspended .lv-status-dot { background: #E24B4A; }
.lv-status-pill--paused { background: #E6F1FB; color: #185FA5; }
.lv-status-pill--paused .lv-status-dot { background: #378ADD; }
.lv-status-pill--error { background: #FCEBEB; color: #A32D2D; }
.lv-status-pill--error .lv-status-dot { background: #E24B4A; }
.lv-status-pill--locked { background: #FCEBEB; color: #A32D2D; }
.lv-status-pill--locked .lv-status-dot { background: #E24B4A; }

.lv-dl-all-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 8px;
  border: 1px solid #E9ECEF; background: #fff;
  color: #3F4254; font-size: 12px; font-weight: 700;
  text-decoration: none; white-space: nowrap;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
  flex-shrink: 0;
}
.lv-dl-all-btn svg { width: 13px; height: 13px; }
.lv-dl-all-btn:hover { background: #FFF5F7; border-color: #ffb6c6; color: #f1416c; text-decoration: none; }

.lv-act-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 12px; border-radius: 8px;
  font-size: 12px; font-weight: 700; cursor: pointer;
  border: none; font-family: inherit; white-space: nowrap;
  transition: background 0.15s;
}
.lv-act-btn svg { width: 13px; height: 13px; }
.lv-act-btn--pause  { background: #fff8ec; border: 1px solid #FAC775; color: #854F0B; }
.lv-act-btn--pause:hover  { background: #FAEEDA; }
.lv-act-btn--stop   { background: #fff5f5; border: 1px solid #fca5a5; color: #dc2626; }
.lv-act-btn--stop:hover   { background: #fee2e2; }
.lv-act-btn--resume { background: #e8f8f0; border: 1px solid #9FE1CB; color: #0f6e56; }
.lv-act-btn--resume:hover { background: #d0f0e4; }

/* ===== Meta grid ===== */
.lv-meta-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.lv-meta-item { background: #F9FAFB; border-radius: 10px; padding: 10px 14px; }
.lv-meta-lbl { font-size: 11px; font-weight: 700; color: #a1a5b7; text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 4px; }
.lv-meta-val { font-size: 14px; font-weight: 700; color: #1e1e2d; }
.lv-meta-val a { color: #f1416c; text-decoration: none; }
.lv-meta-val a:hover { text-decoration: underline; }
.lv-meta-dl-link {
  display: inline-flex; align-items: center; gap: 5px;
  color: #3F4254 !important; font-weight: 700; text-decoration: none !important;
  border-bottom: 1px dashed #a1a5b7;
}
.lv-meta-dl-link svg { width: 12px; height: 12px; stroke: #a1a5b7; flex-shrink: 0; }
.lv-meta-dl-link:hover { color: #f1416c !important; border-bottom-color: #f1416c; }
.lv-meta-dl-link:hover svg { stroke: #f1416c; }

/* ===== Result cards ===== */
.lv-results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 14px; align-items: stretch; }
.lv-rc { background: #fff; border: 1px solid #EFF2F5; border-radius: 16px; padding: 18px 18px 14px; min-width: 0; display: flex; flex-direction: column; }
.lv-rc-lbl { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
.lv-rc-num { font-size: 28px; font-weight: 800; line-height: 1; margin-bottom: 3px; }
.lv-rc-pct { font-size: 12px; margin-bottom: 12px; }
.lv-rc-bar { height: 5px; border-radius: 3px; background: #EFF2F5; margin-bottom: 12px; }
.lv-rc > .lv-dl-btn, .lv-rc > .lv-rc-dl-wrap, .lv-rc > span.lv-dl-btn { margin-top: auto; }
.lv-rc-fill { height: 5px; border-radius: 3px; }

.lv-rc--clean .lv-rc-lbl  { color: #0f6e56; }
.lv-rc--clean .lv-rc-num  { color: #1D9E75; }
.lv-rc--clean .lv-rc-pct  { color: #1D9E75; }
.lv-rc--clean .lv-rc-fill { background: #1D9E75; }
.lv-rc--dirty .lv-rc-lbl  { color: #A32D2D; }
.lv-rc--dirty .lv-rc-num  { color: #E24B4A; }
.lv-rc--dirty .lv-rc-pct  { color: #E24B4A; }
.lv-rc--dirty .lv-rc-fill { background: #E24B4A; }
.lv-rc--unknown .lv-rc-lbl  { color: #5e6278; }
.lv-rc--unknown .lv-rc-num  { color: #3F4254; }
.lv-rc--unknown .lv-rc-pct  { color: #7e8299; }
.lv-rc--unknown .lv-rc-fill { background: #a1a5b7; }

.lv-rc-dl-wrap {
  display: flex; gap: 6px; margin-top: auto;
}
.lv-rc-dl-pill {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 4px; flex: 1; padding: 7px 6px;
  border-radius: 8px; border: 1px solid #E9ECEF;
  background: #fff; font-size: 11px; font-weight: 700;
  color: #3F4254; text-decoration: none; white-space: nowrap;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.lv-rc-dl-pill svg { width: 11px; height: 11px; }
.lv-rc-dl-pill:hover { background: #FFF5F7; border-color: #ffb6c6; color: #f1416c; text-decoration: none; }

.lv-meta-dup-high { color: #E24B4A; font-weight: 700; }
.lv-meta-dup-low  { color: #3F4254; font-weight: 700; }

.lv-help-link {
  display: inline-flex; align-items: center;
  color: #a1a5b7; text-decoration: none;
  vertical-align: middle; margin-left: 2px;
}
.lv-help-link svg { width: 13px; height: 13px; }
.lv-help-link:hover { color: #3F4254; text-decoration: none; }

.lv-dl-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 6px; width: 100%; padding: 7px 10px;
  border-radius: 8px; border: 1px solid #E9ECEF;
  background: #fff; font-size: 12px; font-weight: 700;
  color: #3F4254; cursor: pointer; text-decoration: none;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.lv-dl-btn svg { width: 12px; height: 12px; }
.lv-dl-btn:hover { background: #FFF5F7; border-color: #ffb6c6; color: #f1416c; text-decoration: none; }
.lv-dl-btn--disabled {
  background: #F9FAFB; border-color: #EFF2F5;
  color: #a1a5b7; cursor: not-allowed; opacity: 0.6; pointer-events: none;
}

/* ===== Section label ===== */
.lv-sec-lbl { font-size: 13px; font-weight: 700; color: #1e1e2d; margin-bottom: 10px; margin-top: 20px; padding-top: 18px; border-top: 1px solid #EFF2F5; }

/* ===== Analytics ===== */
.lv-analytics-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; align-items: stretch; }
.lv-ac { background: #fff; border: 1px solid #EFF2F5; border-radius: 16px; padding: 18px 20px; }
.lv-ac-title { font-size: 13px; font-weight: 700; color: #1e1e2d; margin-bottom: 14px; }

/* Stacked bar */
.lv-sbar { display: flex; height: 8px; border-radius: 4px; overflow: hidden; gap: 2px; margin-bottom: 14px; }
.lv-sbar-h { background: #1D9E75; }
.lv-sbar-m { background: #5DCAA5; }
.lv-sbar-l { background: #9FE1CB; }

/* Quality rows */
.lv-q-rows { display: flex; flex-direction: column; gap: 9px; }
.lv-q-row { display: flex; align-items: center; gap: 8px; }
.lv-q-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.lv-q-dot--high { background: #1D9E75; }
.lv-q-dot--med  { background: #5DCAA5; }
.lv-q-dot--low  { background: #9FE1CB; }
.lv-q-name { font-size: 12px; color: #3F4254; flex: 1; }
.lv-q-bw { flex: 0 0 80px; height: 5px; background: #F1F3F5; border-radius: 3px; }
.lv-q-bf { height: 5px; border-radius: 3px; }
.lv-q-bf--high { background: #1D9E75; }
.lv-q-bf--med  { background: #5DCAA5; }
.lv-q-bf--low  { background: #9FE1CB; }
.lv-q-ct { flex: 0 0 30px; text-align: right; font-size: 12px; font-weight: 700; color: #3F4254; }
.lv-q-pc { flex: 0 0 38px; text-align: right; font-size: 11px; color: #7e8299; }
.lv-q-dl { flex: 0 0 18px; display: flex; justify-content: flex-end; }
.lv-q-dl a { display: flex; }
.lv-q-dl svg { width: 13px; height: 13px; stroke: #a1a5b7; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lv-q-dl a:hover svg { stroke: #f1416c; }

/* Dirty */
.lv-dirty-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.lv-see-all-btn {
  font-size: 11px; font-weight: 700; color: #f1416c;
  background: #FFF5F7; border: 1px solid #ffb6c6;
  border-radius: 7px; padding: 4px 10px; cursor: pointer;
  font-family: inherit; white-space: nowrap;
  transition: background 0.15s;
}
.lv-see-all-btn:hover { background: #ffe8ed; }

.lv-d-rows { display: flex; flex-direction: column; gap: 7px; }
.lv-d-row { display: flex; align-items: center; gap: 8px; }
.lv-d-name { font-size: 12px; color: #3F4254; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lv-d-bw { flex: 0 0 80px; height: 5px; background: #F1F3F5; border-radius: 3px; }
.lv-d-bf { height: 5px; border-radius: 3px; background: #E24B4A; }
.lv-d-ct { flex: 0 0 30px; text-align: right; font-size: 12px; font-weight: 700; color: #3F4254; }
.lv-d-pc { flex: 0 0 38px; text-align: right; font-size: 11px; color: #7e8299; }
.lv-d-more-btn {
  margin-top: 10px; font-size: 12px; color: #f1416c;
  font-style: italic; font-family: inherit;
  background: none; border: none; padding: 0;
  cursor: pointer; text-decoration: underline;
  text-decoration-style: dashed; text-underline-offset: 3px;
}
.lv-d-more-btn:hover { color: #d63060; }

/* ===== Payment card ===== */
.lv-pay-card { background: #fff; border: 1px solid #EFF2F5; border-radius: 16px; padding: 20px 24px; margin-bottom: 14px; }
.lv-pay-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid #EFF2F5; flex-wrap: wrap; }
.lv-pay-title { font-size: 14px; font-weight: 700; color: #1e1e2d; margin-bottom: 3px; }
.lv-pay-sub { font-size: 12px; color: #7e8299; }
.lv-currency-sel { padding: 5px 10px; border-radius: 8px; border: 1px solid #E9ECEF; font-size: 12px; font-weight: 700; color: #3F4254; background: #fff; cursor: pointer; }

.lv-pay-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lv-pay-option { border-radius: 12px; border: 1px solid #EFF2F5; overflow: hidden; display: flex; flex-direction: column; }
.lv-pay-option-head { padding: 16px 18px; border-bottom: 1px solid #EFF2F5; }
.lv-pay-option-eyebrow { font-size: 11px; font-weight: 700; color: #a1a5b7; text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 6px; }
.lv-pay-big-num { font-size: 28px; font-weight: 800; color: #f1416c; line-height: 1; margin-bottom: 4px; }
.lv-pay-big-unit { font-size: 13px; color: #a1a5b7; font-weight: 500; }
.lv-pay-credits-note { font-size: 13px; font-weight: 700; color: #1e1e2d; margin-top: 4px; }

.lv-credits-bar-wrap { margin: 8px 0 5px; }
.lv-credits-bar-bg { height: 6px; background: #EFF2F5; border-radius: 3px; }
.lv-credits-bar-fill { height: 6px; border-radius: 3px; background: #f1416c; transition: width 0.4s ease; }
.lv-credits-note { font-size: 11px; color: #a1a5b7; }

.lv-pay-option-body { padding: 12px 18px; font-size: 13px; color: #5e6278; line-height: 1.6; flex: 1; border-bottom: 1px solid #EFF2F5; }
.lv-pay-option-foot { padding: 12px 18px; background: #F9FAFB; }

.lv-pay-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 7px; width: 100%; padding: 10px 18px;
  border-radius: 10px; font-size: 13px; font-weight: 700;
  cursor: pointer; border: none; font-family: inherit;
  text-decoration: none; transition: background 0.15s;
}
.lv-pay-btn svg { width: 14px; height: 14px; }
.lv-pay-btn--primary { background: #f1416c; color: #fff; }
.lv-pay-btn--primary:hover { background: #d63060; text-decoration: none; color: #fff; }
.lv-pay-btn--secondary { background: #fff; border: 1px solid #E9ECEF; color: #3F4254; }
.lv-pay-btn--secondary:hover { background: #F9FAFB; text-decoration: none; color: #3F4254; }

/* ===== Promo + Note ===== */
.lv-promo {
  font-size: 13px; color: #5e6278; line-height: 1.6;
  background: #f0faf7; border: 1px solid #9FE1CB;
  border-radius: 12px; padding: 12px 16px; margin-bottom: 14px;
}
.lv-promo a { color: #0f6e56; font-weight: 700; }
.lv-note {
  font-size: 12px; color: #7e8299; line-height: 1.6;
  padding: 12px 0; border-top: 1px solid #EFF2F5; margin-top: 4px;
}

/* ===== Responsive ===== */

/* Medium small laptops, tablets landscape (< 1200px) */
@media (max-width: 1199px) {
  .lv-analytics-grid { grid-template-columns: 1fr; }
}

/* Small laptops (< 1024px) */
@media (max-width: 1023px) {
  .lv-results-grid { grid-template-columns: repeat(3, 1fr); }
  .lv-pay-grid { grid-template-columns: 1fr 1fr; }
  .lv-d-name { font-size: 11px; }
  .lv-d-bw { flex: 0 0 60px; }
}

/* Tablet portrait + large phones (< 768px) */
@media (max-width: 767px) {
  .lv-file-card { padding: 14px 16px; }
  .lv-file-top { flex-direction: column; gap: 10px; }
  .lv-file-identity { gap: 10px; }
  .lv-file-icon { width: 36px; height: 36px; border-radius: 10px; }
  .lv-file-icon svg { width: 18px; height: 18px; }
  .lv-file-name { font-size: 13px; }
  .lv-status-actions { justify-content: flex-start; flex-wrap: wrap; }

  .lv-meta-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .lv-meta-item { padding: 8px 10px; }
  .lv-meta-val { font-size: 13px; }

  .lv-results-grid { grid-template-columns: 1fr; gap: 8px; }
  .lv-rc { padding: 14px 14px 12px; }
  .lv-rc-num { font-size: 22px; }

  .lv-analytics-grid { grid-template-columns: 1fr; gap: 8px; }
  .lv-ac { padding: 14px 16px; overflow: hidden; }

  /* Analytics rows prevent overflow on small screens */
  .lv-q-row { flex-wrap: nowrap; gap: 6px; }
  .lv-q-name { font-size: 11px; min-width: 0; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .lv-q-bw { flex: 0 0 50px; }
  .lv-q-ct { flex: 0 0 34px; font-size: 11px; }
  .lv-q-pc { flex: 0 0 36px; font-size: 10px; }
  .lv-q-dl { flex: 0 0 16px; }

  .lv-d-row { flex-wrap: nowrap; gap: 6px; }
  .lv-d-name { font-size: 11px; flex: 1; min-width: 0; }
  .lv-d-bw { flex: 0 0 40px; }
  .lv-d-ct { flex: 0 0 34px; font-size: 11px; }
  .lv-d-pc { flex: 0 0 36px; font-size: 10px; }

  /* Dirty head see all button wraps */
  .lv-dirty-head { flex-wrap: wrap; gap: 6px; }

  /* Clean download pills stack nicely */
  .lv-rc-dl-wrap { flex-wrap: wrap; }
  .lv-rc-dl-pill { flex: 1 1 auto; min-width: 60px; }

  .lv-pay-grid { grid-template-columns: 1fr; }
  .lv-pay-card { padding: 14px 16px; }

  .lv-topbar { gap: 8px; }
  .lv-topbar-right { flex-wrap: wrap; gap: 6px; }
  .lv-icon-btn { padding: 6px 10px; font-size: 12px; }
}

/* Small phones (< 480px) */
@media (max-width: 479px) {
  .lv-meta-grid { grid-template-columns: 1fr 1fr; }
  .lv-results-grid { grid-template-columns: 1fr; }
  .lv-rc-num { font-size: 20px; }
  .lv-file-name { font-size: 12px; }
  .lv-act-btn { padding: 5px 9px; font-size: 11px; }
  .lv-status-pill { font-size: 11px; padding: 4px 9px; }
  .lv-q-bw { flex: 0 0 40px; }
  .lv-d-bw { flex: 0 0 40px; }
  .lv-sbar { height: 6px; }
  .lv-see-all-btn { font-size: 10px; padding: 3px 8px; }
}
/* =============================================
   lists_view END
   ============================================= */


/* =========================
   SECURE CHECKOUT START
========================= */

.lc-checkout {
  max-width: 1100px;
  margin: 0 auto;
  padding: 18px 14px;
}

.lc-checkout__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.lc-checkout__header--centered {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 18px 0 20px;
  margin-bottom: 18px;
  border-bottom: 1px solid #eef2f7;
}

.lc-checkout__header-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
}

.lc-checkout-brand__logo {
  height: 34px;
  max-width: 140px;
  width: auto;
  opacity: .95;
}

.lc-checkout-brand__subtitle {
  font-size: 14px;
  font-weight: 600;
  color: #475569;
  letter-spacing: .3px;
}

.lc-checkout__back--left {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  color: #64748b;
  font-weight: 600;
  padding: 6px 8px;
  cursor: pointer;
}

.lc-checkout__back--left:hover {
  background: #f8fafc;
  border-radius: 8px;
}

.lc-checkout__grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 16px;
}

.lc-card {
  background: #fff;
  border: 1px solid #eef0f3;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  overflow: visible;
}

.lc-card__head {
  padding: 14px 16px;
  border-bottom: 1px solid #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  overflow: visible;
}

.lc-card__title {
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .2px;
}

.lc-card__body {
  padding: 14px 16px 16px;
}

.lc-divider {
  height: 1px;
  background: #f1f5f9;
  margin: 14px 0;
}

.lc-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
}

.lc-summary__label { color: #6b7280; font-size: 13px; }
.lc-summary__value { font-size: 13px; font-weight: 600; color: #111827; text-align: right; }
.lc-summary__value--strong { font-size: 15px; font-weight: 800; }
.lc-summary__value--truncate { max-width: 260px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.lc-total__label { color: #6b7280; font-size: 13px; margin-bottom: 6px; }
.lc-total__price { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.lc-total__strike { color: #9ca3af; text-decoration: line-through; font-weight: 700; }
.lc-total__final { font-size: 22px; font-weight: 900; color: #111827; }
.lc-total__save { margin-top: 8px; font-size: 13px; color: #065f46; background: #ecfdf5; border: 1px solid #d1fae5; padding: 8px 10px; border-radius: 10px; }

/* Currency cards */
.lc-currency-switch { display: block; }
.lc-currency-cards-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
.lc-currency-card { width: 100%; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid #e5e7eb; background: #fff; border-radius: 12px; cursor: pointer; min-width: 150px; box-shadow: 0 1px 0 rgba(0,0,0,.02); }
.lc-currency-card:hover { border-color: #cbd5e1; }
.lc-currency-card.is-active { border-color: #111827; box-shadow: 0 0 0 2px rgba(17,24,39,.08); }
.lc-currency-flag { font-size: 16px; line-height: 1; }
.lc-currency-amount { font-weight: 900; font-size: 14px; color: #111827; }

.lc-gst-out { margin-top: 2px; display: flex; align-items: center; gap: 8px; font-size: 12px; color: #6b7280; font-weight: 400; line-height: 1; padding-left: 2px; }
.lc-gst-out.is-under-left { grid-column: 1; }
.lc-gst-out.is-under-right { grid-column: 2; }
.lc-gst-hover { position: relative; display: inline-flex; align-items: center; gap: 6px; cursor: help; color: #6b7280; font-size: 12px; line-height: 1; text-decoration: underline; text-decoration-style: dotted; text-decoration-thickness: 1px; text-underline-offset: 3px; user-select: none; }
.lc-gst-tip { position: absolute; left: 50%; top: calc(100% + 10px); transform: translateX(-50%); min-width: 240px; max-width: 320px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; color: #111827; font-size: 12px; font-weight: 400; line-height: 1.35; box-shadow: 0 10px 30px rgba(0,0,0,.12); opacity: 0; visibility: hidden; pointer-events: none; z-index: 50; }
.lc-gst-tip:before { content: ""; position: absolute; top: -6px; left: 50%; width: 10px; height: 10px; background: #fff; border-left: 1px solid #e5e7eb; border-top: 1px solid #e5e7eb; transform: translateX(-50%) rotate(45deg); }
.lc-gst-hover:hover .lc-gst-tip,
.lc-gst-hover:focus .lc-gst-tip { opacity: 1; visibility: visible; }

/* Invoice section */
.lc-invoice__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lc-invoice__title { font-weight: 800; font-size: 13px; }
.lc-invoice__prose { margin-top: 8px; display: flex; flex-direction: column; gap: 2px; }
.lc-invoice__name { font-size: 13px; font-weight: 600; color: #111827; margin: 0; line-height: 1.5; }
.lc-invoice__line { font-size: 12px; color: #4b5563; margin: 0; line-height: 1.5; }
.lc-invoice__email { font-size: 12px; color: #f1416c; margin: 0; line-height: 1.5; }
.lc-invoice__gst { font-size: 11px; color: #9ca3af; font-family: 'Courier New', monospace; margin: 0; }
.lc-invoice__empty { font-size: 13px; color: #9ca3af; font-style: italic; margin: 8px 0 0; }
.lc-note { margin-top: 6px; font-size: 12px; color: #6b7280; }

.lc-link { border: none; background: none; color: #2563eb; font-weight: 800; padding: 0; cursor: pointer; font-size: 13px; }

/* Offer code */
.lc-offer__box { margin-top: 10px; display: flex; gap: 10px; align-items: center; }
.lc-input { width: 60%; min-width: 180px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 10px; outline: none; }
.lc-offer__actions { display: flex; gap: 10px; }

/* Payment methods */
.lc-paymethods__title { font-weight: 800; margin-bottom: 10px; font-size: 13px; }
.lc-radio { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid #eef0f3; border-radius: 12px; cursor: pointer; margin-bottom: 10px; }
.lc-radio input { margin-top: 4px; }
.lc-radio__content { display: flex; flex-direction: column; gap: 6px; }
.lc-radio__hint { font-size: 12px; color: #6b7280; font-weight: 600; }

.lc-alert { margin: 10px 0 12px; padding: 10px 12px; border-radius: 12px; border: 1px solid #fee2e2; background: #fff1f2; color: #9f1239; font-weight: 700; font-size: 13px; }

.lc-btn { border: 1px solid transparent; border-radius: 12px; padding: 11px 14px; cursor: pointer; font-weight: 900; font-family: Poppins, Helvetica, sans-serif; }
.lc-btn--primary { width: 100%; margin-top: 8px; background: #2563eb; color: #fff; font-size: 15px; padding: 13px 14px; }
.lc-btn--primary:disabled { opacity: .6; cursor: not-allowed; }
.lc-btn--ghost { background: #fff; border: 1px solid #e5e7eb; font-weight: 800; }

.lc-trust { margin-top: 10px; font-size: 12px; color: #6b7280; line-height: 1.35; }

/* Modal */
.lc-modal { position: fixed; inset: 0; background: rgba(17,24,39,.55); display: flex; align-items: center; justify-content: center; z-index: 9999; padding: 16px; }
.lc-modal__card { width: min(560px, 96vw); max-height: 90vh; overflow: auto; background: #fff; border-radius: 16px; box-shadow: 0 22px 70px rgba(0,0,0,.28); }
.lc-modal__head { display: flex; align-items: flex-start; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid #eef0f3; }
.lc-modal__title { font-weight: 900; font-size: 16px; }
.lc-modal__subtitle { color: #6b7280; font-size: 13px; margin-top: 4px; }
.lc-modal__close { border: none; background: transparent; font-size: 18px; cursor: pointer; padding: 6px 10px; border-radius: 10px; }
.lc-modal__close:hover { background: #f3f4f6; }
.lc-modal__body { padding: 0; }

/* White background on checkout page */
body:has(.lc-checkout),
html:has(.lc-checkout) { background: #ffffff !important; }
body:has(.lc-checkout) .wrapper,
body:has(.lc-checkout) .container,
body:has(.lc-checkout) .container-fluid,
body:has(.lc-checkout) #app,
body:has(.lc-checkout) .content,
body:has(.lc-checkout) .main-content { background: #ffffff !important; }
body:has(.lc-checkout) footer,
body:has(.lc-checkout) .app-footer { background: #ffffff !important; }

/* Responsive */
@media (max-width: 980px) {
  .lc-checkout__grid { grid-template-columns: 1fr; }
  .lc-currency-card { min-width: 140px; }
}

@media (max-width: 640px) {
  .lc-checkout__header--centered { flex-direction: column; }
  .lc-checkout__back--left { position: static; transform: none; margin-bottom: 10px; }
}

/* =========================
   SECURE CHECKOUT END
========================= */


/* =========== MY Account / Change Email / Change Password START =========== */

.ma-page {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px 0 40px;
}

.ma-card {
    background: #fff;
    border: 1px solid #EFF2F5;
    border-radius: 10px;
    overflow: hidden;
    font-family: Poppins, Helvetica, sans-serif;
}

.ma-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px 14px;
    border-bottom: 1px solid #EFF2F5;
    border-left: 3px solid #f1416c;
}

.ma-eyebrow {
    display: block;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #A1A5B7;
    margin-bottom: 1px;
}

.ma-title {
    font-size: 15px;
    font-weight: 600;
    color: #181c32;
    margin: 0;
    line-height: 1.3;
}

.ma-card-body {
    padding: 20px 20px 16px;
    background: #fff;
}

.ma-card-desc {
    font-size: 13px;
    color: #7e8299;
    margin-bottom: 20px;
    line-height: 1.6;
}

.ma-card-footer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 20px 18px;
    border-top: 1px solid #EFF2F5;
}

.ma-view-body {
    padding: 4px 0 8px;
}

.ma-view-row {
    display: flex;
    flex-direction: column;
    padding: 10px 20px;
    border-bottom: 1px solid #F9FAFB;
}

.ma-view-row:last-child {
    border-bottom: none;
}

.ma-view-row--2col {
    flex-direction: row;
}

.ma-view-row--2col .ma-view-cell {
    flex: 1;
}

.ma-view-row--2col .ma-view-cell + .ma-view-cell {
    border-left: 1px solid #F9FAFB;
    padding-left: 20px;
}

.ma-view-label {
    display: block;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #B5B5C3;
    margin-bottom: 3px;
}

.ma-view-val {
    font-size: 13px;
    font-weight: 500;
    color: #3F4254;
    line-height: 1.45;
}

.ma-view-val--pink {
    color: #f1416c;
}

.ma-email-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.ma-edit-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: Poppins, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #f1416c;
    background: #fff5f7;
    border: 1px solid #ffd6df;
    border-radius: 7px;
    padding: 6px 13px;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    transition: background .12s, border-color .12s;
}

.ma-edit-btn:hover {
    background: #FBDEE5;
    border-color: #f1416c;
    color: #D9214E;
    text-decoration: none;
}

.ma-form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-width: 420px;
    margin-bottom: 14px;
}

.ma-form-group:last-child {
    margin-bottom: 0;
}

.ma-form-label {
    font-size: 11px;
    font-weight: 600;
    color: #5e6278;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.ma-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.ma-form-input {
    font-family: Poppins, Helvetica, sans-serif;
    font-size: 13px;
    color: #3F4254;
    background: #F5F8FA;
    border: 1px solid #EFF2F5;
    border-radius: 7px;
    padding: 9px 40px 9px 12px;
    outline: none;
    transition: border-color .13s, box-shadow .13s;
    width: 100%;
    box-sizing: border-box;
}

.ma-form-input::placeholder {
    color: #C5C5D0;
}

.ma-form-input:hover {
    border-color: #ffd6df;
    background: #fff;
}

.ma-form-input:focus {
    border-color: #f1416c;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(241, 65, 108, .09);
}

.ma-eye-btn {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 4px;
    cursor: pointer;
    color: #A1A5B7;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color .12s;
}

.ma-eye-btn:hover {
    color: #f1416c;
}

.ma-btn-primary {
    display: inline-flex;
    align-items: center;
    font-family: Poppins, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: #f1416c;
    border: 1px solid #f1416c;
    border-radius: 7px;
    padding: 9px 20px;
    cursor: pointer;
    text-decoration: none;
    transition: background .12s;
}

.ma-btn-primary:hover {
    background: #D9214E;
    border-color: #D9214E;
    color: #fff;
    text-decoration: none;
}

.ma-btn-secondary {
    display: inline-flex;
    align-items: center;
    font-family: Poppins, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: #D9214E;
    background: transparent;
    border: 1px solid #D9214E;
    border-radius: 7px;
    padding: 9px 18px;
    cursor: pointer;
    text-decoration: none;
    transition: background .12s;
}

.ma-btn-secondary:hover {
    background: #FBDEE5;
    color: #D9214E;
    text-decoration: none;
}

/* Skeleton shimmer for empty values while API loads */
.ma-view-val:empty {
    display: inline-block;
    width: 140px;
    height: 13px;
    border-radius: 4px;
    background: linear-gradient(90deg, #EFF2F5 25%, #e2e5ea 50%, #EFF2F5 75%);
    background-size: 200% 100%;
    animation: ma-shimmer 1.4s infinite;
    vertical-align: middle;
}

.ma-view-val--pink:empty {
    display: inline-block;
    width: 180px;
    height: 13px;
    border-radius: 4px;
    background: linear-gradient(90deg, #EFF2F5 25%, #e2e5ea 50%, #EFF2F5 75%);
    background-size: 200% 100%;
    animation: ma-shimmer 1.4s infinite;
    vertical-align: middle;
}

@keyframes ma-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@media (max-width: 640px) {
    .ma-card-header { padding: 14px 16px 12px; }
    .ma-view-row { padding: 10px 16px; }
    .ma-card-body { padding: 16px 16px 12px; }
    .ma-card-footer { padding: 12px 16px 16px; flex-wrap: wrap; }
    .ma-view-row--2col { flex-direction: column; gap: 10px; }
    .ma-view-row--2col .ma-view-cell + .ma-view-cell {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid #F9FAFB;
        padding-top: 10px;
    }
    .ma-form-group { max-width: 100%; }
    .ma-btn-primary,
    .ma-btn-secondary { flex: 1; justify-content: center; }
}

/* Billing page specific classes */

.bp-links {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
}

.bp-link {
    font-size: 12px;
    font-weight: 500;
    color: #f1416c;
    text-decoration: none;
    transition: color .12s;
}

.bp-link:hover {
    color: #D9214E;
    text-decoration: underline;
}

.bp-credits-row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.bp-credits-label {
    font-size: 15px;
    color: #3F4254;
    font-weight: 400;
}

.bp-credits-count {
    font-size: 38px;
    font-weight: 700;
    color: #f1416c;
    line-height: 1;
}

.bp-credits-loading {
    font-size: 13px;
    color: #A1A5B7;
    font-style: italic;
}

.bp-note {
    font-size: 12px;
    color: #A1A5B7;
    margin: 0;
}

/* Shimmer on credits count while data loads */
.bp-credits-shimmer {
    display: inline-block;
    width: 100px;
    height: 38px;
    border-radius: 6px;
    background: linear-gradient(90deg, #EFF2F5 25%, #e2e5ea 50%, #EFF2F5 75%);
    background-size: 200% 100%;
    animation: ma-shimmer 1.4s infinite;
    vertical-align: middle;
}



/* =========== MY Account / Change Email / Change Password END =========== */
