/* BASU Products / Product Variants professional UI — scoped to route-products. */
.route-products {
    --products-navy:#0a2f63;
    --products-blue:#135ecf;
    --products-ink:#0b1f44;
    --products-muted:#71809a;
    --products-line:#dfe7f2;
    --products-soft:#f6f9fd;
    --products-shadow:0 8px 28px rgba(15,38,72,.07);
}
.route-products .page-body {background:#f5f7fb; padding-top:18px;}
.route-products .products-modern-form,
.route-products .products-modern-table-card {
    border:1px solid #e1e7f0;
    border-radius:16px;
    background:#fff;
    box-shadow:var(--products-shadow);
}
.route-products .products-modern-form {padding:22px 24px 20px; margin-bottom:16px;}
.route-products .products-modern-form-head {
    display:flex; align-items:flex-start; justify-content:space-between; gap:18px;
    margin-bottom:18px; padding-bottom:2px;
}
.route-products .products-modern-form .panel-title {
    color:var(--products-ink); font-size:1.2rem; font-weight:850; letter-spacing:-.02em;
}
.route-products .products-modern-form .panel-title i {color:var(--products-blue);}
.route-products .products-modern-form .text-muted {color:var(--products-muted)!important; font-size:.78rem;}
.route-products .products-modern-sku {
    display:inline-flex; align-items:center; justify-content:center; min-height:36px; max-width:220px;
    padding:8px 13px; border-radius:11px; border:1px solid #dbe5f2; background:#f3f7fd;
    color:#154b95; font-size:.78rem; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.route-products .products-modern-form-grid {--bs-gutter-x:1rem; --bs-gutter-y:.8rem;}
.route-products .products-modern-form .form-label {
    margin:0 0 6px; color:#1b3158; font-size:.71rem; font-weight:800; letter-spacing:.01em;
}
.route-products .products-modern-form .form-control,
.route-products .products-modern-form .form-select,
.route-products .products-modern-form .input-group .btn {
    min-height:43px; border-color:#d8e2ef; border-radius:9px; box-shadow:none; font-size:.82rem;
}
.route-products .products-modern-form .input-group .form-control {border-radius:9px 0 0 9px;}
.route-products .products-modern-form .input-group .btn {border-radius:0 9px 9px 0; min-width:44px;}
.route-products .products-modern-form .form-control:focus,
.route-products .products-modern-form .form-select:focus {
    border-color:#8db5ec; box-shadow:0 0 0 3px rgba(19,94,207,.08);
}
.route-products .products-modern-form .form-text {margin-top:5px; color:#8a97aa; font-size:.65rem;}
.route-products .products-modern-form .form-check-label {color:#556782; font-weight:650;}
.route-products .products-modern-form .spec-divider {
    position:relative; display:flex; align-items:center; gap:12px; margin:1px 0 0;
    color:#172d53; font-size:.72rem; font-weight:900; text-transform:none;
}
.route-products .products-modern-form .spec-divider::after {content:""; flex:1; height:1px; background:#dce4ef;}
.route-products .products-modern-submit {
    min-height:42px; border-radius:9px; padding:0 16px; background:linear-gradient(135deg,#0d4fab,#1264db); border-color:#0d4fab;
    font-size:.8rem; font-weight:800; box-shadow:0 5px 12px rgba(13,79,171,.17);
}
.route-products .products-modern-form .btn-outline-secondary {min-height:42px; border-radius:9px; font-size:.8rem; font-weight:700;}

.route-products .products-modern-table-card {padding:16px 16px 10px; overflow:hidden;}
.route-products .products-modern-table-titlebar {
    display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:10px;
}
.route-products .products-modern-eyebrow {display:block; color:#7183a0; font-size:.64rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em;}
.route-products .products-modern-table-titlebar h3 {margin:2px 0 2px; color:var(--products-ink); font-size:1rem; font-weight:850;}
.route-products .products-modern-table-titlebar p {margin:0; color:#8491a4; font-size:.7rem;}
.route-products .products-modern-total-count {
    display:inline-flex; align-items:center; gap:7px; padding:7px 10px; border-radius:10px; background:#f2f6fc; border:1px solid #e2e9f2;
    color:#50647f; font-size:.7rem; font-weight:800; white-space:nowrap;
}
.route-products .products-modern-table-wrap {overflow-x:auto; border-top:1px solid #edf1f6;}
.route-products .products-modern-table {margin:0; min-width:1280px; font-size:.7rem; --bs-table-bg:transparent;}
.route-products .products-modern-table thead th {
    padding:10px 8px; border-bottom:1px solid #dfe6ef; background:#fbfcfe; color:#5d6f8c;
    font-size:.61rem; font-weight:900; text-transform:uppercase; letter-spacing:.025em; white-space:nowrap;
}
.route-products .products-modern-table tbody td {padding:8px 8px; border-color:#edf1f5; color:#243a5f; vertical-align:middle;}
.route-products .products-modern-table tbody tr {transition:background .15s ease;}
.route-products .products-modern-table tbody tr:hover {background:#f8fbff;}
.route-products .products-modern-inactive {opacity:.62;}
.route-products .products-modern-product-cell {min-width:160px;}
.route-products .products-modern-product-link {
    display:flex; align-items:center; gap:6px; color:#152d57; font-weight:800; text-decoration:none; line-height:1.2;
}
.route-products .products-modern-product-link i {font-size:.56rem; color:#8da0bb; transition:transform .15s ease;}
.route-products .products-modern-product-link:hover {color:#0d5ac4;}
.route-products .products-modern-product-link:hover i {transform:translateX(2px); color:#0d5ac4;}
.route-products .products-modern-sku-text {color:#586c8c; font-size:.65rem; font-weight:700; white-space:nowrap;}
.route-products .products-modern-category-chip {
    display:inline-block; max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#365170; font-size:.64rem; font-weight:750;
}
.route-products .products-modern-spec-cell {max-width:220px; color:#5f6f87!important; line-height:1.25;}
.route-products .products-modern-number {font-variant-numeric:tabular-nums; white-space:nowrap;}
.route-products .products-modern-selling {color:#163f80!important; font-weight:800;}
.route-products .products-modern-stock {font-weight:850; color:#15613a!important; font-variant-numeric:tabular-nums;}
.route-products .products-modern-stock.is-low {color:#c33b31!important;}
.route-products .products-modern-stock-value {font-weight:750; color:#243d68!important;}
.route-products .products-modern-actions-col {width:66px; min-width:66px; text-align:right;}
.route-products .products-modern-row-actions {display:flex; justify-content:flex-end; align-items:center; gap:4px;}
.route-products .products-modern-row-actions form {margin:0;}
.route-products .products-modern-icon-action {
    width:28px; height:28px; border:1px solid #dbe4ef; border-radius:8px; background:#fff; color:#426189;
    display:inline-grid; place-items:center; padding:0; text-decoration:none; transition:.15s ease; font-size:.75rem;
}
.route-products .products-modern-icon-action:hover {background:#edf5ff; border-color:#b9d1f2; color:#0d5ac4;}
.route-products .products-modern-icon-action.is-danger {color:#b54a4a;}
.route-products .products-modern-icon-action.is-danger:hover {background:#fff2f2; border-color:#f0c4c4; color:#c82626;}

/* DataTables v2 toolbar styling. */
.route-products .products-modern-table-card .dt-container {width:100%;}
.route-products .products-modern-table-card .dt-layout-row:first-child {
    display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 10px!important;
}
.route-products .products-modern-table-card .dt-layout-row:first-child .dt-layout-cell {padding:0!important;}
.route-products .products-modern-table-card .dt-length {display:flex; align-items:center; gap:6px; color:#71809a; font-size:.68rem;}
.route-products .products-modern-table-card .dt-length select {
    min-width:62px; height:34px; border:1px solid #dbe4ef; border-radius:8px; color:#284363; background:#fff; font-size:.7rem;
}
.route-products .products-modern-table-card .dt-search {position:relative;}
.route-products .products-modern-table-card .dt-search label {display:none;}
.route-products .products-modern-table-card .dt-search input {
    width:210px; height:34px; margin:0!important; border:1px solid #dbe4ef; border-radius:9px; padding:0 12px 0 34px;
    color:#29415e; background:#fff; font-size:.7rem; outline:none;
}
.route-products .products-modern-table-card .dt-search::before {
    content:"\F52A"; font-family:"bootstrap-icons"; position:absolute; left:11px; top:50%; transform:translateY(-50%); color:#7b8da6; z-index:2; font-size:.72rem;
}
.route-products .products-modern-table-card .dt-search input:focus {border-color:#92b7e9; box-shadow:0 0 0 3px rgba(19,94,207,.07);}
.route-products .products-modern-table-card .dt-info {color:#8390a3; font-size:.65rem; padding-top:10px!important;}
.route-products .products-modern-table-card .dt-paging {padding-top:8px;}
.route-products .products-modern-table-card .dt-paging .dt-paging-button {border-radius:7px!important; font-size:.68rem; padding:.35em .65em!important;}

@media (max-width:1100px) {
    .route-products .products-modern-form {padding:18px;}
    .route-products .products-modern-form-head {align-items:center;}
    .route-products .products-modern-table-titlebar p {display:none;}
}
@media (max-width:768px) {
    .route-products .page-body {padding-top:12px;}
    .route-products .products-modern-form {padding:15px; border-radius:13px;}
    .route-products .products-modern-form-head {flex-direction:column; align-items:flex-start; gap:9px;}
    .route-products .products-modern-sku {max-width:100%;}
    .route-products .products-modern-table-card {padding:12px 10px 8px; border-radius:13px;}
    .route-products .products-modern-table-titlebar {align-items:flex-start;}
    .route-products .products-modern-total-count {display:none;}
    .route-products .products-modern-table-card .dt-layout-row:first-child {align-items:flex-start; flex-direction:column;}
    .route-products .products-modern-table-card .dt-search input {width:min(100%,280px);}
}
