/* ==========================================================================
   classic.css — DoctorPCB "2011 professional" reskin
   Loaded LAST (after Bootstrap 5 + style.css) and overrides both.
   Design language: dense layout, 12-13px Tahoma/Verdana, square corners,
   1px borders, subtle gradients, classic blue links, minimal shadows.
   ========================================================================== */

/* ---- 1. Global geometry: square everything, kill animation ---- */
*, *::before, *::after {
    border-radius: 0 !important;
    transition: none !important;
    animation-duration: 0s !important;
}
a:hover, .card:hover, .btn:hover, .service-card:hover, [class*="card"]:hover {
    transform: none !important;
}

/* ---- 2. Base typography & page ---- */
html { font-size: 13px; }
body {
    font-family: Tahoma, Geneva, Verdana, Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.5;
    color: #333;
    background: #e4e4e4 !important;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: bold !important;
    color: #222;
    margin: 0 0 8px 0;
}
h1, .h1 { font-size: 20px !important; }
h2, .h2 { font-size: 17px !important; }
h3, .h3 { font-size: 15px !important; }
h4, .h4, h5, .h5, h6, .h6 { font-size: 13px !important; }
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
    font-size: 24px !important;
    font-weight: bold !important;
}
.lead { font-size: 13px !important; }
p { margin-bottom: 8px; }
small, .small { font-size: 11px !important; }

