/* BukaByte commerce and non-homepage shell. */
body.bb-app .bb-header > .navbar > .container,
body.bb-cart .bb-header > .navbar > .container { display: flex; align-items: center; min-height: 72px; gap: 16px; }
body.bb-app .bb-header .navbar-brand,
body.bb-cart .bb-header .navbar-brand { flex: 0 0 auto; margin-right: auto; }
body.bb-app .bb-header .navbar-brand img,
body.bb-cart .bb-header .navbar-brand img { max-width: 150px; height: auto; }
body.bb-app .bb-header .toolbar,
body.bb-cart .bb-header .toolbar { display: flex; align-items: center; gap: 6px; margin: 0; }
body.bb-app .bb-header .toolbar .nav-item,
body.bb-cart .bb-header .toolbar .nav-item { margin: 0 !important; }
body.bb-app .bb-header .toolbar .nav-link,
body.bb-cart .bb-header .toolbar .nav-link { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--bb-border); border-radius: 12px; background: var(--bb-surface); color: var(--bb-slate-700); }
body.bb-app .bb-header .main-navbar-wrapper,
body.bb-cart .bb-header .main-navbar-wrapper { background: var(--bb-surface); border-top: 1px solid var(--bb-border); border-bottom: 1px solid var(--bb-border); }
body.bb-app .bb-header .main-navbar-wrapper #nav,
body.bb-cart .bb-header .main-navbar-wrapper #nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; }
body.bb-app .bb-header .main-navbar-wrapper #nav > li > a,
body.bb-cart .bb-header .main-navbar-wrapper #nav > li > a { display: inline-flex; align-items: center; min-height: 42px; padding: 8px 12px; border-radius: 10px; color: var(--bb-slate-700); font-weight: 600; white-space: nowrap; }
body.bb-app .bb-header .main-navbar-wrapper #nav > li > a:hover,
body.bb-cart .bb-header .main-navbar-wrapper #nav > li > a:hover { background: var(--bb-accent-soft); color: var(--bb-primary); }
body.page-auth .bb-header .main-navbar-wrapper { display: none; }
body.page-auth .bb-header .toolbar > .nav-item:last-child { display: none; }

body.bb-cart .main-body,
body.bb-cart .store-order-container { min-width: 0; }
body.bb-cart .main-body .section { margin-bottom: 24px; padding: 22px; border: 1px solid var(--bb-border); border-radius: var(--bb-radius); background: var(--bb-surface); box-shadow: var(--bb-shadow-sm); }
body.bb-cart .main-body .section-title { color: var(--bb-slate-900); font-size: clamp(1.1rem, 2vw, 1.45rem); font-weight: 800; }
body.bb-cart .main-body .panel,
body.bb-cart .main-body .card,
body.bb-cart .main-body .package,
body.bb-cart .main-body .product,
body.bb-cart .main-body .pricing-table { border: 1px solid var(--bb-border); border-radius: var(--bb-radius); background: var(--bb-surface); box-shadow: var(--bb-shadow-sm); }
body.bb-cart .main-body .panel-body,
body.bb-cart .main-body .card-body { padding: 20px; }
body.bb-cart .main-body .panel-tabs,
body.bb-cart .main-body .nav-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; margin: 0; border-bottom: 1px solid var(--bb-border); background: var(--bb-page); }
body.bb-cart .main-body .panel-tabs > li > a,
body.bb-cart .main-body .nav-tabs > li > a { border: 0; border-radius: 9px; color: var(--bb-slate-500); font-weight: 700; }
body.bb-cart .main-body .panel-tabs > li.active > a,
body.bb-cart .main-body .nav-tabs > li.active > a,
body.bb-cart .main-body .panel-tabs > li > a:hover,
body.bb-cart .main-body .nav-tabs > li > a:hover { background: var(--bb-accent-soft); color: var(--bb-primary); }
body.bb-cart .main-body .package-price .price,
body.bb-cart .main-body .price-amount { color: var(--bb-primary); font-size: clamp(1.5rem, 3vw, 2.4rem); font-weight: 800; line-height: 1.1; }
body.bb-cart .main-body .price-cycle,
body.bb-cart .main-body .price-starting-from { color: var(--bb-slate-500); font-size: .85rem; }
body.bb-cart .main-body .package-featured,
body.bb-cart .main-body .featured { border-color: var(--bb-accent); box-shadow: 0 12px 30px rgba(0, 146, 255, .14); }
body.bb-cart .main-body .form-control.input-lg { min-height: 48px; border-radius: 10px; }
body.bb-cart .main-body .table-container { overflow-x: auto; }
body.bb-cart .main-body .table-container table { min-width: 680px; }

@media (max-width: 767.98px) {
    body.bb-app .bb-header > .navbar > .container,
    body.bb-cart .bb-header > .navbar > .container { min-height: 60px; padding-inline: 14px; }
    body.bb-app .bb-header .navbar-brand img,
    body.bb-cart .bb-header .navbar-brand img { max-width: 122px; }
    body.bb-app .bb-header .toolbar .nav-link,
    body.bb-cart .bb-header .toolbar .nav-link { width: 38px; height: 38px; }
    body.bb-app .bb-header .main-navbar-wrapper #nav,
    body.bb-cart .bb-header .main-navbar-wrapper #nav { display: block; }
    body.bb-app .bb-header .main-navbar-wrapper #nav > li > a,
    body.bb-cart .bb-header .main-navbar-wrapper #nav > li > a { width: 100%; }
    body.bb-cart .main-body .section { padding: 16px; margin-bottom: 16px; }
    body.bb-cart .main-body .panel-body,
    body.bb-cart .main-body .card-body { padding: 15px; }
    body.bb-cart .main-body .panel-tabs,
    body.bb-cart .main-body .nav-tabs { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
    body.bb-cart .main-body .panel-tabs::-webkit-scrollbar,
    body.bb-cart .main-body .nav-tabs::-webkit-scrollbar { display: none; }
}