@import url('https://fonts.googleapis.com/css?family=Barlow:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Barlow+Condensed:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Mono:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans:400');
@import url('https://fonts.googleapis.com/css?family=Josefin+Slab:400');
@import url('https://fonts.googleapis.com/css?family=Lato:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Lobster+Two:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Merriweather:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Nunito:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Overlock:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Poppins:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Raleway:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Roboto+Mono:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Source+Code+Pro:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Spectral:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Ubuntu:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Amiri:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Averia+Libre:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Cormorant:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Just+Another+Hand:400');

:root {
    color-scheme: light dark;
    --btn-bkgd-color: #545454;
    --btn-bkgd-color-hover: #00000040;
    --btn-light-bkgd-color: #494a4e;
    --btn-bkgd-color-active: #000;
    --hover-bkgd-color: #000000;
    --input-bkgd-color: #474747;
    --input-bkgd-color-active: #0000002f;
    --input-brdr-color-active: #002f5fcc;
    --btn-text-color: #e4e4e4;
    --text-color: #d4d4d4;
    --text-header-color: #d2d2d2;
    --input-text-color: #e4e4e4;
    --focus-hilite: #ffffff5f;
    --bkgd-color: #ffffff;
    --content-bkgd-color: #5f5f5f00;
    --sidebar-bkgd-color: #363636;
    --btn-brdr-color: #63636300;
    --header-margin: 0px;
    --header-padding: 8px;
    --sidebar-margin: 8px;
    --sidebar-padding: 8px;
    --sidebar-border-radius: 16px;
    --sidebar-filter: none;
    --sidebar-filter: drop-shadow(0px 0px 8px #00000013);
    --product-category-blue: #333333; /* Changed to dark gray */
}

body {
    background-color: #ffffff;
    /* background-image: url("https://www.softworksroes.com/ROES/ROESWeb/configs/UnitPrintsRWTest/unitprints_dark_linen.png"); */
}

.navbar-brand {
    /* background-color: var(--product-category-blue); */
    background-image: url('https://roestemplates.colorincprolab.com/roes/sales/Unitprints_new_logo_white.png'); /* New URL */
    height: 42px;
    width: 157px;
    margin: 1px 10px 1px 10px;
    box-shadow: none; /* Remove any box-shadow that might cause a glow effect */
}

.header, .menubar, .dlg-header, .dlg-content, .dlg-footer, .btn.btn-login, .btn.btn-login-guest {
    background-color: var(--product-category-blue) !important;
    color: #ffffff; /* Ensure text is readable against the dark gray background */
}

.dlg-footer {
    background-color: var(--product-category-blue) !important;
}

.product-category {
    background-color: var(--product-category-blue);
    color: #ffffff;
}

input#user.form-control.login-form input[data-v-b2dd69b6] {
    background-color: #ffffff;
    color: #000000; /* Change font color to black */
}

label.control-label.lbl-login-account::after {
    color: #ffffff;
}

img.product-groupimage[data-v-03cede5f] {
    max-width: 153.5px;
    max-height: 120.45px;
}

div.order-summary-shipping-billing,
div.history-order-items-wrapper {
    background-color: #d3d3d3; /* Lighter gray for better readability */
    color: #000000; /* Ensure text is readable against the lighter gray background */
}

div.products-gridthumb-label {
    color: #000000;
}

span.products-gridthumb-label,
span.products-gridthumb-price {
    color: #000000;
}

div.product-breadcrumb-wrapper {
    background-color: #2e2e2e; /* Dark gray for better contrast */
    color: #ffffff; /* Ensure text is readable against the dark gray background */
}

div.rightside-footer.workspace-controls-wrapper,
div.rightside-items,
div.rightside-header.options-pane-header,
div.rightside.options-pane-wrapper.workspace-options-wrapper,
div.leftside.group-templates-wrapper,
button#btn-choose-images.btn.btn-lightweight,
div.column.cart-preview-wrapper {
    background-color: #d3d3d3; /* Lighter gray for better readability */
    color: #000000; /* Ensure text is readable against the lighter gray background */
}

div.order-summary.column.order-item-pane,
div.order-summary {
    background-color: #d3d3d3 !important; /* Changing background color to light gray */
    color: #000000 !important; /* Ensure text is readable against the lighter gray background */
}

button.btn.btn-template-options.row-center::after,
div.option-group-label {
    color: #000000 !important; /* Change font color to black with higher priority */
}

button.btn.btn-linkweight.btn-go-to-history[data-v-b2dd69b6],
button.btn.btn-linkweight.btn-logout[data-v-b2dd69b6] {
    background-color: #292929 !important; /* Dark gray background */
    color: #ffffff !important; /* Ensure text is readable against the dark gray background */
}

button.btn.btn-linkweight.btn-go-to-history:hover,
button.btn.btn-linkweight.btn-logout:hover,
button.btn.btn-linkweight.btn-go-to-history.btn.linkweight:hover,
button.btn.btn-linkweight.btn-logout.btn.linkweight:hover {
    background-color: #292929 !important; /* Dark gray background for hover state */
    color: #ffffff !important; /* Ensure text is readable against the dark gray background */
}

div.show-logout-history-wrapper[data-v-b2dd69b6] {
    background-color: #292929 !important; /* Dark gray background */
    color: #ffffff !important; /* Ensure text is readable against the dark gray background */
}

button.products-gridthumb svg {
    flex-grow: 1.25; /* This will allow the SVG to grow to fill available space */
    width: 85%; /* Ensure it takes up the full width of its container */
    height: auto; /* Maintain aspect ratio while growing */
}