﻿/*below styles are custom for this portal*/
body {
background-color: #f6f6f8;
}

.container,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
max-width: 1520px !important;
}

html[dir=ltr] li a {
margin-left: 0px !important;
}

.visually-hidden {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0 0 0 0);
border: 0;
}



/* Compact overall popup */
.swal2-popup {
width: 30em !important;
padding: 0.6em 1.2em !important;
/* less vertical padding */
font-size: 0.8rem !important;
border-radius: 8px !important;
min-height: auto !important;
line-height: 1.2 !important;
}

/* Title — bigger but closer */
.swal2-title {
font-size: 1.3rem !important;
font-weight: 600 !important;
margin: 0.2em 0 !important;
/* tighten above & below title */
}

/* Text — compact spacing */
.swal2-text {
font-size: 0.85rem !important;
margin: 0.2em 0 !important;
/* reduced margin */
}

/* Icon — smaller & closer */
.swal2-icon {
transform-origin: center center;
margin: 0.1em auto !important;
/* less space around icon */
}

/* Buttons — compact */
.swal2-button {
font-size: 0.75rem !important;
padding: 0.25em 0.8em !important;
min-width: 4.5em !important;
margin: 0 0.2em !important;
/* reduce gap between buttons */
}

/* Action buttons wrapper */
.sw-compact .swal2-actions {
margin-top: 0.4em !important;
/* bring buttons closer to text */
}

.footer-para {
color: white;
font-weight: 400;
text-align: right;
}

.white-text {
color: #FAFCFC;
text-decoration: underline !important;
font-weight: 400 !important;
}


.white-text:hover {
color: #FAFCFC;
text-decoration: none !important;
}


.wrapper-page {
min-height: 750px;
background-color: white;
padding-bottom: 2rem;
margin-bottom: 20px;
border-radius: 0 0 10px 10px;
box-shadow: 0 3px 5px rgb(57 63 72 / 30%);
-webkit-box-shadow: 0 3px 5px rgb(57 63 72 / 30%);
-moz-box-shadow: 0 3px 5px rgb(57 63 72 / 30%);
}

.wrapper-page-wide {
margin-left: 30px;
margin-right: 30px;
width: auto;
}

hr {
border-bottom: 7px solid #0b80d0 !important;
}

.gmb_tablelist {
margin-bottom: 60px !important;
}

.gmb_tablelistheader {
/*color: #666666 !important;
font-size: 26px !important; */
padding-bottom: 10px !important;
border-bottom: 6px solid #0b4d4e !important;
margin-bottom: 15px !important;
}

.btn-tablelist {
display: block;
margin-left: auto;
}

/* Disabled button styling */
.btn.disabled,
.btn:disabled,
fieldset:disabled .btn {
background-color: #b4c2c9;
color: #5d646f;
cursor: not-allowed !important;
border: 1px solid #5d646f;
}

.breadcrumb {
padding: 3px 15px;
margin-top: -3px;
margin-bottom: 20px;
list-style: none;
}

.styled-table {
width: 100%;
border-collapse: collapse;
margin-top: 10px;
}

.styled-table th,
.styled-table td {
text-align: left;
cursor: pointer;
min-width: 150px;
height: 70px;
padding: 10px 12px;
white-space: normal;
word-wrap: break-word;
overflow-wrap: break-word;
word-break: break-word;
}

.styled-table thead {
color: #1b2225;
font-weight: bold;
text-decoration: underline;
border-bottom: 2px solid #ddd;
}



.styled-table tbody tr:nth-child(even) {
background-color: #f9f9f9;
}

.styled-table tbody tr {
border-bottom: 1px solid #ddd;
}

.styled-table tbody tr:last-child {
border-bottom: none;
}

.styled-table tbody tr:hover {
background-color: #f9f9f9;
transition: 0.3s;
}

/* Full wrapper for pagination + total + view all */
.pagination-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
/* allows wrapping on smaller widths */
gap: 10px;
padding-top: 10px;
border-top: 1px solid #eee;
}

.pagination {
display: flex;
}

.pagination button {
border: none;
background: none;
cursor: pointer;
padding: 8px 12px;
}

.pagination button.active {
background-color: #003d59;
color: white;
border-radius: 50%;
text-align: center;
font-weight: bold;
height: 33px;
}

.pagination button:disabled {
color: #ccc;
cursor: not-allowed;
background-color: white;
}

.pagination button:hover:not(.active):not(:disabled) {
text-decoration: underline;
}

/* View All link container */
.viewall-container {
display: flex;
align-items: center;
gap: 8px;
}

/* Style for the "View All" link */
.view-all-link {
color: #0B4D4E;
text-decoration: underline;
font-weight: 500;
font-size: 14px;
cursor: pointer;
}

/* Hover effect for the "View All" link */
.view-all-link:hover {
color: #0B4D4E;
text-decoration: none;
}

/* Container for the search box */
.table-search-container {
position: relative;
width: 300px;
/* Adjust width of the search box */
display: flex;
align-items: center;
margin-top: 20px;
margin-left: auto;
/* Align the search box to the right */
margin-right: 10px;
/* Optional: Adds space from the right */
}

/* Style for the search input */
.table-search-input {
width: 100%;
padding: 8px 10px;
/* Adjust padding since no icon */
font-size: 14px;
border: 1px solid #ddd;
/* Subtle border */
border-radius: 4px;
/* Rounded corners */
outline: none;
}

/* Style for the search input placeholder */
.table-search-input::placeholder {
color: #a0a0a0 !important;
/* Set placeholder text color to light gray */
opacity: 1;
/* Ensure the placeholder is fully opaque */
}

/* When the user types something, the text will appear in normal color */
.table-search-input:not(:placeholder-shown) {
color: #000;
/* Change text color to black when the user types */
}

/* Clear button (inside the search input) */
.table-search-clear-btn {
position: absolute;
top: 50%;
transform: translateY(-50%);
/* Vertically center the button */
right: 10px;
background: none;
border: none;
cursor: pointer;
}

