body {
}
.transactionsPanelWidth {
    /*width:40%;*/
    /*width: 700px;*/
    /*width: 49vw;*/
    /*width: calc(280px + 29vw);*/
/*    width: clamp(380px, 95%, 55vw);
*/    /* width: clamp(380, 95%, 780px); */
    width: min(100%, 700px);
    /*width: 55vw;*/
    margin: 0 auto;
    /* padding: 0.065vw; */
    /*width: 90%;*/
}
.transactionsPurchaseSalePanelWidth {
    /*width:40%;*/
    /*width: 700px;*/
    /*width: 49vw;*/
    /*width: calc(280px + 59vw);*/
    width: min(98%, 1000px);
    /*width: calc(280px + 50vw);*/
    margin: auto;
    /*padding: 0.3vw;*/
    /*width: 90%;*/
}
.transactionsBgColor {
    background-color: #B0C4DE;
}
.transactionsHeaderPanelHeight {
    /*height: 40px;*/
    /*height: 2.8vw;*/
    height: calc(22px + 1.3vw);
}
.transactionsPageTitleFont {
    font-family: Verdana,Helvetica,"Arial Black",Arial;
    /*font-size: 24px;*/
    /*font-size:1.7vw;*/
    /*font-size: calc(14px + 1.7vw);*/
    font-size: calc(10px + 0.70vw);
    font-weight: bold;
    /*text-decoration-color: navy;*/
    color: var(--accountsTitleButtonsColor);
}

.transactionsPageSubTitleFont {
    font-family: Verdana, Helvetica,"Arial Black",Arial;
    /*font-size: 16px;*/
    /*font-size: 1.3vw;*/
    font-size: calc(08px + 0.40vw);
    font-weight: 100 200;
    /*font-stretch: 25% 100%;*/
    /*font-weight: bold;*/
    /*text-decoration-color: navy;*/
    color: var(--accountsTitleButtonsColor);
}
.transactionsHeaderFont {
    font-family: Helvetica,"Arial Black";
    /*font-size: 16px;*/
    font-size: calc(08px + 0.65vw);
    font-weight: bold;
}
.transactionsLabelFont {
    font-size: calc(12px + 0.3vw);
    /*font-size: calc(10px + 0.45vw);*/
    font-weight: bold;
}

.transactionsLabelLeft {
    display: inline-block;
    box-sizing: border-box;
    background-color: transparent;
    outline: none;
    border: 1px solid #ced4da; /* Bootstrap's border color */
    font-size: calc(10px + 0.40vw);
    height: 34px;
    /*height: calc(1.5em + 0.75rem + 2px);*/ /* Responsive by default */
    line-height: 1.5; /* Match Bootstrap's line height */
    padding: 4px 04px;
    border-radius: 04px; /* Matches Bootstrap's rounded */
    width: 100%;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 0;
}
.transactionsLabelBg {
    box-sizing: border-box;
    background-color: white;
    outline: none;
    border: 1px solid #ced4da; /* Bootstrap's border color */
    font-size: calc(10px + 0.40vw);
    /*height: calc(1.5em + 0.75rem + 2px);*/ /* Responsive by default  equivalent to 38px*/
    height: 34px;
    /*line-height: 1.5;*/ /* Match Bootstrap's line height */
    padding: 4px 12px;
    border-radius: 04px; /* Matches Bootstrap's rounded */
    width: 100%;
    /* font-weight: bold; */
    margin-top: 0;
    margin-bottom: 0;
}
.transactionsInputFont {
    box-sizing: border-box;
    background-color: white;
    outline: none;
    border: 1px solid #ced4da; /* Bootstrap's border color */
    font-size: calc(10px + 0.40vw);
    height: 34px;
    /*height: calc(1.5em + 0.75rem + 2px);*/ /* Responsive by default */
    /*line-height: 1.5;*/ /* Match Bootstrap's line height */
    padding: 4px 12px;
    border-radius: 04px; /* Matches Bootstrap's rounded */
    /* font-weight: bold; */
    margin-bottom: 0;
    margin-top:0;
}
.transactionsLabelHeight {
    height: calc(18px + 0.38vw);
    /*  width:100%; */
    /*  height:100%; */
}

