/* QUOTE by Tango - styles follow the STEP app (vars.scss / layout/app.scss). */

:root {
	--step-white: #FFFFFF;
	--step-red: #FF0000;
	--step-green: #00B707;
	--step-blue: #33A0F2;
	--step-orange-1: #FF5100;
	--step-dark-blue-1: #33647E;
	--step-dark-blue-2: #1E3C4D;
	--step-grey-1: #CED2D5;
	--step-dark-1: #333132;
	--step-light-grey-1: #F9F9F9;
	--step-light-grey-2: #F4F7F8;
	--step-light-grey-3: #F0F0F0;
	--step-light-blue-1: #e5eef1;
	--step-light-green-1: rgba(0,183,7,0.11);
	--step-light-orange-1: rgba(240,84,35,0.11);
	--step-light-red-1: rgba(253,109,65,0.257);

	--bs-body-font-family: 'Hind', sans-serif;
	--bs-body-font-weight: 300;
	--bs-body-color: var(--step-dark-blue-2);
	--bs-primary: var(--step-orange-1);
	--bs-primary-rgb: 255,81,0;
	--bs-secondary: var(--step-dark-blue-1);
	--bs-secondary-rgb: 51,100,126;
	--bs-border-radius: .75rem;
	--bs-border-radius-lg: .9rem;
	--bs-link-color: var(--step-dark-blue-1);
	--bs-link-color-rgb: 51,100,126;
	--bs-link-hover-color: var(--step-orange-1);
}

