/* =========================================================
 * SSS Sales Dashboard — Professional UI
 * Design system: soft neutrals, single confident accent,
 * generous spacing, subtle depth via shadow (not borders-only).
 * ========================================================= */

.tss-wrap{
	--tss-ink:#0f1729;
	--tss-ink-soft:#3a4258;
	--tss-muted:#6b7385;
	--tss-faint:#98a1b3;

	--tss-navy:#101a33;
	--tss-navy-2:#16234a;
	--tss-navy-3:#1c2c58;

	--tss-accent:#3457ea;
	--tss-accent-dark:#2540bd;
	--tss-accent-soft:#eaefff;

	--tss-orange:#e8912e;
	--tss-orange-soft:#fdf1e2;
	--tss-green:#1fa971;
	--tss-green-soft:#e5f8ee;
	--tss-red:#e0405a;
	--tss-red-soft:#fdeaee;

	--tss-border:#e7e9f0;
	--tss-border-soft:#f0f2f7;
	--tss-surface:#ffffff;
	--tss-bg:#f5f6fa;

	--tss-radius-sm:8px;
	--tss-radius:12px;
	--tss-radius-lg:16px;

	--tss-shadow-sm:0 1px 2px rgba(16,26,51,0.05);
	--tss-shadow:0 4px 14px rgba(16,26,51,0.06);
	--tss-shadow-lg:0 16px 40px rgba(16,26,51,0.14);

	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	color: var(--tss-ink);
	max-width: 1440px;
	margin: 0 auto;
	background: var(--tss-bg);
	line-height: 1.5;
}
.tss-wrap *{box-sizing:border-box;}
.tss-wrap ::selection{background:var(--tss-accent-soft);color:var(--tss-accent-dark);}

/* ---------------------------------------------------------
 * Top bar
 * --------------------------------------------------------- */
