:root {
    --blue: #1769e0;
    --blue-dark: #0d47a1;
    --blue-soft: #eef6ff;
    --ink: #19324d;
}

body { background: #f6f9fd; color: var(--ink); min-height: 100vh; }
.app-navbar { background: linear-gradient(105deg, #0d47a1 0%, #1769e0 55%, #1685e8 100%); box-shadow: 0 2px 16px rgba(13, 71, 161, .18); }
.navbar-brand { letter-spacing: -.02em; }
.nav-link { font-weight: 500; }
.cart-badge { min-width: 1.35rem; }
.page-title { font-weight: 800; letter-spacing: -.04em; color: #112f55; }
.page-subtitle { color: #64748b; }
.card { border: 0; border-radius: 1rem; box-shadow: 0 5px 20px rgba(19, 65, 125, .07); }
.card-header { background: white; border-bottom: 1px solid #e9eff7; padding: 1.1rem 1.25rem; }
.btn-primary { --bs-btn-bg: var(--blue); --bs-btn-border-color: var(--blue); --bs-btn-hover-bg: #1058be; --bs-btn-hover-border-color: #1058be; }
.btn-outline-primary { --bs-btn-color: var(--blue); --bs-btn-border-color: var(--blue); --bs-btn-hover-bg: var(--blue); }
.form-control, .form-select { border-color: #d9e4f1; border-radius: .65rem; padding: .65rem .8rem; }
.form-control:focus, .form-select:focus { border-color: #6da6ef; box-shadow: 0 0 0 .22rem rgba(23,105,224,.12); }
.form-label { color: #35506e; font-weight: 600; font-size: .92rem; }
.filter-card { background: linear-gradient(120deg, #fff, #f5faff); }
.table > :not(caption) > * > * { padding: .9rem .8rem; vertical-align: middle; }
.table thead th { color: #526a84; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.status-badge { display: inline-flex; align-items: center; gap: .35rem; padding: .28rem .65rem; border-radius: 999px; font-size: .78rem; font-weight: 700; }
.status-active { color: #087443; background: #ddf8ea; }
.status-inactive { color: #9a4a00; background: #fff0d8; }
.product-thumbnail { width: 52px; height: 52px; border-radius: .7rem; object-fit: cover; background: #e9f2ff; }
.section-label { display: flex; align-items: center; gap: .6rem; margin: 2.25rem 0 1rem; color: #123d70; font-size: 1.08rem; font-weight: 800; }
.section-label i { display: grid; place-items: center; width: 2rem; height: 2rem; background: var(--blue-soft); color: var(--blue); border-radius: .55rem; }
.form-panel { padding: 1.5rem; }
.variant-row, .wholesale-row { background: #f8fbff; border: 1px solid #e0ecf8; border-radius: .85rem; padding: 1rem; margin-bottom: .75rem; }
.image-preview { display: flex; gap: .75rem; flex-wrap: wrap; }
.image-preview img { width: 80px; height: 80px; object-fit: cover; border-radius: .7rem; border: 1px solid #d8e5f3; }
.detail-image { aspect-ratio: 1 / 1; width: 100%; object-fit: cover; border-radius: 1rem; background: #edf5ff; }
.info-list dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: #7890a8; margin-top: 1rem; }
.info-list dd { font-weight: 600; margin-bottom: .4rem; white-space: pre-line; }
.storefront { background: #f2f7ff; }
.storefront .app-navbar { box-shadow: 0 3px 20px rgba(8, 67, 154, .24); }
.store-hero { overflow: hidden; position: relative; padding: 2.7rem; background: linear-gradient(115deg, #0e55c0, #1685e8); color: white; border-radius: 1.25rem; box-shadow: 0 12px 28px rgba(23,105,224,.2); }
.store-hero:after { content: ''; position: absolute; width: 250px; height: 250px; right: -55px; top: -105px; border-radius: 50%; background: rgba(255,255,255,.12); }
.store-hero h1 { font-weight: 800; letter-spacing: -.04em; }
.store-search { position: relative; z-index: 1; }
.store-search .form-control { border: 0; padding-left: 2.8rem; }
.store-search i { position: absolute; top: 50%; transform: translateY(-50%); left: 1rem; color: #6992c4; }
.category-chip { text-decoration: none; color: #326298; border: 1px solid #dbe8f7; background: white; padding: .52rem .9rem; border-radius: 99px; font-size: .87rem; font-weight: 600; white-space: nowrap; }
.category-chip:hover, .category-chip.active { color: white; background: var(--blue); border-color: var(--blue); }
.product-card { height: 100%; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.product-card:hover { transform: translateY(-5px); box-shadow: 0 12px 28px rgba(19,65,125,.13); }
.product-card .image-wrap { display: block; aspect-ratio: 1 / .88; background: #eef5ff; overflow: hidden; }
.product-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.product-card:hover img { transform: scale(1.04); }
.product-card .card-body { padding: 1rem; }
.product-name { color: #19324d; text-decoration: none; line-height: 1.35; font-weight: 700; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-price { color: #1266d2; font-size: 1.08rem; font-weight: 800; }
.stock-text { color: #70849a; font-size: .8rem; }
.product-page-card { overflow: hidden; }
.product-page-image { width: 100%; aspect-ratio: 1; object-fit: cover; background: #edf5ff; }
.variant-choice { border: 1px solid #cddff4; background: white; color: #31597f; padding: .45rem .8rem; border-radius: .55rem; font-weight: 600; }
.variant-choice.active, .variant-choice:hover { border-color: var(--blue); color: var(--blue); background: #eef6ff; }
.price-large { color: #1266d2; font-weight: 800; font-size: clamp(1.5rem, 4vw, 2.2rem); }
.cart-item-image { width: 86px; height: 86px; object-fit: cover; border-radius: .8rem; background: #edf5ff; }
.quantity-control { width: 118px; }
.summary-card { position: sticky; top: 6rem; }
.checkout-header { background: linear-gradient(120deg, #e8f3ff, #ffffff); border-radius: 1rem; }
.order-success { max-width: 650px; margin: 3rem auto; text-align: center; }
.dashboard-stat { border-left: 4px solid var(--blue); }
.dashboard-stat .display-6 { font-weight: 800; color: #133c6d; }
@media (max-width: 767.98px) { .store-hero { padding: 1.65rem; } .summary-card { position: static; } .table-responsive { font-size: .86rem; } }
