::deep .container { max-width: 1100px; } /* Navigation Layout overrides */ .nav-pills .nav-link { color: #6c757d; border-radius: 0; padding: 0.75rem 0; font-weight: 500; transition: all 0.2s ease; } .nav-pills .nav-link.active { background-color: transparent !important; color: #1A1A1A; border-bottom: 2px solid #1A1A1A; } .nav-pills .nav-link:hover:not(.active) { color: #1A1A1A; } /* Cards layout rules */ .card { border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 0; } .address-card { transition: border-color 0.2s ease, box-shadow 0.2s ease; } .address-card:hover { border-color: rgba(0, 0, 0, 0.16); } /* Container Wrapper to Suppress the Scrollbar completely */ .table-container-fixed { width: 100%; overflow-x: hidden; /* Hard disables horizontal scroll bar activation */ } /* Global Table Typography - Reduced uniformly to keep items on a single line */ .profile-table { font-size: 0.78rem; /* Scaled down further to eliminate overflow bounds */ width: 100%; table-layout: fixed; /* Fixes proportions to fit 100% parent container space */ } .profile-table tbody td { padding-top: 0.85rem; padding-bottom: 0.85rem; } .profile-table thead th { background-color: #F9F9F9; font-size: 0.7rem; letter-spacing: 0.04rem; } /* Compact Column Proportions */ .col-order-id { width: 115px; } .col-date { width: 100px; } .col-total { width: 85px; } .col-status { width: 105px; } .col-invoice { width: 65px; } .col-title { width: auto; /* Takes shared residual space smoothly */ } .col-address { width: auto; /* Takes shared residual space smoothly */ } /* Product link handling */ .product-link { color: #1A1A1A; text-decoration: none; border-bottom: 1px dashed transparent; transition: border-color 0.2s ease; display: inline-block; } .product-link:hover { border-color: #1A1A1A; } /* Base Badge Settings */ .badge { font-size: 0.62rem; letter-spacing: 0.5px; padding: 0.4em 0.8em; border-radius: 4px; font-weight: 600; } /* Status Badge Palette Colors */ .status-shipped { background-color: #e3f2fd !important; color: #0d6efd !important; border: 1px solid rgba(13, 110, 253, 0.15); } .status-delivered { background-color: #e8f5e9 !important; color: #198754 !important; border: 1px solid rgba(25, 135, 84, 0.15); } .badge-tag { background-color: #f0f0f0 !important; color: #4a4a4a !important; border: 1px solid rgba(0, 0, 0, 0.05); } /* Form Buttons */ .btn-outline-dark { border-radius: 50px; border-width: 1px; } .btn-dark { border-radius: 50px; } /* Action button configurations */ .action-btn { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; text-decoration: none; transition: background-color 0.15s ease, transform 0.1s ease; } .action-btn:hover { background-color: rgba(0, 0, 0, 0.05); } .action-btn.text-danger:hover { background-color: rgba(220, 53, 69, 0.1); } .action-btn:active { transform: scale(0.95); } /* Compact SVG Icons sizing */ .svg-icon { width: 15px; height: 15px; fill: currentColor; display: inline-block; vertical-align: middle; } .pointer-label { cursor: pointer; user-select: none; } /* Shared Card Styling Unification Rules */ .order-history-card { transition: border-color 0.2s ease, box-shadow 0.2s ease; border-radius: 0; /* Matches your address card configuration */ } .order-history-card:hover { border-color: rgba(0, 0, 0, 0.16); } /* Micro Typography Alignment */ .xx-small { font-size: 0.65rem; } .tracking-wider { letter-spacing: 0.05rem; } /* Responsive adjustments across layout break-points */ @media (max-width: 575.98px) { .border-sm-top-0 { border-top: 1px solid rgba(0, 0, 0, 0.06) !important; } }