a { color: #0b5394; text-decoration: none; }
a:hover { color: #073763; text-decoration: underline; }

/* ---- 3. Density: compact the spacing utilities templates rely on ---- */
.container, .container-lg, .container-xl, .container-xxl { max-width: 1024px !important; }
.container-fluid { padding-left: 10px !important; padding-right: 10px !important; }

.p-5  { padding: 14px !important; }
.p-4  { padding: 12px !important; }
.p-3  { padding: 10px !important; }
.py-5 { padding-top: 16px !important; padding-bottom: 16px !important; }
.py-4 { padding-top: 12px !important; padding-bottom: 12px !important; }
.py-3 { padding-top: 10px !important; padding-bottom: 10px !important; }
.mb-5, .my-5 { margin-bottom: 16px !important; }
.mt-5, .my-5 { margin-top: 16px !important; }
.mb-4, .my-4 { margin-bottom: 12px !important; }
.mt-4, .my-4 { margin-top: 12px !important; }
.g-4 > *, .g-5 > * { padding: 6px !important; }
.row.g-4, .row.g-5 { margin: -6px !important; }
main { min-height: 65vh; }

/* Neutralize soft modern shadows everywhere */
.shadow, .shadow-sm, .shadow-lg,
.card, .dropdown-menu, .modal-content {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.10) !important;
}

/* ---- 4. Top navigation: classic gradient bar ---- */
.navbar {
    padding: 0 !important;
    background: linear-gradient(to bottom, #3f6fa8 0%, #2a4d78 50%, #223f63 100%) !important;
    border-bottom: 1px solid #16293f;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    min-height: 38px;
}
.navbar-brand {
    font: bold 16px Arial, sans-serif !important;
    color: #fff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.45);
    padding: 8px 12px !important;
    margin: 0 !important;
}
.navbar .nav-link {
    font-size: 12px !important;
    font-weight: bold;
    color: #e8eef5 !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.45);
    padding: 11px 12px !important;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.navbar .nav-link:hover,
.navbar .nav-link.active {
    background: rgba(0, 0, 0, 0.28);
    color: #fff !important;
    text-decoration: none;
}
.navbar .dropdown-toggle::after { vertical-align: 1px; }

/* Dropdown menus: bordered, tight */
.dropdown-menu {
    font-size: 12px !important;
    border: 1px solid #9aa4ae !important;
    padding: 2px 0 !important;
    margin-top: 0 !important;
}
.dropdown-item { padding: 4px 14px !important; }
.dropdown-item:hover { background: #dfe9f3 !important; color: #222; }
.dropdown-divider { margin: 3px 0 !important; }

/* ---- 5. Buttons: gradient + border + text-shadow per variant ---- */
.btn {
    font: bold 12px Tahoma, Arial, sans-serif !important;
    padding: 4px 12px !important;
    border-width: 1px !important;
    border-style: solid !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 1px rgba(0, 0, 0, 0.15) !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.btn-lg { padding: 6px 16px !important; font-size: 13px !important; }
.btn-sm, .btn-xs { padding: 2px 8px !important; font-size: 11px !important; }
.btn:active { box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25) !important; }
.btn:hover { filter: brightness(0.93); }

.btn-primary   { background: linear-gradient(to bottom, #5a94d6, #2f6cb3) !important; border-color: #1f4d85 !important; }
.btn-success   { background: linear-gradient(to bottom, #6cc067, #3f9339) !important; border-color: #2e7028 !important; }
.btn-danger    { background: linear-gradient(to bottom, #e46a5f, #c23327) !important; border-color: #93261d !important; }
.btn-info      { background: linear-gradient(to bottom, #63c3dd, #2d9dbd) !important; border-color: #1f7c97 !important; color: #fff !important; }
.btn-warning   { background: linear-gradient(to bottom, #fbd25c, #e8a91c) !important; border-color: #c58f13 !important; color: #5c4400 !important; text-shadow: 0 1px 0 rgba(255,255,255,.4); }
.btn-secondary, .btn-light {
    background: linear-gradient(to bottom, #fdfdfd, #dcdcdc) !important;
    border-color: #9a9a9a !important;
    color: #333 !important;
    text-shadow: 0 1px 0 #fff;
}
.btn-dark { background: linear-gradient(to bottom, #5a5a5a, #333) !important; border-color: #1f1f1f !important; }
.btn-outline-primary, .btn-outline-secondary, .btn-outline-success,
.btn-outline-danger, .btn-outline-info, .btn-outline-warning, .btn-outline-dark {
    background: linear-gradient(to bottom, #fff, #ececec) !important;
    text-shadow: none;
    box-shadow: inset 0 1px 0 #fff, 0 1px 1px rgba(0, 0, 0, 0.1) !important;
}
.btn-outline-primary { color: #2f6cb3 !important; border-color: #2f6cb3 !important; }
.btn-outline-success { color: #3f9339 !important; border-color: #3f9339 !important; }
.btn-outline-danger  { color: #c23327 !important; border-color: #c23327 !important; }
.btn-outline-info    { color: #2d80a0 !important; border-color: #2d9dbd !important; }
.btn-outline-warning { color: #8a6d00 !important; border-color: #c58f13 !important; }
.btn-link { background: none !important; border: none !important; box-shadow: none !important; color: #0b5394 !important; text-shadow: none; font-weight: normal !important; }

/* ---- 6. Cards -> classic bordered panels ---- */
.card {
    border: 1px solid #c6c6c6 !important;
    background: #fff;
    margin-bottom: 12px;
}
.card-header {
    background: linear-gradient(to bottom, #fafafa, #e8e8e8) !important;
    border-bottom: 1px solid #c6c6c6 !important;
    padding: 6px 10px !important;
    font: bold 12px Arial, sans-serif;
    color: #333;
}
.card-header h1, .card-header h2, .card-header h3,
.card-header h4, .card-header h5, .card-header h6 {
    font-size: 12px !important;
    margin: 0;
}
.card-body { padding: 10px !important; }
.card-footer {
    background: #f4f4f4 !important;
    border-top: 1px solid #d5d5d5 !important;
    padding: 6px 10px !important;
}

/* ---- 7. Tables: dense grid with header gradient & zebra rows ---- */
.table { font-size: 12px !important; margin-bottom: 10px; border: 1px solid #c6c6c6; }
.table > :not(caption) > * > * {
    padding: 4px 8px !important;
    border: 1px solid #d4d4d4;
    background-color: transparent;
}
.table thead th, .table > thead > tr > th {
    background: linear-gradient(to bottom, #f4f4f4, #e2e2e2) !important;
    border: 1px solid #c0c0c0 !important;
    font: bold 11px Arial, sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: #444;
    white-space: nowrap;
}
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: #f7f7f7 !important; box-shadow: none !important; }
.table-hover > tbody > tr:hover > * { background-color: #e9f1f9 !important; box-shadow: none !important; }

/* ---- 8. Forms: small bordered inputs with inset shadow ---- */
.form-label { font: bold 12px Tahoma, Arial, sans-serif !important; margin-bottom: 2px !important; color: #333; }
.form-control, .form-select {
    font-size: 12px !important;
    padding: 3px 6px !important;
    min-height: 0 !important;
    border: 1px solid #a5a5a5 !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12) !important;
    background-color: #fff;
}
.form-select { padding-right: 24px !important; }
textarea.form-control { padding: 4px 6px !important; }
.form-control:focus, .form-select:focus {
    border-color: #4d90fe !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), 0 0 3px rgba(77, 144, 254, 0.6) !important;
}
.form-control::placeholder { color: #999; }
.form-text { font-size: 11px !important; color: #777 !important; }
.form-check-input { border: 1px solid #8f8f8f !important; box-shadow: none !important; }
.input-group-text {
    font-size: 12px !important;
    padding: 3px 8px !important;
    background: linear-gradient(to bottom, #fafafa, #e6e6e6) !important;
    border: 1px solid #a5a5a5 !important;
}

/* ---- 9. Badges & alerts: classic pastels, square ---- */
.badge {
    font: bold 10px Tahoma, Arial, sans-serif !important;
    padding: 2px 6px !important;
    text-shadow: none;
    letter-spacing: 0.02em;
}
.alert {
    font-size: 12px !important;
    padding: 7px 10px !important;
    margin-bottom: 10px !important;
    border: 1px solid transparent;
}
.alert-success { background: #dff0d8 !important; border-color: #c8e0b8 !important; color: #3c763d !important; }
.alert-danger  { background: #f2dede !important; border-color: #e0c1c4 !important; color: #a94442 !important; }
.alert-warning { background: #fcf8e3 !important; border-color: #ebe0b8 !important; color: #8a6d3b !important; }
.alert-info    { background: #d9edf7 !important; border-color: #bcdde8 !important; color: #31708f !important; }
.alert .btn-close { padding: 8px !important; }

/* ---- 10. Misc components ---- */
.modal-content { border: 1px solid #8f8f8f !important; }
.modal-header {
    background: linear-gradient(to bottom, #fafafa, #e6e6e6);
    border-bottom: 1px solid #c6c6c6 !important;
    padding: 7px 10px !important;
}
.modal-title { font-size: 13px !important; }
.modal-body { padding: 10px !important; }
.modal-footer { padding: 6px 10px !important; background: #f4f4f4; border-top: 1px solid #d5d5d5 !important; }

.list-group-item { font-size: 12px !important; padding: 6px 10px !important; border-color: #d5d5d5 !important; }
.progress { height: 14px !important; border: 1px solid #b5b5b5; background: #eee !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.1) !important; }
.progress-bar { background: linear-gradient(to bottom, #5a94d6, #2f6cb3) !important; font-size: 10px; }
.breadcrumb { font-size: 11px !important; padding: 4px 8px !important; background: #efefef !important; border: 1px solid #ddd; margin-bottom: 10px !important; }
.nav-tabs { border-bottom: 1px solid #b5b5b5 !important; }
.nav-tabs .nav-link {
    font-size: 12px !important; font-weight: bold; color: #555 !important;
    padding: 5px 12px !important; border: 1px solid transparent !important; margin-bottom: -1px;
}
.nav-tabs .nav-link.active {
    background: #fff !important; color: #222 !important;
    border-color: #b5b5b5 #b5b5b5 #fff !important;
}
.pagination { font-size: 12px; }
.page-link { padding: 3px 9px !important; border: 1px solid #b5b5b5 !important; color: #0b5394 !important; }
.page-item.active .page-link { background: linear-gradient(to bottom, #5a94d6, #2f6cb3) !important; border-color: #1f4d85 !important; }

/* ---- 11. Site-specific overrides (style.css classes) ---- */
/* Hero + big promo bands: corporate blue, compact */
.hero-section, section.bg-primary, .work-order-summary {
    background: linear-gradient(to bottom, #2e5c8a, #1d3d5c) !important;
    padding: 18px 0 !important;
    border-bottom: 1px solid #142c44;
}
.work-order-summary { padding: 12px !important; }
.hero-section h1 { color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4); }
.bg-light { background-color: #f0f0f0 !important; }

/* Admin sidebar: flat, dense, 200px */
body.admin-page .d-flex > nav.bg-dark {
    min-width: 200px !important;
    max-width: 200px;
    background: #2c2c2c !important;
    border-right: 1px solid #1a1a1a;
    padding: 8px !important;
}
body.admin-page .d-flex > nav.bg-dark h5 { font-size: 13px !important; color: #fff; }
body.admin-page .d-flex > nav.bg-dark h6 {
    font-size: 10px !important;
    color: #8a8a8a !important;
    margin: 10px 0 2px;
    letter-spacing: 0.05em;
}
body.admin-page .d-flex > nav.bg-dark a {
    font-size: 12px;
    padding: 4px 8px !important;
    border-left: 3px solid transparent;
}
body.admin-page .d-flex > nav.bg-dark a:hover {
    background: #3d3d3d !important;
    text-decoration: none;
}
body.admin-page .d-flex > nav.bg-dark a.bg-primary {
    background: #1d3d5c !important;
    border-left-color: #5a94d6;
}
body.admin-page .d-flex > nav.bg-dark hr { margin: 6px 0; }

/* ---- 12. Footer: thin dark strip with accent bar ---- */
footer.footer {
    background: #222 !important;
    border-top: 3px solid #2e5c8a;
    padding: 8px 0 !important;
    font-size: 11px !important;
    color: #bbb !important;
}
footer.footer p { margin: 0 0 2px; font-size: 11px; }
footer.footer small { font-size: 10px !important; color: #888; }

/* ---- 13. create-work-order page: compact its embedded custom classes ---- */
/* (that page's <style> block loads after this file, hence !important) */
.wo-card { margin-bottom: 10px !important; }
.summary-card { padding: 10px !important; margin-bottom: 10px !important; }
.ship-option { padding: 8px !important; border-width: 1px !important; margin-bottom: 6px !important; }
.group-box { padding: 8px !important; margin-bottom: 8px !important; }
.cart-item { margin-bottom: 6px !important; }
.wi-row, .dev-result, .draft-card { padding: 5px 8px !important; margin-bottom: 5px !important; }
.step-pill, .ci-icon { border: 1px solid #b5b5b5; }