/* Web Forms components adapted to the supplied Bootstrap 5 client design. */
.client-catalog-loader[hidden] { display: none !important; }
.client-catalog-loader { position: fixed; inset: 0; z-index: 20000; display: grid; place-items: center; background: rgba(248, 249, 250, .35); padding: 24px; }
.client-catalog-loading { overflow-y: auto; }
.client-catalog-loading #form1 { filter: blur(6px); pointer-events: none; }
.client-catalog-loading #hdrNav .dropdown-menu { display: none !important; }
.client-loader-card { position: relative; text-align: center; width: min(360px, 100%); padding: 40px 24px; background: #fff; border-radius: 24px; box-shadow: 0 16px 60px #20232912; }
.client-loader-ring { width: 104px; height: 104px; margin: 0 auto 28px; border: 3px solid #fff3cd; border-top-color: #ffc107; border-right-color: #ffc107; border-radius: 50%; animation: client-loader-spin 1s linear infinite; }
.client-loader-logo { position: absolute; top: 70px; left: 50%; transform: translateX(-50%); width: 62px; height: 42px; object-fit: contain; }
.client-loader-card h2 { font-size: 1.2rem; font-weight: 700; color: #202329; }
.client-loader-card p { font-size: .875rem; color: #6c757d; margin: 12px 0 24px; }
.client-loader-progress { height: 4px; border-radius: 4px; overflow: hidden; background: #fff3cd; }
.client-loader-progress::after { content: ''; display: block; height: 100%; width: 40%; background: #ffc107; border-radius: inherit; animation: client-loader-slide 1.4s ease-in-out infinite alternate; }
@keyframes client-loader-spin { to { transform: rotate(360deg); } }
@keyframes client-loader-slide { to { transform: translateX(150%); } }
@media (prefers-reduced-motion: reduce) { .client-loader-ring, .client-loader-progress::after { animation: none; } }
.client-app .catalog-design { background: #f8f9fa; }
.client-app .catalog-design .catalog-layout { grid-template-columns: 200px minmax(0, 1fr); gap: 24px; }
.client-app .catalog-design .catalog-sidebar { padding: 0; border: 0; background: transparent; border-radius: 0; }
.client-app .catalog-design .catalog-sidebar .card-header { padding: .75rem 1rem; }
.client-app .catalog-design .catalog-category-link { padding: .75rem 1rem; font-size: .875rem; line-height: 1.5; flex: 1; }
.client-app .catalog-design .catalog-category-branch { border-bottom: 1px solid #dee2e6; }
.client-app .catalog-design .catalog-category-branch > summary { position: relative; padding-right: 1rem; }
.client-app .catalog-design .catalog-category-branch > summary::before { position: absolute; right: .8rem; }
.client-app .catalog-design .catalog-category-branch > summary:has(.active) { background: #fff9e6; box-shadow: inset 3px 0 #ffc107; }
.client-app .catalog-design .catalog-category-link.active { background: #fff9e6; color: #b57900; border-radius: 0; }
.client-app .catalog-design .catalog-category-children { margin: 0; padding-left: .65rem; background: #fafafa; }
.catalog-view-all { display: block; padding: .75rem 1rem; color: #b57900; font-size: .875rem; }
.client-app .catalog-design .product-list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.client-app .catalog-design .product-image { height: 170px; padding: 1rem; display: flex; justify-content: center; align-items: center; }
.client-app .catalog-design .product-image img { height: 100%; width: 100%; object-fit: contain; }
.client-app .catalog-design .product-details { gap: .5rem; padding: 1rem !important; }
.client-app .catalog-design .product-details .name { font-size: .875rem; line-height: 1.5; margin: 0; }
.client-app .catalog-design .product-details > a.name { min-height: 2.625rem; }
.client-app .catalog-design .actions { margin: .25rem 0; gap: .5rem; }
.client-app .catalog-design .actions:last-child { margin-top: auto; padding-top: .75rem; }
.client-app .catalog-design [data-id="divAddToCart"], .client-app .catalog-design .actions:last-child > div { width: 100%; }
.client-app .catalog-design .actions .button { width: 100%; padding: .5rem .75rem; font-size: .8rem; }
.client-app .catalog-design .actions select { min-width: 0; font-size: .8rem; padding: .4rem .5rem; }
.client-app .catalog-design .actions label, .client-app .catalog-design .actions span { font-size: .8rem; }
.client-app .catalog-design .product-card[hidden] { display: none !important; }
@media (max-width: 1199px) { .client-app .catalog-design .product-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px) { .client-app .catalog-design .catalog-layout { grid-template-columns: 190px minmax(0, 1fr); } .client-app .catalog-design .product-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .client-app .catalog-design .catalog-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 479px) { .client-app .catalog-design .product-list { grid-template-columns: minmax(0, 1fr); } }
.client-app { font-family: Inter, system-ui, sans-serif; color: #202329; }
.client-app a { text-decoration: none; }
.client-app img { max-width: 100%; }
.client-app .client-contact-hero small { overflow-wrap: anywhere; }
.client-app .navbar-brand img { width: auto; object-fit: contain; }
.client-mega-menu { width: 100%; left: 0; max-height: 75vh; overflow-y: auto; }
.client-search { width: 210px; }
.client-app .content { width: 100%; margin: 0; min-height: 50vh; }
.client-app .productContainer { max-width: 1320px; margin: auto; padding: 3rem 1.5rem; }
.client-app #title-bar-id { display: none !important; }
.client-app #title-bar-id img { width: 26px; height: 26px; object-fit: contain; }
.client-app .title-bar { margin-bottom: 1.5rem; }
.client-app .title-bar .title { font-weight: 800; }
.client-app .product-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.client-app .product-list > li { display: contents; }
.catalog-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 2rem; align-items: start; }
.catalog-sidebar { background: #fff; border: 1px solid #e9ecef; border-radius: 1rem; padding: 1.25rem; }
.catalog-category-link { display: block; padding: .55rem .35rem; color: #343a40; font-size: .875rem; overflow-wrap: anywhere; }
.catalog-category-link.active { background: #fff3cd; color: #161616; font-weight: 700; border-radius: .4rem; }
.catalog-category-branch > summary { display: flex; align-items: center; gap: .35rem; cursor: pointer; }
.catalog-category-branch > summary::before { content: '\203A'; font-size: 1.25rem; }
.catalog-category-branch[open] > summary::before { transform: rotate(90deg); }
.catalog-category-children { margin-left: .65rem; padding-left: .65rem; border-left: 1px solid #e9ecef; }
.catalog-results { min-width: 0; }
.client-app .catalog-results .product-card { min-width: 0; height: 100%; }
.client-app .catalog-results .product-details > a.name { min-height: 2.75rem; }
.client-app .catalog-results .product-details .actions:last-child { align-items: flex-end; }
@media (max-width: 1199px) { .client-app .catalog-results .product-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .catalog-layout { grid-template-columns: minmax(0, 1fr); } .catalog-sidebar nav { max-height: 320px; overflow-y: auto; } }
@media (max-width: 575px) { .client-app .catalog-results .product-list { grid-template-columns: minmax(0, 1fr); } }
.client-featured-card { flex: 0 0 calc(25% - 18px); background: #fff; border-radius: 20px; overflow: hidden; border: 1.5px solid #f0efe8; box-shadow: 0 4px 24px #0000000f; }
.client-featured-image { background: #f9f8f2; height: 210px; display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.client-featured-image img { width: 100%; height: 100%; object-fit: contain; }
.client-app .product-card { display: flex; flex-direction: column; background: white; transition: transform .2s, box-shadow .2s; }
.client-app .product-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px #00000012 !important; }
.client-app .product-image { position: relative; background: #f8f9fa; padding: 1.5rem; }
.client-app .product-image img { width: 100%; height: 220px; object-fit: contain; border: 0; }
.client-app .product-details { display: flex; flex-direction: column; gap: .75rem; flex: 1; white-space: normal; }
.client-app .product-details .name { font-size: 1.05rem; font-weight: 700; color: #202329; }
.client-app .product-details .description { font-size: .875rem; font-weight: 400; color: #6c757d; }
.client-app .actions { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; margin-block: .5rem; }
.client-app .actions select { max-width: 100%; min-width: 120px; }
.client-app .actions .button { display: inline-flex; align-items: center; justify-content: center; padding: .65rem 1rem; border-radius: 50rem; font-size: .8rem; font-weight: 600; }
.client-app .product-details .actions:last-child { margin-top: auto; }
.client-app .button, .client-app .btn-yellow { background: #ffc107; color: #111; border: 1px solid #ffc107; border-radius: 50rem; padding: .65rem 1.25rem; font-weight: 600; cursor: pointer; }
.client-app .button.request, .client-app .button-outline { background: transparent; color: #202329; border-color: #202329; }
.client-app .details-box .content-box { background: #fff; border-radius: 1.5rem; padding: 2rem; box-shadow: 0 .125rem .25rem #0000000d; }
.client-app .details-box h1 { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 800; }
.client-app .details-box p { line-height: 1.8; color: #6c757d; }
.client-app .imgMainProductClass { max-height: 450px; }
.client-app .product-thumb { border-radius: .75rem; }
.client-app .input, .client-app .select-box { display: block; width: 100%; border: 1px solid #dee2e6; border-radius: .75rem; padding: .75rem 1rem; background: #f8f9fa; color: #202329; }
.client-app .input-box { margin-bottom: 1rem; }
.client-app .input-box label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: .5rem; }
.client-app .error-message, .client-app .vldtr { color: #dc3545; font-size: .8rem; }
.client-app .branches { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-bottom: 1.5rem; }
.client-app .branch { border: 1px solid #e9ecef; background: #fff; border-radius: 1.25rem; padding: 1.5rem; }
.client-app .branch h3 { font-size: 1.1rem; font-weight: 700; }
.client-app .contact-form { max-width: 850px; margin: 2rem auto; }
.client-app .contact-form .button { width: auto !important; }
.client-app .panel, .client-app .page-content, .client-app .profile-content { background: white; padding: 1.5rem; border-radius: 1rem; }
.client-app .table { background: white; vertical-align: middle; }
.client-app .table th { background: #f8f9fa; font-size: .85rem; }
.client-app .table .table-dark th { background: #212529; color: #fff; }
.client-app .section-header { font-weight: 700; font-size: 1.1rem; }
.client-app .address-box, .client-app .addresses-box { background: #fff; border-radius: 1rem; padding: 1.25rem !important; }
.client-app .text-orange { color: #9e6c00; }
.client-app .form-control, .client-app .form-select { border-radius: .75rem; }
.client-app .modal-content { border: 0; border-radius: 1.25rem; overflow: hidden; }
.client-app .modal-custom { display: none; position: fixed; inset: 0; z-index: 1060; background: #0009; overflow-y: auto; padding: 3vh 1rem; }
.client-app .modal-content-custom { background: #fff; color: #202329; margin: auto; padding: 1.5rem; border-radius: 1.5rem; max-width: 600px; box-shadow: 0 1rem 3rem #0003; }
.client-app .modal-content-custom > .header { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #eee; margin-bottom: 1.5rem; padding-bottom: 1rem; }
.client-app .modal-content-custom .title { font-size: 1.5rem; font-weight: 700; margin: 0; }
.client-app .close-btn, .client-app .close { border: 0; background: transparent; color: inherit; font-size: 1.5rem; }
.client-app .button-box { display: flex; gap: .75rem; flex-wrap: wrap; margin-block: 1.5rem; }
.client-app .button-box .close-btn { font-size: .875rem; }
.client-app .extra-links { font-size: .875rem; margin-top: 1.5rem; line-height: 1.8; }
.client-app .extra-links a { color: #9e6c00; }
.client-app .deleteItemFromCart { width: 22px; height: 22px; cursor: pointer; }
.client-app .shopping-card-modal .modal-body { padding: 1.5rem; }
.client-app .dataTables_wrapper { overflow-x: auto; }
.client-app .dispNone, .client-app .hidden { display: none; }
/* Compatibility utility names used by existing bound controls. */
.client-app .ml-auto { margin-left: auto; }
.client-app .ml-2 { margin-left: .5rem; }
.client-app .ml-3, .client-app .ml-4 { margin-left: 1rem; }
.client-app .mr-2 { margin-right: .5rem; }
.client-app .font-weight-bold, .client-app .font-weight-bolder { font-weight: 700; }
.client-app .pull-right { float: right; }
.client-app .pull-left { float: left; }
.client-app footer { margin-top: 0; }
.client-account-page { min-height: 100vh; background: linear-gradient(135deg, #111, #242424); padding: 3rem 1rem; }
.client-account-page .page-form, .client-account-page .loginform { max-width: 720px; margin: auto; padding: 2rem; background: #fff; border-radius: 1.5rem; float: none; }
.client-account-page .form-group { margin-bottom: 1rem; }
.client-account-page .logo img { max-width: 130px; }
.client-account-page .whitepart, .client-account-page .pull-left, .client-account-page .pull-right { float: none; width: auto; }
.client-login { background: linear-gradient(135deg, #000e, #0009), url('https://images.unsplash.com/photo-1497366754035-f200968a6e72?q=80&w=2070&auto=format&fit=crop') center/cover; min-height: 80vh; }
.client-login-card { background: #ffffff14; backdrop-filter: blur(24px); }
.client-login-page #title-bar-id, .client-login-page #defaultLoginModal > .modal-content-custom > .header { display: none !important; }
.client-login-page #defaultLoginModal { display: block; position: static; background: transparent; padding: 0; overflow: visible; }
.client-login-page #defaultLoginModal > .modal-content-custom { background: transparent; color: #fff; padding: 0; border-radius: 0; box-shadow: none; }
.client-login-page #defaultLoginModal .input { background: #ffffff14; border-color: #ffffff26; color: #fff; border-radius: 50rem; }
.client-login-page #defaultLoginModal .button { width: 100%; }
.client-login-page #defaultLoginModalCancel { display: none; }
.client-login-page #defaultLoginModal .input-box label { color: #fff; }
.client-login-page #defaultLoginModal .extra-links a { color: #ffc107; }
.client-login-page #modalsignup .input { background: #f8f9fa; color: #202329; border-radius: .75rem; }
.client-login-page #modalsignup .button { width: auto; }
.client-login-page #modalsignup .close-btn { color: #202329; }
.client-login-page #defaultLoginModal #modalsignup .input-box label { color: #202329; }
@media (max-width: 1199px) { .client-search { width: 165px; } .client-app .navbar-nav { font-size: .85rem; } }
@media (max-width: 991px) { .client-app .product-list { grid-template-columns: repeat(2, minmax(0,1fr)); } .client-app .client-mega-menu { max-height: none; } .client-search { width: min(75vw, 300px); } .client-app .branches { grid-template-columns: repeat(2,1fr); } .client-featured-card { flex-basis: calc(50% - 12px); } }
@media (max-width: 575px) { .client-app .product-list, .client-app .branches { grid-template-columns: 1fr; } .client-app .productContainer { padding: 1.5rem 1rem; } .client-app .details-box .content-box { padding: 1.25rem; } .client-login .display-2 { font-size: 2.5rem; } .client-app .table { font-size: .8rem; } }
@media (prefers-reduced-motion: reduce) { .client-app * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

@media (min-width: 992px) and (max-width: 1199px) { .client-app .catalog-design .catalog-results .product-list { grid-template-columns: repeat(3, minmax(0,1fr)); } }

.client-app .client-search { position: relative; width: clamp(280px, 24vw, 420px); }
.client-search-results[hidden] { display: none !important; }
.client-search-results { position: absolute; top: calc(100% + 8px); left: 0; right: 0; max-height: 360px; overflow-y: auto; background: white; border: 1px solid #e2e5e8; border-top: 3px solid #ffc107; border-radius: 12px; box-shadow: 0 12px 32px #00000026; z-index: 1100; }
.client-search-result { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; border-bottom: 1px solid #dee2e6; color: #202329; font-size: .9rem; line-height: 1.5; overflow-wrap: anywhere; }
.client-search-result:nth-child(even) { background: #f4f6f8; }
.client-search-result:last-child { border-bottom: 0; }
.client-search-result:hover, .client-search-result:focus { background: #fff3cd; color: #111; outline: 2px solid #ffc107; outline-offset: -2px; }
.client-search-result > span:last-child { color: #a97600; flex-shrink: 0; }
.client-search-status { padding: 16px; color: #495057; font-size: .875rem; }
@media (max-width: 991px) { .client-app .client-search { width: min(75vw, 420px); } }