/* Shared Warehouse Zone portal theme. Keep view-specific CSS in separate files. */
:root { --wz-navy:#091e3b; --wz-blue:#1260d6; --wz-ink:#18324e; --wz-line:#d6e2ef; }
body.body-bg-lightpink { background:#f0f4f9; color:var(--wz-ink); }
.app-header.bg-app-dark,.app-sidebar.bg-app-dark { background:var(--wz-navy)!important; }
.app-header { border-bottom:1px solid #264164; box-shadow:0 4px 18px #061c3514; }
.app-header .navbar-brand { display:flex; align-items:center; flex-shrink:1; min-width:0; }
.portal-wordmark { width:245px; max-width:100%; height:auto; object-fit:contain; }
.app-sidebar .menu-link { border-radius:8px; min-height:42px; transition:background-color .15s ease; }
.app-sidebar .menu-item.active>.menu-link,.app-sidebar .menu-link:hover { background:#214771!important; }
.app-content { min-width:0; }
.app-content .support-app-content,.app-content .support-app-content-header { border:1px solid var(--wz-line); border-radius:16px; }
.app-content .open-ticket-tab-card.active { background:linear-gradient(120deg,#102c4f,#185db6); }
.app-content .issue-meta { border-color:var(--wz-line); }
.app-content .issue-meta dt { color:#64758b; }
.app-content .issue-meta dd { color:var(--wz-ink); overflow-wrap:anywhere; }
.app-content .quick-contact-form { color:var(--wz-ink)!important; }
.app-content .quick-contact-form a { color:#1458b7; overflow-wrap:anywhere; }
.app-content h1,.app-content h2,.app-content h3 { color:var(--wz-navy); letter-spacing:-.025em; }
.app-content .card,.issue-card { border:1px solid var(--wz-line); border-radius:16px; box-shadow:0 8px 24px #152e4d08; }
.app-content .card-header { background:linear-gradient(110deg,#102c4f,#174f94); color:white; border-bottom:0; }
.app-content .btn { border-radius:8px; font-weight:600; transition:background-color .15s ease,box-shadow .15s ease; }
.app-content .btn-primary,.app-content .btn-qsaver { background:var(--wz-blue); border-color:var(--wz-blue); color:#fff; }
.app-content .btn-primary:hover,.app-content .btn-qsaver:hover { background:#094ba9; border-color:#094ba9; }
.app-content :is(.btn-qsaver,.btn-cancel,.btn-details) { min-width:0; bottom:auto; right:auto; border-radius:8px!important; font-size:1rem; min-height:46px; padding:10px 18px; }
.app-content :is(.btn-qsaver,.btn-details) { background:var(--wz-blue)!important; border-color:var(--wz-blue); }
.app-content .btn-cancel { background:#52657d!important; border-color:#52657d; }
.app-content .btn-outline-primary { border-color:#9ab8df; color:#1453a5; }
.app-content .btn-outline-primary:hover { background:#e7f0ff; }
.app-content .form-control,.app-content .form-select { border-color:#ccd9e8; border-radius:8px; }
.app-content :is(input,select,textarea):focus-visible,a:focus-visible,button:focus-visible { outline:3px solid #439bff; outline-offset:3px; }
.app-content .fixed-table-container { border-color:var(--wz-line); }
.app-content .fixed-table-body { overflow-x:auto; }
.app-content .bootstrap-table th { background:#102c4f; }
.issue-description { overflow-wrap:anywhere; }
.issue-description img,.issue-description video { max-width:100%; height:auto; }
.ticket-upload { padding:18px; border:1px dashed #91b4de; background:#f3f8ff; border-radius:12px; width:100%; }
.ticket-upload label { display:block; font-weight:700; margin-bottom:8px; }
.ticket-upload .form-control { height:auto!important; min-height:46px; padding:8px!important; }
.ticket-upload .form-text { color:#51647c; font-size:.85rem; margin-top:8px; }
.ticket-attachment { display:flex; align-items:center; gap:12px; min-height:48px; padding:12px; margin:8px 0; border:1px solid var(--wz-line); border-radius:8px; color:#1255b0; background:#f6f9fe; overflow-wrap:anywhere; }
.ticket-attachment i { flex:none; font-size:1.4rem; }
.ticket-attachment small { display:block; color:#586c83; }
.login-page-body .login-container { padding:32px 20px; min-height:calc(100svh - 100px); }
.login-page-body .login-card { max-width:1280px; border:1px solid #294769; border-radius:24px; box-shadow:0 24px 65px #04142c35; }
.login-page-body .login-image-side { background:radial-gradient(ellipse at top left,#124d82,transparent 65%),linear-gradient(145deg,#071b35,#0f2c53); padding:36px; }
.login-page-body .support-wordmark { width:100%; max-width:480px; height:auto; }
.login-page-body .support-brand-lockup { margin:0 0 12px; }
.login-page-body .login-image-side :is(h1,h2,h3) { color:#fff; }
.login-page-body .support-hero-title { font-size:clamp(1.7rem,2.6vw,2.5rem); line-height:1.15; }
.login-page-body .login-form-side { padding:36px; }
.login-page-body .login-form-card { padding:28px; border-color:var(--wz-line); border-radius:18px; }
.login-page-body .form-control-modern { min-height:48px; }
.login-page-body .btn-login { min-height:48px; background:linear-gradient(110deg,#125bdf,#078ee0); border-radius:10px; }
.login-contact { text-align:center; margin-top:22px; font-size:.88rem; }
.login-contact span { display:block; color:#5b6b80; margin-bottom:5px; }
.login-contact a { display:inline-block; color:#1458b7!important; overflow-wrap:anywhere; padding:8px 0; }
#dvNewSupport iframe { width:100%; max-width:100%; }
@media(max-width:991.98px) {
    .app-header .portal-wordmark { width:210px; }
    .app-content .issue-shell { grid-template-columns:1fr; }
    .app-content .filter-actions { flex-wrap:wrap; gap:8px; }
    .app-content .fixed-table-toolbar { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
    .app-content .fixed-table-toolbar .search { float:none; margin:0; }
    .app-content .bootstrap-table { margin-top:0!important; }
    .login-page-body .login-card { grid-template-columns:1fr 1fr; }
    .login-page-body .login-image-side,.login-page-body .login-form-side { padding:24px; }
}
@media(max-width:767.98px) {
    .offcanvas { width:calc(100% - 16px)!important; max-width:520px; }
    .offcanvas .btn { min-height:44px; min-width:0; max-width:100%; white-space:normal; }
    #formSearch .filter-action-button { height:auto!important; min-height:46px; }
    #formSearch #btnBulkMarkReleased { width:auto!important; }
    .app-content .support-app-content { padding:14px 10px; }
    .app-content .open-ticket-tabs { grid-template-columns:1fr; gap:8px; }
    .app-content .open-ticket-tab-card { padding:14px; }
    .app-header .portal-wordmark { width:180px; }
    .app-header .navbar-collapse { background:var(--wz-navy); padding:10px; }
    .app-header .menu-toggler,.app-header .navbar-toggler { min-width:44px; min-height:44px; }
    #content.app-content { padding:18px 12px!important; }
    .app-content .btn { min-height:44px; white-space:normal; height:auto; padding:10px 14px; max-width:100%; }
    .app-content .btn-group { flex-wrap:wrap; gap:4px; }
    .app-content .form-control,.app-content .form-select { min-height:46px; font-size:16px; }
    .app-content .select2-container { max-width:100%; }
    .app-content .issue-actions { display:flex; flex-wrap:wrap; gap:8px; width:100%; }
    .app-content .issue-actions .btn { flex:1 1 140px; }
    .app-content .issue-meta { grid-template-columns:1fr 1fr; }
    .app-content .filter-actions { position:static; width:100%; margin:0; padding:0; }
    .app-content .fixed-table-toolbar { margin:12px 0; justify-content:flex-start; }
    .app-content .fixed-table-toolbar .search { width:100%; }
    .app-content .fixed-table-toolbar .search input { width:100%; }
    .app-content .fixed-table-toolbar .columns { float:none!important; margin:0; }
    .app-content .nav-tabs { flex-wrap:wrap; gap:4px; }
    .app-content .nav-tabs .nav-link { min-height:44px; padding:10px; }
    .modal-dialog { margin:12px; max-width:calc(100% - 24px); }
    .modal-content { overflow-wrap:anywhere; }
    .modal-body { overflow-x:auto; }
    .login-page-body .login-container { padding:18px 12px; min-height:0; }
    .login-page-body .login-card { display:block; min-height:0; border-radius:18px; }
    .login-page-body .login-image-side { display:none; }
    .login-page-body .login-form-side { padding:24px 18px; }
    .login-page-body .login-mobile-brand-logo { max-width:280px; height:auto; }
    .login-page-body .login-form-card { padding:22px 16px; }
    .login-page-body .login-mobile-brand-row { align-items:center; }
    #formSupportTicket>.d-flex { flex-wrap:wrap; }
    #supportTicketValidationSummary { flex-basis:100%; }
}
@media(prefers-reduced-motion:reduce) {
    .login-page-body *,#dvNewSupport * { animation:none!important; transition:none!important; }
}

/* Grid actions: override the legacy dark .btn background and oversized mobile padding. */
#tblSupportTickets .ticket-status-cell {
    align-items:center;
    gap:8px!important;
}
#tblSupportTickets .ticket-status-badge {
    min-height:36px;
    padding:7px 12px;
    margin:0;
    border-radius:8px;
    font-size:13px;
    font-weight:600;
    line-height:1.3;
    background:#edf7f1;
    border:1px solid #c7e5d3;
    color:#17683e;
}
#tblSupportTickets .ticket-status-badge.label-devcompleted {
    background:#e5f5ec;
    border-color:#b7dfc8;
    color:#17683e;
}
#tblSupportTickets .ticket-status-badge.label-status-open {
    background:#fff3eb;
    border-color:#f2d1ba;
    color:#a44719!important;
}
#tblSupportTickets .ticket-status-badge.bg-red {
    background:#b42336!important;
    border-color:#b42336;
    color:#fff!important;
}
#tblSupportTickets :is(.ticket-status-action,.link-add-estimate,.link-invoiced) {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 36px;
    width:36px;
    height:36px;
    min-width:36px;
    min-height:36px;
    padding:0;
    margin:0;
    border:1px solid #bfd3ed;
    border-radius:8px;
    background:#edf4ff;
    color:#1758a8;
    line-height:1;
    box-shadow:none;
    vertical-align:middle;
}
#tblSupportTickets :is(.ticket-status-action,.link-add-estimate,.link-invoiced) i {
    font-size:16px;
    line-height:1;
    color:inherit;
}
/* Use the existing Bootstrap Icons pencil glyph for the status editor. */
#tblSupportTickets .ticket-status-action .bi-radioactive::before { content:"\f4cb"; }
#tblSupportTickets :is(.ticket-status-action,.link-add-estimate,.link-invoiced):hover {
    background:#dceaff;
    border-color:#6e9dd9;
    color:#0c438b;
}
#tblSupportTickets :is(.ticket-status-action,.link-add-estimate,.link-invoiced):focus-visible {
    outline:3px solid #439bff;
    outline-offset:2px;
}
@media(max-width:767.98px), (pointer:coarse) {
    #tblSupportTickets :is(.ticket-status-action,.link-add-estimate,.link-invoiced) {
        flex-basis:44px;
        width:44px;
        height:44px;
        min-width:44px;
        min-height:44px;
    }
}
#tblSupportTickets .ticket-status-action > i.bi::before {
    font-family: bootstrap-icons !important;
    content: "\f67b" !important;
}