html, body { height: 100%; }
body { background: #fff; }
h1, h2, h3, h4, h5, h6 { font-family: 'Hind', sans-serif; font-weight: 600; color: var(--step-dark-blue-2); }
b, strong { font-weight: 600; }

.step-text-primary { color: var(--step-orange-1) !important; }
.step-text-secondary { color: var(--step-dark-blue-1) !important; }
.step-text-success { color: var(--step-green) !important; }
.step-text-danger { color: var(--step-red) !important; }
.step-text-muted { color: #7b8a93 !important; }
.step-bg-secondary { background-color: var(--step-dark-blue-1) !important; }
.step-bg-warning-light { background-color: var(--step-light-orange-1) !important; }
.step-bg-success-light { background-color: var(--step-light-green-1) !important; }
.step-bg-info-light { background-color: var(--step-light-blue-1) !important; }
.step-bg-danger-light { background-color: var(--step-light-red-1) !important; }

/* Buttons */
.btn { --bs-btn-padding-y: .55rem; --bs-btn-font-weight: 500; }
.btn-primary { --bs-btn-bg: var(--step-orange-1); --bs-btn-border-color: var(--step-orange-1); --bs-btn-hover-bg: #e04700; --bs-btn-hover-border-color: #e04700; --bs-btn-active-bg: #cc4100; --bs-btn-active-border-color: #cc4100; --bs-btn-disabled-bg: var(--step-orange-1); --bs-btn-disabled-border-color: var(--step-orange-1); }
.btn-secondary { --bs-btn-bg: var(--step-dark-blue-1); --bs-btn-border-color: var(--step-dark-blue-1); --bs-btn-hover-bg: var(--step-dark-blue-2); --bs-btn-hover-border-color: var(--step-dark-blue-2); --bs-btn-active-bg: var(--step-dark-blue-2); }
.btn-outline-secondary { --bs-btn-color: var(--step-dark-blue-1); --bs-btn-border-color: var(--step-grey-1); --bs-btn-hover-bg: var(--step-light-blue-1); --bs-btn-hover-color: var(--step-dark-blue-2); --bs-btn-hover-border-color: var(--step-dark-blue-1); --bs-btn-active-bg: var(--step-light-blue-1); --bs-btn-active-color: var(--step-dark-blue-2); }
.btn-light { --bs-btn-bg: var(--step-light-grey-3); --bs-btn-border-color: var(--step-light-grey-3); }
.btn.rounded-pill.btn-primary, .btn.rounded-pill.btn-secondary {
	color: #fff; text-transform: uppercase; font-weight: 600; font-size: .9em;
	box-shadow: 0 1px 0 0 rgba(0,0,0,.11);
}
.btn-icon { border: 0; background: none; color: var(--step-dark-blue-1); padding: .15rem .35rem; border-radius: .5rem; }
.btn-icon:hover { background: var(--step-light-blue-1); color: var(--step-orange-1); }
.btn-icon.danger:hover { background: var(--step-light-red-1); color: var(--step-red); }

.form-control, .form-select { border-color: var(--step-grey-1); font-weight: 400; }
.form-control:focus, .form-select:focus { border-color: var(--step-dark-blue-1); box-shadow: 0 0 0 .2rem rgba(51,100,126,.15); }
.form-check-input:checked { background-color: var(--step-dark-blue-1); border-color: var(--step-dark-blue-1); }
.form-label, .field-label {
	font-size: .7em; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; color: var(--step-dark-blue-1); margin-bottom: .2rem;
}
input[type=number] { -moz-appearance: textfield; }
input[type=number]::-webkit-inner-spin-button { opacity: .4; }

/* Header (STEP app header) */
.app header { z-index: 1020; }
.logo-sm { height: 52px; }
@media (min-width: 992px) {
	.app-header-row { display: grid !important; grid-template-columns: 1fr auto 1fr; column-gap: 1rem; }
	.app-header-logo { justify-self: start; }
	.app-header-nav { justify-self: center; }
	.app-header-profile { justify-self: end; }
}
.top-nav { font-size: 1.1em; font-weight: 600; }
.top-nav a { color: var(--step-dark-1); }
.top-nav a:hover { color: var(--step-dark-blue-1); }
.top-nav a.active { color: var(--step-orange-1); }
.app-project-nav { border-top: 1px solid var(--step-light-grey-3); margin-top: 1rem; padding-top: .5rem; padding-bottom: .5rem; }
.app-project-nav .crumb { font-weight: 600; color: var(--step-dark-blue-1); }

/* Main layout */
.sidebar h4, .right h4 { color: var(--step-dark-blue-1); font-size: .9em; font-weight: normal; text-transform: uppercase; letter-spacing: .03em; }
.sidebar-sticky { position: sticky; top: 150px; }
.form-box { border-radius: 28px; padding: 18px 20px; background-color: var(--step-light-grey-1); border: 1px solid var(--step-light-grey-3); }
.search-box { box-shadow: 0 1px 0 0 rgba(0,0,0,.11); }
.side-list a { display: block; padding: .35rem .75rem; border-radius: .6rem; color: var(--step-dark-1); text-decoration: none; }
.side-list a:hover { background: var(--step-light-grey-2); }
.side-list a.active { color: var(--step-orange-1); font-weight: 600; background: var(--step-light-orange-1); }
.side-list .group-title { font-size: .7em; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--step-dark-blue-1); margin: .9rem .75rem .25rem; }

/* List rows (STEP project-row) */
.list-row { display: flex; margin-bottom: 6px; cursor: pointer; text-decoration: none; color: inherit; }
.list-row .col-a { flex: 1; padding: 18px 20px; background: var(--step-light-grey-3); box-shadow: 0 1px 0 0 rgba(0,0,0,.11); border-radius: .75rem 0 0 .75rem; }
.list-row .col-b { padding: 18px 20px; text-align: right; background: #fafafa; box-shadow: 0 1px 0 0 rgba(0,0,0,.05); border-radius: 0 .75rem .75rem 0; min-width: 220px; }
.list-row:hover .col-a, .list-row:hover .col-b { background: var(--step-light-grey-2); }
.list-row .ref { font-size: .75em; font-weight: 500; letter-spacing: .03em; color: var(--step-dark-blue-1); text-transform: uppercase; }
.list-row .big { font-size: 1.15em; font-weight: 600; }

/* Compact inputs */
.w-num { width: 4.4rem; }
.w-ref { width: 5.6rem; }
.adj-row { display: flex; gap: .75rem; align-items: flex-end; }
.adj-row .form-label { white-space: nowrap; }
.adj-row > .flex-fill { min-width: 0; }
.adj-row .form-select { width: 100%; min-width: 0; padding-right: 1.9rem; text-overflow: ellipsis; }
.staff-list .form-control { max-width: 22rem; }

/* Rate cards */
.rc-table { --bs-table-bg: transparent; font-variant-numeric: tabular-nums; }
.rc-table th { font-size: .7em; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--step-dark-blue-1); vertical-align: bottom; }
.rc-table td { vertical-align: top; }
.rc-rate { width: 7rem; }
.rc-derived { font-size: .72em; color: #6a7c86; margin-top: .2rem; white-space: nowrap; }
.rc-current > td { background: var(--step-light-green-1); }

/* Price history */
.hist-service { padding: .6rem 0; border-top: 1px solid var(--step-light-grey-3); }
.hist-service:first-of-type { border-top: 0; }
.hist-table { --bs-table-bg: transparent; font-size: .88em; }
.hist-table th { font-size: .72em; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--step-dark-blue-1); }
.hist-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Milestones (one per service title) */
.milestone { display: flex; flex-wrap: wrap; align-items: center; margin: 1.4rem 0 .5rem; border-radius: .75rem; background: var(--step-light-blue-1); box-shadow: 0 1px 0 0 rgba(0,0,0,.08); }
.milestone.collapsed { margin: 0 0 6px; }
.milestone .ms-a { flex: 1 1 340px; display: flex; align-items: center; gap: .75rem; padding: 12px 18px; cursor: pointer; min-width: 0; }
.milestone .ms-a .chev { font-size: 1.1em; color: var(--step-dark-blue-1); }
.milestone .ms-a:hover .chev { color: var(--step-orange-1); }
.milestone .group { font-size: .7em; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--step-orange-1); }
.milestone .title { font-weight: 600; font-size: 1.12em; }
.milestone .ms-b { flex: 0 1 620px; display: grid; grid-template-columns: .7fr 1fr 1.15fr 1fr 1fr; gap: .6rem; padding: 10px 18px; }
.milestone .out { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.2; }
.milestone .out small { display: block; font-weight: 400; font-size: .72em; color: #6a7c86; }
.milestone .out.price { color: var(--step-dark-blue-2); font-size: 1.05em; }
.milestone.total { background: var(--step-dark-blue-1); color: #fff; margin-top: 1.2rem; }
.milestone.total .ms-a { cursor: default; }
.milestone.total .title, .milestone.total .out, .milestone.total .out.price { color: #fff; }
.milestone.total .out small, .milestone.total .step-text-muted { color: rgba(255,255,255,.75) !important; }
.view-toggle .btn { --bs-btn-padding-y: .3rem; border-radius: 2rem; }
.view-toggle .btn:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.view-toggle .btn:last-child { border-top-left-radius: 0; border-bottom-left-radius: 0; }

/* Task rows */
.service-head { display: flex; align-items: baseline; gap: .75rem; margin: 1.6rem 0 .5rem; padding: 0 .25rem; }
.service-head .title { font-weight: 600; font-size: 1.15em; }
.service-head .group { font-size: .7em; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--step-orange-1); }
.service-head .sub { margin-left: auto; font-size: .9em; color: var(--step-dark-blue-1); }

.task-row { display: flex; flex-wrap: wrap; margin-bottom: 6px; border-radius: .75rem; }
.task-row > .col-a { flex: 1 1 380px; min-width: 0; padding: 14px 18px; background: var(--step-light-grey-3); box-shadow: 0 1px 0 0 rgba(0,0,0,.11); border-radius: .75rem 0 0 .75rem; }
.task-row > .col-b { flex: 0 1 760px; padding: 12px 16px; background: #fafafa; box-shadow: 0 1px 0 0 rgba(0,0,0,.05); border-radius: 0 .75rem .75rem 0; }
@media (max-width: 1199px) {
	.task-row > .col-a { border-radius: .75rem .75rem 0 0; flex-basis: 100%; }
	.task-row > .col-b { border-radius: 0 0 .75rem .75rem; flex-basis: 100%; }
}
.task-row:hover > .col-a, .task-row:hover > .col-b { background: var(--step-light-grey-2); }
.task-row.not-charged > .col-a { background-image: repeating-linear-gradient(135deg, transparent 0 10px, rgba(51,100,126,.04) 10px 20px); }
.task-row .svc { font-size: .7em; font-weight: 500; letter-spacing: .03em; text-transform: uppercase; color: var(--step-dark-blue-1); }
.task-row .heading-input {
	border: 0; background: transparent; padding: 0; width: 100%; font-weight: 600; font-size: 1.08em; color: var(--step-dark-blue-2); outline: none;
	border-bottom: 1px dashed transparent;
}
.task-row .heading-input:hover { border-bottom-color: var(--step-grey-1); }
.task-row .heading-input:focus { border-bottom-color: var(--step-dark-blue-1); }
.task-row .heading-input::placeholder { color: var(--step-grey-1); font-weight: 400; }
.desc { position: relative; margin-top: .2rem; font-size: .95em; }
.desc .desc-text { white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; color: #3d5562; min-height: 1.4em; }
.desc .desc-text.empty { color: #9aa7ae; font-style: italic; }
.desc textarea { font-size: .95em; }
.desc-toggle { font-size: .8em; color: var(--step-dark-blue-1); cursor: pointer; text-decoration: none; }
.desc-toggle:hover { color: var(--step-orange-1); }

.badge-soft { font-weight: 500; font-size: .72em; letter-spacing: .03em; text-transform: uppercase; padding: .35em .6em; border-radius: .5rem; }
.badge-custom { background: var(--step-light-blue-1); color: var(--step-dark-blue-1); }
.badge-nocharge { background: var(--step-light-orange-1); color: var(--step-orange-1); }
.badge-internal { background: var(--step-light-grey-3); color: var(--step-dark-1); border: 1px solid var(--step-grey-1); }
.badge-discount { background: var(--step-light-red-1); color: #b33a10; }

.staff-chips { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; margin-top: .55rem; }
.chip { display: inline-flex; align-items: center; gap: .3rem; background: #fff; border: 1px solid var(--step-grey-1); border-radius: 2rem; padding: .05rem .25rem .05rem .65rem; font-size: .85em; font-weight: 500; }
.chip .bi { cursor: pointer; color: #8a9aa3; }
.chip .bi:hover { color: var(--step-red); }
.chip-input { border: 1px dashed var(--step-grey-1); border-radius: 2rem; padding: .1rem .7rem; font-size: .85em; width: 150px; background: transparent; outline: none; }
.chip-input:focus { border-color: var(--step-dark-blue-1); background: #fff; }
.chip.chip-static { padding: .05rem .65rem; }
.milestone .ms-invoice { display: inline-flex; align-items: center; gap: .35rem; color: #6a7c86; cursor: default; }
.milestone .ms-invoice .form-control-sm { width: auto; padding: .05rem .4rem; font-size: .8rem; border-radius: 2rem; }
.task-row .task-date { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: .2rem 0 .1rem; }
.task-row .task-date .form-control-sm { width: auto; padding: .05rem .4rem; font-size: .85rem; border-radius: .5rem; }
.sow-table .sow-ms td { background: var(--step-light-blue-1); border-top: 2px solid #fff; }
.task-notes { margin-top: .6rem; padding-top: .5rem; border-top: 1px dashed var(--step-grey-1); font-size: .9em; }
.task-notes .note { background: #fff; border: 1px solid var(--step-light-grey-3); border-radius: .5rem; padding: .35rem .55rem; margin-bottom: .35rem; }
.task-notes .note-meta { display: flex; align-items: center; gap: .3rem; font-size: .8em; color: #7b8a93; }
.task-notes .note-tools { margin-left: auto; }
.task-notes .note-text { white-space: pre-wrap; }
.task-notes .notes-earlier { margin-top: .35rem; opacity: .9; }
.task-notes .note-add { display: flex; gap: .4rem; align-items: flex-start; margin-top: .35rem; }
.adj-section { border-top: 1px solid var(--step-light-grey-3); padding-top: .6rem; }
.adj-section > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; flex-wrap: wrap; }
.adj-section > summary::-webkit-details-marker { display: none; }
.adj-section > summary::before { content: '\F285'; font-family: 'bootstrap-icons'; font-size: .75em; margin-right: .4rem; transition: transform .15s; }
.adj-section[open] > summary::before { transform: rotate(90deg); }
.adj-section .adj-body { padding-top: .6rem; }
.order-apply { border: 1px solid var(--step-light-grey-3); border-radius: .75rem; background: var(--step-light-grey-1); padding: .6rem .8rem; font-size: .88em; }
.badge-partial { background: #fdf0e1; color: #a5590f; }
.badge-completed { background: var(--step-dark-blue-1); color: #fff; }

/* Quote list filters */
.lf-box { border: 1px solid var(--step-light-grey-3); border-radius: 1rem; background: #fff; overflow: hidden; }
.lf { border-bottom: 1px solid var(--step-light-grey-3); }
.lf:last-child { border-bottom: 0; }
.lf > summary { display: flex; align-items: center; padding: .55rem .9rem; font-weight: 600; font-size: .9em; cursor: pointer; list-style: none; }
.lf > summary::-webkit-details-marker { display: none; }
.lf > summary::after { content: '\F282'; font-family: 'bootstrap-icons'; margin-left: .5rem; font-size: .8em; color: #8a9aa3; transition: transform .15s; }
.lf[open] > summary::after { transform: rotate(180deg); }
.lf-n { margin-left: auto; color: var(--step-orange-1); font-size: .75em; }
.lf-body { padding: 0 .9rem .7rem; font-size: .88em; }
.lf-body .form-check { margin-bottom: .15rem; }
.lf-dates { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .3rem .5rem; align-items: center; }
.lf-dates span { color: #6a7c86; }
.lf-scroll { max-height: 190px; overflow-y: auto; padding-right: .25rem; }
.lf-summary { padding: 14px 20px; }
.bm-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; column-gap: .1rem; padding: .3rem .45rem; margin: 0 -.45rem .15rem; border-radius: .5rem; }
.bm-row.active { background: var(--step-light-blue-1); }
.bm-row .bm-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.bm-row .bm-meta { grid-column: 1 / -1; font-size: .78em; color: #7b8a93; }
.bm-row .btn-icon.on { color: var(--step-orange-1); }
.bm-row.bm-hidden .bm-title { font-weight: 400; color: #7b8a93; }
.bm-form { border: 1px solid var(--step-light-grey-3); border-radius: .6rem; padding: .5rem; margin: .1rem 0 .5rem; background: var(--step-light-grey-1); }
.milestone .ms-status { width: auto; display: inline-block; font-size: .72rem; font-weight: 600; padding: .05rem 1.6rem .05rem .55rem; border-radius: 2rem; border-color: transparent; background-position: right .4rem center; cursor: pointer; }
.milestone.declined .title, .milestone.declined .ms-b { opacity: .55; }
.milestone.declined .title { text-decoration: line-through; }
.milestone .ms-staff { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; cursor: default; }
.milestone .ms-staff .chip-input { font-size: 1em; }

.nums { display: grid; grid-template-columns: .85fr .85fr 1.35fr .85fr 1.05fr 1fr 1.1fr; gap: .35rem .6rem; align-items: end; }
.nums.cost { margin-top: .5rem; padding-top: .5rem; border-top: 1px dashed var(--step-grey-1); align-items: start; }
.nums.cost .out { padding-top: .9rem; }
.nums .span-3 { grid-column: span 3; }
.nums .staff-chips { margin-top: 0; min-height: 31px; }
.quote-top .form-box { padding: 16px 20px; }
.nums .form-control, .nums .form-select { padding: .25rem .45rem; font-size: .9em; border-radius: .5rem; }
.nums .out { font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; line-height: 1.2; padding: .25rem 0; }
.nums .out small { display: block; font-weight: 400; font-size: .75em; color: #7b8a93; }
.nums .field-label { display: block; font-size: .62em; white-space: nowrap; }
.nums .span-2 { grid-column: span 2; }
.row-actions { display: inline-flex; gap: .1rem; margin-left: .25rem; }
.neg { color: var(--step-red) !important; }

/* Totals */
.totals { font-variant-numeric: tabular-nums; }
.totals .line { display: flex; justify-content: space-between; padding: .18rem 0; }
.totals .line.sub { color: #5c707b; font-size: .92em; }
.totals .line.strong { font-weight: 600; border-top: 1px solid var(--step-grey-1); margin-top: .3rem; padding-top: .45rem; }
.totals .line.grand { font-weight: 700; font-size: 1.15em; color: var(--step-dark-blue-2); }
.totals .line.semi { font-weight: 600; }
.totals .line.margin { font-weight: 700; font-size: 1.1em; }
.totals .section { font-size: .7em; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--step-orange-1); margin-top: .8rem; }
.margin-bar { height: 10px; border-radius: 6px; background: var(--step-light-grey-3); overflow: hidden; display: flex; margin: .4rem 0 .2rem; }
.margin-bar > div { height: 100%; }

/* Staff view */
.staff-card { border-radius: 28px; background: var(--step-light-grey-1); border: 1px solid var(--step-light-grey-3); padding: 18px 22px; margin-bottom: 1rem; }
.staff-card h3 { font-size: 1.35em; margin: 0; }
.staff-card table { font-size: .93em; }
.staff-card th { font-size: .72em; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--step-dark-blue-1); }
.staff-card td.num, .staff-card th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.staff-card .table { --bs-table-bg: transparent; }
.staff-card .staff-desc { white-space: pre-line; font-size: .9em; color: #4d6370; margin-top: .2rem; max-width: 60ch; }
.staff-card .staff-desc.empty { color: #9aa7ae; font-style: italic; }
.staff-card td { vertical-align: top; }

/* Catalogue picker */
#pickerBody .pick-services { border-right: 1px solid var(--step-light-grey-3); max-height: 65vh; overflow: auto; padding: .5rem; }
#pickerBody .pick-tasks { max-height: 65vh; overflow: auto; padding: 1rem 1.25rem; }
.pick-task { display: flex; gap: .75rem; padding: .5rem .6rem; border-radius: .6rem; }
.pick-task:hover { background: var(--step-light-grey-2); }
.pick-task .meta { margin-left: auto; white-space: nowrap; font-size: .85em; color: var(--step-dark-blue-1); }
.pick-task .d { font-size: .85em; color: #6a7c86; white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Catalogue editor */
.cat-table td { vertical-align: top; }
.cat-table .form-control, .cat-table .form-select { padding: .25rem .45rem; font-size: .9em; border-radius: .5rem; }
.cat-table th { font-size: .7em; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--step-dark-blue-1); }

.empty-state { text-align: center; padding: 3rem 1rem; color: #6a7c86; border: 2px dashed var(--step-light-grey-3); border-radius: 28px; }
.empty-state .bi { font-size: 2.5rem; color: var(--step-grey-1); }

footer { background: var(--step-light-grey-3); font-size: .9em; border-radius: 1rem 1rem 0 0; }

@media print {
	header, footer, .sidebar .no-print, .row-actions, .no-print { display: none !important; }
}

/* Sign-in (js/auth.js): the app stays hidden until the Ingestor confirms who is signed in. */
.tq-locked .app, .tq-locked .toast-container, .tq-locked .modal { visibility: hidden !important; }
#tqLogin { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: center; justify-content: center; background: var(--step-light-grey-2); padding: 16px; }
#tqLogin .tq-login-card { width: 100%; max-width: 420px; background: #fff; border-radius: 28px; padding: 28px 30px; box-shadow: 0 10px 30px rgba(0,0,0,.08); }

/* Team users (no quote access): quotes as documents only - no New quote, Catalogue or Settings */
.tq-team [data-action="new-quote"], .tq-team .top-nav li:has([data-nav="catalogue"]), .tq-team .top-nav li:has([data-nav="settings"]) { display: none !important; }
/* Management viewing as another user */
.tq-imp-banner { background: #fff4e5; border: 1px solid #f5a623; border-radius: 999px; padding: .4rem 1rem; font-size: .9rem; }
.tq-viewas-list { max-height: 260px; overflow-y: auto; }