/* ─── SORT ARROWS CSS (inline, no gap) ─────────────────────────────────────────── */
.styled-table th {
cursor: pointer;
/* remove any right padding—you’ll see the arrow immediately after the text */
padding-right: 0;
white-space: nowrap;
}

/* inline pseudo-element, with a tiny left-margin to separate it from the text */
.styled-table th.sort-asc::after,
.styled-table th.sort-desc::after {
content: "";
display: inline-block;
margin-left: 0.2em;
/* just enough to breathe */
font-size: 0.8em;
line-height: 1;
color: #003d59;
}

/* ▲ up‐arrow for ascending */
.styled-table th.sort-asc::after {
content: "▲";
}

/* ▼ down‐arrow for descending */
.styled-table th.sort-desc::after {
content: "▼";
}

/* Icons style for the clear button */
.table-search-clear-icon {
font-size: 18px;
color: #666666;
/* Light color for the clear icon */
}

/* Common link style for applications and licenses */
.table-link {
color: #075EAD;
/* Blue color */
text-decoration: none;
/* No underline by default */
}

/* Hover effect */
.table-link:hover {
color: #075EAD;
/* Darker blue on hover */
text-decoration: underline;
/* Underline on hover */
}


.dropdowndiv {
display: none;
position: absolute;
background-color: #fff;
min-width: 120px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
z-index: 10;
/*right: 0; */
border-radius: 5px;
}

.dropdownDiv {
display: none;
position: absolute;
background-color: #fff;
min-width: 120px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
z-index: 10;
border-radius: 5px;
/* top: 35px; */
}

.dropdowndiv a {
color: #333;
padding: 8px 12px;
text-decoration: none;
display: block;
font-size: 14px;
}

.dropdownButton {
border: 2px solid #003d59;
background-color: white;
color: #003d59;
cursor: pointer;
font-size: 8px;
padding: 5px 10px;
border-radius: 4px;
}

.dropdownButton:hover {
border-color: #006d8b;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.Modal {
display: none;
position: fixed;
z-index: 1050;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.4);
}

/* Modal Dialog */
.Modal-dialog {
position: relative;
width: auto;
max-width: 600px;
margin: 5% auto;
}

/* Modal Content */
.Modal-content {
position: relative;
background-color: #fefefe;
margin: auto;
padding: 0;
border: 1px solid #888;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
overflow: visible;
width: 70%;
height: fit-content;
border-radius: 20px;
}

