/* =========================================================
   Welding Manager - modern layout, "Graphite" theme
   Built on Tabler (Bootstrap 5.3). Load AFTER tabler.min.css.
   ========================================================= */

/* ---- Theme tokens ---- */
:root {
    --wm-primary: #6741d9;
    --wm-primary-rgb: 103, 65, 217;
    --wm-accent: #e64980;
    --wm-sidebar-bg: #0f0f12;
    --wm-radius: 0px;

    --tblr-font-sans-serif: 'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --tblr-primary: var(--wm-primary);
    --tblr-primary-rgb: var(--wm-primary-rgb);
    --tblr-primary-lt: rgba(var(--wm-primary-rgb), .12);
    --tblr-primary-lt-rgb: var(--wm-primary-rgb);
    --tblr-border-radius: var(--wm-radius);
    --tblr-border-radius-sm: var(--wm-radius);
    --tblr-border-radius-lg: var(--wm-radius);
    --tblr-border-radius-xl: var(--wm-radius);
}

body { font-family: var(--tblr-font-sans-serif); }

.bg-primary-lt { background-color: rgba(var(--wm-primary-rgb), .12) !important; color: var(--wm-primary) !important; }
.card, .btn, .form-control, .form-select, .dropdown-menu, .badge, .modal-content, .alert, .input-group-text { border-radius: var(--wm-radius); }