.tss-topbar{
	background: linear-gradient(155deg, var(--tss-navy) 0%, var(--tss-navy-3) 100%);
	display:flex;align-items:center;gap:24px;
	padding:16px 24px;
	border-radius: var(--tss-radius-lg) var(--tss-radius-lg) 0 0;
	box-shadow: var(--tss-shadow);
}
.tss-brand{display:flex;align-items:center;gap:12px;color:#fff;}
.tss-logo{background:var(--tss-accent);color:#fff;font-weight:700;border-radius:8px;padding:9px 11px;font-size:14px;letter-spacing:.3px;}
.tss-logo-img{height:36px;width:auto;display:block;background:#fff;border-radius:8px;padding:4px 7px;box-shadow: var(--tss-shadow-sm);}
.tss-brand-text strong{display:block;font-size:15px;letter-spacing:.2px;color:#fff;}
.tss-brand-text span{font-size:10px;letter-spacing:1.6px;color:#8fa0d4;font-weight:600;}

.tss-search{flex:1;position:relative;}
.tss-search::before{
	content:"";
	position:absolute;left:16px;top:50%;transform:translateY(-50%);
	width:15px;height:15px;
	background: rgba(255,255,255,.55);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") center/contain no-repeat;
	pointer-events:none;
}
.tss-search input{
	width:100%;max-width:480px;padding:11px 16px 11px 42px;border-radius:9px;border:1px solid rgba(255,255,255,.08);
	background: rgba(255,255,255,.08); color:#fff; font-size:13.5px;
	transition: background .15s ease, box-shadow .15s ease;
}
.tss-search input::placeholder{color:rgba(255,255,255,.5);}
.tss-search input:focus{outline:none;background:rgba(255,255,255,.14);box-shadow:0 0 0 3px rgba(52,87,234,.35);}

.tss-top-actions{display:flex;align-items:center;gap:14px;}
.tss-user-chip{
	background: rgba(255,255,255,.08);color:#fff;padding:9px 16px;border-radius:9px;font-size:13px;font-weight:600;
	border:1px solid rgba(255,255,255,.08);
}

/* ---------------------------------------------------------
 * Buttons
 * --------------------------------------------------------- */
.tss-btn{
	border:none;border-radius:9px;padding:11px 18px;font-weight:600;cursor:pointer;font-size:13.5px;
	transition: transform .12s ease, box-shadow .12s ease, background .15s ease, filter .15s ease;
	letter-spacing:.1px;
}
.tss-btn:active{transform:translateY(1px);}
.tss-btn-dark{background: var(--tss-accent); color:#fff; box-shadow: 0 4px 10px rgba(52,87,234,.28);}
.tss-btn-dark:hover{background: var(--tss-accent-dark); box-shadow: 0 6px 16px rgba(52,87,234,.36);}
.tss-btn-light{background:#fff;color:var(--tss-ink);border:1px solid var(--tss-border);}
.tss-btn-light:hover{background:#f7f8fb;border-color:#d8dcea;}
.tss-mini-btn{
	background:#fff;border:1px solid var(--tss-border);border-radius:7px;padding:6px 12px;font-size:12px;font-weight:600;
	cursor:pointer;margin-right:6px;color:var(--tss-ink-soft);transition:all .12s ease;
}
.tss-mini-btn:hover{background:var(--tss-accent-soft);border-color:#c9d5ff;color:var(--tss-accent-dark);}
.tss-delete:hover{background:var(--tss-red-soft);border-color:#f6c6cf;color:var(--tss-red);}

/* ---------------------------------------------------------
 * Tabs
 * --------------------------------------------------------- */
.tss-tabs{background:#fff;display:flex;align-items:center;gap:8px;padding:16px 24px;border-bottom:1px solid var(--tss-border);flex-wrap:wrap;}
.tss-tabs-label{color:var(--tss-faint);font-size:10.5px;letter-spacing:1.4px;font-weight:700;margin-right:10px;}
.tss-tab{
	background:var(--tss-bg);border:1px solid transparent;padding:9px 18px;border-radius:22px;font-size:13px;font-weight:600;
	cursor:pointer;color:var(--tss-ink-soft);transition:all .15s ease;
}
.tss-tab:hover{background:#eceef4;}
.tss-tab-active{background:var(--tss-ink);color:#fff;box-shadow:0 3px 8px rgba(15,23,41,.22);}
.tss-tab-active:hover{background:var(--tss-ink);}

/* ---------------------------------------------------------
 * Info strips
 * --------------------------------------------------------- */
.tss-strip{
	background:#fff;border:1px solid var(--tss-border);
	border-radius: var(--tss-radius);display:flex;align-items:center;gap:18px;padding:18px 22px;margin:18px 24px 0;flex-wrap:wrap;
	box-shadow: var(--tss-shadow-sm);
	position:relative;overflow:hidden;
}
.tss-strip::before{
	content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tss-accent);
}
.tss-strip-title{font-size:11px;color:var(--tss-orange);font-weight:700;line-height:1.7;letter-spacing:.3px;padding-left:6px;}
.tss-strip-title strong{color:var(--tss-ink);font-size:14.5px;font-weight:700;}
.tss-strip-box{background:var(--tss-bg);border-radius:10px;text-align:center;padding:12px 22px;min-width:86px;}
.tss-strip-box strong{display:block;font-size:21px;font-weight:800;color:var(--tss-ink);}
.tss-strip-box span{font-size:11px;color:var(--tss-muted);font-weight:500;}
.tss-strip-warn{background:var(--tss-orange-soft);}
.tss-strip-warn strong{color:#a8641b;}
.tss-strip-blue{background:var(--tss-accent-soft);}
.tss-strip-blue strong{color:var(--tss-accent-dark);}

/* ---------------------------------------------------------
 * Layout
 * --------------------------------------------------------- */
.tss-main{display:flex;gap:0;margin-top:22px;min-height:520px;padding:0 24px 24px;}
.tss-sidebar{
	background: linear-gradient(180deg, var(--tss-navy) 0%, var(--tss-navy-2) 100%);
	color:#cdd6ee;width:256px;flex-shrink:0;border-radius: var(--tss-radius) 0 0 var(--tss-radius);
	padding:22px 16px;box-shadow: var(--tss-shadow);
}
.tss-sidebar-title{font-size:10.5px;color:#8b96b8;margin-bottom:10px;letter-spacing:.6px;font-weight:600;text-transform:uppercase;}
.tss-select{
	width:100%;padding:11px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.1);margin-bottom:22px;
	background:rgba(255,255,255,.08);color:#fff;font-size:13px;font-weight:600;
}
.tss-nav-group-label{font-size:10px;letter-spacing:1.3px;color:#6c7aa3;margin:20px 0 8px;font-weight:700;text-transform:uppercase;}
.tss-nav-group-label:first-of-type{margin-top:6px;}
.tss-nav-item{
	display:flex;align-items:center;gap:10px;color:#cdd6ee;text-decoration:none;padding:10px 12px;border-radius:8px;
	font-size:13.5px;font-weight:500;margin-bottom:3px;transition:all .14s ease;border-left:3px solid transparent;
}
.tss-nav-item:hover{background:rgba(255,255,255,.06);color:#fff;}
.tss-nav-active{background:rgba(52,87,234,.22);color:#fff;font-weight:600;border-left:3px solid var(--tss-accent);}

.tss-content{
	background:#fff;border:1px solid var(--tss-border);border-left:none;
	border-radius:0 var(--tss-radius) var(--tss-radius) 0;flex:1;padding:32px;box-shadow: var(--tss-shadow);
}

.tss-panel-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px;margin-bottom:28px;}
.tss-eyebrow{color:var(--tss-accent);font-size:11px;letter-spacing:1.4px;font-weight:700;text-transform:uppercase;}
.tss-panel-header h1{font-size:30px;margin:6px 0;font-weight:800;letter-spacing:-.4px;color:var(--tss-ink);}
.tss-panel-header p{color:var(--tss-muted);margin:0;font-size:14px;}
.tss-panel-actions{display:flex;gap:10px;flex-wrap:wrap;}

/* ---------------------------------------------------------
 * Stat cards
 * --------------------------------------------------------- */
.tss-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:32px;}
.tss-stat-card{
	border:1px solid var(--tss-border);border-radius: var(--tss-radius);padding:20px 22px;background:#fff;
	box-shadow: var(--tss-shadow-sm); transition: transform .15s ease, box-shadow .15s ease; position:relative;overflow:hidden;
}
.tss-stat-card::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:var(--tss-accent);}
.tss-stat-card:hover{transform:translateY(-2px);box-shadow: var(--tss-shadow);}
.tss-stat-card span{display:block;color:var(--tss-muted);font-size:12.5px;margin-bottom:10px;font-weight:600;}
.tss-stat-card strong{font-size:30px;font-weight:800;color:var(--tss-ink);letter-spacing:-.5px;}
.tss-accent-orange::before{background:var(--tss-orange);}
.tss-accent-green::before{background:var(--tss-green);}
.tss-accent-blue::before{background:var(--tss-accent);}

/* ---------------------------------------------------------
 * Workflow
 * --------------------------------------------------------- */
.tss-workflow-row{display:grid;grid-template-columns:2fr 1fr;gap:20px;}
.tss-workflow-box, .tss-quick-actions{
	border:1px solid var(--tss-border);border-radius: var(--tss-radius);padding:26px;background:#fff;box-shadow: var(--tss-shadow-sm);
}
.tss-workflow-box h2, .tss-quick-actions h2{margin-top:0;font-size:18px;font-weight:800;color:var(--tss-ink);letter-spacing:-.2px;}
.tss-workflow-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(126px,1fr));gap:14px;margin-top:18px;}
.tss-workflow-card{
	background: var(--tss-bg);border-radius:10px;padding:16px;text-align:left;border:1px solid var(--tss-border-soft);
	transition: background .15s ease;
}
.tss-workflow-card:hover{background:var(--tss-accent-soft);}
.tss-workflow-card strong{font-size:24px;color:var(--tss-accent);display:block;font-weight:800;}
.tss-workflow-card span{font-size:12px;color:var(--tss-muted);font-weight:500;}
.tss-quick-link{
	display:flex;justify-content:space-between;align-items:center;text-decoration:none;color:var(--tss-ink);font-weight:600;
	padding:13px 4px;border-bottom:1px solid var(--tss-border-soft);font-size:13.5px;transition:color .12s ease,padding-left .12s ease;
}
.tss-quick-link:hover{color:var(--tss-accent);padding-left:4px;}
.tss-quick-link:last-child{border-bottom:none;}
.tss-quick-link span{color:var(--tss-faint);transition:transform .12s ease;}
.tss-quick-link:hover span{transform:translateX(3px);color:var(--tss-accent);}

/* ---------------------------------------------------------
 * Tables (leads/customers/quotes list panels)
 * --------------------------------------------------------- */
.tss-h2{font-size:22px;margin-bottom:18px;font-weight:800;color:var(--tss-ink);letter-spacing:-.3px;}
.tss-table{width:100%;border-collapse:collapse;border:1px solid var(--tss-border);border-radius:var(--tss-radius-sm);overflow:hidden;}
.tss-table th, .tss-table td{padding:13px 14px;border-bottom:1px solid var(--tss-border-soft);text-align:left;font-size:13.5px;}
.tss-table th{
	color:var(--tss-muted);font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;font-weight:700;
	background:var(--tss-bg);border-bottom:1px solid var(--tss-border);
}
.tss-table tbody tr{transition:background .12s ease;}
.tss-table tbody tr:hover{background:#f9fafc;}
.tss-table tbody tr:last-child td{border-bottom:none;}

.tss-badge{padding:4px 12px;border-radius:20px;font-size:11px;font-weight:700;background:var(--tss-bg);letter-spacing:.2px;}
.tss-badge-new{background:var(--tss-accent-soft);color:var(--tss-accent-dark);}
.tss-badge-open{background:var(--tss-orange-soft);color:#a8641b;}
.tss-badge-closed{background:var(--tss-green-soft);color:#157a4f;}
.tss-badge-draft{background:var(--tss-orange-soft);color:#a8641b;}
.tss-badge-sent{background:var(--tss-accent-soft);color:var(--tss-accent-dark);}
.tss-badge-approved{background:var(--tss-green-soft);color:#157a4f;}
.tss-badge-active{background:var(--tss-green-soft);color:#157a4f;}

.tss-footer{text-align:center;color:var(--tss-faint);padding:22px;font-size:12.5px;font-weight:500;}

/* ---------------------------------------------------------
 * Modal
 * --------------------------------------------------------- */
.tss-modal{
	display:none;position:fixed;inset:0;background:rgba(15,23,41,0.55);backdrop-filter:blur(2px);
	z-index:9999;align-items:center;justify-content:center;
}
.tss-modal.tss-modal-open{display:flex;animation: tss-fade .15s ease;}
@keyframes tss-fade{from{opacity:0;}to{opacity:1;}}
.tss-modal-box{
	background:#fff;border-radius: var(--tss-radius);padding:28px;width:90%;max-width:440px;
	box-shadow: var(--tss-shadow-lg); animation: tss-pop .16s ease;
}
@keyframes tss-pop{from{transform:translateY(8px) scale(.98);opacity:0;}to{transform:none;opacity:1;}}
.tss-modal-box h3{margin-top:0;font-size:19px;font-weight:800;color:var(--tss-ink);margin-bottom:18px;}
.tss-modal-box label{display:block;font-size:12.5px;margin-bottom:14px;color:var(--tss-ink-soft);font-weight:600;}
.tss-modal-box input, .tss-modal-box textarea, .tss-modal-box select{
	width:100%;padding:10px 12px;border:1px solid var(--tss-border);border-radius:8px;margin-top:6px;font-size:14px;
	font-weight:400;color:var(--tss-ink);transition:border-color .12s ease, box-shadow .12s ease;
}
.tss-modal-box input:focus, .tss-modal-box textarea:focus, .tss-modal-box select:focus{
	outline:none;border-color:var(--tss-accent);box-shadow:0 0 0 3px rgba(52,87,234,.12);
}
.tss-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px;}

/* ---------------------------------------------------------
 * Toast
 * --------------------------------------------------------- */
.tss-toast{
	position:fixed;bottom:24px;right:24px;background:var(--tss-ink);color:#fff;padding:14px 22px;border-radius:10px;
	display:none;z-index:10000;font-size:13.5px;font-weight:600;box-shadow: var(--tss-shadow-lg);
}
.tss-toast.tss-show{display:block;animation: tss-slide-in .18s ease;}
@keyframes tss-slide-in{from{transform:translateY(10px);opacity:0;}to{transform:none;opacity:1;}}

.tss-login-box{padding:48px;text-align:center;background:#fff;border:1px solid var(--tss-border);border-radius: var(--tss-radius);box-shadow: var(--tss-shadow-sm);font-size:14.5px;color:var(--tss-ink-soft);}
.tss-login-box a{color:var(--tss-accent);font-weight:600;text-decoration:none;}
.tss-login-box a:hover{text-decoration:underline;}

@media (max-width: 900px){
	.tss-main{flex-direction:column;padding:0 16px 16px;}
	.tss-sidebar{width:100%;border-radius: var(--tss-radius) var(--tss-radius) 0 0;}
	.tss-content{border-radius:0 0 var(--tss-radius) var(--tss-radius);border-left:1px solid var(--tss-border);padding:22px;}
	.tss-workflow-row{grid-template-columns:1fr;}
	.tss-strip{margin:16px 16px 0;}
	.tss-topbar{flex-wrap:wrap;padding:14px 16px;}
	.tss-panel-header h1{font-size:24px;}
}

/* =========================================================
 * Admin: Quotation Builder & Products (wp-admin pages)
 * ========================================================= */
.tss-item-table{border-collapse:collapse;margin-top:12px;width:100%;border:1px solid #dcdcde;border-radius:8px;overflow:hidden;}
.tss-item-table th, .tss-item-table td{padding:9px;border:1px solid #e2e4e9;vertical-align:top;}
.tss-item-table th{background:#f6f7fb;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:#5c6478;}
.tss-item-table input, .tss-item-table select, .tss-item-table textarea{width:100%;box-sizing:border-box;padding:6px 8px;font-size:13px;border-radius:5px;}
.tss-item-table textarea{resize:vertical;min-height:32px;}
.tss-item-table tfoot td{background:#f6f7f7;font-size:13px;font-weight:600;}
.tss-item-remove{color:#c9354e;font-weight:bold;line-height:1;padding:2px 10px !important;cursor:pointer;}

.tss-status-pill{padding:4px 12px;border-radius:20px;font-size:11px;font-weight:700;display:inline-block;background:#eef1f7;letter-spacing:.2px;}
.tss-status-draft{background:#fdf1e2;color:#a8641b;}
.tss-status-sent{background:#eaefff;color:#2540bd;}
.tss-status-approved{background:#e5f8ee;color:#157a4f;}
.tss-status-declined{background:#fdeaee;color:#c9354e;}
.tss-status-expired{background:#f1f1f1;color:#666;}