/* Modal Header */
.Modal-header {
padding: 2px 16px;
color: white;
background: #007bff;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}

/* Modal Body */
.Modal-body {
padding: 10px 16px;
max-height: 400px;
overflow-y: auto;
}

/* Modal Footer */
.Modal-footer {
padding: 10px 16px;
color: white;
background: #007bff;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
}

/* Smooth fade-in and fade-out effect for the modal */
.modal.fade .modal-dialog {
transform: translate(0, -50px);
transition: transform 0.3s ease-in-out, opacity 0.2s ease-in-out;
opacity: 0;
}

.modal.show .modal-dialog {
transform: translate(0, 0);
opacity: 1;
}

/* Optional: Slow down the fade in for the backdrop */
.modal.fade .modal-backdrop {
opacity: 0;
transition: opacity 0.3s ease-in-out;
}

.modal.show .modal-backdrop {
opacity: 0.5;
}

.toggleButton {
border: 2px solid #003d59;
background-color: white;
color: #003d59;
cursor: pointer;
font-size: 15px;
padding: 5px 10px;
border-radius: 4px;
float: right;
margin-top: 2px;
}

.toggleButton:hover {
border-color: #006d8b;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}


.show {
display: block;
}

.form-group {
margin-bottom: 20px;
}

.fieldset {
margin-bottom: 20px;
}


/* Style for the tabs */
.tab-content {
display: none;
padding: 20px;
border: 1px solid #ddd;
border-top: none;
}

.tab-content.active {
display: block;
}

.nav-tabs {
border-bottom: 2px solid #ddd;
}

.nav-tabs>li {
float: left;
margin-bottom: -1px;
border: 1px solid #ccc;
border-radius: 8px 8px 0 0;
}

.nav-item .active {
background-color: #f8f9fa;
/* Or any color you prefer */
color: #007bff;
}

.nav-tabs .nav-item {
margin-right: 5px;
}

.nav-tabs .nav-link {
/* background-color: #D9D9D9; */
color: #075ead;
border: none;
padding: 15px 15px;
text-align: center;
font-weight: bold;
}

.nav-tabs .nav-link.active {
background-color: #003d59;
color: white;
opacity: 80%;
}

.nav-tabs .nav-link:hover {
background-color: #bfbfbf;
}

.section-container {
display: flex;
flex-wrap: wrap;
}

.section {
flex: 1;
min-width: 50px;
margin: 10px;
}

.border-section {
padding: 10px;
margin-top: 20px;
padding: 10px;
border: 1px solid #0b4d4e;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.section-header {
background-color: #d2dbdf;
color: #073334;
padding: 10px;
font-size: 20px;
font-weight: bold;
border-radius: 8px 8px 0 0;
margin-left: -10px !important;
margin-top: -10px !important;
margin-right: -10px !important;
}

.section-content {
padding: 5px;
}

.form-group input::placeholder {
color: gray !important;
}

.form-group label {
font-weight: bold;
font-size: 15px;
color: #202124;
display: block;
margin-bottom: 5px;
}

.form-group input,
.form-group select {
width: 100%;
padding: 6px;
margin-bottom: 20px;
border: 1px solid #949494;
border-radius: 4px;
font-size: 14px;
display: block;
outline: none;
}

.form-group p {
font-size: 13px;
color: #202124;
margin-top: -10px;
margin-bottom: 20px;
display: block;
}

.btn-danger {
font-size: 14px;
font-weight: 600;
border-radius: 2px;
}

.btn-primary,.button2, .btn-secondary, .btn-default, .btn-danger {
font-family: 'Fira Sans', sans-serif !important;
}

.section.container {
border: #0869c4 1px solid;
border-radius: 6px;
max-width: 90% !important;
}

input:focus,
select:focus {
border: 1px solid #007bff;
box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
}

.required {
color: #d81616;
}

.form-flex-container {
display: flex;
align-items: center;
padding: 10px;
gap: 20px;
}

.form-flex-container label {
margin-right: 4px;
}

.instructiontext {
background-color: #d2dbdf !important;
color: #666666;
margin-bottom: 0px;
font-weight: bold;
}

.alert-info {
color: #073334;
background-color: #d9edf7;
border-color: #0b4d4e;
}

.alert {
border-radius: 4px;
}

.alert-danger {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
/* padding: 10px; */
border-radius: 5px;
}

.spinner-icon {
font-size: 22px;
vertical-align: middle;
}

/* Force hide initially */
.hide {
display: none !important;
}

/* Define custom spin animation */
@keyframes spin {
from {
transform: rotate(0deg);
}

to {
transform: rotate(360deg);
}
}

/* Custom spinning class */
.custom-spin {
animation: spin 1s linear infinite;
}

/* fontawesome-icon */
.fontawesome-icon {
font-family: "Font Awesome 6 Pro", "Font Awesome 6 Free", sans-serif;
font-weight: 900;
font-style: normal;
font-size: 8px;
cursor: pointer;
margin: 0 10px;
color: #003d59;
}

.download-btn {
background: none;
/* No background */
border: none;
/* No border/box */
cursor: pointer;
font-size: 18px;
/* Slightly bigger icon for visibility */
color: #003d59;
/* Your brand color */
padding: 0;
/* Remove extra padding */
outline: none;
/* No outline on focus */
}

.download-btn:hover {
color: #005a8c;
/* Slightly darker on hover for feedback */
}

.qlrnav-tabs .qlrnav-link:hover {
background-color: #003d59 !important;
}

input.qlrform-control,
select.qlrform-control {
width: 400px !important;
}

.qlrform-control:disabled,
.qlrform-row input:disabled{
background-color: #e9ecef !important;
opacity: 1;
}

.qlrfilter-bar {
display: flex;
align-items: center;
gap: 15px;
flex-wrap: wrap;
margin-top: 20px;
margin-bottom: 20px;
}

.paynow-checkboxinput {
position: absolute;
opacity: 0;
cursor: pointer;
}

.paynow-checkbox {
display: inline-block;
width: 18px;
height: 18px;
background-color: white;
border: 2px solid #ccc;
border-radius: 3px;
position: relative;
vertical-align: middle;
margin-right: 8px;
transition: border-color 0.3s ease;
}

.paynow-checkbox:hover {
border-color: #003d59;
}

.paynow-checkboxinput:checked+.paynow-checkbox::after {
content: "";
position: absolute;
left: 4px;
top: 0px;
width: 6px;
height: 12px;
border: solid #003d59;
border-width: 0 3px 3px 0;
transform: rotate(45deg);
}


.cusaccdownload-btn {
background: none;
border: none;
cursor: pointer;
font-size: 18px;
color: #003d59;
padding: 0;
outline: none;
}

.cusaccdownload-btn:hover {
color: #005a8c;
}

.creditbalancenotification {
background-color: #ebdea3;
border-left: 5px solid #e6ba0d;
padding: 10px;
margin: 15px 0;
font-size: 16px;
}

.availablecreditnotification {
background-color: #deefe7;
border-left: 5px solid #e6ba0d;
padding: 10px;
margin: 15px 0;
font-size: 16px;
}

.creditbalancenotification b {
color: #FF6347;
}
.availablecreditnotification b {
color: #FF6347;
}

.btn-paynow {
float: right;
margin-left: auto;
margin-right: 10px;
margin-bottom: 10px;
}

.btn-statement {
float: left;
margin-left: 10px;
margin-right: auto;
margin-bottom: 10px;
}

.payment-method-container{
margin-top: 1rem;
display: flex;
align-items: center;
}

.viewbillingsection-container {
background-color: #cfe7f0;
padding: 20px;
border-radius: 5px;
display: flex;
justify-content: space-between;
margin-top: 20px;
}

.viewbillingsection {
background-color: #cfe7f0;
padding: 10px;
border-radius: 5px;
flex: 1;
margin: 0 10px;
}

.icon-payment-rejected {
color: #d81616;
}

.required-asterisk {
color: #d81616;
}

.width-auto{
width: auto;
}

.display-block{
display: block;
}

.display-flex{
display: flex;
}

.margin-0{
margin: 0;
}

.qlrtransaction-form{
max-width: 600px;
margin-top: 15px;
}

.qlrsign-section{
background-color: #d2dbdf !important;
border-radius: 6px;
padding: 16px;
margin-bottom: 20px;
}

.qlrsign-content{
display: flex;
align-items: start;
gap: 8px;
}

.qlrsign-content-p{
margin-bottom: 10px;
}

.qlrsign-totaldue-container{
text-align: right;
top: 16px;
right: 16px;
font-weight: 800;
font-size: 18px;
}

.qlrsign-totaldue-value{
font-size: 16px;
padding: 8px;
width: 200;
text-align: left;
display: inline-block;
}

.qlrsign-label{
font-weight: 800;
margin-bottom: 0;
margin-bottom: 10;
}

.qlrhorizontal-line {
border-top: 1px solid black;
margin: 20px 0;
}

.qlrsection-content {
display: none;
}

.qlrsection-content.active {
display: block;
}

.custaccountmodal{
max-width: 600px;
}

.display-none{
display: none;
}

.color-green{
color: green;
}

.color-red{
color: red;
}

.btn-container{
overflow: auto;
margin-top: 80px;
}

.btn-section{
float: left;
display: flex;
align-items: center;
}

.margin-left-10{
margin-left: 10px;
}

.margin-right-15{
margin-right: 15px;
}

.margin-bottom-20{
margin-bottom: 20px;
}

.dis-flex-alignitem-center{
display: flex;
align-items: center;
}

.text-align-center{
text-align:center;
}

.text-align-right{
text-align:right;
}

.cussaccountspinner{
margin-right: 8px;
}

.position-relative{
position: relative;
}

.commercial-savedbtn{
margin-top: 20px;
}

.printqlr-btn{
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
}

.qlr-head-sec{
margin-bottom: 20px;
}

.qlrhead-org-name{
font-weight: bold;
margin: 0;
}

.qlrhead-org-name-span{
font-weight: normal;
}

.qlrhead-licenseyearquarter{
font-weight: bold;
margin: 5px 0 0 0;
}

.qlrhead-licenseyearspan{
padding-right: 52px;
}

.qlrhead-reportperiodspan{
padding-right: 44px;
}

.fileqlr-savebtnsec{
margin-top: 20px;
}

.fileqlr-savebtn{
margin-right: 8px;
}

.viewqlr-btn{
margin-right: 8px;
}

.Amend-table-container {
max-width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}

.qlrpaymentduesec{
max-width: 600px;
margin-top: 15px;
display: flex;
gap: 100px;
}

.Amendpopup-modal{
max-width: 800px;
}

.Amendpopup-transactionname{
padding: 8px;
}

.Amendpopup-value{
padding: 8px;
text-align: right;
}

.Amendpopup-header{
background-color: #003d59;
color: white;
}

.Amendpopup-table{
width:100%;
border-collapse: collapse;
margin-bottom: 15px;
}

.qlrtransactionamount{
width: 600px;
text-align: right;
margin-right: 20px;
}

.qlrhead-yearquarterspan{
font-weight: normal;
}

.qlrinstruction-polname{
margin: 0;
font-weight: bold;
}

.fileqlrbtn{
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
}

.paymentspinner-icon {
display: inline-block;
animation: spin 1s linear infinite;
}

.usecreditcheckboxlabel {
font-size: 18px !important;
white-space: nowrap !important;
}

.achcontainer .section-container .form-group {
display: grid;
grid-template-columns: 250px auto;
grid-template-rows: auto auto;
row-gap: 4px;
align-items: center;
margin-bottom: 1rem;
}

.achcontainer .section-container .form-group label {
grid-column: 1 / 2;
grid-row: 1 / 2;
font-weight: bold;
text-align: left;
padding-right: 30px;
white-space: nowrap;
}

.achcontainer .section-container .form-group input,
.achcontainer .section-container .form-group select {
grid-column: 2 / 3;
grid-row: 1 / 2;
width: 450px;
max-width: 100%;
padding: 6px 8px;
font-size: 1rem;
box-sizing: border-box;
margin-bottom: 10px !important;
}

.acherrormessage {
grid-column: 2 / 3;
grid-row: 2 / 3;
color: red;
font-size: 0.9rem;
margin-top: 4px;
display: none;
}


.achmessagecontent {
grid-column: 2 / 3;
grid-row: 2 / 3;
font-size: 0.9rem;
margin-top: 2px;
color: #5e5b5b;
}

.achcontainer .section {
border: 1px solid #c8c8c8;
padding: 25px 20px;
border-radius: 8px;
margin-top: 20px;
background-color: #f9f9f9;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.billing-details {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 20px;
margin-top: 30px;
}

.invoice-table {
width: 100%;
margin-top: 30px;
border-collapse: collapse;
}

.invoice-table th, .invoice-table td {
padding: 8px 12px;
text-align: left;
border: 1px solid #ddd;
}

.invoice-table th {
background-color: #003d59;
color: white;
}

.invoice-table tbody tr:nth-child(even) {
background-color: #f9f9f9;
}

.invoice-table tbody tr:hover {
background-color: #f1f1f1;
}


.invoice-details {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 15px;
}

.invoice-details .label {
width: 150px;
font-weight: bold;
}

.invoice-details .value {
flex: 1;
}

.invoice-details .paymentstatusvalue {
flex: 1;
font-weight: bold;
color: #d81616;
}

.invoice-details .Currencyfields {
text-align: right;
}

.invoice-container {
font-family: 'Fira Sans', sans-serif;
max-width: 100%;
margin: 0 auto;
padding: 20px;
border: 1px solid #ddd;
border-radius: 8px;
background-color: #f9f9f9;
}

.invoice-header {
background-color: #003d59;
color: white;
padding: 20px;
text-align: center;
border-radius: 6px;
}

.invoice-header h1 {
font-size: 24px;
margin: 0;
}

.invoice-header p {
margin: 5px 0;
}


.paymentdetails table.product-list {
width: 900px;
border-collapse: collapse;
margin-top: 10px;
}

.paymentdetails table.product-list td {
padding: 4px 8px;
vertical-align: top;
}

.paymentdetails table.product-list .desc {
font-weight: bold;
width: 230px;
text-align: center;
padding-right: 8px;
white-space: nowrap;
}

.paymentdetails table.product-list .colon {
width: 10px;
text-align: center;
font-weight: bold;
}

.paymentdetails table.product-list .price {
text-align: right;
width: 80px;
font-weight: bold;
}

.paymentdetails table.product-list .remove-item-btn {
width: 20px;
text-align: center;
padding-left: 10px;
cursor: pointer;
margin-left: 10px;
border: none;
background: none;
cursor: pointer;
font-weight: bold;
font-size: 1.2rem;
}

.paymentdetails table.product-list .payment-method-row td.desc {
text-align: left;
padding-right: 20px;
white-space: nowrap;
}


.paymentdetails table.product-list {
width: 100% !important;
border-collapse: collapse;
margin-top: 20px;
background-color: #ffffff;
border-radius: 8px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.paymentdetails table.product-list th,
.paymentdetails table.product-list td {
padding: 12px 15px;
text-align: left;
vertical-align: middle;
}

.paymentdetails table.product-list th {
background-color: #f4f4f4;
font-weight: bold;
text-transform: uppercase;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}

.paymentdetails table.product-list td {
background-color: #f9f9f9;
border-bottom: 1px solid #e0e0e0;
}

.paymentdetails table.product-list .price {
text-align: right !important;
font-weight: bold;
}

.paymentdetails table.product-list .remove-item-btn {
cursor: pointer;
font-size: 1.5rem;
color: red;
background: none;
border: none;
}

.paymentdetails table.product-list .remove-item-btn:hover {
color: darkred;
}

.paymentdetails table.product-list .remove-item-btn:focus {
outline: none;
}

.payment-method-select {
padding: 6px 10px;
font-size: 1rem;
margin-left: 50px;
line-height: 1.1;
}

.payment-method-select option {
padding: 2px 6px;
font-size: 0.9rem;
line-height: 1.1;
}

.selected-payment-alert {
display: none;
margin-top: 15px;
font-weight: bold;
color: black;
}

.payment-details-heading {
text-align: center !important;
font-weight: bold;
text-decoration: underline;
}

.creditsection {
width: 100% !important;
margin-top: 50px;
background-color: #e9f5f0;
padding: 20px;
border-radius: 8px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.balance-info {
margin-top: 10px !important;
}

.balance-info span {
font-size: 16px !important;
color: green !important;
}

.creditamounts {
margin-top: 20px !important;
text-align: right;
margin-right: 100px;
}

.creditamounts span {
font-size: 20px !important;
font-weight: bold !important;
}

.creditamounts .subtotal {
font-size: 24px !important;
}

.checkbox-creditsection {
display: flex;
align-items: center;
}

.amountdue {
text-align: right !important;
white-space: nowrap;
word-break: keep-all !important;
width: 1%;
}

.summarytotaldue {
display: inline-block;
width: 100%;
padding: 8px 10px;
background-color: #eef0f2;
border: 1px solid #c8c8c8;
border-radius: 4px;
color: #333;
text-align: right;
font-size: 14px;
box-sizing: border-box;
margin-left: 15px;
}

.amendsummarytotaldue {
display: inline-block;
width: 100%;
padding: 8px 10px;
background-color: #eef0f2;
border: 1px solid #c8c8c8;
border-radius: 4px;
color: #333;
text-align: right;
font-size: 14px;
box-sizing: border-box;
margin-left: 15px;
min-width: 200px;
}

.Amendmentduelabel {
visibility: hidden;
}

.qlrform-row {
display: flex;
align-items: center;
margin-bottom: 12px;
}

.qlrform-row label {
white-space: nowrap;
font-weight: 600;
font-size: 0.9rem;
width: 400px;
flex-shrink: 0;
}

.qlrform-row input[type="text"] {
padding: 6px 10px;
font-size: 0.9rem;
border: 1px solid #ccc;
border-radius: 3px;
margin-left: 10px;
}

.qlrform-row input::placeholder {
color: #ddd;

}

.qlrform-row textarea {
width: 1200px;
}

.qlrform-row textarea::placeholder {
color: #d3d3d3;
opacity: 0.7;
}

.qlrform-row {
display: flex;
align-items: center;
margin-bottom: 12px;
}

.qlrform-row label {
white-space: nowrap;
font-weight: 600;
font-size: 0.9rem;
width: 400px;
flex-shrink: 0;
}

.qlrform-row input[type="text"] {
padding: 6px 10px;
font-size: 0.9rem;
border: 1px solid #ccc;
border-radius: 3px;
margin-left: 10px;
}

.qlrform-row input[type="text"]:first-of-type {
width: 300px;
text-align: right;
margin-right: 20px;
}

.qlrform-row input[type="text"]:last-of-type {
width: 900px;
}

.qlrform-row input::placeholder {
color: #ddd;
}

.qlrform-row textarea {
width: 1200px;
}

.qlrform-row textarea::placeholder {
color: #d3d3d3;
opacity: 0.7;
}

.quarterly-section .qlrform-row label {
margin-left: 40px !important;
}

.quarterly-section .qlrform-row input[disabled] {
margin-left: -30px !important;
flex: 0 0 200px !important;
text-align: right !important;
}

.max-license-spacing {
margin-top: 25px !important;
margin-bottom: 25px !important;
display: block;
}

.qlrform-row input[type="text"]:first-of-type {
width: 300px;
text-align: right;
margin-right: 20px;
}

.qlrform-row input[type="text"]:last-of-type {
width: 900px;
}

.qlr-heading-container {
margin-bottom: 25px !important;
}

.qlr-main-heading {
margin: 0 !important;
padding-bottom: 15px !important;
}

.clear-both{
clear: both;
}

.newlicense-btn{
float:right;
margin:0 10px 10px;
}

.new-employeelicense-btn{
margin-right: 10px;
margin-bottom: 10px;
float: right;
}

.licensebtn-left{
margin-left: 8px;
}

.licensebtn-right{
margin-right: 8px;
}

.license-min-width-300{
min-width: 300px;
}

.license-padding-left-20{
padding-left: 20px;
}

.license-currency-question{
position: relative;
display: flex;
align-items: center;
}

.license-currency-span{
position: absolute;
left: 10px;
pointer-events: none;
margin-bottom: 20px;
}

.licensedocname{
width: 150px;
text-align: right;
}

.license-margintop-10{
margin-top: 10px;
}

.license-margintop-20{
margin-top: 20px;
}

.license-marginbottom-20{
margin-bottom: 20px;
}

.license-margintop-36{
margin-top: 36px;
}

.license-margintop-26{
margin-top: 26px;
}

.license-marginbottom-7{
margin-bottom: 7px;
}

.license-marginleft-5{
margin-left: 5px;
}

.license-marginright-5{
margin-right: 5px;
}

.license-margintop-40{
margin-top: 40px;
}

.Application-oath-labelcheck{
display: flex;
align-items: center;
white-space: nowrap;
}

.spinner-btn-size{
font-size: 24px;
}

.small-license-note{
margin-bottom:0px;
}

.small-license-div{
margin-top: 7px;
}

.license-margin-bottom-10{
margin-bottom: 10px;
}

.license-margin-bottom-5{
margin-bottom: 5px;
}

.contact-spinner-btn{
font-size: 24px;
}

.common-licensedocs-btn{
margin-left: auto;
flex-shrink: 0;
}

.license-nav-container{
overflow: auto;
margin-bottom: 20px;
}

.license-nav-btn-sec{
overflow: auto;
margin-bottom: 20px;
margin-top: 20px;
}

.license-small{
margin-bottom:20px;
}

.license-applynew{
float: right;
margin-left: auto;
margin-bottom: 10px;
}

.license-uploaddoc{
float: right;
margin-left: auto;
margin-bottom: 10px;
}

.license-uploaddocshrink{
float: right;
margin-left: auto;
margin-bottom: 10px;
flex-shrink: 0;
}

.license-uploaddoc-marginright{
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
}

.license-addbtn-marginright{
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
}

.license-uploaddoc-shrink-right{
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
flex-shrink: 0;
}

.license-textarea{
width: 100%;
max-width: 100%;
resize: vertical;
}

.license-a-div{
display: flex;
align-items: center;
}

.license-bp-btn-div{
align-items: center;
display: flex;
float: left;
}

.bullet-label {
display: block;
position: relative;
padding-left: 15px;
}

.bullet-label::before {
content: "•";
position: absolute;
left: 0;
top: 0;
}

.typesofrentingequipments-div{
margin-bottom: 5px;
}

.gmb_donthavewarehouseoroffice-div{
display: flex;
align-items: center;
white-space: nowrap;
margin-bottom: 10px;
}

.providecopywarehouse-div{
display: flex;
align-items: center;
margin-top: 20px;
}

.license-app-status{
margin-top: 2px;
margin-left: 5px;
}

.contact-name-error{
display: none;
color: red;
font-size: 12px;
margin-top: 5px;
}

.license-date-error{
display: none;
color: red;
font-size: 12px;
margin-top: 5px;
}

.license-doc-sec{
margin-top: 10px;
}

.business-premise-label{
margin-bottom: 7px;
}

.Address-Validate-btn{
margin-top: 10px;
}

.common-license-questiondiv{
display: flex;
align-items: center;
margin-bottom: 10px;
}

.mailing-address-div{
display: flex;
align-items: center;
justify-content: space-between;
}

.mailing-address-label{
margin-bottom: 0;
}

.Address-Validation-checkbox{
display: flex;
align-items: center;
white-space: nowrap;
}

.Address-checkbox-input{
margin-right: 5px;
}

.Address-checkbox-label{
margin: 0;
font-weight: normal;
}

.App-contact-person{
margin-top: 20px;
}

.App-contact-personbtn{
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
}

.gmb_donthavewarehouseoroffice-checkbox{
margin-right: 5px;
margin-bottom: 5px;
}

.gmb_corporationprivatelyorpubliclyexplain-div{
width: 100%;
max-width: 100%;
resize: vertical;
}

.float-right{
float: right;
}

.float-left{
float: left;
}

.contact-remove-btn{
margin-right: 4px;
}

.remove-spinner-btn{
margin-right: 4px;
}

.Add-contact-modal{
max-width: 600px;
}

.modal-dialog-width{
max-width: 600px;
}

.tribelicense-form-row {
display: flex;
justify-content: space-between;
gap: 15px;
margin-bottom: 20px;
}

.tribelicense-form-row .form-group {
flex: 1;
}

.addindividualmodal-dialog-width{
max-width: 700px;
}

.license-doc-question-div{
display: flex;
align-items: center;
}


/* Submission related CSS */
.sub-btn-container {
overflow: auto;
margin-bottom: 20px;
margin-top: 20px;
}

.sub-btn-div {
float: left;
display: flex;
align-items: center;
}

.sub-btn-right {
margin-right: 8px;
}

.sub-btn-left {
margin-left: 8px;
}

.sub-btn-docupload {
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
}

.sub-float-right {
float: right;
}

.sub-Topmargin {
margin-top: 20px;
}

.sub-closebtn {
display: none !important;
margin-right:8px !important;
}

/* Non-TLS Submission Instruction tab */
.sub-nonTLS-line {
height: 3px;
background-color: black;
border: none;
}

.sub-nonTLS-paragraph {
font-family: inherit;
font-size: inherit;
line-height: inherit;
margin: 0 0 10px 0;
}

/* Non-TLS Submission Summary tab */
.sub-nonTLS {
display: none;
margin-top: 10px;
}

/* Non-TLS Submission Legal Rights info tab */
.sub-nonTLS-legaltab {
display: none;
margin-bottom: 20px;
}

/* Non-TLS Submission Equipment/Software info tab */
.sub-nonTLS-equipmentsoft {
display: none;
margin-top:20px;
margin-bottom: 20px;
}

/* TLS Submission Acknowledgment*/
.sub-TLS-ackdiv {
display: flex;
align-items: center;
gap: 20px;
}

.sub-TLS-label {
margin: 0;
}

.sub-TLS-ackcheckbox {
width: 17px;
height: 17px;
cursor: pointer;
position: relative;
top: -2px;
}

/* PTN Submission*/
.sub-PTN {
display: flex;
align-items: center;
height: 100%;
padding-top: 10px;
}

.sub-PTN-Licensebtn {
height: 30px;
}

.sub-PTN-gap {
gap: 10px;
}

.sub-PTN-flex {
flex: 1;
}

.sub-blue-url {
color: blue;
}

/* CSS use in 'GMB - WT - Software Search (TLS Signature Lookup)'*/
.software-titlefont {
font-weight: 400;
}

.software-subname {
margin-top: 30px;
}

.software-fieldlabel {
display: flex;
align-items: stretch;
gap: 10px;
}

.software-inputtext {
width: 50%;
min-width: 300px;
}

.software-searchbtn {
height: 34px;
}

.software-paragraphcss {
text-align: left;
font-weight: bold;
}

.software-headingfont {
font-weight: 300;
}

.software-divwidth {
width: 50%;
}

.software-searchbymanuf {
margin-top: 10px;
height: 34px;
}

.software-btncontainer {
overflow: auto;
margin-top: 20px;
margin-bottom: 10px;
}

.software-actionButtons {
float: right;
display: none;
align-items: center;
}

.software-rowcount {
text-align: left;
font-weight: bold;
}

.software-norecord {
text-align:center;
color:red;
font-weight:bold;
}
/* End of CSS for TLS Signature Lookup*/

/* CSS use for GMB - WT - OrganisationDashboard(Submissions/QLR/Events/Licenses)*/
.org-clear {
clear: both;
}

/* CSS use for GMB - WT - Organization Profile(Users)*/
.orgprofile-adduser {
float: right;
margin: 0 10px 10px;
}

/* CSS use for GMB - WT - Organization Profile(Related Records)*/
.orgprofile-suggestion {
pointer-events: none;
color:red;
}

.org-nonepointer {
pointer-events: none;
}

.org-font24 {
font-size: 24px;
}

.orgprofile-contsuggest {
display: none;
position: absolute;
top: 100%;
left: 0;
right: 0;
z-index: 3100;
max-height: 250px;
overflow-y: auto;
width: 100%;
}

.orgprofile-conterror {
display: none;
color: red;
font-size: 12px;
margin-top: 5px;
}

/* CSS use for GMB - WT - Tribal Allocation */
.tribal-topmargin2 {
margin-top: 2em;
}

/* CSS use for GMB - WT - Tribal Profile( Tribal Facility ) */
.tribalprofile-savespinner {
margin-right: 8px;
animation: spin 1s linear infinite;
}

/* CSS use for GMB - WT - Fortress License*/
.Fortress-width300 {
min-width: 300px;
}
  
.Fortress-resultcont {
display: none;
margin-top:30px;
margin-bottom:20px;
}
    
.Fortress-detailurl {
text-decoration:underline;
color:#007bff;
cursor:pointer;
}

.textalign-center {
text-align: center;
}
   
.Fortress-activenewbtn {
float: left;
display: none;
align-items: center;
}

.Fortress-emplink {
color:#007bff;
cursor:pointer;
display:none;
}

.Fortress-empactionbtn {
display: none;
margin-top:20px;
}

/* CSS use Report Request Public Records, */
.top-margin-4 {
margin-top: 4px;
}
 
.RPR-div-style {
text-align: center;
margin-top: 60px;
}

.bottom-margin-30 {
margin-bottom: 30px;
}

.resize-vertical {
resize:vertical;
}

/* CSS use Report Illegal Gambling Activity*/
.top-margin-3 {
margin-top: 3px;
}

.RIGA-div {
background-color: #d2dbdf !important;
border-radius: 6px;
padding: 16px;
margin-bottom: 20px;
}

.RIGA-ack-div {
display: flex;
align-items: start;
gap: 8px;
}

.RIGA-ack-label {
font-weight: 600;
margin-bottom: 0;
}

.RIGA-para {
margin-left: 26px;
margin-top: 10px;
}

/* CSS use 'Secure message' and GMB - WT - view-Secure-Message*/
.SM-para {
font-style: italic;
position: absolute;
bottom: 0;
margin: 0;
}
 
.SM-div {
position: relative;
height: 50px;
}

.SM-sectionheader {
display: flex;
justify-content: space-between;
align-items: center;
}

.SM-msgthread {
font-weight: bold;
text-align: right;
}

.SM-right-20 {
margin-right: 20px;
}

.SM-font-15 {
font-size: 15px;
}

.SM-right20-font15 {
margin-right: 20px;
font-size: 15px;
}

.SM-bold-right40 {
font-weight: bold;
margin-right: 40px;
}
   
.SM-top10-flex {
display: flex;
align-items: center;
margin-left: auto;
margin-top: 10px;
}

.SM-flex-wrap {
display: flex;
align-items: center;
flex-wrap: wrap;
margin-bottom: 20px;
}

.SM-font12-color {
font-size: 12px;
color: #545454;
}

.SM-bold {
font-weight: bold;
}

.SM-left-margin5 {
margin-left: 5%;
}

.SM-height40-width40 {
height: 40px;
width: 40px;
}

.SM-margin-top10 {
margin-top: 10px;
}

.SM-margin-top5 {
margin-top: 5px;
}

.SM-right8-black {
margin-right: 8px;
color:#003366;
}

.SM-wt50-textdecor {
font-weight: 500;
text-decoration: none;
}

/* CSS use GMB - WT - reply-Secure-Message*/

.SM-auto-top30 {
overflow: auto;
margin-top: 30px;
}

.SM-flex-left-center {
float: left;
display: flex;
align-items: center;
}

.SM-inline-left8 {
margin-left: 8px;
display: inline-block;
}
   
.SM-float-auto-10 {
float: right;
margin-left: auto;
margin-bottom: 10px;
margin-right: 10px;
}

.SM-msg-suggestion {
display: none;
z-index:3100;
top: 100%;
width: 100%;
max-height: 250px;
overflow-y: auto;
}

.SM-error-msg {
display: none;
color: red;
font-size: 12px;
margin-top: 5px;
}

/* CSS use GMB - WT - create-Secure-Message*/

.SM-bottom-4 {
margin-bottom: 4px;
}

.SM-inner-suggestion {
pointer-events: auto;
display: flex;
flex-direction: column;
align-items: flex-start;
font-size: 13px;
}

@media (max-width: 768px) {

.payment-method-container {
flex-direction: column;
align-items: flex-start;
margin-left: 0;
}

.payment-method-label {
margin-bottom: 8px;
margin-right: 0;
font-weight: bold;
}

.payment-method-select {
width: 100%;
margin-left: 0 !important;
padding: 6px 10px;
font-size: 1rem;
}

.achcontainer .section-container .form-group {
display: block;
width: 100%;
}

.achcontainer .section-container .form-group label {
font-weight: bold;
margin-bottom: 8px;
}

.achcontainer .section-container .form-group input,
.achcontainer .section-container .form-group select {
width: 100%;
margin-bottom: 15px;
}

.achcontainer .section-container .form-group .required {
font-size: 1.1rem;
color: red;
}

.achcontainer .section {
padding: 15px;
}

.quarterly-section .qlrform-row {
display: flex;
flex-direction: column;
align-items: stretch;
}

.quarterly-section .qlrform-row label {
margin-left: 0 !important;
margin-bottom: 5px !important;
text-align: left !important;
}

.quarterly-section .qlrform-row input[disabled] {
margin-left: 0 !important;
width: 100% !important;
flex: none !important;
text-align: right !important;
}

.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
padding-right: calc(var(--bs-gutter-x) * .2) !important;
padding-left: calc(var(--bs-gutter-x) * .2) !important;
}

.gmb_tablelistheader {
padding-top: 10px !important;
padding-bottom: 13px !important;
}

.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger {
padding: 6px 12px !important;
font-size: 12px !important;
margin: 0 5px 5px !important;
}

.h3,
h3 {
font-size: calc(1rem + 1vw) !important;
white-space: normal !important;
word-wrap: break-word !important;
}

.swal2-popup {
width: 85% !important;
height: auto !important;
font-size: 14px !important;
padding: 15px !important;
transform: scale(0.9);
max-width: 100% !important;
}

.swal2-title,
.swal2-content,
.swal2-actions {
font-size: 14px !important;
}

.swal2-button {
font-size: 10px !important;
padding: 8px 16px !important;
}

.swal2-icon {
font-size: 10px !important;
}

.message-container {
flex-direction: column;
gap: 15px;
}

.left-section,
.right-section {
flex: 0 0 100%;
}

.nav.nav-tabs {
flex-direction: column;
gap: .25rem;
}

.nav-tabs>li {
width: 100%;
}

.nav-tabs>li>a,
.nav-tabs .nav-link {
width: 100%;
text-align: center;
}

.section-container {
flex-direction: column;
align-items: stretch;
}

.section {
width: 100%;
margin-bottom: 20px;
}

.form-group {
width: 100%;
}

.styled-table {
width: 100%;
min-width: 600px;
}

.styled-table th,
.styled-table td {
min-width: 100px;
}

.table-container {
overflow-x: auto !important;
}

.pagination-wrapper {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
padding: 10px;
}

.pagination-button {
margin: 0 5px;
}

.pagination {
display: flex;
}

.table-search-container {
width: 260px;
}

.Modal-dialog {
width: 95%;
margin: 20% auto;
}

.Modal-header,
.Modal-footer {
padding: 10px 20px;
}
}

/* For screens wider than mobile (max-width: 767px) and up to tablet range (max-width: 1024px) */
@media only screen and (max-width: 1024px) {
.styled-table {
width: 100%;
min-width: 600px;
}

.styled-table th,
.styled-table td {
min-width: 120px;
}

.styled-table td:first-child,
.styled-table th:first-child {
white-space: normal;
word-break: break-word;
overflow-wrap: break-word;
}

.qlrsection-container {
display: flex;
flex-direction: column;
gap: 20px;
}

.qlrsection {
width: 100%;
}

input.qlrform-control,
select.qlrform-control {
width: 100% !important;
max-width: 100%;
}

.qlrfilter-bar {
display: flex;
flex-direction: row;
gap: 10px;
flex-wrap: wrap;
}

.qlrfilter-bar label,
.qlrfilter-bar select {
width: 50%;
margin-right: 10px;
box-sizing: border-box;
}

.qlrfilter-bar select {
width: 100px !important;
margin-right: 10px;
}

.qlrfilter-bar button {
width: auto;
padding: 5px 15px;
font-size: 14px;
margin-left: 0;
display: inline-block;
}

.message-container {
flex-direction: column;
gap: 15px;
}

.left-section,
.right-section {
flex: 0 0 100%;
}

.sw-compact {
width: 20em !important;
padding: 0.55em 1.1em !important;
}

.sw-compact-title {
font-size: 1.25rem !important;
}

.sw-compact-text {
font-size: 0.8rem !important;
}

.sw-compact-btn {
font-size: 0.75rem !important;
padding: 0.25em 0.7em !important;
}

.sw-compact-icon {
transform: scale(0.6);
}


.qlrform-row {
flex-direction: column;
align-items: flex-start;
}

.qlrform-row label {
width: 100% !important;
text-align: left;
white-space: normal !important;
margin-left: 0;
margin-right: 0;
word-wrap: break-word !important;
}

.qlrform-row input[type="text"],
.qlrform-row textarea,
.qlrform-row select.form-control {
width: 100% !important;
max-width: 100%;
margin-left: 0;
}

.qlrform-row input[type="text"]:first-of-type {
width: 100%;
}

.qlrform-row textarea {
width: 100%;
}

.achcontainer .section-container .form-group {
display: block;
width: 100%;
}

.achcontainer .section-container .form-group label {
font-weight: bold;
margin-bottom: 8px;
}

.achcontainer .section-container .form-group input,
.achcontainer .section-container .form-group select {
width: 100%;
margin-bottom: 15px;
}

.achcontainer .section-container .form-group .required {
font-size: 1.1rem;
color: red;
}

.achcontainer .section {
padding: 15px;
}

.payment-method-container {
flex-direction: row;
justify-content: flex-start;
}

.payment-method-label {
margin-right: 15px;
font-weight: bold;
}

.payment-method-select {
width: auto;
padding: 6px 10px;
font-size: 1rem;
margin-left: 50px;
}
}