/* ---- Sidebar ---- */
.navbar-vertical { background: var(--wm-sidebar-bg) !important; }
.navbar-vertical .nav-item.active > .nav-link { color: #fff !important; box-shadow: inset 3px 0 0 var(--wm-primary); }
.navbar-vertical .nav-link-icon i { font-size: 1.15rem; }
.navbar-vertical .dropdown-item.active,
.navbar-vertical .dropdown-item:active { background: rgba(var(--wm-primary-rgb), .25); }

.wm-brand { display: flex; align-items: center; gap: .6rem; font-weight: 700; letter-spacing: -.01em; padding-top: 1rem; padding-bottom: 1rem; }
.wm-brand-logo { max-height: 32px; width: auto; }
/* Desktop sidebar: larger logo, centred, name underneath. Phones keep the compact one-line bar. */
@media (min-width: 992px) {
    .navbar-vertical .wm-brand { flex-direction: column; justify-content: center; gap: .5rem; width: 100%; margin: 0; padding: 1.5rem 0 1.25rem; text-align: center; font-size: 1.15rem; line-height: 1.2; }
    .navbar-vertical .wm-brand-logo { max-height: none; height: 72px; }
}

/* ---- Header ---- */
.wm-header { border-bottom: 1px solid var(--tblr-border-color); }
.wm-contract { font-weight: 600; }
.wm-avatar { background: linear-gradient(135deg, var(--wm-primary), var(--wm-accent)); color: #fff; font-weight: 700; }

.footer { font-size: .8125rem; }

/* ---- Legacy plugin tweaks (jqGrid / jQuery UI) ---- */
.ui-jqgrid, .ui-widget { font-family: var(--tblr-font-sans-serif) !important; font-size: .8125rem; }
.ui-jqgrid .ui-jqgrid-htable th { font-weight: 600; }
[data-bs-theme="dark"] .ui-jqgrid,
[data-bs-theme="dark"] .ui-widget-content { color: var(--tblr-body-color); background: var(--tblr-bg-surface); }
/* jQuery UI autocomplete (e.g. line-number suggestions in the Lines filter row) */
.ui-autocomplete { z-index: 1080 !important; max-height: 320px; overflow-y: auto; padding: .25rem !important; border: 1px solid var(--tblr-border-color) !important; border-radius: var(--wm-radius);
    background: var(--tblr-bg-surface) !important; box-shadow: 0 10px 30px rgba(0, 0, 0, .15); font-family: var(--tblr-font-sans-serif); font-size: .8125rem; list-style: none; }
.ui-autocomplete li a, .ui-autocomplete .ui-menu-item-wrapper { display: block; padding: .35rem .6rem !important; border: 0 !important; border-radius: 6px; color: var(--tblr-body-color) !important; background: transparent !important; cursor: pointer; }
.ui-autocomplete li a:hover, .ui-autocomplete .ui-state-active, .ui-autocomplete .ui-state-focus { background: rgba(var(--wm-primary-rgb), .1) !important; color: var(--wm-primary) !important; }
.ui-autocomplete-album-name { font-size: .75rem; color: var(--tblr-secondary); }
.ui-autocomplete { width: auto !important; min-width: 200px; max-width: 340px; }
/* jQuery UI 1.11 (WM8's copy): items are the <li> itself, the focused item gets .ui-state-focus on the <li> */
.ui-autocomplete li.ui-menu-item { margin: 0; padding: .35rem .6rem; border: 0 !important; border-radius: 6px; cursor: pointer; line-height: 1.25; list-style: none; background: transparent; }
.ui-autocomplete li.ui-menu-item.ui-state-focus, .ui-autocomplete li.ui-menu-item:hover { margin: 0; background: rgba(var(--wm-primary-rgb), .1) !important; color: var(--wm-primary) !important; }
.ui-autocomplete .ui-autocomplete-artist strong { color: var(--wm-primary); }

/* =========================================================
   Bootstrap 3 compatibility shim
   Lets existing views render acceptably until they are migrated.
   Delete this block once all views use Bootstrap 5 classes.
   ========================================================= */
.pull-right { float: right !important; }
.pull-left { float: left !important; }
.center-block { display: block; margin-left: auto; margin-right: auto; }
.hidden { display: none !important; }
.btn-default { --tblr-btn-color: var(--tblr-body-color); --tblr-btn-bg: var(--tblr-bg-surface); --tblr-btn-border-color: var(--tblr-border-color); }
.btn-xs { padding: .125rem .4rem; font-size: .75rem; }
.panel { background: var(--tblr-bg-surface); border: 1px solid var(--tblr-border-color); border-radius: var(--wm-radius); margin-bottom: 1rem; }
.panel-heading { padding: .75rem 1rem; border-bottom: 1px solid var(--tblr-border-color); font-weight: 600; }
.panel-body { padding: 1rem; }
.panel-footer { padding: .75rem 1rem; border-top: 1px solid var(--tblr-border-color); }
.label { display: inline-block; padding: .2em .55em; font-size: 75%; font-weight: 600; border-radius: var(--wm-radius); color: #fff; background: var(--tblr-secondary); }
.label-success { background: var(--tblr-success); }
.label-warning { background: var(--tblr-warning); }
.label-danger { background: var(--tblr-danger); }
.label-info { background: var(--tblr-info); }
.label-primary { background: var(--tblr-primary); }
.form-group { margin-bottom: 1rem; }
.control-label { margin-bottom: .25rem; font-weight: 500; }
/* Glyphicons (Bootstrap 3 icon font, not loaded any more) drawn with the matching Tabler icon */
.glyphicon { display: inline-block; font-family: "tabler-icons" !important; font-style: normal; font-weight: 400; line-height: 1; vertical-align: -.125em; -webkit-font-smoothing: antialiased; }
.glyphicon-edit::before { content: "\eb04"; }
.glyphicon-trash::before { content: "\eb41"; }
.glyphicon-plus::before { content: "\eb0b"; }
.glyphicon-list::before { content: "\eb6b"; }
.glyphicon-list-alt::before { content: "\ef40"; }
.glyphicon-ok::before { content: "\ea5e"; }
.glyphicon-ok-sign::before, .glyphicon-ok-circle::before { content: "\ea67"; }
.glyphicon-remove::before { content: "\eb55"; }
.glyphicon-remove-sign::before, .glyphicon-remove-circle::before { content: "\ea6a"; }
.glyphicon-info-sign::before { content: "\eac5"; }
.glyphicon-alert::before, .glyphicon-warning-sign::before { content: "\ea06"; }
.glyphicon-refresh::before { content: "\eb13"; }
.glyphicon-search::before { content: "\eb1c"; }
.glyphicon-lock::before { content: "\eae2"; }
.glyphicon-user::before { content: "\eb4d"; }
.glyphicon-cog::before { content: "\eb20"; }
.glyphicon-file::before { content: "\eaa4"; }
.glyphicon-link::before { content: "\eade"; }
.glyphicon-copy::before { content: "\ea7a"; }
.glyphicon-camera::before { content: "\ea54"; }
.glyphicon-paperclip::before { content: "\eb02"; }
.glyphicon-download::before, .glyphicon-download-alt::before { content: "\ea96"; }
.glyphicon-thumbs-up::before { content: "\eb3c"; }
.glyphicon-thumbs-down::before { content: "\eb3b"; }
.glyphicon-chevron-left::before { content: "\ea60"; }
.glyphicon-chevron-right::before { content: "\ea61"; }
.glyphicon-chevron-down::before { content: "\ea5f"; }
/* Icons inside buttons never take the click: older scripts check e.target.id (e.g. "SaveLine", "SaveNewDrawingNO") */
.btn > .ti, button > .ti, .btn > .fa, .btn > .glyphicon { pointer-events: none; }

/* Line form (Views/Lines/_AddAndUpdateLine.cshtml) */
.wm-line-options { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 2rem; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--tblr-border-color); }
.wm-line-option-field { display: flex; align-items: center; gap: .5rem; }
.wm-line-option-field .form-select { width: auto; min-width: 140px; }
.wm-collapse-head { display: flex; align-items: center; width: 100%; padding: 0; border: 0; background: transparent; font-weight: 600; font-size: .9375rem; color: var(--tblr-body-color); text-align: left; }
.wm-collapse-head .ti-chevron-down { transition: transform .2s; }
.wm-collapse-head:not(.collapsed) .ti-chevron-down { transform: rotate(180deg); }
.wm-form-actions { position: sticky; bottom: 0; z-index: 10; display: flex; justify-content: flex-end; gap: .5rem; margin: 0 -.25rem; padding: .75rem .25rem;
    background: linear-gradient(to top, var(--tblr-body-bg) 70%, transparent); }

/* Modern partial-view dialogs: <div class="modal-content wm-dlg" data-wm-size="sm|md|lg"> (sized by wm-modern.js) */
.wm-modal-sm { max-width: 460px; }
.wm-dlg .modal-title { font-weight: 700; font-size: 1.05rem; }
.wm-dlg .wm-field-error, .wm-dlg .field-validation-error { color: var(--tblr-danger); font-size: .75rem; }
.wm-dlg .input-validation-error { border-color: var(--tblr-danger) !important; }
.wm-dlg .wm-dlg-label { font-size: .6875rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--tblr-secondary); margin: 1.1rem 0 .5rem; }
.wm-dlg .wm-dlg-label:first-child { margin-top: 0; }
.wm-dlg .wm-readonly-facts { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; padding: .6rem .8rem; border-radius: var(--wm-radius); background: var(--tblr-bg-surface-secondary); font-size: .8125rem; }
.wm-dlg .wm-readonly-facts span { color: var(--tblr-secondary); }
.wm-dlg .wm-readonly-facts strong { color: var(--tblr-body-color); }
/* Small tables built by older scripts inside dialogs (rows added with their own markup) */
.wm-dlg-busy { position: absolute !important; inset: 0 !important; z-index: 5; display: flex; align-items: center; justify-content: center; background: rgba(var(--tblr-bg-surface-rgb, 255, 255, 255), .8); font-weight: 600; color: var(--wm-primary); }
.wm-mini-table thead th { padding: .35rem .6rem; border-bottom: 1px solid var(--tblr-border-color); background: var(--tblr-bg-surface-secondary); text-transform: uppercase; letter-spacing: .04em; font-size: .6875rem; }
.wm-mini-table:has(thead) tbody tr:first-child td, .wm-mini-table:has(thead) > tr:first-child td { font-size: inherit; font-weight: inherit; letter-spacing: 0; text-transform: none; color: inherit; background: transparent; }
.wm-mini-table { width: 100%; margin: 0; font-size: .8125rem; border-collapse: collapse; }
.wm-mini-table td { padding: .35rem .6rem !important; border-bottom: 1px solid var(--tblr-border-color); text-align: left !important; vertical-align: middle; }
.wm-mini-table tr:first-child td { font-size: .6875rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--tblr-secondary); background: var(--tblr-bg-surface-secondary); }
.wm-mini-table td:last-child { text-align: right !important; width: 1%; white-space: nowrap; }
.wm-mini-table a { cursor: pointer; }
.wm-mini-table button, .wm-legacy-buttons td button {
    display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0;
    border: 1px solid transparent; border-radius: var(--wm-radius); background: transparent; color: var(--tblr-secondary); cursor: pointer; }
.wm-mini-table button:hover, .wm-legacy-buttons td button:hover:not([disabled]) { background: var(--tblr-bg-surface-secondary); border-color: var(--tblr-border-color); color: var(--tblr-danger); }
.wm-legacy-buttons td button span { color: inherit !important; font-size: 1rem; }
.wm-legacy-buttons td button:disabled { opacity: .35; cursor: not-allowed; }
.wm-legacy-buttons .inline-form { display: inline-flex; gap: .25rem; align-items: center; justify-content: center; }
/* Bootstrap 3 close button in dialogs loaded from older partial views */
.modal-header .close { padding: 0; border: 0; background: transparent; font-size: 1.5rem; line-height: 1; opacity: .5; color: inherit; cursor: pointer; }
.modal-header .close:hover { opacity: .9; }
.help-block { display: block; margin-top: .25rem; font-size: .75rem; color: var(--tblr-secondary); }
.checkbox label, .checkbox-inline { display: inline-flex; align-items: center; gap: .35rem; font-weight: 400; }
.img-responsive { max-width: 100%; height: auto; }
.img-rounded { border-radius: var(--wm-radius); }
@media (max-width: 575.98px) { .hidden-xs { display: none !important; } }
@media print { .hidden-print { display: none !important; } }