.transactionsLabelHeight2 {
    height: calc(21px + 0.33vw);
    /*  height:100%; */
}
.transactionsLabelCaption {
    /*display:flex;*/
    display: inline-block;
    /*height: calc(26px + 0.25vw);*/
    /*display: block;*/
    /*line-height: calc(24px + 0.20vw);*/
    /*height: calc(20px + 0.38vw);*/ /* 14px;*/
    /*padding-top: calc(08px + 0.13vw);*/
    /*padding-left: 3px;*/
    margin: 0;
    /*padding: calc(01px + 0.065vw) calc(01px + 0.065vw);*/
    /*padding-top: calc(03px + 0.065vw);
    padding-left: calc(03px + 0.065vw);*/
    /*padding: calc(03px + 0.13vw) calc(02px + 0.13vw);*/
    padding: 03px 02px;
    /*padding-bottom: 0px;*/
    /*clear: both;*/
    /*padding: 2px;*/
    /*padding: calc(1px + 0.065vw);*/
    font-size: calc(07px + 0.45vw); /*12px;*/
    /*font-weight: bold;*/
    background-color: darkslategray;
    background-color: gray;
    color: white;
    width: 100%;
    /* height: auto;*/
    /*height: 100%;*/
    /*min-height: 100%;*/
    /*text-align:center;*/
    /*vertical-align: central;
    align-content: center;*/
}
.transactionsLabelLeftOLD {
    /*Label Background Color is darkSlateGray*/
    display: inline-block;
    /*line-height: 12px;*/
    padding: calc(03px + 0.13vw) calc(02px + 0.13vw);
    /*padding-top: calc(08px + 0.15vw);*/
    /*padding-top: 4px;*/
    padding-left: 0px;
    /*font-size: 12px;*/
    font-size: calc(08px + 0.32vw);
    /*font-weight: bold;*/
    background-color: darkslategray;
    background-color: whitesmoke;
    /*color: white;*/
    /*height: 99%;*/
}

.transactionsInputFontOLD {
    font-family: Helvetica,Arial,"Arial Black";
    font-size: calc(08px + 0.37vw);
}
/* Custom CSS to match form-control dimensions */
.form-label-matched {
    background-color: #f8f9fa; /* Light gray similar to bg-light */
    border-radius: 0.25rem; /* Matches Bootstrap's rounded */
    /* Bootstrap uses 0.375rem for small spacing (e.g., padding: 0.375rem 0.75rem = 6px 12px). */
    padding: 0.375rem 0.75rem; /* Same as form-control */

    height: calc(1.5em + 0.75rem + 2px); /* Standard form-control height */
    line-height: 1.5; /* Match Bootstrap's line height */
    display: inline-flex;
    align-items: center;
    margin-bottom: 0;
    width: 100%;
    box-sizing: border-box;
    text-align: end;
}
.transactionsInputHeight {
    height: calc(23px + 0.40vw);
    /*  height:100%; */
}

.transactionsGridDateNo {
    display: grid;
    /* grid-template-rows: 30px 30px 30px 30px 30px 30px; */
    /* grid-template-columns: 3fr 1fr 2fr; */
    /*grid-template-columns: minmax(60px,120px) auto minmax(40px,100px);*/
    grid-template-columns: minmax(120px,160px) auto minmax(100px,140px);
    column-gap: 0;
    row-gap: 0;
}
.transactionsGridDateBalance {
    display: grid;
    /* grid-template-rows: 30px 30px 30px 30px 30px 30px; */
    /* grid-template-columns: 3fr 1fr 2fr; */
    /*grid-template-columns: minmax(60px,120px) auto minmax(40px,100px);*/
    grid-template-columns: minmax(120px,160px) minmax(100px,160px) auto;
    column-gap: 0;
    row-gap: 0;
}
.transactionsGridAmountStatus {
    display: grid;
    grid-template-columns: minmax(120px,160px) minmax(100px,auto);
    column-gap: 0;
    row-gap: 0;
}

input[type='number'] {
    -moz-appearance: textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.no-spin, .no-spin:hover, no-spin:focus {
    -webkit-appearance: none;
    margin: 0;
    -moz-appearance: textfield;
}