:root {
  --bg: #eef3ff;
  --surface: rgba(255, 255, 255, 0.9);
  --surface-strong: #ffffff;
  --surface-ink: #1f2f63;
  --line: rgba(108, 126, 202, 0.22);
  --line-strong: rgba(108, 126, 202, 0.36);
  --primary: #6f63ff;
  --primary-deep: #5748de;
  --accent: #2f58cf;
  --accent-soft: #e8eeff;
  --success: #198f64;
  --text: #1f2741;
  --muted: #5f6b8f;
  --shadow: 0 22px 56px rgba(86, 106, 190, 0.14);
  --radius-lg: 24px;
  --radius-md: 16px;
  --radius-sm: 12px;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: "Manrope", sans-serif;
  color: var(--text);
  overflow-x: clip;
  background:
    radial-gradient(circle at 10% 4%, rgba(111, 99, 255, 0.16), transparent 32%),
    radial-gradient(circle at 92% 8%, rgba(47, 88, 207, 0.14), transparent 36%),
    linear-gradient(135deg, #f7f9ff 0%, #f2f5ff 34%, #ecf1ff 100%);
}

@media (min-width: 1201px) {
  body:not(.app-auth-screen) {
    height: 100vh;
    overflow: hidden;
  }
}

body.app-booting .app-header,
body.app-booting .page-shell {
  visibility: hidden;
  pointer-events: none;
}

body.app-auth-screen .app-header,
body.app-auth-screen .page-shell {
  display: none;
}

.login-overlay {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: start center;
  padding: clamp(0.75rem, 2vw, 1.35rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  background:
    radial-gradient(circle at 12% 9%, rgba(94, 83, 224, 0.2), transparent 34%),
    radial-gradient(circle at 90% 4%, rgba(32, 97, 154, 0.24), transparent 28%),
    rgba(8, 17, 28, 0.58);
  backdrop-filter: blur(6px);
}

.login-overlay[hidden] {
  display: none;
}

.login-card {
  width: min(1540px, 100%);
  min-height: 760px;
  max-height: none;
  overflow: visible;
  background: linear-gradient(180deg, #f4f8ff 0%, #f0f5ff 100%);
  border: 1px solid rgba(255, 255, 255, 0.74);
  border-radius: 28px;
  box-shadow: 0 28px 78px rgba(7, 19, 32, 0.34);
  display: grid;
  grid-template-columns: minmax(920px, 1.72fr) minmax(320px, 0.52fr);
}

.login-hero {
  padding: clamp(1.5rem, 1.15rem + 1.2vw, 2.2rem);
  background:
    radial-gradient(circle at 84% 4%, rgba(99, 144, 255, 0.16), transparent 32%),
    radial-gradient(circle at 12% 6%, rgba(142, 172, 255, 0.12), transparent 34%),
    linear-gradient(165deg, #f7faff 0%, #f2f7ff 56%, #ecf3ff 100%);
  color: #1a2850;
  display: grid;
  gap: 1.15rem;
  align-content: start;
  position: relative;
  overflow: visible;
}

.login-hero::before {
  content: "";
  position: absolute;
  top: 0.8rem;
  right: 0.9rem;
  width: 150px;
  height: 72px;
  background-image: radial-gradient(circle, rgba(58, 109, 217, 0.22) 1.3px, transparent 1.4px);
  background-size: 11px 11px;
  opacity: 0.55;
  z-index: 0;
  pointer-events: none;
}

.login-hero-top {
  display: grid;
  grid-template-columns: minmax(420px, 1.22fr) minmax(300px, 0.78fr);
  gap: 1.2rem;
  align-items: center;
  position: relative;
  z-index: 1;
}

.login-hero-intro {
  display: grid;
  gap: 0.78rem;
}

.login-brand-row {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 1rem;
}

.login-brand-mark {
  width: 9.4rem;
  height: 6.4rem;
  border-radius: 22px;
  display: inline-grid;
  place-items: center;
  background: #ffffff;
  border: 1px solid rgba(170, 191, 241, 0.52);
  box-shadow: 0 14px 28px rgba(36, 71, 145, 0.16);
  overflow: hidden;
}

.login-brand-mark i {
  font-size: 1.2rem;
}

.login-brand-mark img {
  width: 88%;
  height: 88%;
  object-fit: contain;
  border-radius: 16px;
}

.login-hero .eyebrow {
  color: #386ad6;
  margin-bottom: 0.2rem;
  font-size: 0.94rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.login-hero-title {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  color: #0d2a67;
  font-size: clamp(3rem, 2.25rem + 1.25vw, 4.2rem);
  line-height: 0.96;
  margin: 0;
}

.login-hero-title span {
  color: #3677ff;
}

.login-hero-copy {
  margin: 0;
  font-size: 1.06rem;
  font-weight: 600;
  line-height: 1.6;
  color: #3b4e75;
  max-width: 62ch;
}

.login-module-overview {
  border: 1px solid #c9d9fb;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.95);
  padding: 1.15rem 1.1rem 1.12rem;
  display: grid;
  gap: 0.84rem;
  position: relative;
  z-index: 1;
  box-shadow: 0 18px 34px rgba(42, 72, 140, 0.1);
}

.login-module-overview-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.login-module-overview h4 {
  margin: 0;
  font-size: 1.04rem;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: #1f57cb;
}

.login-module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.78rem;
}

.login-module-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.72rem;
  align-items: center;
  padding: 0.88rem 0.86rem;
  border-radius: 16px;
  border: 1px solid #d4e1fc;
  background: #ffffff;
  min-height: 7.35rem;
}

.login-module-icon {
  width: 3.32rem;
  height: 3.32rem;
  border-radius: 14px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(129, 159, 233, 0.28);
}

.login-module-icon i {
  font-size: 1.52rem;
}

.login-module-icon.tone-blue {
  background: #eaf1ff;
  color: #225fdd;
}

.login-module-icon.tone-indigo {
  background: #ecefff;
  color: #3650d9;
}

.login-module-icon.tone-violet {
  background: #eeecff;
  color: #6652db;
}

.login-module-icon.tone-green {
  background: #ebf7ec;
  color: #1c963d;
}

.login-module-icon.tone-cyan {
  background: #e8f8fb;
  color: #1197b6;
}

.login-module-icon.tone-amber {
  background: #fff4e8;
  color: #e17210;
}

.login-module-icon.tone-rose {
  background: #fff0f2;
  color: #dc6371;
}

.login-module-card h5 {
  margin: 0 0 0.2rem;
  font-size: 0.98rem;
  line-height: 1.2;
  color: #182f63;
}

.login-module-card p {
  margin: 0;
  color: #46628f;
  font-size: 0.86rem;
  line-height: 1.42;
}

.login-hero-art {
  position: relative;
  min-height: 13.6rem;
  z-index: 1;
  perspective: 1400px;
  display: grid;
  align-items: center;
}

.login-hero-art-bg {
  position: absolute;
  inset: 0.9rem -0.2rem 0.1rem 1.2rem;
  border-radius: 24px;
  background:
    radial-gradient(circle at 16% 18%, rgba(119, 160, 245, 0.26), transparent 44%),
    radial-gradient(circle at 88% 80%, rgba(105, 205, 239, 0.18), transparent 48%),
    linear-gradient(145deg, rgba(215, 231, 255, 0.82), rgba(230, 241, 255, 0.38));
  filter: blur(0.25px);
  pointer-events: none;
}

.login-hero-art-panel {
  position: relative;
  height: 100%;
  min-height: 13.35rem;
  width: min(100%, 23.2rem);
  margin-left: auto;
  border-radius: 24px;
  border: 1px solid #cadbf9;
  background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%);
  box-shadow: 0 26px 44px rgba(48, 84, 160, 0.2);
  overflow: hidden;
  transform: translateY(0.1rem) rotateY(-10deg) rotateX(4deg) rotateZ(-1deg);
  transform-origin: center;
}

.login-hero-art-panel::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3.6rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.login-hero-art-panel::after {
  content: "";
  position: absolute;
  left: 0.95rem;
  right: 0.95rem;
  bottom: 0.52rem;
  height: 0.52rem;
  border-radius: 999px;
  background: rgba(55, 98, 193, 0.12);
  filter: blur(0.55px);
  pointer-events: none;
}

.login-hero-art-header {
  height: 2.2rem;
  padding: 0 0.8rem;
  display: flex;
  align-items: center;
  gap: 0.34rem;
  background: linear-gradient(95deg, #2c67e6, #4f88ff);
}

.login-hero-art-header span {
  width: 0.34rem;
  height: 0.34rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
}

.login-hero-art-header p {
  margin: 0 0 0 auto;
  font-size: 0.63rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(239, 246, 255, 0.95);
  font-weight: 700;
}

.login-hero-art-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.62rem;
  padding: 0.8rem 0.9rem 0.56rem;
}

.login-hero-art-kpi {
  position: relative;
  border-radius: 14px;
  border: 1px solid #d7e4fb;
  background: #ffffff;
  min-height: 4.2rem;
  display: grid;
  gap: 0.08rem;
  align-content: center;
  padding: 0.58rem 0.66rem;
  box-shadow: 0 8px 16px rgba(48, 83, 156, 0.08);
}

.login-hero-art-kpi small {
  font-size: 0.58rem;
  color: #6984b4;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.login-hero-art-kpi strong {
  font-size: 1.12rem;
  line-height: 1.05;
  color: #1f4ea9;
}

.login-hero-art-kpi span {
  font-size: 0.58rem;
  font-weight: 700;
  color: #2a9a51;
}

.login-hero-art-chart {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.68rem;
  padding: 0 0.9rem 0.7rem;
  align-items: end;
}

.login-hero-art-curve {
  position: relative;
  min-height: 2.55rem;
  border-radius: 12px;
  border: 1px solid #d8e6fc;
  background:
    linear-gradient(180deg, rgba(230, 240, 255, 0.7), rgba(241, 247, 255, 0.4)),
    repeating-linear-gradient(to right, rgba(122, 152, 212, 0.16), rgba(122, 152, 212, 0.16) 1px, transparent 1px, transparent 18px);
  overflow: hidden;
}

.login-hero-art-curve::after {
  content: "";
  position: absolute;
  left: 0.38rem;
  right: 0.38rem;
  top: 52%;
  height: 1.1rem;
  border-radius: 999px;
  border: 2px solid rgba(56, 116, 233, 0.66);
  border-top-color: transparent;
  border-left-color: transparent;
  transform: skewX(-24deg) rotate(-7deg);
}

.login-hero-art-bars {
  display: grid;
  grid-auto-flow: column;
  align-items: end;
  gap: 0.2rem;
  height: 2.55rem;
}

.login-hero-art-bars span {
  width: 0.32rem;
  border-radius: 999px;
  background: linear-gradient(180deg, #7ea9fa 0%, #396fdf 100%);
}

.login-hero-art-bars span:nth-child(1) {
  height: 1rem;
}

.login-hero-art-bars span:nth-child(2) {
  height: 1.62rem;
}

.login-hero-art-bars span:nth-child(3) {
  height: 2.25rem;
}

.login-hero-art-bars span:nth-child(4) {
  height: 1.35rem;
}

.login-hero-art-list {
  display: grid;
  gap: 0.4rem;
  padding: 0 0.9rem 0.92rem;
}

.login-hero-art-list span {
  display: block;
  height: 0.36rem;
  border-radius: 999px;
  background: #dfe9fb;
}

.login-hero-art-list span:nth-child(1) {
  width: 90%;
}

.login-hero-art-list span:nth-child(2) {
  width: 96%;
}

.login-hero-art-list span:nth-child(3) {
  width: 74%;
}

.login-hero-float {
  position: absolute;
  width: 2.54rem;
  height: 2.54rem;
  border-radius: 999px;
  border: 1px solid #d6e4ff;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 14px 24px rgba(36, 67, 134, 0.16);
  display: grid;
  place-items: center;
  color: #2f67df;
}

.login-hero-float i {
  font-size: 0.92rem;
}

.login-hero-float.float-doc {
  left: -0.84rem;
  top: 1.12rem;
}

.login-hero-float.float-bell {
  left: -0.78rem;
  bottom: 1.86rem;
}

.login-hero-float.float-box {
  right: -0.84rem;
  top: 2.28rem;
}

.login-hero-float.float-shield {
  right: -0.92rem;
  bottom: 1.24rem;
}

.login-highlight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.76rem;
  position: relative;
  z-index: 1;
}

.login-highlight-card {
  border: 1px solid #d7e4fc;
  border-radius: 16px;
  background: #ffffff;
  padding: 0.88rem 0.86rem;
  display: grid;
  gap: 0.52rem;
  align-content: start;
  box-shadow: 0 10px 22px rgba(47, 80, 144, 0.1);
  min-height: 11rem;
}

.login-highlight-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 13px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(129, 159, 233, 0.24);
}

.login-highlight-icon.tone-blue {
  background: #edf2ff;
  color: #225fdd;
}

.login-highlight-icon.tone-violet {
  background: #f0ecff;
  color: #6a49d6;
}

.login-highlight-icon.tone-green {
  background: #ebf8ed;
  color: #239640;
}

.login-highlight-icon.tone-amber {
  background: #fff2e7;
  color: #d57a20;
}

.login-highlight-icon i {
  font-size: 1.1rem;
}

.login-highlight-card h4 {
  margin: 0;
  font-size: 0.98rem;
  color: #1a2f63;
}

.login-highlight-card p {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.48;
  color: #4b6692;
}

.login-highlight-line {
  display: block;
  width: 3.15rem;
  height: 0.22rem;
  border-radius: 999px;
}

.login-highlight-line.tone-blue {
  background: #366ef0;
}

.login-highlight-line.tone-violet {
  background: #7350dd;
}

.login-highlight-line.tone-green {
  background: #2a9b4f;
}

.login-highlight-line.tone-amber {
  background: #e48126;
}

.login-feature-list {
  list-style: none;
  margin: 0;
  padding: 1.05rem 1.1rem;
  display: grid;
  gap: 0.64rem;
  position: relative;
  z-index: 1;
  border: 1px solid #b8cdf7;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(236, 244, 255, 0.82), rgba(240, 246, 255, 0.92));
}

.login-feature-list li {
  font-size: 0.97rem;
  line-height: 1.42;
  color: #24426f;
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}

.login-feature-list li::before {
  content: "\2713";
  width: 1.2rem;
  height: 1.2rem;
  margin-top: 0.1rem;
  border-radius: 999px;
  background: #3b73dd;
  color: #ffffff;
  font-size: 0.76rem;
  font-weight: 800;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}

.login-hero-note {
  display: none;
}

.login-trust-strip {
  display: none;
}

.login-trust-strip span {
  display: none;
}

.login-trust-strip i {
  display: none;
}

.login-forms {
  display: grid;
  align-content: start;
  gap: 0.8rem;
  padding: 1.35rem;
  min-height: auto;
  overflow: visible;
  background:
    radial-gradient(circle at 88% 7%, rgba(127, 182, 255, 0.14), transparent 24%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(246, 249, 255, 0.92));
}

.login-side-info {
  display: grid;
  gap: 0.62rem;
}

.login-side-info-card {
  border: 1px solid rgba(116, 138, 220, 0.24);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 8px 20px rgba(34, 58, 116, 0.08);
  padding: 0.68rem 0.74rem;
  display: grid;
  gap: 0.24rem;
}

.login-side-info-card h4 {
  margin: 0;
  font-size: 0.82rem;
  color: #1f3c79;
}

.login-side-info-card p {
  margin: 0;
  font-size: 0.74rem;
  line-height: 1.42;
  color: #4e6796;
}

.login-section {
  display: grid;
  gap: 0.7rem;
  border: 1px solid rgba(116, 138, 220, 0.2);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(28, 48, 86, 0.08);
  padding: 0.95rem;
}

.login-section-signin {
  background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%);
  border-color: rgba(116, 138, 220, 0.34);
  box-shadow:
    0 12px 28px rgba(28, 48, 86, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.login-section h3 {
  margin: 0;
  font-size: clamp(1.2rem, 1.08rem + 0.45vw, 1.55rem);
  color: #243665;
}

.login-section .helper-text {
  margin-top: 0;
}

.login-section .stack-form {
  gap: 0.72rem;
}

.login-section .action-row {
  margin-top: 0;
}

.login-section .login-error {
  margin-top: 0.2rem;
}

.login-error {
  min-height: 1.15rem;
  color: #a83b32;
}

.signup-divider {
  margin: 0.95rem 0 0.85rem;
  text-align: center;
  color: var(--muted);
  font-size: 0.82rem;
  letter-spacing: 0.02em;
  position: relative;
}

.signup-divider::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  border-top: 1px solid rgba(20, 33, 61, 0.15);
  transform: translateY(-50%);
}

.signup-divider span {
  display: inline-block;
  padding: 0 0.5rem;
  background: #f8fbff;
  position: relative;
  z-index: 1;
}

.signup-request-text {
  min-height: 1.15rem;
}

.signup-terms-check {
  display: flex;
  align-items: center;
  gap: 0.58rem;
  font-size: 0.9rem;
  color: #243665;
}

.signup-terms-check input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
}

.signup-terms-box {
  border: 1px solid rgba(81, 110, 194, 0.22);
  border-radius: 12px;
  background: rgba(242, 247, 255, 0.78);
  padding: 0.58rem 0.72rem;
}

.signup-terms-box summary {
  cursor: pointer;
  font-weight: 700;
  color: #2d4f9f;
  outline: none;
}

.signup-terms-content {
  margin-top: 0.58rem;
  max-height: 10.5rem;
  overflow: auto;
  white-space: pre-line;
  color: #324b80;
  font-size: 0.84rem;
  line-height: 1.46;
}

.create-account-block {
  margin-top: 0.25rem;
  display: grid;
  gap: 0.5rem;
  padding: 0.78rem;
  border: 1px dashed rgba(53, 82, 166, 0.28);
  border-radius: 12px;
  background: rgba(235, 242, 255, 0.64);
}

.create-account-block .helper-text {
  margin-top: 0;
}

.login-recovery-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.login-recovery-row .ghost-btn {
  padding: 0.48rem 0.74rem;
  border-radius: 10px;
  font-size: 0.8rem;
}

.signup-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.7rem;
}

.login-back-btn {
  padding: 0.55rem 0.8rem;
  border-radius: 10px;
  font-size: 0.82rem;
}

.login-overlay[data-mode="signin"] .signup-divider,
.login-overlay[data-mode="signin"] .login-section-signup {
  display: none;
}

.login-overlay[data-mode="signup"] {
  place-items: start center;
}

.login-overlay[data-mode="signup"] .login-card {
  width: min(760px, 100%);
  grid-template-columns: 1fr;
  height: auto;
  min-height: auto;
  max-height: none;
  overflow: visible;
}

.login-overlay[data-mode="signup"] .login-hero,
.login-overlay[data-mode="signup"] .login-section-signin,
.login-overlay[data-mode="signup"] .login-side-info,
.login-overlay[data-mode="signup"] .signup-divider {
  display: none;
}

.login-overlay[data-mode="signup"] .login-forms {
  overflow: visible;
  padding: 1rem;
  background: transparent;
}

.login-overlay[data-mode="signup"] .login-section-signup {
  box-shadow: 0 20px 52px rgba(11, 26, 48, 0.18);
}

@media (max-width: 1120px) {
  .login-card {
    grid-template-columns: 1fr;
    min-height: auto;
    max-height: none;
    overflow: visible;
  }

  .login-hero {
    overflow: visible;
  }

  .login-hero-top {
    grid-template-columns: 1fr;
  }

  .login-hero-art {
    min-height: 11.4rem;
  }

  .login-hero-art-panel {
    min-height: 11.1rem;
    width: min(100%, 21.6rem);
    transform: rotateY(-3.4deg) rotateX(1.8deg) rotateZ(-0.42deg);
  }

  .login-hero-art-bg {
    inset: 0.8rem 0.4rem 0.2rem 1rem;
  }

  .login-forms {
    overflow: visible;
  }

  .login-module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .login-highlight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .login-hero {
    padding: 0.95rem 0.88rem 1rem;
  }

  .login-highlight-grid {
    grid-template-columns: 1fr;
  }

  .login-brand-row {
    gap: 0.6rem;
  }

  .login-brand-mark {
    width: 6.2rem;
    height: 4.4rem;
  }

  .login-module-overview-head {
    justify-content: flex-start;
  }

  .login-module-grid {
    grid-template-columns: 1fr;
  }

  .login-hero-art {
    min-height: 9.6rem;
  }

  .login-hero-art-panel {
    width: 100%;
    transform: none;
    min-height: 9.6rem;
  }

  .login-hero-art-bg {
    inset: 0.42rem 0.26rem 0.22rem 0.42rem;
  }

  .login-hero-float {
    display: none;
  }
}

.dialog-overlay {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: grid;
  place-items: center;
  padding: 1rem;
  overflow-y: auto;
  background: rgba(9, 18, 22, 0.48);
  backdrop-filter: blur(4px);
}

.dialog-overlay[hidden] {
  display: none;
}

.dialog-card {
  width: min(520px, 100%);
  background: rgba(255, 252, 245, 0.98);
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 20px;
  box-shadow: 0 20px 56px rgba(9, 26, 35, 0.24);
  padding: 1rem 1rem 1.05rem;
}

.dialog-heading {
  margin: 0 0 0.35rem;
}

.dialog-card .panel-heading.compact {
  margin-top: 0;
}

.dialog-card .helper-text {
  margin-top: 0;
}

.recovery-dialog {
  width: min(560px, 100%);
}

.replacement-master-quick-dialog {
  width: min(980px, 100%);
  max-height: calc(100dvh - 2rem);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.replacement-master-quick-host {
  min-height: 0;
  overflow-y: auto;
  padding-right: 0.15rem;
}

.replacement-master-quick-host .stack-form {
  margin: 0;
}

.replacement-master-quick-host #importCustomerCsvBtn,
.replacement-master-quick-host #importSupplierCsvBtn,
.replacement-master-quick-host #downloadItemSampleCsvBtn,
.replacement-master-quick-host #importItemCsvBtn {
  display: none !important;
}

.replacement-master-quick-footer {
  justify-content: flex-end;
}

.recovery-section {
  display: grid;
  gap: 0.62rem;
  padding: 0.72rem;
  border: 1px solid rgba(109, 124, 184, 0.2);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.62);
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  background: #ffffff;
  border-radius: 12px;
  padding: 0.78rem 0.9rem;
  color: var(--text);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
  transform: none;
  filter: none;
  backdrop-filter: none;
  text-shadow: none;
}

select:not([multiple]) {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-right: 2.1rem;
  background-color: #ffffff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%2334447A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.68rem center;
  background-size: 1rem 1rem;
}

select,
option {
  text-shadow: none;
}

input::placeholder,
textarea::placeholder {
  color: rgba(95, 107, 143, 0.4);
  font-weight: 500;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: rgba(111, 99, 255, 0.66);
  box-shadow: 0 0 0 4px rgba(111, 99, 255, 0.13);
  background: #ffffff;
}

.field-validation-error {
  border-color: rgba(194, 61, 64, 0.92) !important;
  box-shadow: 0 0 0 4px rgba(194, 61, 64, 0.14) !important;
}

textarea {
  resize: vertical;
}

label {
  display: grid;
  gap: 0.45rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: #4e5f95;
  letter-spacing: 0.01em;
}

.field-label-line {
  display: flex;
  align-items: center;
  gap: 0.28rem;
  flex-wrap: wrap;
  min-width: 0;
}

.field-required {
  color: #c43d3d;
  font-weight: 800;
  line-height: 1;
}

.field-optional {
  color: #7688b5;
  font-weight: 600;
  font-size: 0.76rem;
}

.icon-label {
  gap: 0.42rem;
}

.field-control {
  position: relative;
  display: flex;
  align-items: center;
}

.field-control .field-icon {
  position: absolute;
  left: 0.62rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.36rem;
  height: 1.36rem;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  color: rgba(85, 98, 155, 0.82);
  background: rgba(111, 99, 255, 0.08);
  border: 1px solid rgba(111, 99, 255, 0.15);
  pointer-events: none;
}

.field-control > input,
.field-control > select,
.field-control > textarea {
  padding-left: 2.6rem;
}

.field-control.is-searchable-select > .searchable-select-input {
  padding-right: 2.1rem;
  background-color: #ffffff;
}

.field-control.is-searchable-select > .searchable-select-native {
  position: absolute !important;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  border: 0;
  padding: 0;
}

.field-control.is-textarea {
  align-items: stretch;
}

.field-control.is-textarea .field-icon {
  top: 0.8rem;
  transform: none;
}

.field-control.is-textarea > textarea {
  min-height: 100px;
}

.checklist-hidden-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.checklist-toolbar {
  display: flex;
  gap: 0.4rem;
  margin: 0.35rem 0 0.45rem;
}

.checklist-toolbar .small-btn {
  min-height: 1.9rem;
  padding: 0.25rem 0.55rem;
  font-size: 0.76rem;
}

.checklist-box {
  border: 1px solid rgba(110, 124, 177, 0.32);
  border-radius: 14px;
  background: #ffffff;
  min-height: 110px;
  max-height: 180px;
  overflow: auto;
  padding: 0.45rem;
}

.checklist-box.compact {
  min-height: 110px;
  max-height: 160px;
}

.checklist-item {
  display: flex;
  align-items: center;
  gap: 0.48rem;
  margin: 0;
  padding: 0.38rem 0.42rem;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 600;
  color: #2d3b64;
}

.checklist-item:hover {
  background: rgba(100, 116, 188, 0.08);
}

.checklist-item input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
}

.checklist-item-text {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  flex-wrap: wrap;
}

.checklist-item-rate {
  color: #5b6ea6;
  font-size: 0.78rem;
  font-weight: 700;
}

.checklist-empty {
  padding: 0.55rem 0.5rem;
  color: #7080ab;
  font-size: 0.84rem;
  font-weight: 600;
}

h1,
h2,
h3 {
  margin: 0;
  color: var(--surface-ink);
}

p {
  margin: 0;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

table {
  width: 100%;
  border-collapse: collapse;
}

thead th {
  text-align: left;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 0.95rem 0.85rem;
  border-bottom: 1px solid var(--line);
}

tbody td {
  padding: 0.9rem 0.85rem;
  border-bottom: 1px solid rgba(20, 33, 61, 0.08);
  vertical-align: top;
}

.app-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: minmax(230px, 310px) minmax(320px, 1fr) auto;
  gap: 0.72rem;
  align-items: center;
  padding: 0.72rem clamp(0.9rem, 1.2vw, 1.35rem);
  backdrop-filter: blur(10px);
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 1px solid rgba(166, 182, 225, 0.28);
}

.app-header-brand {
  border: 1px solid rgba(156, 175, 223, 0.34);
  background: #ffffff;
  border-radius: 14px;
  padding: 0.52rem 0.72rem;
  display: inline-flex;
  align-items: center;
  gap: 0.72rem;
  color: var(--surface-ink);
  min-height: 3.2rem;
}

.app-header-brand-icon {
  width: 6.25rem;
  height: 2.95rem;
  border-radius: 12px;
  display: inline-grid;
  place-items: center;
  background: #ffffff;
  border: 1px solid rgba(126, 143, 208, 0.34);
  box-shadow: 0 2px 8px rgba(53, 84, 166, 0.16);
  overflow: hidden;
}

.app-header-brand-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transform: none;
  border-radius: 10px;
}

.app-header-brand-copy {
  display: grid;
  text-align: left;
  line-height: 1.15;
  gap: 0.14rem;
}

.app-header-brand-copy strong {
  font-size: 1.04rem;
  font-family: "Inter", "Manrope", sans-serif;
}

.app-header-brand-copy small {
  font-size: 0.8rem;
  color: #7285af;
  font-weight: 600;
}

.app-header-search {
  display: grid;
  grid-template-columns: auto minmax(220px, 1fr) auto auto;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid rgba(156, 175, 223, 0.34);
  border-radius: 14px;
  background: #ffffff;
  padding: 0.36rem 0.42rem;
  min-height: 3rem;
  width: min(100%, 880px);
  justify-self: start;
}

.app-header-search .field-icon,
.app-header-search-icon {
  color: #8499c8;
  font-size: 1rem;
  display: inline-grid;
  place-items: center;
  width: 1.74rem;
}

.app-header-search input {
  border: none;
  background: transparent;
  box-shadow: none;
  min-height: 2.2rem;
  padding: 0.2rem 0;
  font-size: 0.98rem;
  font-family: "Inter", "Manrope", sans-serif;
  color: #2d3a68;
}

.app-header-search input:focus {
  outline: none;
}

.app-header-search-shortcut {
  font-size: 0.84rem;
  font-weight: 700;
  color: #94a3c4;
  padding: 0 0.2rem;
  white-space: nowrap;
}

.app-search-btn {
  min-height: 2.2rem;
  padding: 0.42rem 0.88rem;
  border-radius: 11px;
  border-color: rgba(130, 151, 210, 0.34);
  color: #3556c5;
  background: #f9fbff;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.app-search-btn i:last-child {
  font-size: 0.72rem;
  margin-left: 0.14rem;
}

.page-shell {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: clamp(0.85rem, 1.2vw, 1.4rem);
  padding: clamp(0.8rem, 1vw, 1.2rem) clamp(0.9rem, 1.2vw, 1.35rem) clamp(1rem, 1.4vw, 1.45rem);
  align-items: start;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.page-shell > * {
  min-width: 0;
}

.page-shell.workspace-mode {
  grid-template-columns: minmax(0, 1fr);
}

.page-shell.workspace-mode .sidebar {
  display: none;
}

.page-shell.dashboard-only {
  grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
  align-items: start;
}

.page-shell.dashboard-only .sidebar {
  position: static;
  top: auto;
  align-self: start;
}

.sidebar {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
  position: static;
  align-self: start;
  height: 100%;
  max-height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.brand-panel,
.sidebar-card,
.panel-card {
  background: var(--surface);
  backdrop-filter: none;
  border: 1px solid rgba(133, 149, 220, 0.25);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.brand-panel {
  padding: clamp(1rem, 1vw, 1.25rem);
  position: static;
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  background:
    radial-gradient(circle at 88% 12%, rgba(111, 99, 255, 0.15), transparent 38%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.94), rgba(242, 246, 255, 0.95));
  border-radius: 28px;
  padding: 1.25rem 1.2rem 1.1rem;
}

.brand-panel:hover {
  transform: translateY(-1px);
  border-color: rgba(111, 99, 255, 0.34);
  box-shadow: 0 16px 34px rgba(86, 106, 190, 0.16);
}

.brand-panel h1 {
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(2.2rem, 4.1vw, 3.25rem);
  line-height: 0.98;
  margin-bottom: 0.9rem;
}

.lede {
  font-size: 1.04rem;
  line-height: 1.58;
  color: var(--muted);
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.74rem;
  font-weight: 800;
  color: var(--primary);
  margin-bottom: 0.55rem;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.6rem;
  position: static;
  top: auto;
  z-index: 4;
  gap: 0.62rem;
}

.summary-card {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(133, 149, 220, 0.2);
  border-radius: 18px;
  padding: 0.85rem 0.78rem;
  box-shadow: 0 10px 22px rgba(90, 109, 189, 0.1);
}

.dashboard-shortcut {
  cursor: pointer;
  transition: transform 0.14s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.dashboard-shortcut:hover {
  transform: translateY(-1px);
  border-color: rgba(111, 99, 255, 0.34);
  box-shadow: 0 14px 26px rgba(86, 106, 190, 0.16);
}

.dashboard-shortcut:focus-visible,
.brand-panel:focus-visible {
  outline: 3px solid rgba(111, 99, 255, 0.26);
  outline-offset: 2px;
}

.summary-card strong {
  display: block;
  font-size: clamp(1.32rem, 1.4vw, 1.55rem);
  font-family: "Space Grotesk", sans-serif;
  color: var(--accent);
  margin-top: 0.35rem;
}

.summary-label {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.sidebar-card,
.panel-card {
  padding: 1.35rem;
}

.panel-card {
  background:
    radial-gradient(circle at 96% -8%, rgba(111, 99, 255, 0.08), transparent 26%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 250, 255, 0.95));
}

.auth-toolbar {
  display: grid;
  justify-items: end;
  align-items: center;
  gap: 0.34rem;
  margin-bottom: 0;
}

.auth-toolbar-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.48rem;
  flex-wrap: wrap;
}

.auth-toolbar .helper-text {
  margin: 0;
  font-family: "Inter", "Manrope", sans-serif;
  font-size: 0.88rem;
  color: #5d6f9a;
  font-weight: 600;
  white-space: nowrap;
  text-align: right;
  width: 100%;
}

#headerDashboardBtn {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
}

.app-header .secondary-btn {
  min-height: 2.7rem;
  padding: 0.58rem 0.96rem;
  border-radius: 12px;
  border: 1px solid rgba(153, 171, 220, 0.34);
  background: #f5f8ff;
  color: #2f56be;
  font-weight: 700;
  font-family: "Inter", "Manrope", sans-serif;
}

.stack-form {
  display: grid;
  gap: 1rem;
}

.storage-card {
  display: grid;
  gap: 1rem;
  margin-bottom: 1.1rem;
  padding: 1rem;
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.48);
  border: 1px solid rgba(20, 33, 61, 0.08);
}

.storage-copy {
  margin-top: 0.35rem;
}

.storage-actions {
  margin-top: 0;
}

.license-input-wrap {
  display: grid;
  gap: 0.35rem;
  margin-top: 0.55rem;
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--surface-ink);
}

.license-input-wrap textarea {
  min-height: 92px;
  font-family: "Space Grotesk", sans-serif;
  font-size: 0.76rem;
  line-height: 1.4;
  letter-spacing: 0.02em;
}

.danger-btn {
  color: #a83b32;
  border-color: rgba(168, 59, 50, 0.25);
  background: rgba(168, 59, 50, 0.08);
}

.profile-logo-section {
  display: grid;
  gap: 0.9rem;
}

.business-settings-home {
  margin-bottom: 1rem;
}

.business-settings-panel {
  display: grid;
  gap: 0.75rem;
}

.business-settings-panel .panel-heading.compact {
  margin: 0.1rem 0 0.15rem;
}

.profile-media-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.profile-logo-actions {
  margin-top: 0;
  justify-content: flex-start;
}

.owner-integration-card {
  margin-top: 0.25rem;
}

.owner-integration-card .panel-heading.compact {
  margin-top: 0;
  margin-bottom: 0.55rem;
}

.owner-integration-card .user-form-status {
  margin-top: 0.2rem;
}

.owner-integration-card .action-row {
  margin-top: 0.35rem;
}

.interakt-key-card {
  margin-top: 1rem;
}

.interakt-key-card .action-row {
  justify-content: flex-start;
}

.gst-lookup-card {
  margin-top: 0.85rem;
}

.gst-lookup-card .action-row {
  justify-content: flex-start;
}

.gst-fetch-row {
  display: grid;
  gap: 0.45rem;
  align-content: start;
}

.gst-fetch-row .secondary-btn {
  width: fit-content;
}

.interakt-mode-fieldset {
  margin: 0;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  display: grid;
  gap: 0.6rem;
}

.interakt-mode-fieldset legend {
  padding: 0 0.25rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: #4e5f95;
}

.interakt-mode-option {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
}

.interakt-mode-option input[type="radio"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
}

.interakt-event-settings {
  display: grid;
  gap: 0.7rem;
}

.interakt-events-heading {
  margin-top: 0;
  margin-bottom: 0;
}

.interakt-event-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.interakt-module-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-bottom: 0.15rem;
}

.interakt-module-btn {
  border: 1px solid rgba(125, 138, 189, 0.38);
  background: #ffffff;
  color: #34457f;
  border-radius: 999px;
  padding: 0.48rem 0.95rem;
  font-weight: 700;
}

.interakt-module-btn.active {
  background: linear-gradient(135deg, #6f63ff, #5648df);
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 10px 20px rgba(80, 68, 224, 0.2);
}

.interakt-event-card {
  display: grid;
  gap: 0.65rem;
  border: 1px solid rgba(123, 139, 210, 0.24);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: 0 8px 18px rgba(40, 55, 96, 0.05);
  padding: 0.75rem;
}

.interakt-event-card[hidden] {
  display: none !important;
}

.interakt-event-card h4 {
  margin: 0;
  font-size: 1rem;
  color: var(--surface-ink);
}

.interakt-event-card .helper-text {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
}

.interakt-event-card .interakt-mode-fieldset {
  padding: 0.55rem 0.7rem;
  gap: 0.45rem;
}

.interakt-event-card .interakt-mode-option {
  font-size: 0.84rem;
  font-weight: 700;
}

.interakt-event-fields {
  display: grid;
  gap: 0.62rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.interakt-event-fields label {
  display: grid;
  gap: 0.32rem;
}

.interakt-variable-count-label {
  display: grid;
  gap: 0.32rem;
}

.interakt-variable-builder {
  display: grid;
  gap: 0.5rem;
  padding: 0.52rem;
  border: 1px dashed rgba(120, 138, 212, 0.3);
  border-radius: 10px;
  background: rgba(241, 246, 255, 0.68);
}

.interakt-variable-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.5rem;
}

.interakt-variable-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.1rem;
  padding: 0.3rem 0.42rem;
  border-radius: 8px;
  border: 1px solid rgba(115, 130, 196, 0.34);
  background: rgba(255, 255, 255, 0.9);
  color: #2d3f73;
  font-size: 0.78rem;
  font-weight: 800;
  font-family: "Space Grotesk", "Manrope", sans-serif;
}

.interakt-variable-empty {
  margin: 0;
}

.interakt-supported-fields {
  margin-top: -0.1rem;
  padding: 0.48rem 0.58rem;
  border: 1px dashed rgba(120, 138, 212, 0.28);
  border-radius: 10px;
  background: rgba(237, 243, 255, 0.6);
  font-size: 0.78rem;
  line-height: 1.45;
}

.interakt-supported-fields code {
  font-size: 0.78rem;
}

.interakt-event-fields input,
.interakt-event-fields textarea {
  font-size: 0.9rem;
}

.interakt-fixed-recipient {
  margin-top: -0.15rem;
}

.interakt-advanced-details {
  border: 1px solid rgba(125, 138, 189, 0.24);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.78);
  overflow: hidden;
}

.interakt-advanced-details > summary {
  cursor: pointer;
  padding: 0.74rem 0.92rem;
  font-weight: 700;
  color: var(--surface-ink);
  list-style: none;
}

.interakt-advanced-details > summary::-webkit-details-marker {
  display: none;
}

.interakt-advanced-details[open] > summary {
  border-bottom: 1px solid rgba(20, 33, 61, 0.08);
}

.interakt-advanced-body {
  padding: 0.78rem 0.9rem 0.9rem;
  display: grid;
  gap: 0.72rem;
}

.interakt-test-grid {
  margin-top: 0.15rem;
}

.logo-card {
  display: grid;
  gap: 0.75rem;
}

.logo-preview {
  min-height: 118px;
  display: grid;
  place-items: center;
  border: 1px dashed var(--line-strong);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.45);
  padding: 0.9rem;
  color: var(--muted);
  text-align: center;
}

.logo-preview.has-logo {
  border-style: solid;
}

.qr-preview.has-qr {
  border-style: solid;
}

.logo-preview img {
  display: none;
  max-width: 100%;
  max-height: 84px;
  object-fit: contain;
}

.qr-preview img {
  max-height: 148px;
}

.main-content {
  display: grid;
  gap: 1rem;
  min-width: 0;
  height: 100%;
  max-height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.module-focus-bar {
  display: grid;
  grid-template-columns: auto auto minmax(280px, 1fr);
  align-items: center;
  gap: 0.7rem;
  padding: 0.75rem 0.85rem;
  border-radius: 16px;
  border: 1px solid rgba(126, 144, 218, 0.26);
  background: linear-gradient(125deg, rgba(247, 250, 255, 0.98), rgba(236, 242, 255, 0.94));
  box-shadow: 0 12px 30px rgba(68, 88, 164, 0.12);
  position: sticky;
  top: 0.2rem;
  z-index: 14;
}

.module-focus-bar .secondary-btn,
.module-focus-bar .primary-btn {
  min-height: 2.2rem;
  padding: 0.45rem 0.8rem;
}

.module-focus-bar .secondary-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.module-focus-bar .primary-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.module-focus-label {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 800;
  color: #2f4687;
  letter-spacing: 0.025em;
  font-family: "Space Grotesk", "Manrope", sans-serif;
}

.module-focus-jump {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto;
  gap: 0.55rem;
  align-items: center;
}

.module-focus-jump input {
  min-height: 2.2rem;
}

.module-hub {
  display: grid;
  gap: 0.95rem;
}

.module-hub-header h2 {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: clamp(1.52rem, 1.7vw, 1.92rem);
  letter-spacing: 0.01em;
}

.module-hub-header .helper-text {
  margin: 0.35rem 0 0;
  font-size: 0.92rem;
  color: #5f6f99;
}

.module-hub-grid {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.module-hub-card {
  border-radius: 16px;
  padding: 0.8rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(245, 249, 255, 0.9));
  border: 1px solid rgba(122, 140, 213, 0.24);
  box-shadow: 0 10px 22px rgba(74, 96, 180, 0.1);
}

.module-hub-card .tab-group-title {
  margin-bottom: 0.6rem;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: 0.92rem;
  letter-spacing: 0.06em;
}

.module-hub-card .tab-group-title i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 999px;
  background: rgba(96, 117, 203, 0.16);
  color: #3556c5;
  margin-right: 0.32rem;
}

.module-hub-card[hidden] {
  display: none;
}

.module-hub-card.full-span {
  grid-column: 1 / -1;
}

.module-hub-actions {
  display: grid;
  gap: 0.5rem;
}

.module-hub-btn {
  width: 100%;
  border: 1px solid rgba(119, 136, 212, 0.26);
  background: rgba(255, 255, 255, 0.96);
  color: var(--surface-ink);
  padding: 0.56rem 0.78rem;
  border-radius: 12px;
  font-weight: 700;
  font-size: 0.9rem;
  line-height: 1.2;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.48rem;
  min-height: 2.2rem;
  transition: border-color 0.16s ease, background-color 0.16s ease, box-shadow 0.18s ease, transform 0.14s ease;
}

.module-hub-btn i {
  font-size: 0.9rem;
  color: #3554c9;
}

.module-hub-btn:hover {
  border-color: rgba(93, 113, 194, 0.42);
  background: rgba(241, 246, 255, 0.98);
  box-shadow: 0 8px 18px rgba(84, 105, 191, 0.16);
  transform: translateY(-1px);
}

.module-hub-btn:focus-visible {
  outline: 2px solid rgba(111, 99, 255, 0.34);
  outline-offset: 1px;
}

.workspace-home {
  padding: 1rem;
  border-radius: 18px;
  border: 1px solid rgba(170, 186, 226, 0.34);
  background: linear-gradient(180deg, #f6f9ff 0%, #f4f7ff 100%);
  box-shadow: 0 16px 34px rgba(57, 86, 160, 0.08);
  font-family: "Inter", "Manrope", sans-serif;
}

.workspace-home-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 1rem;
}

.workspace-home-main {
  display: grid;
  gap: 1rem;
}

.workspace-home-modules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}

.workspace-module-card {
  border: 1px solid rgba(168, 184, 224, 0.3);
  border-radius: 16px;
  padding: 0.9rem;
  background: #ffffff;
  box-shadow: 0 10px 20px rgba(71, 96, 160, 0.06);
}

.workspace-module-card-full {
  grid-column: 1 / -1;
}

.workspace-module-title {
  margin: 0 0 0.7rem;
  display: inline-flex;
  align-items: center;
  gap: 0.46rem;
  font-size: 1.02rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #274b9b;
}

.workspace-module-title i {
  width: 1.72rem;
  height: 1.72rem;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  color: #2c69dc;
  background: #eaf1ff;
}

.workspace-module-list {
  display: grid;
  gap: 0.56rem;
}

.workspace-module-item,
.workspace-mini-item,
.workspace-side-item {
  width: 100%;
  border: 1px solid rgba(173, 189, 228, 0.34);
  border-radius: 12px;
  background: #ffffff;
  min-height: 3rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.62rem;
  padding: 0.52rem 0.72rem;
  color: #234081;
  text-align: left;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.14s ease;
}

.workspace-module-item:hover,
.workspace-mini-item:hover,
.workspace-side-item:hover {
  border-color: rgba(90, 120, 200, 0.42);
  box-shadow: 0 10px 18px rgba(61, 87, 155, 0.13);
  transform: translateY(-1px);
}

.workspace-module-copy {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.workspace-module-copy strong {
  font-size: 1rem;
  font-weight: 700;
  color: #224184;
}

.workspace-module-copy small {
  font-size: 0.86rem;
  color: #667ba8;
}

.workspace-module-arrow {
  color: #7c91bf;
  font-size: 0.9rem;
}

.workspace-module-icon,
.workspace-side-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  font-size: 1rem;
  border: 1px solid transparent;
}

.workspace-module-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
}

.workspace-mini-item .workspace-module-copy strong {
  font-size: 0.93rem;
}

.workspace-mini-item .workspace-module-copy small {
  font-size: 0.8rem;
}

.workspace-home-side {
  display: grid;
  gap: 0.9rem;
  align-content: start;
}

.workspace-side-card {
  border: 1px solid rgba(168, 184, 224, 0.3);
  border-radius: 16px;
  padding: 0.95rem;
  background: #ffffff;
  box-shadow: 0 10px 20px rgba(71, 96, 160, 0.06);
  display: grid;
  gap: 0.7rem;
}

.workspace-side-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: #2b57bb;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

.workspace-side-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
}

.workspace-side-meta {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 700;
  color: #6c7ead;
}

.workspace-side-manage-btn {
  border: 1px solid rgba(162, 181, 226, 0.6);
  background: #f4f7ff;
  color: #305cc4;
  border-radius: 11px;
  padding: 0.42rem 0.7rem;
  font-size: 0.82rem;
  font-weight: 700;
}

.workspace-side-list {
  display: grid;
  gap: 0.56rem;
}

.workspace-side-item {
  min-height: 3.05rem;
  grid-template-columns: auto minmax(0, 1fr);
}

.workspace-side-item span:last-child {
  font-weight: 700;
  color: #29468b;
}

.workspace-favourite-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.44rem;
  align-items: center;
}

.workspace-favourite-remove {
  min-width: 2.22rem;
  min-height: 2.22rem;
  width: 2.22rem;
  height: 2.22rem;
  border-radius: 10px;
  border: 1px solid rgba(189, 102, 126, 0.3);
  background: #fff6f8;
  color: #c23a5b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
}

.workspace-favourite-remove:hover {
  background: #ffeef3;
}

.workspace-favourites-actions {
  display: flex;
  justify-content: flex-start;
}

.workspace-favourites-add-panel {
  display: grid;
  gap: 0.55rem;
  padding-top: 0.2rem;
  border-top: 1px dashed rgba(169, 187, 226, 0.45);
}

.workspace-favourites-add-panel .select-field {
  min-height: 2.5rem;
}

.workspace-favourites-add-panel .action-row {
  margin-top: 0;
}

.workspace-side-footer-btn {
  width: 100%;
  border: 1px solid rgba(173, 189, 228, 0.34);
  border-radius: 12px;
  background: #f5f8ff;
  color: #2d59c4;
  min-height: 2.7rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.44rem;
  font-weight: 700;
  text-decoration: none;
}

.workspace-side-help {
  margin: 0;
  color: #6b7ea9;
  font-size: 0.93rem;
  line-height: 1.5;
}

.workspace-activity-list {
  display: grid;
  gap: 0.44rem;
}

.workspace-activity-list .dashboard-timeline-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.5rem;
  align-items: center;
  border: 1px solid rgba(177, 193, 229, 0.34);
  border-radius: 12px;
  padding: 0.56rem 0.64rem;
  background: #fbfdff;
}

.workspace-activity-list .dashboard-timeline-item::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: #5a83eb;
}

.workspace-activity-list .dashboard-timeline-item strong {
  font-size: 0.9rem;
  font-weight: 700;
  color: #234387;
  margin: 0;
}

.workspace-activity-list .dashboard-timeline-item span {
  margin: 0;
  font-size: 0.81rem;
  color: #7488b4;
}

.workspace-activity-list .dashboard-timeline-item span:nth-of-type(1) {
  display: none;
}

.workspace-activity-list .dashboard-timeline-item span:nth-of-type(2) {
  justify-self: end;
  font-weight: 700;
  color: #7b8fb9;
  white-space: nowrap;
}

.workspace-activity-list .empty-state {
  border-radius: 12px;
  border: 1px dashed rgba(178, 192, 226, 0.5);
  padding: 0.8rem;
  text-align: center;
  color: #7a8db9;
}

.dashboard-shell {
  --ds-primary: #2962ff;
  --ds-primary-hover: #1e4fe0;
  --ds-primary-soft: #eef4ff;
  --ds-bg: #f7f9fc;
  --ds-card: #ffffff;
  --ds-border: #e4eaf3;
  --ds-heading: #16214a;
  --ds-subtext: #6b7a99;
  --ds-success: #1f9d55;
  --ds-success-soft: #e9f8ef;
  --ds-warning: #d97706;
  --ds-warning-soft: #fff4e5;
  --ds-danger: #dc2626;
  --ds-danger-soft: #fdecec;
  --ds-purple: #7c3aed;
  --ds-purple-soft: #f4edff;
  max-width: 1600px;
  margin: 0 auto;
  min-height: calc(100vh - 120px);
  padding: 0;
  background: var(--ds-bg);
  border: 1px solid var(--ds-border);
  border-radius: 20px;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.dashboard-shell-sidebar {
  background: #ffffff;
  border-right: 1px solid var(--ds-border);
  padding: 12px 12px 14px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
}

.dashboard-shell-brand {
  min-height: 60px;
  border: 1px solid var(--ds-border);
  border-radius: 12px;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}

.dashboard-shell-brand-logo {
  width: 54px;
  height: 40px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  background: #ffffff;
  border: 1px solid #d9e5f8;
}

.dashboard-shell-brand-logo img {
  width: 90%;
  height: 90%;
  object-fit: contain;
}

.dashboard-shell-brand-copy {
  display: grid;
  gap: 2px;
  line-height: 1.2;
}

.dashboard-shell-brand-copy strong {
  font-size: 17px;
  font-weight: 700;
  color: var(--ds-heading);
}

.dashboard-shell-brand-copy small {
  font-size: 12px;
  font-weight: 500;
  color: var(--ds-subtext);
}

.dashboard-shell-nav {
  min-height: 0;
  overflow-y: auto;
  display: grid;
  align-content: start;
  gap: 6px;
}

.dashboard-shell-nav-btn.tab-btn {
  width: 100%;
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: #ffffff;
  color: var(--ds-heading);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  text-align: left;
}

.dashboard-shell-nav-btn.tab-btn > span {
  min-width: 0;
}

.dashboard-shell-nav-btn.tab-btn > i:first-child {
  font-size: 18px;
  color: #5b76be;
}

.dashboard-shell-nav-btn.tab-btn > i:last-child {
  font-size: 14px;
  color: #8ea0c5;
}

.dashboard-shell-nav-btn.tab-btn.active {
  background: var(--ds-primary-soft);
  border-color: #d6e4ff;
  color: var(--ds-primary);
  box-shadow: inset 3px 0 0 var(--ds-primary);
}

.dashboard-shell-nav-btn.tab-btn.active > i:first-child {
  color: var(--ds-primary);
}

.dashboard-shell-nav-btn.tab-btn:hover {
  border-color: #d9e5fa;
  background: #f8fbff;
}

.dashboard-shell-label {
  margin: 10px 6px 2px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #7a89a8;
}

.dashboard-shell-label-inline {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dashboard-shell-label-inline span {
  text-transform: none;
  letter-spacing: 0;
  color: var(--ds-primary);
  font-size: 14px;
}

.dashboard-shell-nav-link {
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: 12px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  font-size: 16px;
  font-weight: 600;
  color: var(--ds-heading);
  text-decoration: none;
}

.dashboard-shell-nav-link i {
  font-size: 18px;
  color: #1f9d55;
}

.dashboard-shell-nav-link:hover {
  border-color: #d9e5fa;
  background: #f8fbff;
}

.dashboard-shell-collapse-btn {
  min-height: 44px;
  border: 1px solid var(--ds-border);
  border-radius: 12px;
  background: #f8faff;
  color: #5b72a6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
}

.dashboard-shell-main {
  padding: 18px;
  overflow: auto;
  display: grid;
  align-content: start;
  gap: 16px;
}

.dashboard-shell-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.dashboard-shell-head h2 {
  margin: 0;
  color: var(--ds-heading);
  font-size: 42px;
  font-weight: 700;
  line-height: 1.1;
}

.dashboard-shell-head p {
  margin: 6px 0 0;
  font-size: 14px;
  color: var(--ds-subtext);
}

.dashboard-shell-head p strong {
  color: var(--ds-heading);
}

.dashboard-shell-customize-btn.secondary-btn {
  min-height: 44px;
  border-radius: 14px;
  border-color: #dce5f3;
  background: #ffffff;
  color: var(--ds-primary);
  font-size: 15px;
  font-weight: 600;
}

.dashboard-shell-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.dashboard-shell-kpi-card {
  min-height: 120px;
  border: 1px solid #e8edf5;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
  padding: 16px 16px 14px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  text-align: left;
}

.dashboard-shell-kpi-card.tone-blue {
  border-color: #dbe7ff;
}

.dashboard-shell-kpi-card.tone-green {
  border-color: #d7ecdd;
}

.dashboard-shell-kpi-card.tone-amber {
  border-color: #f2dfc1;
}

.dashboard-shell-kpi-card.tone-violet {
  border-color: #e6dcff;
}

.dashboard-shell-kpi-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: inline-grid;
  place-items: center;
  font-size: 26px;
  border: 1px solid transparent;
}

.dashboard-shell-kpi-copy {
  display: grid;
  gap: 2px;
}

.dashboard-shell-kpi-copy p {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--ds-heading);
}

.dashboard-shell-kpi-copy strong {
  margin: 0;
  font-size: 38px;
  font-weight: 700;
  line-height: 1;
}

.dashboard-shell-kpi-card.tone-blue strong {
  color: #1f3fd6;
}

.dashboard-shell-kpi-card.tone-green strong {
  color: #1f9d55;
}

.dashboard-shell-kpi-card.tone-amber strong {
  color: #d97706;
}

.dashboard-shell-kpi-card.tone-violet strong {
  color: #7c3aed;
}

.dashboard-shell-kpi-copy span {
  margin: 0;
  color: #6b7a99;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}

.dashboard-shell-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.dashboard-shell-content-main {
  display: grid;
  gap: 14px;
}

.dashboard-shell-quick-card,
.dashboard-shell-module-card,
.dashboard-shell-side-card {
  border: 1px solid #e8edf5;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
}

.dashboard-shell-quick-card {
  padding: 16px;
  display: grid;
  gap: 12px;
}

.dashboard-shell-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid #dfe8fa;
  border-radius: 12px;
  background: #f3f7ff;
}

.dashboard-shell-section-head h3 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: var(--ds-heading);
}

.dashboard-shell-manage-btn {
  min-height: 36px;
  border: none;
  background: transparent;
  color: var(--ds-primary);
  font-size: 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.dashboard-shell-manage-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.dashboard-shell-quick-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dashboard-shell-section-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.dashboard-shell-section-card {
  padding: 14px;
  display: grid;
  gap: 10px;
}

.dashboard-shell-section-card .dashboard-shell-section-head h3 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--ds-heading);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.dashboard-shell-section-card .dashboard-shell-section-head h3 i {
  color: var(--ds-primary);
}

.dashboard-shell-section-tiles {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 10px;
}

.dashboard-shell-quick-tile {
  flex: 0 0 120px;
  width: 120px;
  max-width: 120px;
  min-height: 92px;
  border: 1px solid #dce5f3;
  border-radius: 16px;
  background: #f8fbff;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  padding: 8px;
}

.dashboard-shell-quick-tile > span {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-grid;
  place-items: center;
  font-size: 24px;
  border: 1px solid transparent;
}

.dashboard-shell-quick-tile > strong {
  font-size: 14px;
  font-weight: 600;
  color: var(--ds-heading);
  text-align: center;
  line-height: 1.2;
}

.dashboard-section-tile {
  flex: 0 0 120px;
  width: 120px;
  min-height: 92px;
  min-width: 120px;
  max-width: 120px;
}

.dashboard-section-tile > span {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  font-size: 24px;
}

.dashboard-section-tile > strong {
  text-align: center;
  font-size: 14px;
  line-height: 1.2;
}

.dashboard-shell-quick-tile:hover {
  border-color: #d6e4ff;
  box-shadow: 0 10px 20px rgba(41, 98, 255, 0.16);
  transform: translateY(-2px);
}

.dashboard-shell-quick-tile.tile-bg-blue {
  background: #f2f7ff;
  border-color: #dbe7ff;
}

.dashboard-shell-quick-tile.tile-bg-green {
  background: #f2fcf4;
  border-color: #d8efdd;
}

.dashboard-shell-quick-tile.tile-bg-violet {
  background: #f6f3ff;
  border-color: #e6defd;
}

.dashboard-shell-quick-tile.tile-bg-cyan {
  background: #f0fbff;
  border-color: #d8eff7;
}

.dashboard-shell-quick-tile.tile-bg-amber {
  background: #fff9ef;
  border-color: #f5e5c5;
}

.dashboard-shell-shortcuts-editor {
  border-top: 1px dashed #d7e1f4;
  padding-top: 12px;
}

.dashboard-shell-module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.dashboard-shell-module-card {
  padding: 12px;
  display: grid;
  gap: 8px;
}

.dashboard-shell-module-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.dashboard-shell-module-head h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--ds-heading);
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.dashboard-shell-module-head h3 i {
  color: var(--ds-primary);
}

.dashboard-shell-module-head span {
  min-width: 26px;
  min-height: 24px;
  border-radius: 999px;
  border: 1px solid #d8e4fb;
  background: #f4f8ff;
  color: #4062c5;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.dashboard-shell-module-item {
  width: 100%;
  min-height: 40px;
  border: 1px solid #e7edf8;
  border-radius: 12px;
  background: #ffffff;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  text-align: left;
}

.dashboard-shell-module-item span {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #203565;
  font-size: 14px;
  font-weight: 600;
}

.dashboard-shell-module-item span i {
  color: #5f7bc2;
}

.dashboard-shell-module-item i:last-child {
  color: #8ea0c5;
}

.dashboard-shell-module-item:hover {
  border-color: #d6e4ff;
}

.dashboard-shell-module-view-btn {
  min-height: 34px;
  border: none;
  background: transparent;
  color: var(--ds-primary);
  font-size: 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.dashboard-shell-content-side {
  display: grid;
  gap: 14px;
}

.dashboard-shell-side-card {
  padding: 14px;
}

.dashboard-shell-link-btn {
  border: none;
  background: transparent;
  color: var(--ds-primary);
  font-size: 14px;
  font-weight: 600;
  padding: 0;
}

.dashboard-shell-activity-list {
  display: grid;
  gap: 8px;
}

.dashboard-shell-activity-list .dashboard-timeline-item {
  min-height: 68px;
  border: 1px solid #e7edf8;
  border-radius: 14px;
  background: #fbfdff;
  padding: 10px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 10px;
  align-items: start;
}

.dashboard-shell-activity-list .dashboard-timeline-item::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #2f6de7;
  margin-top: 7px;
}

.dashboard-shell-activity-list .dashboard-timeline-item strong {
  grid-column: 2;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #1f356f;
  line-height: 1.3;
}

.dashboard-shell-activity-list .dashboard-timeline-item span {
  grid-column: 2;
  margin: 0;
  font-size: 13px;
  color: #6c7b9a;
  line-height: 1.25;
}

.dashboard-shell-activity-list .dashboard-timeline-item span:nth-of-type(2) {
  font-size: 12px;
  color: #8b98b3;
}

.dashboard-shell-shortcut-meta {
  margin: -2px 0 8px;
  color: #7c8cab;
  font-size: 12px;
  font-weight: 600;
}

.dashboard-favourite-tile-wrap {
  position: relative;
  display: inline-flex;
}

.dashboard-favourite-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid #f1cada;
  background: #fff5f9;
  color: #c4385b;
  font-size: 10px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  cursor: pointer;
}

.dashboard-favourite-remove:hover {
  background: #ffebf2;
  border-color: #ecb9cc;
}

.dashboard-add-shortcut-tile {
  border-style: dashed;
  border-color: #cedcf8;
  background: #f7faff;
  color: #335fcd;
}

.dashboard-add-shortcut-tile:disabled {
  opacity: 0.58;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

.dashboard-shortcuts-editor {
  margin-top: 10px;
  border-top: 1px dashed #d7e1f4;
  padding-top: 10px;
}

.dashboard-shortcuts-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.dashboard-shortcuts-controls select {
  min-width: 240px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid #d6e2f7;
  background: #fff;
  color: #22396f;
  padding: 0 11px;
  font-size: 13px;
  font-weight: 500;
}

.dashboard-shortcuts-action-btn {
  height: 38px;
  min-height: 38px;
  border-radius: 10px;
  padding: 0 14px;
  font-size: 13px;
}

.dashboard-shortcuts-status {
  margin: 8px 2px 0;
  min-height: 18px;
  font-size: 12px;
  font-weight: 600;
  color: #6b7a99;
}

.dashboard-shell-support-card {
  background: linear-gradient(145deg, #f4f8ff, #eaf1ff);
}

.dashboard-shell-support-card h3 {
  margin: 0;
  color: var(--ds-heading);
  font-size: 24px;
  font-weight: 700;
}

.dashboard-shell-support-card p {
  margin: 8px 0 12px;
  color: #5f7093;
  font-size: 14px;
}

.dashboard-shell-support-btn {
  min-height: 40px;
  border: 1px solid #cfe0ff;
  border-radius: 12px;
  background: #ffffff;
  color: #1f9d55;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 14px;
}

.dashboard-shell-support-btn i {
  font-size: 18px;
}

@media (max-width: 1500px) {
  .dashboard-shell-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-shell-quick-tile,
  .dashboard-section-tile {
    flex-basis: 112px;
    width: 112px;
    min-width: 112px;
    max-width: 112px;
  }

  .dashboard-shell-module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1280px) {
  .dashboard-shell {
    grid-template-columns: 1fr;
  }

  .dashboard-shell-sidebar {
    display: none;
  }

  .dashboard-shell-content-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-shell-content-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 960px) {
  .dashboard-shell-main {
    padding: 14px;
  }

  .dashboard-shell-head {
    flex-direction: column;
  }

  .dashboard-shell-head h2 {
    font-size: 30px;
  }

  .dashboard-shell-module-grid,
  .dashboard-shell-content-side {
    grid-template-columns: 1fr;
  }

  .dashboard-shell-quick-tile,
  .dashboard-section-tile {
    flex-basis: 104px;
    width: 104px;
    min-width: 104px;
    max-width: 104px;
  }

  .dashboard-shell-quick-tile > span,
  .dashboard-section-tile > span {
    width: 34px;
    height: 34px;
    font-size: 20px;
  }

  .dashboard-shell-quick-tile > strong,
  .dashboard-section-tile > strong {
    font-size: 13px;
  }

  .dashboard-shell-kpi-copy strong {
    font-size: 32px;
  }
}

@media (max-width: 640px) {
  .dashboard-shell {
    border-radius: 14px;
  }

  .dashboard-shell-kpi-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-shell-section-tiles {
    gap: 8px;
  }

  .dashboard-shell-quick-tile,
  .dashboard-section-tile {
    flex: 1 1 calc(50% - 4px);
    width: auto;
    min-width: 0;
    max-width: none;
  }

  .dashboard-shortcuts-controls select {
    min-width: 100%;
  }
}

.workspace-home-v2 {
  --dashboard-primary: #2962ff;
  --dashboard-primary-hover: #1e4fe0;
  --dashboard-primary-soft: #eef4ff;
  --dashboard-bg: #f7f9fc;
  --dashboard-card: #ffffff;
  --dashboard-border: #e4eaf3;
  --dashboard-heading: #16214a;
  --dashboard-subtext: #6b7a99;
  --dashboard-success: #1f9d55;
  --dashboard-success-soft: #e9f8ef;
  --dashboard-warning: #d97706;
  --dashboard-warning-soft: #fff4e5;
  --dashboard-danger: #dc2626;
  --dashboard-danger-soft: #fdecec;
  --dashboard-purple: #7c3aed;
  --dashboard-purple-soft: #f4edff;
  max-width: 1600px;
  margin: 0 auto;
  padding: 24px;
  border: 1px solid var(--dashboard-border);
  border-radius: 20px;
  background: var(--dashboard-bg);
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  display: grid;
  gap: 24px;
}

.workspace-home-v2 .workspace-dashboard-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.workspace-home-v2 .workspace-dashboard-title-wrap {
  display: grid;
  gap: 8px;
}

.workspace-home-v2 .workspace-dashboard-eyebrow {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--dashboard-primary);
}

.workspace-home-v2 .workspace-dashboard-title {
  margin: 0;
  font-size: clamp(34px, 4.2vw, 42px);
  line-height: 1.05;
  color: var(--dashboard-heading);
  font-weight: 700;
}

.workspace-home-v2 .workspace-dashboard-subtitle {
  margin: 0;
  font-size: 14px;
  color: var(--dashboard-subtext);
  line-height: 1.5;
}

.workspace-home-v2 .workspace-dashboard-subtitle strong {
  color: var(--dashboard-heading);
  font-weight: 700;
}

.workspace-home-v2 .workspace-dashboard-mode {
  border: 1px solid #dce5f3;
  background: #ffffff;
  color: #3658cc;
  border-radius: 14px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.workspace-home-v2 .dashboard-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.workspace-home-v2 .dashboard-kpi-card {
  border: 1px solid var(--dashboard-border);
  border-radius: 20px;
  background: var(--dashboard-card);
  min-height: 120px;
  padding: 18px 20px;
  text-align: left;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
}

.workspace-home-v2 .dashboard-kpi-card.tone-blue {
  border-color: #d9e6ff;
  background: #f9fbff;
}

.workspace-home-v2 .dashboard-kpi-card.tone-green {
  border-color: #d9efdf;
  background: #f7fcf9;
}

.workspace-home-v2 .dashboard-kpi-card.tone-amber {
  border-color: #f3dfc1;
  background: #fffaf2;
}

.workspace-home-v2 .dashboard-kpi-card.tone-violet {
  border-color: #e8ddff;
  background: #faf7ff;
}

.workspace-home-v2 .dashboard-kpi-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  border: 1px solid transparent;
  display: inline-grid;
  place-items: center;
  font-size: 24px;
}

.workspace-home-v2 .dashboard-kpi-copy {
  display: grid;
  gap: 4px;
}

.workspace-home-v2 .dashboard-kpi-copy p {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--dashboard-heading);
  line-height: 1.25;
}

.workspace-home-v2 .dashboard-kpi-copy strong {
  margin: 0;
  font-size: 38px;
  line-height: 1;
  font-weight: 700;
}

.workspace-home-v2 .dashboard-kpi-card.tone-blue strong {
  color: #2962ff;
}

.workspace-home-v2 .dashboard-kpi-card.tone-green strong {
  color: #1f9d55;
}

.workspace-home-v2 .dashboard-kpi-card.tone-amber strong {
  color: #d97706;
}

.workspace-home-v2 .dashboard-kpi-card.tone-violet strong {
  color: #7c3aed;
}

.workspace-home-v2 .dashboard-kpi-copy span {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #7c8daf;
}

.workspace-home-v2 .workspace-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  gap: 20px;
  align-items: start;
}

.workspace-home-v2 .workspace-dashboard-main {
  display: grid;
  gap: 20px;
}

.workspace-home-v2 .dashboard-quick-access-panel,
.workspace-home-v2 .dashboard-module-card,
.workspace-home-v2 .dashboard-side-card {
  border: 1px solid var(--dashboard-border);
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
}

.workspace-home-v2 .dashboard-quick-access-panel {
  padding: 20px;
  display: grid;
  gap: 16px;
}

.workspace-home-v2 .dashboard-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.workspace-home-v2 .dashboard-panel-head h3 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: var(--dashboard-heading);
}

.workspace-home-v2 .workspace-side-manage-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 42px;
  border-radius: 14px;
  padding: 0 15px;
  border: 1px solid #dce5f3;
  background: #ffffff;
  color: #3158c8;
  font-size: 14px;
  font-weight: 700;
}

.workspace-home-v2 .workspace-side-manage-btn:hover {
  border-color: #c9dafb;
  background: #f6f9ff;
}

.workspace-home-v2 .workspace-side-manage-btn.is-active {
  color: #ffffff;
  border-color: transparent;
  background: #2962ff;
}

.workspace-home-v2 .workspace-side-manage-btn:disabled {
  opacity: 0.62;
  cursor: not-allowed;
  box-shadow: none;
}

.workspace-home-v2 .dashboard-quick-access-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 12px;
}

.workspace-home-v2 .dashboard-quick-tile {
  width: 100%;
  min-height: 92px;
  border: 1px solid #e2e9f5;
  border-radius: 16px;
  background: #ffffff;
  padding: 10px 8px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  text-align: center;
  color: #213670;
}

.workspace-home-v2 .dashboard-quick-tile:hover {
  border-color: #cddfff;
  box-shadow: 0 12px 20px rgba(41, 98, 255, 0.12);
  transform: translateY(-2px);
}

.workspace-home-v2 .dashboard-quick-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid transparent;
  display: inline-grid;
  place-items: center;
  font-size: 22px;
}

.workspace-home-v2 .dashboard-quick-tile span:last-child {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}

.workspace-home-v2 .dashboard-shortcuts-editor {
  padding-top: 14px;
}

.workspace-home-v2 .dashboard-module-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.workspace-home-v2 .dashboard-module-card {
  padding: 16px;
  display: grid;
  gap: 14px;
}

.workspace-home-v2 .dashboard-module-head h3 {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 24px;
  font-weight: 700;
  color: var(--dashboard-heading);
}

.workspace-home-v2 .dashboard-module-head h3 i {
  color: #3b61d3;
}

.workspace-home-v2 .dashboard-module-list {
  display: grid;
  gap: 8px;
}

.workspace-home-v2 .dashboard-module-item {
  width: 100%;
  min-height: 44px;
  border: 1px solid #e6edf8;
  border-radius: 14px;
  background: #ffffff;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  color: #274182;
  text-align: left;
}

.workspace-home-v2 .dashboard-module-item span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  font-size: 14px;
  font-weight: 600;
}

.workspace-home-v2 .dashboard-module-item span i {
  color: #5a75c7;
}

.workspace-home-v2 .dashboard-module-item > i {
  color: #8ca0cb;
}

.workspace-home-v2 .workspace-dashboard-side {
  display: grid;
  gap: 16px;
}

.workspace-home-v2 .dashboard-side-card {
  padding: 16px;
}

.workspace-home-v2 .dashboard-link-btn {
  border: none;
  background: transparent;
  color: #2962ff;
  font-size: 14px;
  font-weight: 700;
  padding: 0;
}

.workspace-home-v2 .workspace-side-title {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: var(--dashboard-heading);
  text-transform: none;
  letter-spacing: 0;
}

.workspace-home-v2 .workspace-side-meta {
  font-size: 12px;
  color: #7788aa;
}

.workspace-home-v2 .workspace-side-list {
  gap: 10px;
}

.workspace-home-v2 .workspace-favourite-row {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.workspace-home-v2 .workspace-side-item {
  min-height: 42px;
  border-radius: 12px;
  border-color: #dfe7f3;
  background: #ffffff;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 6px 10px;
}

.workspace-home-v2 .workspace-side-icon {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  font-size: 15px;
}

.workspace-home-v2 .workspace-side-item span:last-child {
  font-size: 16px;
  font-weight: 600;
  color: #1f356e;
  line-height: 1.2;
}

.workspace-home-v2 .workspace-favourite-remove {
  min-width: 38px;
  min-height: 38px;
  width: 38px;
  height: 38px;
  border-radius: 10px;
}

.workspace-home-v2 .dashboard-activity-list {
  gap: 10px;
}

.workspace-home-v2 .dashboard-activity-list .dashboard-timeline-item {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px 10px;
  min-height: 68px;
  border-radius: 14px;
  padding: 10px 12px;
}

.workspace-home-v2 .dashboard-activity-list .dashboard-timeline-item strong {
  font-size: 18px;
  line-height: 1.28;
  color: #1f356d;
}

.workspace-home-v2 .dashboard-activity-list .dashboard-timeline-item span {
  font-size: 14px;
  line-height: 1.3;
}

.workspace-home-v2 .dashboard-activity-list .dashboard-timeline-item span:nth-of-type(1) {
  display: block;
  grid-column: 2;
}

.workspace-home-v2 .dashboard-activity-list .dashboard-timeline-item span:nth-of-type(2) {
  grid-column: 2;
  justify-self: start;
  font-size: 12px;
  color: #8b99b7;
}

.workspace-home-v2 .workspace-side-help {
  margin: 0;
  font-size: 14px;
  color: #6b7a99;
  line-height: 1.5;
}

.workspace-home-v2 .workspace-side-footer-btn {
  min-height: 46px;
  border-radius: 14px;
  border: 1px solid #dce5f3;
  background: #ffffff;
  color: #2f58cf;
  font-size: 14px;
  font-weight: 700;
}

.workspace-home-v2 .workspace-side-footer-btn:hover {
  border-color: #c9dafa;
  background: #f7faff;
}

@media (max-width: 1480px) {
  .workspace-home-v2 .dashboard-quick-access-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .workspace-home-v2 .dashboard-kpi-copy strong {
    font-size: 34px;
  }
}

@media (max-width: 1220px) {
  .workspace-home-v2 {
    padding: 18px;
  }

  .workspace-home-v2 .dashboard-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-home-v2 .workspace-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .workspace-home-v2 .workspace-dashboard-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 920px) {
  .workspace-home-v2 .dashboard-panel-head h3,
  .workspace-home-v2 .workspace-side-title,
  .workspace-home-v2 .dashboard-module-head h3 {
    font-size: 20px;
  }

  .workspace-home-v2 .dashboard-module-grid,
  .workspace-home-v2 .workspace-dashboard-side {
    grid-template-columns: 1fr;
  }

  .workspace-home-v2 .dashboard-quick-access-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .workspace-home-v2 {
    padding: 14px;
    gap: 16px;
    border-radius: 16px;
  }

  .workspace-home-v2 .workspace-dashboard-head {
    align-items: start;
    flex-direction: column;
  }

  .workspace-home-v2 .workspace-dashboard-mode {
    align-self: flex-start;
  }

  .workspace-home-v2 .workspace-dashboard-title {
    font-size: 30px;
  }

  .workspace-home-v2 .dashboard-kpi-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .workspace-home-v2 .dashboard-kpi-copy strong {
    font-size: 32px;
  }

  .workspace-home-v2 .dashboard-quick-access-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-home-v2 .workspace-side-manage-btn {
    width: 100%;
    justify-content: center;
  }
}

#tab-quotation-home {
  --qh-bg-main: #f7f9ff;
  --qh-sidebar-bg: #ffffff;
  --qh-card-bg: #ffffff;
  --qh-primary: #3f46f4;
  --qh-primary-dark: #1e2a78;
  --qh-primary-light: #eef2ff;
  --qh-text-main: #071b52;
  --qh-text-secondary: #4e6394;
  --qh-text-muted: #7b8db8;
  --qh-border: #dde6fa;
  --qh-shadow: 0 14px 35px rgba(20, 40, 90, 0.08);
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--qh-text-main);
}

.quotation-home-dashboard {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  min-height: calc(100vh - 104px);
  background: var(--qh-bg-main);
  border: 1px solid rgba(221, 230, 250, 0.92);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 42px rgba(20, 40, 90, 0.06);
}

.quotation-home-sidebar {
  width: 240px;
  min-width: 240px;
  background: var(--qh-sidebar-bg);
  border-right: 1px solid var(--qh-border);
  padding: 24px 14px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 22px;
  align-content: start;
}

.quotation-home-brand {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--qh-text-main);
  text-align: left;
  padding: 0 6px;
  min-height: 40px;
}

.quotation-home-brand-mark {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
}

.quotation-home-brand-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.quotation-home-brand strong,
.quotation-home-profile strong {
  display: block;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--qh-text-main);
}

.quotation-home-brand small,
.quotation-home-profile small {
  display: block;
  min-width: 0;
  font-size: 11px;
  color: var(--qh-text-secondary);
  line-height: 1.35;
}

.quotation-home-nav {
  display: grid;
  gap: 8px;
  align-content: start;
}

.quotation-home-nav-item {
  height: 56px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--qh-text-main);
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  font-size: 15px;
  font-weight: 500;
  text-align: left;
}

.quotation-home-nav-item i {
  color: #4e6394;
  font-size: 16px;
}

.quotation-home-nav-item.active {
  background: linear-gradient(90deg, #eef2ff, #f4f6ff);
  color: #203bff;
}

.quotation-home-nav-item.active i {
  color: #203bff;
}

.quotation-home-sidebar-note {
  border: 1px solid var(--qh-border);
  border-radius: 14px;
  background: #fbfcff;
  padding: 16px 14px;
  display: grid;
  justify-items: start;
  gap: 8px;
  color: var(--qh-text-secondary);
}

.quotation-home-sidebar-note span {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  color: var(--qh-primary);
  background: var(--qh-primary-light);
}

.quotation-home-sidebar-note strong {
  color: var(--qh-text-main);
  font-size: 13px;
}

.quotation-home-sidebar-note small {
  font-size: 12px;
  line-height: 1.45;
}

.quotation-home-main {
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  align-content: start;
}

.quotation-home-topbar {
  min-height: 74px;
  background: #ffffff;
  border-bottom: 1px solid var(--qh-border);
  padding: 10px 24px;
  display: grid;
  grid-template-columns: minmax(280px, 640px) auto;
  gap: 18px;
  align-items: center;
}

.quotation-home-search-box {
  height: 52px;
  border: 1px solid var(--qh-border);
  border-radius: 12px;
  background: #ffffff;
  padding: 0 10px 0 18px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  color: var(--qh-text-muted);
  box-shadow: 0 8px 20px rgba(20, 40, 90, 0.04);
}

.quotation-home-search-box input {
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--qh-text-main);
  min-height: 42px;
  font: 500 13px "Inter", "Manrope", sans-serif;
  min-width: 0;
}

.quotation-home-search-box span {
  background: #f4f6ff;
  color: var(--qh-primary);
  border-radius: 7px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.quotation-home-search-box button,
.quotation-home-icon-btn {
  width: 36px;
  height: 36px;
  border: 1px solid var(--qh-border);
  border-radius: 999px;
  background: #ffffff;
  color: var(--qh-primary-dark);
  display: inline-grid;
  place-items: center;
}

.quotation-home-toolbar {
  display: inline-grid;
  grid-auto-flow: column;
  align-items: center;
  justify-content: end;
  gap: 12px;
  min-width: 0;
}

.quotation-home-profile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 210px;
  padding-left: 14px;
  border-left: 1px solid var(--qh-border);
}

.quotation-home-profile > span {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(135deg, #7166ff, #8a7dff);
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
}

.quotation-home-body,
.quotation-home-settings-panel {
  margin: 0;
  padding: 28px 36px;
}

.quotation-home-body {
  display: grid;
  gap: 24px;
}

.quotation-home-heading-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
}

.quotation-home-heading-row h1 {
  margin: 0;
  font-size: 30px;
  font-weight: 700;
  color: var(--qh-text-main);
  line-height: 1.15;
}

.quotation-home-heading-row p {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--qh-text-secondary);
}

.quotation-home-heading-actions {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 12px;
}

.quotation-home-primary-btn,
.quotation-home-secondary-btn {
  height: 52px;
  border-radius: 10px;
  padding: 0 26px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  white-space: nowrap;
  border: 1px solid transparent;
}

.quotation-home-primary-btn {
  background: linear-gradient(135deg, #3f46f4, #5b5ff8);
  color: #ffffff;
  box-shadow: 0 12px 25px rgba(63, 70, 244, 0.22);
}

.quotation-home-secondary-btn {
  background: #ffffff;
  border-color: var(--qh-border);
  color: #1e3a8a;
}

.quotation-home-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.quotation-home-stat-card,
.quotation-home-card {
  background: var(--qh-card-bg);
  border: 1px solid var(--qh-border);
  border-radius: 14px;
  box-shadow: var(--qh-shadow);
}

.quotation-home-stat-card {
  min-height: 130px;
  padding: 24px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 18px;
}

.quotation-home-stat-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: inline-grid;
  place-items: center;
  font-size: 22px;
}

.quotation-home-stat-card small {
  display: block;
  font-size: 13px;
  color: var(--qh-text-secondary);
  font-weight: 700;
  margin-bottom: 5px;
}

.quotation-home-stat-card strong {
  display: block;
  color: var(--qh-text-main);
  font-size: 30px;
  line-height: 1;
  font-weight: 800;
}

.quotation-home-stat-card span:not(.quotation-home-stat-icon) {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  color: #178f62;
  font-weight: 700;
}

.quotation-home-stat-card span.is-warning {
  color: #cf6d16;
}

.quotation-home-stat-card span.is-muted {
  color: var(--qh-text-muted);
}

.quotation-home-actions {
  padding: 20px;
}

.quotation-home-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.quotation-home-section-head h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--qh-text-main);
}

.quotation-home-link-btn {
  border: 0;
  background: transparent;
  color: var(--qh-primary);
  font-size: 13px;
  font-weight: 800;
  padding: 4px 0;
}

.quotation-home-action-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.quotation-home-action-card {
  min-height: 112px;
  padding: 20px;
  border-radius: 14px;
  border: 1px solid var(--qh-border);
  background: #ffffff;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  text-align: left;
  color: var(--qh-text-main);
}

.quotation-home-action-card.featured {
  color: #ffffff;
  border-color: transparent;
  background: linear-gradient(135deg, #3f46f4, #5b5ff8);
  box-shadow: 0 16px 28px rgba(63, 70, 244, 0.2);
}

.quotation-home-action-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-grid;
  place-items: center;
  font-size: 20px;
  background: rgba(255, 255, 255, 0.18);
  color: inherit;
}

.quotation-home-action-card:not(.featured) .quotation-home-action-icon {
  background: #eef6ff;
}

.quotation-home-action-card strong,
.quotation-home-template-item strong {
  display: block;
  font-size: 14px;
  font-weight: 800;
  color: inherit;
}

.quotation-home-action-card small,
.quotation-home-template-item small {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.45;
  color: currentColor;
  opacity: 0.74;
}

.quotation-home-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 14px;
  align-items: start;
}

.quotation-home-table-card,
.quotation-home-templates {
  padding: 20px;
}

.quotation-home-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--qh-border);
  border-radius: 14px;
}

.quotation-home-table-wrap table {
  width: 100%;
  min-width: 700px;
  border-collapse: collapse;
  background: #ffffff;
}

.quotation-home-table-wrap th {
  font-size: 13px;
  font-weight: 600;
  color: var(--qh-text-secondary);
  background: #fafbff;
  padding: 14px 16px;
  text-align: left;
  border-bottom: 1px solid var(--qh-border);
}

.quotation-home-table-wrap td {
  font-size: 14px;
  color: var(--qh-text-main);
  padding: 14px 16px;
  border-top: 1px solid #e6edfa;
  vertical-align: middle;
}

.quotation-home-table-wrap td strong {
  color: var(--qh-primary);
}

.quotation-home-row-action {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--qh-primary-dark);
  display: inline-grid;
  place-items: center;
}

.quotation-home-row-action:hover {
  background: var(--qh-primary-light);
}

.quotation-home-table-meta {
  margin: 14px 0 0;
  font-size: 13px;
  color: var(--qh-text-secondary);
}

.quotation-home-templates {
  display: grid;
  gap: 10px;
}

.quotation-home-template-item {
  width: 100%;
  min-height: 72px;
  border: 1px solid #e6edfa;
  border-radius: 12px;
  background: #ffffff;
  padding: 12px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  text-align: left;
  color: var(--qh-text-main);
}

.quotation-home-template-item > span:first-child {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
}

.quotation-home-template-item.is-active {
  border-color: rgba(63, 70, 244, 0.4);
  background: linear-gradient(90deg, #ffffff, #f7f9ff);
  box-shadow: 0 10px 20px rgba(20, 40, 90, 0.06);
}

.quotation-home-create-template {
  height: 52px;
  border-radius: 10px;
  border: 1px solid var(--qh-border);
  background: linear-gradient(180deg, #ffffff, #f7f9ff);
  color: var(--qh-primary);
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.quotation-home-settings-panel {
  background: var(--qh-card-bg);
  border: 1px solid var(--qh-border);
  border-radius: 14px;
  box-shadow: var(--qh-shadow);
}

@media (max-width: 1180px) {
  .quotation-home-stat-grid,
  .quotation-home-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .quotation-home-content-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 920px) {
  .quotation-home-dashboard {
    grid-template-columns: 1fr;
  }

  .quotation-home-sidebar {
    width: 100%;
    min-width: 0;
    border-right: 0;
    border-bottom: 1px solid var(--qh-border);
    grid-template-rows: auto auto;
  }

  .quotation-home-sidebar-note {
    display: none;
  }

  .quotation-home-nav {
    grid-auto-flow: column;
    grid-auto-columns: minmax(150px, 1fr);
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .quotation-home-topbar {
    grid-template-columns: 1fr;
  }

  .quotation-home-toolbar {
    justify-content: start;
  }

  .quotation-home-heading-row {
    grid-template-columns: 1fr;
  }

  .quotation-home-heading-actions {
    justify-content: start;
  }
}

@media (max-width: 640px) {
  .quotation-home-dashboard {
    border-radius: 14px;
  }

  .quotation-home-sidebar,
  .quotation-home-topbar,
  .quotation-home-body,
  .quotation-home-settings-panel {
    padding: 16px;
  }

  .quotation-home-search-box {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .quotation-home-search-box span {
    display: none;
  }

  .quotation-home-toolbar {
    grid-auto-flow: row;
    grid-template-columns: repeat(2, auto) minmax(0, 1fr);
    width: 100%;
  }

  .quotation-home-profile {
    min-width: 0;
  }

  .quotation-home-heading-actions,
  .quotation-home-stat-grid,
  .quotation-home-action-grid {
    grid-template-columns: 1fr;
    grid-auto-flow: row;
    width: 100%;
  }

  .quotation-home-primary-btn,
  .quotation-home-secondary-btn {
    width: 100%;
  }

  .quotation-home-stat-card,
  .quotation-home-action-card {
    padding: 18px;
  }
}

#tab-invoice-home,
#tab-partner-sync,
#tab-payment-home,
#tab-renewal-home,
#tab-ledger-home,
#tab-item-home,
#tab-bundle-home,
#tab-stock-home,
#tab-serial-home,
#tab-todo-home,
#tab-attendance-home,
#tab-replacement-home {
  --ph-bg-main: #f7f9ff;
  --ph-sidebar-bg: #ffffff;
  --ph-card-bg: #ffffff;
  --ph-primary: #3f46f4;
  --ph-primary-dark: #1e2a78;
  --ph-primary-light: #eef2ff;
  --ph-text-main: #071b52;
  --ph-text-secondary: #4e6394;
  --ph-text-muted: #7b8db8;
  --ph-border: #dde6fa;
  --ph-shadow: 0 14px 35px rgba(20, 40, 90, 0.08);
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ph-text-main);
}

.payment-home-dashboard {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  min-height: calc(100vh - 104px);
  background: var(--ph-bg-main);
  border: 1px solid rgba(221, 230, 250, 0.92);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 42px rgba(20, 40, 90, 0.06);
}

.payment-home-sidebar {
  width: 240px;
  min-width: 240px;
  background: var(--ph-sidebar-bg);
  border-right: 1px solid var(--ph-border);
  padding: 24px 14px;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 20px;
  align-content: start;
}

.payment-home-brand {
  width: 100%;
  min-height: 40px;
  border: 0;
  padding: 0 6px;
  background: transparent;
  color: var(--ph-text-main);
  text-align: left;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}

.payment-home-brand-mark {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
}

.payment-home-brand-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.payment-home-brand strong,
.payment-home-profile strong {
  display: block;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--ph-text-main);
}

.payment-home-brand small,
.payment-home-profile small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.35;
  color: var(--ph-text-secondary);
}

.payment-home-nav {
  display: grid;
  align-content: start;
  gap: 8px;
}

.payment-home-nav-item {
  height: 56px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--ph-text-main);
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  font-size: 15px;
  font-weight: 500;
  text-align: left;
}

.payment-home-nav-item i {
  color: #4e6394;
  font-size: 16px;
}

.payment-home-nav-item.active {
  background: linear-gradient(90deg, #eef2ff, #f4f6ff);
  color: #203bff;
}

.payment-home-nav-item.active i {
  color: #203bff;
}

.payment-home-main {
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr;
}

.module-home-main-pane {
  min-width: 0;
  padding: 24px;
  display: grid;
  align-content: start;
}

.payment-home-topbar {
  min-height: 74px;
  background: #ffffff;
  border-bottom: 1px solid var(--ph-border);
  padding: 10px 24px;
  display: grid;
  grid-template-columns: minmax(260px, 640px) auto;
  align-items: center;
  gap: 18px;
}

.payment-home-search-box {
  height: 52px;
  border: 1px solid var(--ph-border);
  border-radius: 12px;
  background: #ffffff;
  padding: 0 10px 0 18px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  color: #8ca1cd;
  box-shadow: 0 8px 20px rgba(20, 40, 90, 0.04);
}

.payment-home-search-box input {
  border: 0;
  outline: 0;
  background: transparent;
  min-width: 0;
  min-height: 42px;
  padding: 0;
  color: var(--ph-text-main);
  font: 500 13px "Inter", "Manrope", sans-serif;
  box-shadow: none;
}

.payment-home-search-box span {
  border-radius: 7px;
  background: #f4f6ff;
  color: var(--ph-primary);
  font-size: 11px;
  font-weight: 700;
  padding: 4px 8px;
  white-space: nowrap;
}

.payment-home-search-box button,
.payment-home-icon-btn {
  width: 36px;
  height: 36px;
  border: 1px solid var(--ph-border);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ph-primary-dark);
  display: inline-grid;
  place-items: center;
  padding: 0;
}

.payment-home-toolbar {
  min-width: 0;
  display: inline-grid;
  grid-auto-flow: column;
  align-items: center;
  justify-content: end;
  gap: 12px;
}

.payment-home-jump-btn {
  height: 44px;
  border: 1px solid var(--ph-border);
  border-radius: 10px;
  background: #ffffff;
  color: var(--ph-primary-dark);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.payment-home-jump-btn i:first-child {
  color: var(--ph-primary);
}

.payment-home-icon-btn {
  position: relative;
}

.payment-home-icon-btn em {
  position: absolute;
  top: -4px;
  right: -3px;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #f43f5e;
  color: #ffffff;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  display: inline-grid;
  place-items: center;
}

.payment-home-profile {
  min-width: 220px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border-left: 1px solid var(--ph-border);
  padding-left: 14px;
}

.payment-home-profile > span {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
}

.payment-home-profile > i {
  color: #6a80b3;
}

.payment-home-body {
  margin: 0;
  padding: 28px 36px;
  display: grid;
  gap: 24px;
}

.payment-home-heading-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
}

.payment-home-heading-row h1 {
  margin: 0;
  font-size: 30px;
  line-height: 1.08;
  letter-spacing: 0;
  color: var(--ph-text-main);
  font-weight: 700;
}

.payment-home-heading-row p {
  margin: 8px 0 0;
  font-size: 13px;
  color: var(--ph-text-secondary);
  font-weight: 500;
}

.payment-home-heading-actions {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 12px;
}

.payment-home-primary-btn,
.payment-home-secondary-btn {
  height: 52px;
  border-radius: 10px;
  padding: 0 26px;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 600;
  white-space: nowrap;
}

.payment-home-primary-btn {
  background: linear-gradient(135deg, #3f46f4, #5b5ff8);
  color: #ffffff;
  box-shadow: 0 12px 25px rgba(63, 70, 244, 0.22);
}

.payment-home-secondary-btn {
  background: #ffffff;
  border-color: var(--ph-border);
  color: #1e3a8a;
}

.payment-home-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.payment-home-card,
.payment-home-stat-card {
  background: var(--ph-card-bg);
  border: 1px solid var(--ph-border);
  border-radius: 14px;
  box-shadow: var(--ph-shadow);
}

.payment-home-stat-card {
  min-height: 130px;
  padding: 24px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 18px;
}

.payment-home-stat-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: inline-grid;
  place-items: center;
  font-size: 22px;
}

.payment-home-stat-card small {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--ph-text-main);
  margin-bottom: 8px;
  line-height: 1.25;
}

.payment-home-stat-card strong {
  display: block;
  font-size: 46px;
  line-height: 1;
  color: var(--ph-text-main);
  font-weight: 700;
}

.payment-home-stat-card > div {
  min-width: 0;
}

#paymentHomeRecoveredAmount {
  font-size: clamp(24px, 1.8vw, 38px);
  line-height: 1.08;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.payment-home-stat-card span:not(.payment-home-stat-icon) {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  color: #16a34a;
  font-weight: 600;
}

.payment-home-stat-card span.is-warning {
  color: #f59e0b;
}

.payment-home-stat-card span.is-muted {
  color: var(--ph-text-muted);
}

.payment-home-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 350px);
  gap: 14px;
  align-items: start;
}

.serial-home-stat-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(1) {
  background: #fcfbff;
  border-color: #ddd8ff;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(1) strong {
  color: #5b4ff8;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(2) {
  background: #f8fdf9;
  border-color: #cfeedd;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(2) strong {
  color: #16934a;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(3) {
  background: #f8fbff;
  border-color: #d7e7ff;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(3) strong {
  color: #2563eb;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(4) {
  background: #fffaf4;
  border-color: #f6dfc7;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(4) strong {
  color: #ea8a00;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(5) {
  background: #fbfaff;
  border-color: #e2ddff;
}

.serial-home-stat-grid .payment-home-stat-card:nth-child(5) strong {
  color: #634cf7;
}

.serial-home-stat-grid .payment-home-stat-card[data-serial-home-stat] {
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.serial-home-stat-grid .payment-home-stat-card[data-serial-home-stat]:hover {
  border-color: #cbd9fb;
  box-shadow: 0 14px 30px rgba(20, 40, 90, 0.12);
  transform: translateY(-1px);
}

.serial-home-stat-grid .payment-home-stat-card[data-serial-home-stat]:focus-visible {
  outline: 2px solid #3f46f4;
  outline-offset: 2px;
}

.serial-home-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(300px, 1fr);
  gap: 16px;
  align-items: start;
}

.invoice-home-eyebrow {
  margin: 0 0 4px;
  color: #4b56d9;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.invoice-home-stat-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(1) {
  background: #fcfbff;
  border-color: #ddd8ff;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(1) strong {
  color: #5b4ff8;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(2) {
  background: #fffaf4;
  border-color: #f6dfc7;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(2) strong {
  color: #ea8a00;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(3) {
  background: #f8fbff;
  border-color: #d7e7ff;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(3) strong {
  color: #2563eb;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(4) {
  background: #f8fdf9;
  border-color: #cfeedd;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(4) strong {
  color: #16934a;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(5) {
  background: #fbfaff;
  border-color: #e2ddff;
}

.invoice-home-stat-grid .payment-home-stat-card:nth-child(5) strong {
  color: #634cf7;
}

.invoice-home-stat-grid .payment-home-stat-card[data-invoice-home-stat] {
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.invoice-home-stat-grid .payment-home-stat-card[data-invoice-home-stat]:hover {
  border-color: #cbd9fb;
  box-shadow: 0 14px 30px rgba(20, 40, 90, 0.12);
  transform: translateY(-1px);
}

.invoice-home-stat-grid .payment-home-stat-card[data-invoice-home-stat]:focus-visible {
  outline: 2px solid #3f46f4;
  outline-offset: 2px;
}

#invoiceHomeBilledAmount {
  font-size: clamp(18px, 1.35vw, 28px);
  line-height: 1.06;
  letter-spacing: -0.01em;
  white-space: nowrap;
  max-width: 100%;
}

.invoice-home-content-grid .serial-home-action-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.invoice-home-content-grid {
  grid-template-columns: minmax(0, 2.15fr) minmax(320px, 0.95fr);
  gap: 18px;
}

.invoice-home-quick-actions-card {
  padding: 12px;
}

.invoice-home-quick-actions-card .serial-home-action-grid {
  gap: 10px;
}

.invoice-home-quick-actions-card .replacement-home-action-tile {
  min-height: 116px;
  padding: 0.76rem;
  border-radius: 12px;
}

.invoice-home-quick-actions-card .replacement-home-action-icon {
  width: 54px;
  height: 54px;
  font-size: 1.35rem;
}

.invoice-home-quick-actions-card .replacement-home-action-copy strong {
  font-size: 1.03rem;
}

.invoice-home-quick-actions-card .replacement-home-action-copy small {
  font-size: 0.88rem;
  line-height: 1.3;
}

.invoice-home-customer-card .payment-home-section-head h2 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.invoice-home-customer-card .payment-home-section-head {
  flex-wrap: wrap;
  row-gap: 8px;
}

.invoice-home-customer-card {
  padding: 14px;
}

.invoice-home-customer-card .payment-home-link-btn {
  margin-left: auto;
  white-space: nowrap;
}

.invoice-home-customer-table-wrap {
  max-height: 320px;
  overflow: auto;
}

.invoice-home-activity-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: 560px;
  overflow: hidden;
}

.invoice-home-activity-card .serial-home-activity-list {
  max-height: 480px;
  overflow-y: auto;
  padding-right: 4px;
}

.invoice-home-customer-table-wrap table {
  min-width: 660px;
}

.invoice-home-customer-table-wrap th {
  padding: 12px 14px;
  font-size: 12px;
}

.invoice-home-customer-table-wrap td {
  padding: 12px 14px;
  font-size: 13px;
}

.invoice-home-customer-table-wrap th:first-child,
.invoice-home-customer-table-wrap td:first-child {
  text-align: left;
}

.invoice-home-customer-table-wrap th:nth-child(n + 2),
.invoice-home-customer-table-wrap td:nth-child(n + 2) {
  text-align: right;
  white-space: nowrap;
}

.invoice-home-customer-table-wrap td:nth-child(4) {
  font-weight: 700;
}

.invoice-home-insights-card .serial-home-insight-head strong {
  font-size: 24px;
}

.invoice-home-insights-card .serial-home-insight-head span {
  font-size: 15px;
}

.partner-sync-body {
  gap: 16px;
}

.partner-sync-hero-card {
  padding: 22px 24px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}

.partner-sync-eyebrow {
  margin: 0 0 4px;
  color: #4b56d9;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.partner-sync-hero-copy h1 {
  margin: 0;
  font-size: 38px;
  line-height: 1.1;
  color: #071b52;
}

.partner-sync-hero-copy p {
  margin: 8px 0 0;
  color: #4e6394;
  font-size: 15px;
  font-weight: 500;
}

.partner-sync-hero-phase {
  display: inline-grid;
  grid-auto-flow: column;
  align-items: center;
  gap: 8px;
  padding: 6px;
  border-radius: 999px;
  background: #f3f5ff;
  border: 1px solid #e0e6ff;
}

.partner-sync-hero-phase span,
.partner-sync-hero-phase strong {
  border-radius: 999px;
  padding: 9px 14px;
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

.partner-sync-hero-phase span {
  background: #ecefff;
  color: #4f46e5;
  font-weight: 700;
}

.partner-sync-hero-phase strong {
  color: #4e6394;
  font-weight: 700;
}

.partner-sync-home-layout {
  display: grid;
  gap: 10px;
}

.partner-sync-section {
  padding: 16px;
}

.partner-sync-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.partner-sync-section-head h2 {
  margin: 0;
  font-size: 34px;
  line-height: 1.1;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #071b52;
}

.partner-sync-section-head p {
  margin: 8px 0 0;
  color: #4e6394;
  font-size: 14px;
}

.partner-sync-count-chip,
.partner-sync-status-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  border-radius: 999px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

.partner-sync-count-chip {
  background: #f0edff;
  color: #634cf7;
}

.partner-sync-status-chip {
  background: #eafbef;
  color: #16a34a;
}

.partner-sync-head-tools {
  display: inline-grid;
  grid-auto-flow: row;
  justify-items: end;
  gap: 8px;
}

.partner-sync-head-tools small {
  font-size: 13px;
  color: #6378aa;
  font-weight: 600;
}

.partner-sync-tool-btn {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 10px;
}

#tab-partner-sync .replacement-b2b-invite-table-wrap,
#tab-partner-sync .replacement-b2b-connected-table-wrap {
  border: 1px solid #dde6fa;
  border-radius: 12px;
  background: #ffffff;
  max-height: none;
}

#tab-partner-sync .replacement-b2b-invite-table th,
#tab-partner-sync .replacement-b2b-invite-table td,
#tab-partner-sync .replacement-b2b-connected-table th,
#tab-partner-sync .replacement-b2b-connected-table td {
  padding: 14px 12px;
}

.partner-sync-business-layout {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.partner-sync-business-id-card {
  border: 1px solid #dde6fa;
  border-radius: 12px;
  background: #f7f9ff;
  min-height: 120px;
  padding: 16px 18px;
  display: grid;
  align-content: center;
  gap: 8px;
}

.partner-sync-business-id-card span {
  color: #4b5fd8;
  font-size: 20px;
  font-weight: 700;
}

.partner-sync-business-id-card strong {
  font-size: 44px;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #4f46e5;
}

.partner-sync-invite-form {
  display: grid;
  gap: 12px;
}

.partner-sync-invite-form label {
  display: grid;
  gap: 6px;
  color: #4e6394;
  font-size: 13px;
  font-weight: 700;
}

.partner-sync-send-row {
  display: flex;
  justify-content: flex-end;
}

.partner-sync-send-row .primary-btn {
  min-width: 220px;
  min-height: 48px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

#tab-partner-sync .replacement-b2b-utility-links {
  justify-content: flex-end;
  margin-bottom: 0;
}

#tab-partner-sync .replacement-b2b-utility-links > button {
  min-width: 196px;
}

.partner-sync-status-line {
  margin: 2px 4px 0;
}

@media (max-width: 1280px) {
  .partner-sync-hero-copy h1,
  .partner-sync-section-head h2 {
    font-size: 30px;
  }
}

@media (max-width: 1120px) {
  .partner-sync-business-layout {
    grid-template-columns: 1fr;
  }

  .partner-sync-send-row {
    justify-content: flex-start;
  }
}

@media (max-width: 920px) {
  .partner-sync-hero-card {
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .partner-sync-section-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .partner-sync-head-tools {
    justify-items: start;
  }
}

@media (max-width: 680px) {
  .partner-sync-hero-copy h1,
  .partner-sync-section-head h2 {
    font-size: 24px;
  }

  .partner-sync-hero-phase {
    grid-auto-flow: row;
    width: 100%;
    justify-items: start;
  }

  .partner-sync-send-row .primary-btn {
    width: 100%;
    min-width: 0;
  }

  #tab-partner-sync .replacement-b2b-utility-links > button {
    min-width: 0;
    width: 100%;
  }
}

.stock-home-eyebrow {
  margin: 0 0 4px;
  color: #4b56d9;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.stock-home-stat-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(1) {
  background: #fcfbff;
  border-color: #ddd8ff;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(1) strong {
  color: #5b4ff8;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(2) {
  background: #f8fdf9;
  border-color: #cfeedd;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(2) strong {
  color: #16934a;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(3) {
  background: #f8fbff;
  border-color: #d7e7ff;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(3) strong {
  color: #2563eb;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(4) {
  background: #fffaf4;
  border-color: #f6dfc7;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(4) strong {
  color: #ea8a00;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(5) {
  background: #fbfaff;
  border-color: #e2ddff;
}

.stock-home-stat-grid .payment-home-stat-card:nth-child(5) strong {
  color: #634cf7;
}

.stock-home-stat-grid .payment-home-stat-card[data-stock-home-stat] {
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.stock-home-stat-grid .payment-home-stat-card[data-stock-home-stat]:hover {
  border-color: #cbd9fb;
  box-shadow: 0 14px 30px rgba(20, 40, 90, 0.12);
  transform: translateY(-1px);
}

.stock-home-stat-grid .payment-home-stat-card[data-stock-home-stat]:focus-visible {
  outline: 2px solid #3f46f4;
  outline-offset: 2px;
}

#stockHomeCurrentStockValue {
  font-size: clamp(24px, 1.7vw, 34px);
  line-height: 1.08;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.stock-home-content-grid .serial-home-action-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.stock-home-supplier-card .payment-home-section-head h2 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.stock-home-supplier-table-wrap table {
  min-width: 660px;
}

.stock-home-supplier-table-wrap th:first-child,
.stock-home-supplier-table-wrap td:first-child {
  text-align: left;
}

.stock-home-supplier-table-wrap th:nth-child(n + 2),
.stock-home-supplier-table-wrap td:nth-child(n + 2) {
  text-align: right;
  white-space: nowrap;
}

.stock-home-supplier-table-wrap td:nth-child(4) {
  font-weight: 700;
}

.stock-home-insights-card .serial-home-insight-head strong {
  font-size: 24px;
}

.stock-home-insights-card .serial-home-insight-head span {
  font-size: 15px;
}

.serial-home-left-stack,
.serial-home-side-grid {
  display: grid;
  gap: 14px;
  align-content: start;
  min-width: 0;
}

.serial-home-quick-actions-card,
.serial-home-low-stock-card,
.serial-home-activity-card,
.serial-home-insights-card {
  padding: 14px;
}

.serial-home-quick-actions-card {
  overflow: hidden;
}

.serial-home-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 12px;
}

.serial-home-action-grid .replacement-home-action-tile {
  min-height: 128px;
  min-width: 0;
}

.serial-home-action-grid .replacement-home-action-copy small {
  line-height: 1.35;
}

.serial-home-insight-list {
  display: grid;
  gap: 12px;
}

.serial-home-insight-item {
  display: grid;
  gap: 7px;
}

.serial-home-insight-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.serial-home-insight-head span {
  font-size: 16px;
  color: #1b2f72;
  font-weight: 600;
}

.serial-home-insight-head strong {
  font-size: 28px;
  line-height: 1;
  color: #071b52;
  font-weight: 700;
}

.serial-home-insight-bar {
  height: 8px;
  border-radius: 999px;
  background: #e9efff;
  overflow: hidden;
}

.serial-home-insight-bar span {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
}

.serial-home-insight-bar span.tone-amber {
  background: #f59e0b;
}

.serial-home-insight-bar span.tone-blue {
  background: #3b82f6;
}

.serial-home-insight-bar span.tone-green {
  background: #16a34a;
}

.serial-home-insight-bar span.tone-violet {
  background: #7c3aed;
}

.serial-home-low-stock-card .payment-home-section-head h2 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.serial-home-low-stock-card .payment-home-table-wrap table td:nth-child(2),
.serial-home-low-stock-card .payment-home-table-wrap table td:nth-child(3) {
  font-weight: 700;
  white-space: nowrap;
}

.serial-home-activity-list .replacement-home-activity-item {
  grid-template-columns: auto auto minmax(0, 1fr);
}

.payment-home-table-card {
  padding: 16px;
}

.payment-home-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.payment-home-section-head.compact {
  margin-bottom: 8px;
}

.payment-home-section-head h2 {
  margin: 0;
  font-size: 20px;
  line-height: 1.15;
  color: var(--ph-text-main);
  font-weight: 700;
}

.payment-home-section-head select {
  height: 34px;
  border-radius: 9px;
  border: 1px solid var(--ph-border);
  background: #ffffff;
  color: var(--ph-text-secondary);
  font-size: 13px;
  font-weight: 600;
  padding: 0 10px;
}

.payment-home-table-filters {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 180px) minmax(150px, 180px) auto;
  gap: 12px;
  margin-bottom: 12px;
}

.payment-home-filter-box {
  height: 52px;
  border: 1px solid var(--ph-border);
  border-radius: 12px;
  background: #ffffff;
  padding: 0 12px 0 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: #8ca1cd;
}

.payment-home-filter-box.grow {
  width: 100%;
}

.payment-home-filter-box input,
.payment-home-filter-box select {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  min-width: 0;
  min-height: 38px;
  padding: 0;
  color: var(--ph-text-main);
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
  text-align: left !important;
  background-image: none !important;
  appearance: none;
  -webkit-appearance: none;
}

.payment-home-filter-box select {
  font-weight: 600;
  color: var(--ph-text-main);
  appearance: none;
  background-image: none;
  padding-right: 0;
}

.payment-home-filter-box select::-ms-expand {
  display: none;
}

.payment-home-filter-box input {
  text-align: left;
}

.payment-home-filter-box input::-webkit-search-decoration,
.payment-home-filter-box input::-webkit-search-cancel-button,
.payment-home-filter-box input::-webkit-search-results-button,
.payment-home-filter-box input::-webkit-search-results-decoration {
  display: none;
}

.payment-home-filter-box i,
.payment-home-filter-box svg {
  display: none !important;
}

.payment-home-filter-btn {
  height: 52px;
  border-radius: 12px;
  border: 1px solid var(--ph-border);
  background: #ffffff;
  color: var(--ph-primary-dark);
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
}

.payment-home-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--ph-border);
  border-radius: 12px;
}

.payment-home-table-wrap table {
  width: 100%;
  min-width: 730px;
  border-collapse: collapse;
  background: #ffffff;
}

.payment-home-table-wrap th {
  background: #fafbff;
  color: var(--ph-text-secondary);
  font-size: 13px;
  font-weight: 600;
  text-align: left;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ph-border);
}

.payment-home-table-wrap td {
  color: var(--ph-text-main);
  font-size: 14px;
  padding: 14px 16px;
  border-top: 1px solid #e6edfa;
  vertical-align: middle;
}

.payment-home-table-wrap td strong {
  color: #2040ff;
  font-weight: 700;
}

.payment-home-status-pill {
  border-radius: 8px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.payment-home-status-pill.is-pending {
  background: #fff7ea;
  color: #f59e0b;
}

.payment-home-status-pill.is-sent {
  background: #ecf2ff;
  color: #2563eb;
}

.payment-home-status-pill.is-paid {
  background: #eafbef;
  color: #16a34a;
}

.payment-home-status-pill.is-overdue {
  background: #ffefef;
  color: #dc2626;
}

.payment-home-status-pill.is-scheduled {
  background: #f2edff;
  color: #8b5cf6;
}

.payment-home-status-pill.is-active {
  background: #eafbef;
  color: #16a34a;
}

.payment-home-status-pill.is-inactive {
  background: #eef3ff;
  color: #4e6394;
}

.payment-home-status-pill.is-due-soon {
  background: #fff7ea;
  color: #f59e0b;
}

.payment-home-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

.payment-home-row-action {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ph-primary-dark);
  display: inline-grid;
  place-items: center;
}

.payment-home-row-action:hover {
  background: var(--ph-primary-light);
}

.payment-home-table-meta {
  margin: 12px 0 0;
  font-size: 13px;
  color: var(--ph-text-secondary);
}

.payment-home-side-grid {
  display: grid;
  gap: 12px;
}

.payment-home-overview-card,
.payment-home-overdue-card,
.payment-home-quick-card {
  padding: 12px;
}

.payment-home-overview-body {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.payment-home-overview-chart {
  width: 146px;
  height: 146px;
  border-radius: 999px;
  position: relative;
  display: grid;
  place-items: center;
  background: conic-gradient(#e8eefc 0deg, #e8eefc 360deg);
  margin: 4px auto 4px 0;
}

.payment-home-overview-chart::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(221, 230, 250, 0.9);
}

.payment-home-overview-chart > div {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 2px;
}

.payment-home-overview-chart strong {
  color: var(--ph-text-main);
  font-size: 40px;
  line-height: 1;
  font-weight: 700;
}

.payment-home-overview-chart span {
  color: var(--ph-text-secondary);
  font-size: 12px;
  font-weight: 600;
}

.payment-home-overview-legend {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 7px;
}

.payment-home-overview-legend li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  color: var(--ph-text-secondary);
  font-size: 13px;
  font-weight: 500;
}

.payment-home-overview-legend .dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  display: inline-block;
}

.payment-home-overview-legend strong {
  color: #6b7dac;
  font-size: 13px;
  font-weight: 600;
}

.payment-home-overdue-list {
  display: grid;
  gap: 10px;
  margin: 4px 0 10px;
}

.payment-home-overdue-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.payment-home-overdue-list strong {
  color: var(--ph-text-main);
  font-size: 16px;
  font-weight: 600;
}

.payment-home-overdue-list span {
  color: #dc2626;
  font-size: 16px;
  font-weight: 700;
}

.payment-home-link-btn {
  border: 0;
  background: transparent;
  color: #2348e8;
  font-size: 13px;
  font-weight: 700;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.payment-home-quick-card {
  display: grid;
  gap: 2px;
}

.payment-home-quick-row {
  width: 100%;
  border: 0;
  border-top: 1px solid #e6edfa;
  background: transparent;
  padding: 10px 2px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  text-align: left;
  color: var(--ph-text-main);
}

.payment-home-quick-row:first-of-type {
  border-top: 0;
}

.payment-home-quick-row > span:first-child {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  border: 1px solid currentColor;
  display: inline-grid;
  place-items: center;
  font-size: 16px;
}

.payment-home-quick-row strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--ph-text-main);
}

.payment-home-quick-row small {
  display: block;
  margin-top: 1px;
  color: var(--ph-text-secondary);
  font-size: 13px;
  font-weight: 400;
}

.payment-home-quick-row > i {
  color: #7f92bd;
}

.ledger-home-balance-value {
  font-weight: 700;
  white-space: nowrap;
}

.ledger-home-balance-value.is-positive {
  color: #071b52;
}

.ledger-home-balance-value.is-negative {
  color: #dc2626;
}

.ledger-home-top-balance-list {
  display: grid;
  gap: 2px;
  margin: 4px 0 10px;
}

.ledger-home-top-balance-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid #e6edfa;
}

.ledger-home-top-balance-list > div:first-child {
  border-top: 0;
}

.ledger-home-top-balance-list strong {
  color: var(--ph-text-main);
  font-size: 16px;
  font-weight: 600;
}

.ledger-home-top-balance-list span {
  font-size: 16px;
  font-weight: 700;
  white-space: nowrap;
}

.ledger-home-top-balance-list .is-positive {
  color: #16a34a;
}

.ledger-home-top-balance-list .is-negative {
  color: #dc2626;
}

.item-home-item-cell {
  display: inline-grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.item-home-stat-card {
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.item-home-stat-card:hover {
  transform: translateY(-1px);
  border-color: #cfdbfb;
  box-shadow: 0 16px 28px rgba(20, 40, 90, 0.1);
}

.item-home-stat-card:focus-visible {
  outline: 2px solid rgba(63, 70, 244, 0.3);
  outline-offset: 2px;
}

.bundle-home-stat-card {
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.bundle-home-stat-card:hover {
  transform: translateY(-1px);
  border-color: #cfdbfb;
  box-shadow: 0 16px 28px rgba(20, 40, 90, 0.1);
}

.bundle-home-stat-card:focus-visible {
  outline: 2px solid rgba(63, 70, 244, 0.3);
  outline-offset: 2px;
}

.item-home-item-cell > span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.item-home-thumb {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #eef3ff;
  color: #5d74bd;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  flex-shrink: 0;
}

.item-home-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.item-home-thumb i {
  font-size: 14px;
}

.item-home-stock-qty {
  color: #1e2a78;
  font-weight: 700;
}

.item-home-insights-list {
  display: grid;
  gap: 4px;
  margin-top: 2px;
}

.item-home-insights-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  border-top: 1px solid #e6edfa;
}

.item-home-insights-list > div:first-child {
  border-top: 0;
}

.item-home-insights-list span {
  color: var(--ph-text-main);
  font-size: 16px;
  font-weight: 600;
}

.item-home-insights-list strong {
  font-size: 16px;
  font-weight: 700;
}

.item-home-insights-list > div:nth-child(1) strong {
  color: #f97316;
}

.item-home-insights-list > div:nth-child(2) strong {
  color: #dc2626;
}

.item-home-insights-list > div:nth-child(3) strong {
  color: #2563eb;
}

.item-home-insights-list > div:nth-child(4) strong {
  color: #16a34a;
}

.bundle-home-top-list {
  display: grid;
  gap: 2px;
  margin: 4px 0 10px;
}

.bundle-home-top-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid #e6edfa;
}

.bundle-home-top-list > div:first-child {
  border-top: 0;
}

.bundle-home-top-list strong {
  color: var(--ph-text-main);
  font-size: 16px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bundle-home-top-list span {
  font-size: 16px;
  font-weight: 700;
  color: #16a34a;
  white-space: nowrap;
}

@media (max-width: 1280px) {
  .payment-home-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .invoice-home-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stock-home-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .payment-home-heading-row h1 {
    font-size: 28px;
  }
}

@media (max-width: 1120px) {
  .payment-home-content-grid {
    grid-template-columns: 1fr;
  }

  .serial-home-content-grid {
    grid-template-columns: 1fr;
  }

  .invoice-home-activity-card {
    max-height: none;
  }

  .invoice-home-activity-card .serial-home-activity-list {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }

  .invoice-home-customer-table-wrap {
    max-height: none;
  }
}

@media (max-width: 920px) {
  .payment-home-dashboard {
    grid-template-columns: 1fr;
  }

  .payment-home-sidebar {
    width: 100%;
    min-width: 0;
    border-right: 0;
    border-bottom: 1px solid var(--ph-border);
  }

  .payment-home-nav {
    grid-auto-flow: column;
    grid-auto-columns: minmax(170px, 1fr);
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .payment-home-topbar {
    grid-template-columns: 1fr;
  }

  .payment-home-toolbar {
    justify-content: start;
  }

  .payment-home-heading-row {
    grid-template-columns: 1fr;
  }

  .payment-home-heading-actions {
    justify-content: start;
  }

  .payment-home-table-filters {
    grid-template-columns: 1fr;
  }

  .payment-home-filter-btn {
    width: 100%;
  }
}

@media (max-width: 680px) {
  .payment-home-dashboard {
    border-radius: 14px;
  }

  .payment-home-sidebar,
  .payment-home-topbar,
  .payment-home-body,
  .module-home-main-pane {
    padding: 16px;
  }

  .payment-home-search-box {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .payment-home-search-box span {
    display: none;
  }

  .payment-home-toolbar {
    grid-auto-flow: row;
    grid-template-columns: repeat(2, auto) minmax(0, 1fr);
    width: 100%;
  }

  .payment-home-profile {
    min-width: 0;
  }

  .payment-home-heading-row h1 {
    font-size: 24px;
  }

  .payment-home-section-head h2 {
    font-size: 18px;
  }

  .payment-home-heading-actions,
  .payment-home-stat-grid {
    grid-template-columns: 1fr;
    grid-auto-flow: row;
    width: 100%;
  }

  .serial-home-action-grid {
    grid-template-columns: 1fr;
  }

  .stock-home-stat-grid {
    grid-template-columns: 1fr;
  }

  .invoice-home-stat-grid {
    grid-template-columns: 1fr;
  }

  .payment-home-primary-btn,
  .payment-home-secondary-btn {
    width: 100%;
  }

  .payment-home-stat-card,
  .payment-home-overview-card,
  .payment-home-overdue-card,
  .payment-home-quick-card {
    padding: 14px;
  }

  .payment-home-overview-body {
    grid-template-columns: 1fr;
  }

  .payment-home-overview-chart {
    margin: 4px auto;
  }

  .payment-home-table-wrap {
    border-radius: 10px;
  }
}

.renewal-home-dashboard .payment-home-heading-row p {
  max-width: 68ch;
}

#renewalHomeValueAmount {
  font-size: clamp(30px, 2vw, 38px);
  line-height: 1.06;
  white-space: nowrap;
}

.renewal-home-product-cell {
  display: inline-grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  max-width: 100%;
}

.renewal-home-product-cell > i {
  color: #5168af;
  font-size: 13px;
}

.renewal-home-product-cell > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.renewal-home-days {
  font-size: 13px;
  font-weight: 600;
}

.renewal-home-days.is-overdue {
  color: #dc2626;
}

.renewal-home-days.is-due {
  color: #f59e0b;
}

.renewal-home-days.is-active {
  color: #16a34a;
}

.renewal-home-expiring-card {
  padding-bottom: 8px;
}

.renewal-home-expiring-list {
  display: grid;
  gap: 10px;
  margin: 4px 0;
}

.renewal-home-expiring-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.renewal-home-expiring-list span {
  color: #203f8a;
  font-size: 16px;
  font-weight: 600;
}

.renewal-home-expiring-list strong {
  font-size: 24px;
  line-height: 1;
  font-weight: 700;
}

.renewal-home-expiring-list > div:nth-child(1) strong {
  color: #f59e0b;
}

.renewal-home-expiring-list > div:nth-child(2) strong {
  color: #fb923c;
}

.renewal-home-expiring-list > div:nth-child(3) strong {
  color: #dc2626;
}

.tone-blue {
  background: #eaf1ff;
  color: #2b67da;
  border-color: #d8e5ff;
}

.tone-indigo {
  background: #edf0ff;
  color: #495fdb;
  border-color: #dde4ff;
}

.tone-cyan {
  background: #e9f7ff;
  color: #2484c7;
  border-color: #d5eeff;
}

.tone-violet {
  background: #f1edff;
  color: #6f42e5;
  border-color: #e5dbff;
}

.tone-green {
  background: #eafbef;
  color: #2f9f56;
  border-color: #d7f4e0;
}

.tone-emerald {
  background: #eafdf6;
  color: #179d74;
  border-color: #d1f7e7;
}

.tone-mint {
  background: #ebfbf8;
  color: #1c9a8a;
  border-color: #d4f6ef;
}

.tone-purple {
  background: #f0edff;
  color: #6148de;
  border-color: #e0d8ff;
}

.tone-lilac {
  background: #f4f2ff;
  color: #715dd9;
  border-color: #e8e2ff;
}

.tone-pink {
  background: #fff0fa;
  color: #c54c9c;
  border-color: #ffdff1;
}

.tone-amber {
  background: #fff7ea;
  color: #d18123;
  border-color: #ffe8bf;
}

.tone-orange {
  background: #fff1e8;
  color: #da6f28;
  border-color: #ffdcbf;
}

.tone-sky {
  background: #eaf4ff;
  color: #2e7ed8;
  border-color: #d6e9ff;
}

.workspace-mode .section-back-btn {
  display: none !important;
}

.sidebar-tab-nav {
  position: static;
  grid-template-columns: 1fr;
  padding: 0.5rem;
  border-radius: 20px;
  gap: 0.62rem;
}

.sidebar-tab-nav .tab-group {
  padding: 0.56rem 0.58rem 0.62rem;
}

.sidebar-tab-nav .tab-group-buttons {
  gap: 0.4rem;
}

.sidebar-tab-nav .tab-btn {
  width: 100%;
  justify-content: flex-start;
}

.compact-sidebar .brand-panel,
.compact-sidebar .summary-grid {
  display: none;
}

.dashboard-panel {
  display: grid;
  gap: 1rem;
}

.dashboard-hero .helper-text {
  margin-top: 0.35rem;
  margin-bottom: 0;
}

.dashboard-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
}

.dashboard-kpi-card {
  border: 1px solid rgba(121, 138, 212, 0.28);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 10px 24px rgba(64, 83, 151, 0.1);
  padding: 0.78rem 0.82rem;
}

.dashboard-kpi-card span {
  display: block;
  font-size: 0.77rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.dashboard-kpi-card strong {
  display: block;
  margin-top: 0.3rem;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: 1.55rem;
  color: #2b56cb;
}

.dashboard-grid {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-section-card {
  padding: 0.95rem;
  border-radius: 16px;
}

.dashboard-section-card.full-span {
  grid-column: 1 / -1;
}

.dashboard-action-list {
  display: grid;
  gap: 0.55rem;
}

.dashboard-action-item {
  border: 1px solid rgba(120, 138, 210, 0.24);
  border-radius: 12px;
  background: rgba(244, 248, 255, 0.75);
  padding: 0.62rem 0.68rem;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 0.55rem;
}

.dashboard-action-item strong {
  font-size: 0.9rem;
  color: #2b3f7a;
}

.dashboard-action-item span {
  font-size: 0.79rem;
  color: var(--muted);
}

.dashboard-action-item b {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  color: #284ec0;
  font-size: 1rem;
}

.dashboard-timeline {
  display: grid;
  gap: 0.55rem;
}

.dashboard-timeline-item {
  border: 1px solid rgba(120, 138, 210, 0.22);
  border-radius: 12px;
  background: rgba(244, 248, 255, 0.72);
  padding: 0.62rem 0.68rem;
  display: grid;
  gap: 0.2rem;
}

.dashboard-timeline-item strong {
  font-size: 0.88rem;
}

.dashboard-timeline-item span {
  font-size: 0.78rem;
  color: var(--muted);
}

.tab-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0.62rem;
  width: 100%;
  padding: 0.4rem;
  border: 1px solid rgba(129, 146, 219, 0.24);
  border-radius: 18px;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.86), rgba(242, 246, 255, 0.82));
  box-shadow: 0 10px 24px rgba(25, 37, 66, 0.08);
  align-items: start;
}

.tab-group {
  --tab-group-accent: #5e4cf1;
  border: 1px solid rgba(120, 138, 212, 0.2);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
  padding: 0.54rem 0.56rem 0.6rem;
  display: grid;
  gap: 0.46rem;
}

.tab-group-title {
  margin: 0;
  padding: 0 0.12rem 0.2rem;
  border-bottom: 1px dashed rgba(112, 132, 206, 0.24);
  font-size: 0.69rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 800;
  color: #4c5f95;
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
}

.tab-group-title i {
  width: 1.05rem;
  height: 1.05rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.62rem;
  color: #ffffff;
  background: var(--tab-group-accent);
}

.tab-group-buttons {
  display: grid;
  gap: 0.42rem;
}

.tab-group-workflow {
  --tab-group-accent: #5e4cf1;
}

.tab-group-accounting {
  --tab-group-accent: #2a6fb1;
}

.tab-group-masters {
  --tab-group-accent: #2f8aa2;
}

.tab-group-operations {
  --tab-group-accent: #ba7f36;
}

.tab-group-settings {
  --tab-group-accent: #5b72c1;
}

.tab-btn {
  border: 1px solid rgba(119, 136, 212, 0.26);
  background: rgba(255, 255, 255, 0.95);
  color: var(--surface-ink);
  padding: 0.52rem 0.75rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.84rem;
  line-height: 1.2;
  box-shadow: none;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  white-space: nowrap;
  min-height: 2.1rem;
}

.tab-btn.active {
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  color: #fff8f1;
  border-color: transparent;
}

.tab-btn:hover {
  border-color: rgba(93, 113, 194, 0.44);
  background: rgba(241, 246, 255, 0.96);
}

.tab-panel {
  display: none;
}

.tab-panel.active {
  display: block;
  animation: fade-up 0.3s ease;
}

.panel-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
  margin-bottom: 1.05rem;
}

.panel-card > .panel-heading {
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(133, 149, 220, 0.22);
  border-radius: 16px;
  background: linear-gradient(120deg, rgba(244, 247, 255, 0.98), rgba(236, 242, 255, 0.92));
}

.panel-heading.compact {
  margin-top: 1.8rem;
}

.section-divider {
  border: 0;
  border-top: 1px solid rgba(133, 149, 220, 0.22);
  margin: 1.1rem 0 1.25rem;
}

.status-pill {
  white-space: nowrap;
  align-self: center;
  background: var(--accent-soft);
  color: var(--accent);
  border-radius: 999px;
  padding: 0.45rem 0.85rem;
  font-size: 0.86rem;
  font-weight: 700;
}

.form-grid,
.card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.quotation-header-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customer-snapshot {
  margin-top: 1rem;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.45);
  border: 1px solid rgba(20, 33, 61, 0.08);
  border-radius: var(--radius-md);
}

.helper-text {
  margin-top: 0.9rem;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

.full-span {
  grid-column: 1 / -1;
}

.inline-field-group {
  display: grid;
  grid-template-columns: minmax(90px, 110px) minmax(140px, 1fr);
  gap: 0.6rem;
}

.inline-field-group-validity {
  grid-template-columns: minmax(84px, 100px) auto minmax(84px, 100px) auto;
  align-items: center;
}

.inline-field-label {
  color: #4d5e7d;
  font-size: 0.9rem;
  font-weight: 600;
}

.line-items-wrapper,
.data-table,
.quotation-list {
  overflow: auto;
}

.line-items-table {
  table-layout: auto;
}

.bundle-quick-add-card {
  margin-bottom: 1rem;
}

.bundle-quick-add-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(160px, 200px) auto;
  gap: 0.8rem;
  align-items: end;
}

.bundle-quick-add-actions {
  display: flex;
  align-items: end;
}

.bundle-quick-add-hint {
  margin-top: 0.6rem;
}

.line-items-table th,
.line-items-table td {
  min-width: 0;
  padding: 0.7rem 0.45rem;
  word-break: break-word;
}

.line-items-table td:last-child,
.line-items-table th:last-child {
  width: 40px;
  min-width: 40px;
}

.line-items-table input,
.line-items-table select {
  min-width: 0;
  padding: 0.62rem 0.55rem;
  font-size: 0.88rem;
}

.line-item-configurator,
.invoice-line-item-configurator {
  margin-top: 0;
  padding: 0.5rem;
  border-radius: 10px;
  border: 1px dashed rgba(84, 106, 176, 0.32);
  background: rgba(240, 246, 255, 0.72);
}

.line-item-config-row > td,
.invoice-line-item-config-row > td {
  padding-top: 0.25rem;
  padding-bottom: 0.78rem;
}

.line-item-config-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 0.45rem;
}

.line-item-config-field {
  display: grid;
  gap: 0.28rem;
}

.line-item-config-field small {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #3f4f83;
}

.line-item-config-select,
.invoice-line-item-config-select {
  min-width: 0;
  width: 100%;
  padding: 0.38rem 0.46rem;
  border-radius: 8px;
}

.line-item-config-other[multiple],
.invoice-line-item-config-other[multiple] {
  min-height: 3.4rem;
}

.line-item-config-other-checklist.checklist-box,
.invoice-line-item-config-other-checklist.checklist-box {
  min-height: 2.7rem;
  max-height: 7rem;
  padding: 0.28rem 0.32rem;
}

.line-item-config-other-checklist .checklist-item,
.invoice-line-item-config-other-checklist .checklist-item {
  padding: 0.25rem 0.34rem;
  font-size: 0.9rem;
}

.line-item-config-other-checklist .checklist-empty,
.invoice-line-item-config-other-checklist .checklist-empty {
  padding: 0.42rem 0.3rem;
}

.line-items-table th:nth-child(1),
.line-items-table td:nth-child(1) {
  width: 32%;
}

.line-items-table th:nth-child(2),
.line-items-table td:nth-child(2) {
  width: 20%;
}

.line-items-table th:nth-child(3),
.line-items-table td:nth-child(3) {
  width: 14%;
}

.line-items-table th:nth-child(4),
.line-items-table td:nth-child(4) {
  width: 8%;
}

.line-items-table th:nth-child(5),
.line-items-table td:nth-child(5) {
  width: 12%;
}

.line-items-table th:nth-child(6),
.line-items-table td:nth-child(6) {
  width: 8%;
}

.line-items-table th:nth-child(7),
.line-items-table td:nth-child(7) {
  width: 12%;
}

.line-items-table th:nth-child(8),
.line-items-table td:nth-child(8) {
  width: 4%;
}

@media (max-width: 1360px) {
  .line-item-config-grid {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
}

@media (max-width: 760px) {
  .line-item-config-grid {
    grid-template-columns: 1fr;
  }
}

.bundle-items-table th,
.bundle-items-table td {
  min-width: 0;
  padding: 0.62rem 0.5rem;
  word-break: break-word;
}

.bundle-items-table th:nth-child(1),
.bundle-items-table td:nth-child(1) {
  width: 48%;
}

.bundle-items-table th:nth-child(2),
.bundle-items-table td:nth-child(2) {
  width: 16%;
}

.bundle-items-table th:nth-child(3),
.bundle-items-table td:nth-child(3) {
  width: 30%;
}

.bundle-items-table th:nth-child(4),
.bundle-items-table td:nth-child(4) {
  width: 6%;
}

.totals-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.8fr);
  gap: 1rem;
  margin-top: 1.5rem;
}

.notes-card,
.totals-card,
.table-card {
  background: rgba(255, 255, 255, 0.45);
  border: 1px solid rgba(20, 33, 61, 0.08);
  border-radius: var(--radius-md);
  padding: 1rem;
}

.owner-insights-panel {
  display: grid;
  gap: 1rem;
}

.owner-insights-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(140px, 1fr));
  gap: 0.85rem;
}

.owner-insight-kpi {
  display: grid;
  gap: 0.35rem;
  padding: 1rem;
  min-height: 118px;
  border: 1px solid rgba(118, 139, 219, 0.22);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(246, 249, 255, 0.76));
  box-shadow: 0 18px 36px rgba(91, 112, 194, 0.1);
}

.owner-insight-kpi span {
  width: 2.25rem;
  height: 2.25rem;
  display: inline-grid;
  place-items: center;
  border-radius: 13px;
  color: var(--accent);
  background: rgba(47, 88, 207, 0.1);
  border: 1px solid rgba(47, 88, 207, 0.15);
}

.owner-insight-kpi small {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.owner-insight-kpi strong {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  color: var(--surface-ink);
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  line-height: 1.05;
}

.owner-insight-kpi.tone-green span {
  color: #16845d;
  background: rgba(47, 201, 128, 0.13);
  border-color: rgba(47, 201, 128, 0.22);
}

.owner-insight-kpi.tone-indigo span {
  color: #4b5bdc;
  background: rgba(111, 99, 255, 0.13);
  border-color: rgba(111, 99, 255, 0.22);
}

.owner-insight-kpi.tone-cyan span {
  color: #167c9a;
  background: rgba(56, 189, 248, 0.13);
  border-color: rgba(56, 189, 248, 0.22);
}

.owner-insight-kpi.tone-orange span {
  color: #b86210;
  background: rgba(255, 168, 74, 0.14);
  border-color: rgba(255, 168, 74, 0.25);
}

.owner-insight-kpi.tone-violet span {
  color: #6a40d9;
  background: rgba(139, 92, 246, 0.13);
  border-color: rgba(139, 92, 246, 0.23);
}

.owner-insights-toolbar {
  align-items: flex-start;
}

.owner-insights-table table {
  min-width: 1180px;
}

.owner-insights-table td {
  vertical-align: top;
}

.owner-audit-toolbar {
  align-items: center;
}

.owner-audit-actions {
  margin-left: auto;
  gap: 0.55rem;
  align-items: center;
}

.owner-audit-limit-label {
  display: inline-grid;
  gap: 0.3rem;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.owner-audit-limit-label select {
  min-width: 88px;
}

.owner-audit-table table {
  min-width: 1080px;
}

.owner-audit-table td {
  vertical-align: top;
}

.audit-outcome-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.22rem 0.5rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.audit-outcome-success {
  color: #0d7c57;
  background: rgba(16, 185, 129, 0.14);
  border: 1px solid rgba(16, 185, 129, 0.3);
}

.audit-outcome-failure {
  color: #b63838;
  background: rgba(239, 68, 68, 0.14);
  border: 1px solid rgba(239, 68, 68, 0.3);
}

.audit-outcome-blocked {
  color: #8f5e09;
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(245, 158, 11, 0.33);
}

.audit-outcome-info {
  color: #36508f;
  background: rgba(37, 99, 235, 0.12);
  border: 1px solid rgba(37, 99, 235, 0.27);
}

@media (max-width: 1180px) {
  .owner-insights-kpis {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }
}

@media (max-width: 900px) {
  .owner-insights-kpis {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }

  .owner-audit-actions {
    width: 100%;
    justify-content: flex-end;
  }
}

.notes-stack {
  display: grid;
  gap: 1rem;
}

.totals-card {
  display: grid;
  gap: 0.85rem;
}

.totals-hint {
  margin-top: 0;
}

.payment-status-line {
  margin-top: 0.15rem;
  margin-bottom: 0.15rem;
}

.payment-status-line strong {
  color: var(--accent);
}

.totals-list {
  display: grid;
  gap: 0.7rem;
  margin-top: 0.25rem;
}

.totals-list div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.98rem;
}

.totals-list strong {
  font-family: "Space Grotesk", sans-serif;
  color: var(--surface-ink);
}

.quotation-v2-page {
  padding: 1.15rem;
  border-radius: 22px;
  border: 1px solid #dbe3f2;
  background:
    radial-gradient(circle at 100% 0%, rgba(79, 102, 232, 0.08), transparent 35%),
    linear-gradient(180deg, #f8faff 0%, #f4f7fd 100%);
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #27365f;
}

.panel-card.quotation-v2-page > .panel-heading {
  margin-bottom: 0.95rem;
  padding: 0.95rem 1rem;
  border-radius: 14px;
  border: 1px solid #d7e0f2;
  background: linear-gradient(180deg, #fefeff 0%, #f8fbff 100%);
}

.quotation-v2-top {
  align-items: center;
}

.quotation-v2-breadcrumb {
  margin: 0 0 0.4rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: #7384aa;
}

.quotation-v2-breadcrumb span {
  display: inline-block;
  margin: 0 0.34rem;
  color: #8b9bc0;
}

.quotation-v2-top h2 {
  margin: 0;
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: clamp(1.9rem, 1.68rem + 0.54vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #1f3161;
}

.quotation-v2-subtitle {
  margin-top: 0.4rem;
  color: #6a7caa;
  font-size: 0.88rem;
}

.quotation-v2-top-actions {
  align-items: center;
  justify-content: flex-end;
  gap: 0.52rem;
}

.quotation-v2-page .status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 2.36rem;
  padding: 0.58rem 0.92rem;
  border-radius: 10px;
  border: 1px solid transparent;
  background: linear-gradient(135deg, #5a6bf4, #4656d7);
  color: #ffffff;
  font-size: 0.84rem;
  font-weight: 700;
  box-shadow: 0 10px 20px rgba(70, 86, 215, 0.24);
}

.quotation-autosave-status {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-height: 2rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #41527f;
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}

.quotation-autosave-status::before {
  content: "\2713";
  width: 1rem;
  height: 1rem;
  border-radius: 999px;
  border: 1.5px solid #1ea968;
  display: grid;
  place-items: center;
  color: #1ea968;
  font-size: 0.6rem;
  font-weight: 900;
  line-height: 1;
}

.quotation-autosave-status[data-state="saving"]::before {
  content: "";
  border-color: #4f63dd;
  border-top-color: transparent;
  animation: btn-spin 0.8s linear infinite;
}

.quotation-autosave-status[data-state="saved-offline"]::before {
  content: "!";
  border-color: #c58521;
  color: #c58521;
}

.quotation-autosave-status[data-state="unsaved"]::before {
  content: "";
  border: 0;
  background: #d85656;
  box-shadow: 0 0 0 3px rgba(216, 86, 86, 0.16);
}

.quotation-v2-page .primary-btn,
.quotation-v2-page .secondary-btn,
.quotation-v2-page .ghost-btn {
  min-height: 2.36rem;
  padding: 0.58rem 0.92rem;
  border-radius: 10px;
  font-size: 0.84rem;
  font-weight: 700;
  box-shadow: none;
}

.quotation-v2-page .primary-btn {
  border: 1px solid transparent;
  background: linear-gradient(135deg, #5a6bf4, #4656d7);
  color: #ffffff;
  box-shadow: 0 10px 20px rgba(70, 86, 215, 0.24);
}

.quotation-v2-page .secondary-btn {
  border: 1px solid #d0d9ee;
  background: #ffffff;
  color: #334a83;
}

.quotation-v2-page .ghost-btn {
  border: 1px solid #d8e0f2;
  background: #ffffff;
  color: #355090;
}

.quotation-v2-page .primary-btn:hover,
.quotation-v2-page .secondary-btn:hover,
.quotation-v2-page .ghost-btn:hover,
.quotation-v2-page .status-pill:hover {
  transform: translateY(-1px);
}

.quotation-v2-page .secondary-btn i {
  font-size: 0.96rem;
}

.quotation-v2-form {
  display: grid;
  gap: 0.95rem;
}

.quotation-v2-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

.quotation-v2-main,
.quotation-v2-sidebar {
  display: grid;
  gap: 0.9rem;
}

.quotation-v2-main {
  counter-reset: quotation-v2-section;
}

.quotation-v2-sidebar {
  position: static;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.quotation-v2-section,
.quotation-v2-summary-card,
.quotation-v2-payment-card,
.quotation-v2-quick-card,
.quotation-v2-tip-card {
  padding: 0.96rem;
  border: 1px solid #dce4f4;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 6px 16px rgba(63, 86, 166, 0.06);
}

.quotation-v2-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.72rem;
  margin-bottom: 0.74rem;
}

.quotation-v2-main > .quotation-v2-section > .quotation-v2-section-head {
  padding-left: 1.8rem;
  position: relative;
}

.quotation-v2-main > .quotation-v2-section > .quotation-v2-section-head::before {
  counter-increment: quotation-v2-section;
  content: counter(quotation-v2-section);
  position: absolute;
  left: 0;
  top: 0.08rem;
  width: 1.22rem;
  height: 1.22rem;
  border-radius: 7px;
  background: linear-gradient(135deg, #6a78f6, #4f5de0);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 800;
  display: grid;
  place-items: center;
}

.quotation-v2-section-head.compact {
  margin-bottom: 0.52rem;
}

.quotation-v2-section-head h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: #2a3e78;
  letter-spacing: -0.01em;
}

.quotation-v2-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.quotation-v2-inline-actions {
  margin-top: 0.72rem;
}

.quotation-v2-page label {
  font-size: 0.82rem;
  font-weight: 700;
  color: #4b5d89;
  letter-spacing: 0.01em;
}

.quotation-v2-page input,
.quotation-v2-page select,
.quotation-v2-page textarea {
  border-color: #d5deef;
  border-radius: 10px;
  min-height: 2.46rem;
  padding: 0.62rem 0.74rem;
  font-size: 0.9rem;
  color: #273760;
  background: #ffffff;
}

.quotation-v2-page textarea {
  min-height: 3.6rem;
}

.quotation-v2-page .field-control > input,
.quotation-v2-page .field-control > select,
.quotation-v2-page .field-control > textarea {
  padding-left: 2.56rem;
}

.quotation-v2-page input::placeholder,
.quotation-v2-page textarea::placeholder {
  color: #a7b3cf;
  font-weight: 500;
}

.quotation-v2-page input:focus,
.quotation-v2-page select:focus,
.quotation-v2-page textarea:focus {
  border-color: #7f91ed;
  box-shadow: 0 0 0 3px rgba(93, 111, 225, 0.16);
}

.quotation-v2-page .field-optional {
  color: #8a9abc;
  font-weight: 600;
}

.quotation-v2-page .helper-text {
  margin-top: 0.45rem;
  color: #7082ae;
  font-size: 0.83rem;
  line-height: 1.45;
}

.quotation-v2-page .quotation-optional-toggle-btn {
  min-height: 2.36rem;
  border-style: solid;
  border-color: #bfaeff;
  background: linear-gradient(180deg, #f4efff 0%, #ece4ff 100%);
  color: #5536c8;
  font-weight: 800;
  box-shadow: 0 8px 16px rgba(98, 73, 205, 0.14);
}

.quotation-v2-page .quotation-optional-toggle-btn:hover {
  border-color: #ab93ff;
  background: linear-gradient(180deg, #efe7ff 0%, #e7ddff 100%);
  color: #4a2fbb;
}

.quotation-v2-page .quotation-optional-toggle-btn:focus-visible {
  outline: 3px solid rgba(113, 84, 225, 0.22);
  outline-offset: 1px;
}

.quotation-v2-page .quotation-optional-toggle-btn[aria-expanded="true"] {
  border-color: #6d54e3;
  background: linear-gradient(135deg, #7157e8 0%, #5c44d5 100%);
  color: #ffffff;
  box-shadow: 0 10px 20px rgba(96, 70, 203, 0.26);
}

.quotation-v2-optional-panel {
  margin-top: 0.72rem;
  border-style: dashed;
  border-color: #cad5ef;
  background: #fbfcff;
}

.quotation-v2-lineitems-head {
  margin-top: 0.46rem;
}

.quotation-v2-page .line-items-wrapper {
  border: 1px solid #dde5f4;
  border-radius: 12px;
  background: #ffffff;
}

.quotation-v2-page .line-items-table {
  table-layout: fixed;
  width: 100%;
}

.quotation-v2-page .line-items-table input,
.quotation-v2-page .line-items-table select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.quotation-v2-page .line-items-table thead th {
  background: #f5f8ff;
  color: #4a5d8f;
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.quotation-v2-page .line-items-table th:nth-child(1),
.quotation-v2-page .line-items-table td:nth-child(1) {
  width: 30%;
}

.quotation-v2-page .line-items-table th:nth-child(2),
.quotation-v2-page .line-items-table td:nth-child(2) {
  width: 18%;
}

.quotation-v2-page .line-items-table th:nth-child(3),
.quotation-v2-page .line-items-table td:nth-child(3) {
  width: 12%;
}

.quotation-v2-page .line-items-table th:nth-child(4),
.quotation-v2-page .line-items-table td:nth-child(4) {
  width: 7%;
}

.quotation-v2-page .line-items-table th:nth-child(5),
.quotation-v2-page .line-items-table td:nth-child(5) {
  width: 10%;
}

.quotation-v2-page .line-items-table th:nth-child(6),
.quotation-v2-page .line-items-table td:nth-child(6) {
  width: 7%;
}

.quotation-v2-page .line-items-table th:nth-child(7),
.quotation-v2-page .line-items-table td:nth-child(7) {
  width: 18%;
  text-align: right;
  white-space: nowrap;
  word-break: normal;
}

.quotation-v2-page .line-items-table th:nth-child(8),
.quotation-v2-page .line-items-table td:nth-child(8) {
  width: 56px;
  min-width: 56px;
  text-align: center;
}

.quotation-v2-page .line-items-table .line-item-total {
  display: inline-block;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.quotation-v2-page .line-items-table th,
.quotation-v2-page .line-items-table td {
  padding: 0.65rem 0.42rem;
  border-bottom: 1px solid #ecf0f9;
}

.quotation-v2-page .line-items-table tbody tr:last-child td {
  border-bottom: 0;
}

.quotation-v2-commercial-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.quotation-v2-submit-row {
  margin-top: 0.22rem;
}

.quotation-v2-summary-card {
  background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
}

.quotation-v2-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem 0.8rem;
  margin-bottom: 0.62rem;
}

.quotation-v2-kpi-grid > div {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.6rem;
}

.quotation-v2-kpi-grid span {
  font-size: 0.84rem;
  color: #5a6d9f;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

.quotation-v2-kpi-grid strong {
  font-size: 0.98rem;
  color: #2d4177;
}

.quotation-v2-summary-card .totals-hint {
  margin-top: 0;
  margin-bottom: 0.1rem;
  color: #7284b0;
}

.quotation-v2-summary-card .totals-list {
  gap: 0.34rem;
  margin-top: 0.2rem;
}

.quotation-v2-summary-card .totals-list div {
  align-items: center;
  font-size: 0.92rem;
  color: #475b8f;
}

.quotation-v2-summary-card .totals-list strong {
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #2c427a;
}

.quotation-v2-summary-card .totals-list #quotationGrandTotalRow {
  margin-top: 0.36rem;
  padding-top: 0.58rem;
  border-top: 1px solid #e5eaf6;
}

.quotation-v2-summary-card .totals-list #quotationGrandTotalRow span {
  font-size: 1.62rem;
  font-weight: 800;
  color: #4d5be7;
  letter-spacing: -0.02em;
}

.quotation-v2-summary-card .totals-list #quotationGrandTotalRow strong {
  font-size: 2rem;
  font-weight: 800;
  color: #4d5be7;
  letter-spacing: -0.03em;
}

.quotation-v2-summary-card .totals-list #quotationBalanceDueRow {
  margin-top: 0.34rem;
  padding: 0.56rem 0.68rem;
  border-radius: 10px;
  border: 1px solid #cce8dc;
  background: #effaf4;
}

.quotation-v2-summary-card .totals-list #quotationBalanceDueRow span,
.quotation-v2-summary-card .totals-list #quotationBalanceDueRow strong {
  color: #16935f;
  font-weight: 800;
}

.quotation-v2-payment-card {
  display: grid;
  gap: 0.58rem;
}

.quotation-v2-payment-card .payment-status-line {
  margin-top: 0.2rem;
  margin-bottom: 0.1rem;
  padding: 0.46rem 0.58rem;
  border: 1px solid #dce3f3;
  border-radius: 9px;
  background: #f9fbff;
  color: #536796;
}

.quotation-v2-payment-card .payment-status-line strong {
  color: #1d945f;
}

.quotation-v2-quick-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.52rem;
  align-items: stretch;
}

.quotation-v2-quick-card .quotation-v2-section-head {
  grid-column: 1 / -1;
}

.quotation-v2-quick-card .ghost-btn,
.quotation-v2-quick-card .secondary-btn {
  width: 100%;
  min-height: 3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  font-size: 0.82rem;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#shareWhatsappPaymentReminderBtn {
  grid-column: 1 / -1;
}

.quotation-v2-quick-card button[data-action-blocked="true"] {
  opacity: 0.62;
  cursor: not-allowed;
}

.quotation-v2-quick-card button[data-action-blocked="true"]:hover {
  transform: none;
}

.quotation-v2-tip-card {
  display: grid;
  gap: 0.4rem;
  border-color: #e0ddfb;
  background: linear-gradient(180deg, #f4f2ff 0%, #f8f6ff 100%);
}

.quotation-v2-tip-card h3 {
  color: #5866e7;
}

.quotation-v2-tip-card p {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.46;
  color: #5d68a4;
}

.invoice-panel-card {
  background:
    linear-gradient(180deg, rgba(226, 238, 215, 0.95), rgba(234, 244, 224, 0.98));
}

.invoice-panel-card > .panel-heading {
  background: linear-gradient(120deg, rgba(230, 239, 252, 0.95), rgba(212, 227, 247, 0.96));
  border-color: rgba(80, 120, 185, 0.24);
}

.tally-invoice-form {
  gap: 0.78rem;
  border: 1px solid rgba(88, 130, 79, 0.28);
  background: rgba(240, 247, 231, 0.96);
  border-radius: 14px;
  padding: 0.72rem;
}

.tally-voucher-bar {
  display: grid;
  grid-template-columns: minmax(120px, 150px) repeat(3, minmax(0, 1fr));
  gap: 0.58rem;
  align-items: end;
  background: linear-gradient(180deg, #1f4f86, #1a4678);
  border: 1px solid rgba(16, 58, 100, 0.6);
  border-radius: 10px;
  padding: 0.62rem;
}

.tally-voucher-type {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0.42rem 0.66rem;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(106, 185, 251, 0.98), rgba(84, 165, 244, 0.94));
  border: 1px solid rgba(145, 210, 255, 0.8);
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.78rem;
  font-weight: 800;
}

.tally-voucher-bar label {
  display: grid;
  gap: 0.22rem;
  color: rgba(230, 240, 255, 0.96);
  font-size: 0.75rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.tally-voucher-bar input,
.tally-voucher-bar select {
  background-color: rgba(248, 252, 255, 0.96);
  border: 1px solid rgba(117, 161, 214, 0.85);
  border-radius: 8px;
  min-height: 40px;
  color: #0f2d4c;
  font-size: 0.95rem;
  font-weight: 700;
}

.tally-customer-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.62rem;
  border: 1px solid rgba(124, 152, 109, 0.36);
  background: rgba(228, 241, 214, 0.7);
  border-radius: 10px;
  padding: 0.62rem;
}

.tally-customer-strip label {
  margin: 0;
}

.tally-items-header {
  display: flex;
  justify-content: space-between;
  gap: 0.8rem;
  align-items: end;
  border: 1px solid rgba(128, 151, 105, 0.3);
  border-radius: 10px;
  padding: 0.62rem 0.7rem;
  background: rgba(236, 245, 226, 0.9);
}

.tally-items-header .panel-heading {
  margin: 0;
}

.tally-items-header h3 {
  margin: 0;
  font-size: 1.1rem;
}

.tally-items-header .add-row-controls {
  align-items: end;
  justify-content: flex-end;
}

.tally-keyboard-mode-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  min-height: 2.1rem;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(91, 126, 173, 0.35);
  background: rgba(236, 244, 252, 0.9);
  color: #1a3556;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.tally-keyboard-mode-toggle input {
  margin: 0;
}

.tally-items-header .add-row-count {
  min-width: 132px;
}

.tally-items-header #addInvoiceItemCount {
  min-width: 92px;
}

.tally-line-items-wrapper {
  border: 1px solid rgba(122, 150, 103, 0.34);
  border-radius: 10px;
  background: rgba(244, 250, 236, 0.96);
}

.tally-line-items-table {
  border-collapse: separate;
  border-spacing: 0;
}

.tally-line-items-table thead th {
  background: linear-gradient(180deg, #d9e9ca, #d1e2c0);
  color: #1f3459;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid rgba(118, 145, 102, 0.44);
}

.tally-line-items-table tbody td {
  background: rgba(247, 252, 240, 0.88);
}

.tally-line-items-table tbody tr:nth-child(even) td {
  background: rgba(239, 247, 227, 0.92);
}

.tally-line-items-table th:nth-child(1),
.tally-line-items-table td:nth-child(1) {
  width: 24%;
}

.tally-line-items-table th:nth-child(2),
.tally-line-items-table td:nth-child(2) {
  width: 18%;
}

.tally-line-items-table th:nth-child(3),
.tally-line-items-table td:nth-child(3) {
  width: 10%;
}

.tally-line-items-table th:nth-child(4),
.tally-line-items-table td:nth-child(4) {
  width: 12%;
}

.tally-line-items-table th:nth-child(5),
.tally-line-items-table td:nth-child(5) {
  width: 12%;
}

.tally-line-items-table th:nth-child(6),
.tally-line-items-table td:nth-child(6) {
  width: 8%;
}

.tally-line-items-table th:nth-child(7),
.tally-line-items-table td:nth-child(7) {
  width: 12%;
}

.tally-ledger-footer {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
  gap: 0.72rem;
  align-items: start;
}

.tally-ledger-lines {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.62rem;
  border: 1px solid rgba(127, 150, 107, 0.28);
  border-radius: 10px;
  padding: 0.62rem;
  background: rgba(235, 244, 224, 0.78);
}

.tally-ledger-lines .full-span {
  grid-column: 1 / -1;
}

.invoice-additional-entries,
.stock-purchase-additional-entries {
  border: 1px dashed rgba(109, 143, 96, 0.45);
  border-radius: 10px;
  padding: 0.58rem;
  background: rgba(245, 251, 238, 0.85);
  display: grid;
  gap: 0.48rem;
}

.invoice-additional-entries-header,
.stock-purchase-additional-entries-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.52rem;
}

.invoice-additional-entries-hint,
.stock-purchase-additional-entries-hint {
  margin: 0;
}

.invoice-additional-entries-list,
.stock-purchase-additional-entries-list {
  display: grid;
  gap: 0.45rem;
}

.invoice-additional-entry-row {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(108px, 0.55fr) minmax(116px, 0.6fr) minmax(120px, 0.58fr) minmax(92px, 0.48fr) auto;
  gap: 0.42rem;
  align-items: center;
}

.stock-purchase-additional-entry-row {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(108px, 0.5fr) minmax(120px, 0.55fr) auto;
  gap: 0.42rem;
  align-items: center;
}

.invoice-additional-entry-name,
.invoice-additional-entry-type,
.invoice-additional-entry-gst-mode,
.invoice-additional-entry-gst-rate,
.invoice-additional-entry-amount,
.stock-purchase-additional-entry-name,
.stock-purchase-additional-entry-type,
.stock-purchase-additional-entry-amount {
  width: 100%;
}

.invoice-additional-entry-gst-rate,
.invoice-additional-entry-amount,
.stock-purchase-additional-entry-amount {
  text-align: right;
}

.invoice-additional-entry-gst-rate::placeholder,
.invoice-additional-entry-amount::placeholder {
  color: #6f8278;
  opacity: 1;
}

.row-source-wrap {
  display: grid;
  gap: 0.16rem;
}

.row-source-hint {
  display: block;
  min-height: 0.95rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.row-source-hint.hint-master {
  color: #1d6b38;
}

.row-source-hint.hint-custom {
  color: #955300;
}

.row-source-hint.hint-empty {
  color: transparent;
}

.invoice-line-item-main-row td:first-child,
.stock-purchase-line-item-main-row td:first-child {
  vertical-align: top;
}

.invoice-additional-entry-remove,
.stock-purchase-additional-entry-remove {
  min-width: 2rem;
  min-height: 2rem;
  line-height: 1;
}

.tally-totals-list {
  border: 1px solid rgba(96, 131, 86, 0.3);
  border-radius: 10px;
  padding: 0.75rem;
  background: rgba(221, 236, 204, 0.85);
}

.tally-totals-list div {
  font-size: 1rem;
}

.tally-totals-list input {
  width: 128px;
  margin-left: auto;
  text-align: right;
  font-weight: 800;
  color: #17356f;
  border-radius: 9px;
  border: 1px solid rgba(101, 131, 191, 0.35);
  background: rgba(252, 255, 248, 0.96);
}

.invoice-panel-card {
  border-color: #dce7dd;
  background: linear-gradient(180deg, #f9fcf9 0%, #f4f8f4 100%);
  box-shadow: 0 16px 34px rgba(45, 88, 52, 0.08);
}

.invoice-panel-card > .panel-heading.invoice-create-heading {
  gap: 0.8rem;
  margin-bottom: 0.95rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.invoice-create-heading-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.72rem;
  padding: 0.05rem 0.05rem 0.78rem;
  border-bottom: 1px solid #dfe8df;
}

.invoice-panel-card #invoiceBackToHomeBtn {
  min-height: 2.15rem;
  padding: 0.35rem 0.2rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #2d6d3d;
  box-shadow: none;
  font-size: 0.95rem;
  font-weight: 700;
}

.invoice-panel-card #invoiceBackToHomeBtn i {
  font-size: 0.92rem;
}

.invoice-panel-card #invoiceMode {
  align-self: center;
  min-height: 2.1rem;
  padding: 0.44rem 0.84rem;
  border-radius: 9px;
  border: 1px solid #93caa1;
  background: #ecf8ef;
  color: #1f8b3f;
  box-shadow: none;
  font-size: 0.87rem;
  font-weight: 700;
}

.invoice-create-heading-copy h2 {
  margin: 0;
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: clamp(1.6rem, 1.45rem + 0.54vw, 2rem);
  line-height: 1.2;
  color: #1f2c25;
  letter-spacing: -0.01em;
}

.invoice-create-heading-copy p {
  margin: 0.3rem 0 0;
  color: #495c52;
  font-size: 1rem;
}

.invoice-panel-card #invoiceCreatePanel {
  display: grid;
  gap: 0.95rem;
}

.invoice-panel-card .tally-invoice-form {
  gap: 0.9rem;
  border: 0;
  background: transparent;
  border-radius: 0;
  padding: 0;
}

.invoice-panel-card .tally-voucher-bar,
.invoice-panel-card .tally-customer-strip,
.invoice-panel-card .tally-items-header,
.invoice-panel-card .tally-line-items-wrapper,
.invoice-panel-card .tally-ledger-lines,
.invoice-panel-card .tally-summary-panel {
  border: 1px solid #dbe5dc;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(64, 96, 72, 0.05);
}

.invoice-panel-card .tally-voucher-bar {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
  align-items: start;
  padding: 0.95rem;
}

.invoice-panel-card .tally-voucher-type {
  display: none;
}

.invoice-panel-card .tally-voucher-bar label {
  gap: 0.46rem;
  color: #26352f;
  font-size: 0.95rem;
  font-weight: 650;
  text-transform: none;
  letter-spacing: 0;
}

.invoice-panel-card .tally-customer-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.88rem;
  padding: 0.95rem;
}

.invoice-panel-card .tally-section-title {
  display: inline-flex;
  align-items: center;
  gap: 0.52rem;
  margin: -0.05rem 0 0.05rem;
  color: #258141;
  font-size: 1.34rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}

.invoice-panel-card .tally-section-title i {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #258141;
  background: #ecf7ee;
  border: 1px solid #c8e4cf;
  font-size: 0.82rem;
}

.invoice-panel-card .tally-customer-strip label,
.invoice-panel-card .tally-ledger-lines label {
  gap: 0.45rem;
  color: #26352f;
  font-size: 0.95rem;
  font-weight: 650;
}

.invoice-panel-card label .field-optional {
  color: #7f8e85;
  font-size: 0.85rem;
  font-weight: 600;
}

.invoice-panel-card input,
.invoice-panel-card select,
.invoice-panel-card textarea {
  min-height: 2.85rem;
  border-radius: 10px;
  border-color: #d7e1d9;
  background: #ffffff;
  color: #203028;
  font-size: 0.95rem;
  box-shadow: none;
}

.invoice-panel-card input::placeholder,
.invoice-panel-card textarea::placeholder {
  color: #a6b2aa;
}

.invoice-panel-card input:focus,
.invoice-panel-card select:focus,
.invoice-panel-card textarea:focus {
  border-color: #79bc8b;
  box-shadow: 0 0 0 3px rgba(74, 163, 98, 0.16);
}

.invoice-panel-card input[readonly],
.invoice-panel-card textarea[readonly] {
  background: #f8fbf8;
  color: #4a5d51;
}

.invoice-panel-card .field-control .field-icon {
  color: #6e7e74;
  background: #f4f8f4;
  border-color: #d8e4da;
}

.invoice-panel-card .field-control > input,
.invoice-panel-card .field-control > select,
.invoice-panel-card .field-control > textarea {
  padding-left: 2.5rem;
}

.invoice-panel-card .tally-items-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.8rem;
  align-items: center;
  padding: 0.75rem 0.95rem;
}

.invoice-panel-card .tally-items-heading-copy h3 {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.52rem;
  color: #258141;
  font-size: 1.32rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}

.invoice-panel-card .tally-items-heading-copy h3 i {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #258141;
  background: #ecf7ee;
  border: 1px solid #c8e4cf;
  font-size: 0.82rem;
}

.invoice-panel-card .tally-items-header .add-row-controls {
  align-items: center;
  gap: 0.55rem;
}

.invoice-panel-card .tally-keyboard-mode-toggle {
  min-height: 2.25rem;
  padding: 0.26rem 0.72rem;
  border-radius: 10px;
  border-color: #c8dfcf;
  background: #f4f9f5;
  color: #2a4634;
  font-size: 0.9rem;
  font-weight: 650;
  text-transform: none;
  letter-spacing: 0;
}

.invoice-panel-card .add-row-count {
  min-height: 2.25rem;
  padding: 0.2rem 0.32rem 0.2rem 0.6rem;
  border: 1px solid #d6e0d8;
  border-radius: 10px;
  background: #ffffff;
  color: #42554a;
  font-size: 0.86rem;
}

.invoice-panel-card #addInvoiceItemCount {
  min-width: 76px;
  min-height: 2.05rem;
}

.invoice-panel-card .line-items-table input,
.invoice-panel-card .line-items-table select {
  min-height: 2.35rem;
  font-size: 0.94rem;
}

.invoice-panel-card .tally-line-items-wrapper {
  overflow: auto;
}

.invoice-panel-card .tally-line-items-table thead th {
  background: #edf5ed;
  color: #2f5e3d;
  border-bottom: 1px solid #d6e3d9;
  font-size: 0.87rem;
  text-transform: none;
  letter-spacing: 0;
}

.invoice-panel-card .tally-line-items-table tbody td {
  background: #ffffff;
  border-bottom: 1px solid #edf3ee;
}

.invoice-panel-card .tally-line-items-table tbody tr:nth-child(even) td {
  background: #fcfefc;
}

.invoice-panel-card .invoice-items-footer-actions {
  margin-top: -0.15rem;
  gap: 0.55rem;
}

.invoice-panel-card .tally-ledger-footer {
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
  gap: 0.8rem;
}

.invoice-panel-card .tally-ledger-lines {
  padding: 0.88rem;
  gap: 0.78rem;
}

.invoice-panel-card .invoice-additional-entries {
  border: 1px solid #d9e5dc;
  border-radius: 12px;
  background: #fdfefd;
  padding: 0.72rem;
}

.invoice-panel-card .invoice-additional-entries-header strong {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #2a7a40;
  font-size: 1.18rem;
  font-weight: 740;
}

.invoice-panel-card .invoice-additional-entries-header strong i {
  width: 1.42rem;
  height: 1.42rem;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2a7a40;
  background: #ecf7ee;
  border: 1px solid #c8e4cf;
  font-size: 0.8rem;
}

.invoice-panel-card .invoice-additional-entries-hint {
  color: #708377;
}

.invoice-panel-card .invoice-additional-entry-row {
  gap: 0.52rem;
}

.invoice-panel-card .tally-summary-panel {
  padding: 0.86rem;
  display: grid;
  gap: 0.55rem;
}

.invoice-panel-card .tally-summary-title {
  display: inline-flex;
  align-items: center;
  gap: 0.48rem;
  color: #2a7a40;
  font-size: 1.18rem;
  font-weight: 740;
}

.invoice-panel-card .tally-summary-title i {
  width: 1.42rem;
  height: 1.42rem;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2a7a40;
  background: #ecf7ee;
  border: 1px solid #c8e4cf;
  font-size: 0.8rem;
}

.invoice-panel-card .tally-totals-list {
  margin-top: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  gap: 0.36rem;
}

.invoice-panel-card .tally-totals-list div {
  min-height: 2rem;
  align-items: center;
  border-bottom: 1px dashed #e0e8e2;
  font-size: 0.98rem;
  color: #41564a;
  padding: 0.06rem 0;
}

.invoice-panel-card .tally-totals-list div:last-child {
  margin-top: 0.35rem;
  padding: 0.6rem 0.72rem;
  border: 1px solid #cde5d4;
  border-radius: 10px;
  background: #ecf8ef;
  color: #1f8b3f;
  font-weight: 700;
}

.invoice-panel-card .tally-totals-list strong {
  color: #22392e;
  font-size: 1.01rem;
  font-weight: 700;
}

.invoice-panel-card .tally-totals-list div:last-child strong,
.invoice-panel-card #invoiceGrandTotal {
  color: #1f8b3f;
  font-size: 2rem;
  font-weight: 800;
}

.invoice-panel-card .invoice-total-input-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.22rem;
  margin-left: auto;
}

.invoice-panel-card .invoice-total-input-wrap > span {
  color: #1f8b3f;
  font-size: 1.42rem;
  font-weight: 800;
  line-height: 1;
}

.invoice-panel-card #invoiceGrandTotal {
  width: 170px;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: right;
}

.invoice-autofill-guard {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.invoice-autofill-guard input {
  position: absolute;
  left: -99999px;
  top: -99999px;
  width: 1px;
  height: 1px;
  border: 0;
  padding: 0;
}

.invoice-panel-card .payment-status-line {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  margin: 0.1rem 0 0.15rem;
  color: #53665a;
  font-size: 0.96rem;
}

.invoice-panel-card #invoiceFormStatus {
  display: inline-flex;
  align-items: center;
  min-height: 1.88rem;
  padding: 0.18rem 0.62rem;
  border-radius: 8px;
  border: 1px solid #cde5d4;
  background: #ecf8ef;
  color: #1f8b3f;
  font-size: 0.9rem;
  font-weight: 700;
}

.invoice-panel-card .invoice-print-pref-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
  margin: 0.05rem 0 0.1rem;
}

.invoice-panel-card .invoice-print-pref {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-height: 2.14rem;
  padding: 0.22rem 0.58rem;
  border: 1px solid #d6e2d9;
  border-radius: 10px;
  background: #ffffff;
  color: #3f5448;
  font-size: 0.86rem;
  font-weight: 620;
}

.invoice-panel-card .invoice-print-pref input[type="checkbox"] {
  width: 0.95rem;
  height: 0.95rem;
  accent-color: #1f8b3f;
}

.invoice-panel-card #invoiceDirectPrintBtn {
  border-color: #c4ddca;
  background: #f5faf6;
  color: #2c6f3e;
}

.invoice-panel-card .action-row {
  margin-top: 0.1rem;
  gap: 0.55rem;
}

.invoice-panel-card .primary-btn,
.invoice-panel-card .secondary-btn,
.invoice-panel-card .ghost-btn {
  min-height: 2.4rem;
  padding: 0.58rem 0.94rem;
  border-radius: 10px;
  box-shadow: none;
}

.invoice-panel-card .primary-btn {
  border: 1px solid #248744;
  background: linear-gradient(135deg, #3faa5f, #1f8b3f);
  color: #ffffff;
}

.invoice-panel-card .secondary-btn {
  border: 1px solid #c6dcc9;
  background: #f4f9f5;
  color: #2d6d3d;
}

.invoice-panel-card .ghost-btn {
  border: 1px solid #d4dfd6;
  background: #ffffff;
  color: #3f5448;
}

.invoice-panel-card #invoiceValidateBtn,
.invoice-panel-card #invoiceSubmitBtn {
  border-color: #248744;
  background: linear-gradient(135deg, #3faa5f, #1f8b3f);
  color: #ffffff;
}

.invoice-panel-card #addInvoiceItemBtn,
.invoice-panel-card #invoiceCreateItemBtn,
.invoice-panel-card #invoiceAddEntryBtn,
.invoice-panel-card #invoiceShortcutHelpBtn {
  border-color: #c4ddca;
  background: #f5faf6;
  color: #2c6f3e;
}

.invoice-panel-card #invoiceShortcutFooterBtn,
.invoice-panel-card #resetInvoiceBtn {
  border-color: #d0dbd3;
  background: #ffffff;
  color: #34493e;
}

.invoice-panel-card .invoice-shortcuts-card {
  border: 1px solid #dbe5dc;
  border-radius: 14px;
  background: #f7fbf8;
  padding: 0.9rem 0.95rem;
  display: grid;
  gap: 0.72rem;
}

.invoice-panel-card .invoice-shortcuts-head {
  display: inline-flex;
  align-items: center;
  gap: 0.48rem;
}

.invoice-panel-card .invoice-shortcuts-head i {
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2a7a40;
  background: #ecf7ee;
  border: 1px solid #c8e4cf;
  font-size: 0.78rem;
}

.invoice-panel-card .invoice-shortcuts-head h3 {
  margin: 0;
  font-size: 1.22rem;
  color: #2a7a40;
}

.invoice-panel-card .invoice-shortcuts-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.5rem;
}

.invoice-panel-card .invoice-shortcuts-grid > div {
  min-height: 2.46rem;
  border: 1px solid #deeadf;
  border-radius: 10px;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.48rem;
  padding: 0.3rem 0.56rem;
}

.invoice-panel-card .invoice-shortcuts-grid kbd {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.2rem;
  min-height: 1.48rem;
  padding: 0.12rem 0.42rem;
  border-radius: 7px;
  border: 1px solid #d4e5d8;
  background: #f0f8f2;
  color: #2f6a3e;
  font-size: 0.78rem;
  font-weight: 700;
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  box-shadow: none;
}

.invoice-panel-card .invoice-shortcuts-grid span {
  color: #4f6358;
  font-size: 0.83rem;
  font-weight: 600;
  text-align: center;
}

@media (max-width: 1280px) {
  .invoice-panel-card .invoice-shortcuts-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .invoice-panel-card .tally-voucher-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .invoice-panel-card .tally-ledger-footer {
    grid-template-columns: 1fr;
  }

  .invoice-panel-card .tally-items-header {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .invoice-panel-card .tally-items-header .add-row-controls {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .invoice-create-heading-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .invoice-panel-card #invoiceBackToHomeBtn,
  .invoice-panel-card #invoiceMode {
    justify-content: center;
    width: 100%;
  }

  .invoice-panel-card .tally-voucher-bar,
  .invoice-panel-card .tally-customer-strip {
    grid-template-columns: 1fr;
  }

  .invoice-panel-card .invoice-total-input-wrap {
    width: 100%;
    justify-content: flex-end;
  }

  .invoice-panel-card #invoiceGrandTotal {
    width: 130px;
  }

  .invoice-panel-card .invoice-print-pref,
  .invoice-panel-card #invoiceDirectPrintBtn {
    width: 100%;
    justify-content: center;
  }

  .invoice-panel-card .action-row > .primary-btn,
  .invoice-panel-card .action-row > .secondary-btn,
  .invoice-panel-card .action-row > .ghost-btn {
    width: 100%;
    justify-content: center;
  }
}

.action-row,
.search-row {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  margin-top: 1rem;
  flex-wrap: wrap;
}

.search-row {
  margin-top: 0;
  margin-bottom: 1rem;
}

.renewal-view-sticky {
  position: static;
  top: auto;
  z-index: 12;
  margin-bottom: 0.7rem;
  padding: 0.55rem 0.65rem;
  border-radius: 14px;
  border: 1px solid rgba(111, 130, 205, 0.24);
  background: linear-gradient(120deg, rgba(251, 253, 255, 0.98), rgba(239, 245, 255, 0.95));
  box-shadow: 0 10px 20px rgba(78, 98, 168, 0.12);
}

.renewal-search-row {
  margin-bottom: 0.45rem;
}

.renewal-quick-filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}

.renewal-quick-filter-label {
  font-size: 0.78rem;
  font-weight: 800;
  color: #4f5f94;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.renewal-quick-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.34rem;
}

.renewal-quick-filter-chip {
  border: 1px solid rgba(79, 102, 184, 0.24);
  border-radius: 999px;
  background: rgba(89, 111, 192, 0.1);
  color: #334780;
  font-size: 0.76rem;
  font-weight: 700;
  padding: 0.26rem 0.56rem;
  line-height: 1.2;
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.renewal-quick-filter-chip:hover {
  transform: translateY(-1px);
}

.renewal-quick-filter-chip:focus-visible {
  outline: 2px solid rgba(66, 97, 196, 0.46);
  outline-offset: 2px;
}

.renewal-quick-filter-chip.is-active {
  border-color: #395ec5;
  background: linear-gradient(135deg, #5d7fe8 0%, #3f66d2 100%);
  color: #ffffff;
  box-shadow: 0 8px 16px rgba(46, 78, 173, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.renewal-quick-filter-chip.is-active:hover {
  transform: translateY(-1px);
}

.renewal-clear-filters-btn {
  margin-left: auto;
  white-space: nowrap;
  border: 1px solid rgba(67, 89, 168, 0.28);
  background: rgba(255, 255, 255, 0.84);
  color: #2f447a;
}

.renewal-bulk-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.42rem;
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px dashed rgba(84, 106, 187, 0.24);
}

.renewal-select-all-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: #3f5186;
}

.renewal-bulk-count {
  font-size: 0.82rem;
  color: #3b4f82;
  background: rgba(93, 123, 214, 0.12);
  border: 1px solid rgba(93, 123, 214, 0.2);
  border-radius: 999px;
  padding: 0.26rem 0.62rem;
}

.renewal-bulk-row select {
  min-width: 180px;
}

.renewal-auto-cycle-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: auto;
  font-size: 0.8rem;
  font-weight: 700;
  color: #3e4f80;
}

.renewal-auto-cycle-toggle input {
  margin: 0;
}

.renewal-action-queue-card {
  margin-bottom: 0.75rem;
  padding: 0.64rem 0.75rem;
  border-radius: 16px;
  border: 1px solid rgba(67, 93, 178, 0.2);
  background: linear-gradient(145deg, rgba(252, 254, 255, 0.96), rgba(239, 246, 255, 0.9));
  box-shadow: 0 10px 24px rgba(62, 86, 164, 0.08);
}

.renewal-action-queue-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.4rem 0.8rem;
  margin-bottom: 0.58rem;
}

.renewal-action-queue-head h3 {
  margin: 0;
  font-size: 0.98rem;
  color: #233b78;
}

.renewal-action-queue-head p {
  margin: 0;
  font-size: 0.82rem;
  color: #566696;
}

.renewal-action-queue-list {
  display: grid;
  gap: 0.48rem;
}

.renewal-action-queue-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.48rem;
  border: 1px solid rgba(84, 108, 186, 0.18);
  background: rgba(255, 255, 255, 0.92);
  border-radius: 12px;
  padding: 0.55rem 0.64rem;
}

.renewal-action-queue-meta {
  display: grid;
  gap: 0.14rem;
}

.renewal-action-queue-meta strong {
  color: #1f356b;
}

.renewal-action-queue-meta span {
  font-size: 0.82rem;
  color: #52608b;
}

.renewal-action-queue-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
}

.renewal-action-queue-days {
  font-size: 0.78rem;
  font-weight: 800;
  color: #39509a;
  background: rgba(75, 101, 188, 0.12);
  border-radius: 999px;
  padding: 0.22rem 0.55rem;
}

.search-row > input[type="search"],
.search-row .search-control {
  flex: 1 1 320px;
}

.accounting-shortcut-dialog,
.accounting-validation-dialog {
  max-width: min(700px, 94vw);
}

.accounting-validation-issue-list {
  display: grid;
  gap: 0.48rem;
  margin-top: 0.55rem;
}

.accounting-validation-issue-btn {
  width: 100%;
  border: 1px solid rgba(153, 84, 57, 0.28);
  border-radius: 10px;
  background: rgba(255, 246, 236, 0.9);
  color: #5c2b19;
  padding: 0.58rem 0.66rem;
  text-align: left;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.45rem;
  align-items: start;
  cursor: pointer;
}

.accounting-validation-issue-btn:hover,
.accounting-validation-issue-btn:focus-visible {
  border-color: rgba(153, 84, 57, 0.5);
  background: rgba(255, 239, 222, 0.96);
}

.accounting-validation-issue-index {
  font-weight: 800;
}

.compact-table td strong {
  font-family: "Space Grotesk", sans-serif;
}

.search-control {
  position: relative;
  display: flex;
  align-items: center;
}

.search-control .field-icon {
  position: absolute;
  left: 0.62rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.48rem;
  height: 1.48rem;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.82rem;
  color: #6155d8;
  background: rgba(111, 99, 255, 0.12);
  border: 1px solid rgba(111, 99, 255, 0.2);
  pointer-events: none;
}

.search-control input[type="search"] {
  padding-left: 2.6rem;
}

.user-form-status {
  margin-top: 0;
  min-height: 1.2rem;
  font-weight: 700;
}

.error-text {
  color: var(--danger);
}

.compact-filter {
  display: grid;
  gap: 0.35rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--muted);
  min-width: 180px;
}

.compact-filter select {
  min-width: 170px;
}

.compact-filter input[type="date"] {
  min-width: 170px;
}

.saved-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.saved-filter-grid label {
  display: grid;
  gap: 0.35rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--muted);
}

.saved-filter-actions {
  display: flex;
  align-items: end;
}

.saved-filter-actions .ghost-btn {
  width: 100%;
}

.saved-insights {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.serial-insights {
  margin-top: 0.15rem;
}

.serial-home-product-card {
  margin-top: 0.85rem;
}

.serial-home-product-search-row {
  align-items: center;
}

.serial-home-product-search-row .secondary-btn {
  white-space: nowrap;
}

.serial-home-serial-search-row {
  align-items: center;
  margin-top: -0.1rem;
}

.serial-home-serial-search-row .secondary-btn {
  white-space: nowrap;
}

.serial-records-toolbar {
  display: grid;
  gap: 0.7rem;
  margin-bottom: 0.9rem;
}

.serial-records-row {
  display: grid;
  gap: 0.7rem;
  align-items: end;
}

.serial-records-row-search {
  grid-template-columns: minmax(360px, 1fr) auto;
  align-items: center;
  border: 1px solid rgba(129, 149, 211, 0.3);
  border-radius: 14px;
  padding: 0.62rem 0.7rem 0.68rem;
  background: linear-gradient(145deg, rgba(246, 250, 255, 0.88), rgba(239, 246, 255, 0.74));
}

.serial-records-row-filters {
  grid-template-columns: repeat(3, minmax(180px, 1fr)) auto;
  border: 1px solid rgba(129, 149, 211, 0.3);
  border-radius: 14px;
  padding: 0.62rem 0.7rem 0.68rem;
  background: linear-gradient(145deg, rgba(245, 249, 255, 0.9), rgba(236, 245, 255, 0.74));
}

.serial-records-inline-search {
  display: grid;
  gap: 0.35rem;
}

.serial-records-inline-search input {
  margin: 0;
}

.serial-records-inline-label {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #5a6c9f;
}

.serial-records-inline-label i {
  font-size: 0.84rem;
}

.serial-records-quick-actions {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 0.5rem;
}

.serial-records-quick-actions .secondary-btn {
  white-space: nowrap;
}

.serial-records-filter {
  min-width: 0;
}

.serial-records-filter select {
  min-width: 0;
  width: 100%;
}

.serial-records-attention-btn {
  min-height: 2.7rem;
  white-space: nowrap;
}

.serial-records-row-actions {
  grid-template-columns: minmax(320px, 1fr) minmax(360px, 1fr);
  align-items: stretch;
}

.serial-records-action-group {
  border: 1px solid rgba(129, 149, 211, 0.34);
  border-radius: 14px;
  padding: 0.72rem 0.78rem 0.78rem;
  background: linear-gradient(160deg, rgba(248, 251, 255, 0.86), rgba(242, 247, 255, 0.72));
}

.serial-records-action-group-bulk {
  background: linear-gradient(160deg, rgba(245, 250, 255, 0.92), rgba(234, 243, 255, 0.76));
}

.serial-records-action-group-sync {
  background: linear-gradient(160deg, rgba(244, 250, 255, 0.92), rgba(232, 246, 255, 0.78));
}

.serial-records-action-title {
  margin: 0 0 0.5rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #5a6c9f;
}

.serial-home-product-summary-meta {
  margin-top: 0;
  margin-bottom: 0.55rem;
}

.serial-home-product-table {
  table-layout: fixed;
}

.serial-home-product-table th:first-child,
.serial-home-product-table td:first-child {
  width: 28%;
}

.serial-home-product-table th:nth-child(2),
.serial-home-product-table td:nth-child(2) {
  width: 14%;
}

.serial-home-product-table th:nth-child(n + 3),
.serial-home-product-table td:nth-child(n + 3) {
  width: calc(58% / 7);
  text-align: center;
}

.serial-summary-sku {
  margin-top: 0;
}

.serial-product-count-btn {
  min-width: 44px;
  height: 30px;
  border: 1px solid rgba(84, 101, 176, 0.3);
  border-radius: 10px;
  background: rgba(93, 110, 186, 0.12);
  color: #233672;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  transition: transform 0.14s ease, box-shadow 0.14s ease, background 0.18s ease;
}

.serial-product-count-btn:hover {
  transform: translateY(-1px);
  background: rgba(93, 110, 186, 0.2);
  box-shadow: 0 8px 18px rgba(40, 58, 118, 0.15);
}

.serial-product-count-btn:focus-visible {
  outline: 2px solid rgba(99, 114, 255, 0.55);
  outline-offset: 2px;
}

.serial-product-count-btn.is-empty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 30px;
  border-radius: 10px;
  background: rgba(95, 109, 161, 0.08);
  color: #7d86a8;
  font-weight: 700;
}

.serial-drilldown-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  margin-bottom: 0.75rem;
  padding: 0.56rem 0.7rem;
  border-radius: 12px;
  border: 1px solid rgba(107, 122, 188, 0.3);
  background: linear-gradient(130deg, rgba(100, 115, 203, 0.12), rgba(129, 142, 210, 0.08));
}

#serialDrilldownText {
  font-size: 0.88rem;
  font-weight: 700;
  color: #314680;
}

#tab-items table th:first-child,
#tab-items table td:first-child {
  width: 46px;
  min-width: 46px;
  text-align: center;
}

#itemSelectAll,
.item-row-select {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--primary-deep);
}

#serialRecordsPanel table th:first-child,
#serialRecordsPanel table td:first-child {
  width: 46px;
  min-width: 46px;
  text-align: center;
}

#serialSelectAll,
.serial-row-select {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--primary-deep);
}

.serial-bulk-actions {
  min-width: 360px;
}

.serial-bulk-actions-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.serial-bulk-actions-row .danger-btn {
  margin: 0;
  white-space: nowrap;
}

.serial-bulk-actions-row .secondary-btn {
  margin: 0;
  white-space: nowrap;
}

.serial-bulk-actions-row .secondary-btn i,
.serial-bulk-actions-row .danger-btn i {
  margin-right: 0.28rem;
}

.serial-b2b-sync-actions {
  min-width: 360px;
}

.serial-b2b-sync-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 0.45rem;
  align-items: center;
}

.serial-b2b-sync-row select {
  min-width: 0;
}

.serial-b2b-sync-row .primary-btn {
  white-space: nowrap;
  min-width: 190px;
}

.serial-b2b-sync-row .primary-btn i {
  margin-right: 0.28rem;
}

.serial-b2b-sync-note {
  margin: 0.42rem 0 0;
  font-size: 0.78rem;
  line-height: 1.35;
  color: #546598;
}

.serial-b2b-sync-mini-summary {
  margin-top: 0.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.38rem;
}

.serial-b2b-summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.26rem 0.58rem;
  border-radius: 999px;
  border: 1px solid rgba(82, 101, 175, 0.24);
  background: rgba(92, 111, 186, 0.1);
  color: #304179;
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.serial-b2b-summary-chip-button {
  font: inherit;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.serial-b2b-summary-chip-button:hover {
  transform: translateY(-1px);
}

.serial-b2b-summary-chip-button:focus-visible {
  outline: 2px solid rgba(63, 95, 196, 0.42);
  outline-offset: 2px;
}

.serial-b2b-summary-chip-button.is-active {
  border-color: rgba(47, 77, 178, 0.55);
  box-shadow: inset 0 0 0 1px rgba(47, 77, 178, 0.25);
}

.serial-b2b-summary-chip strong {
  font-size: 0.82rem;
  font-weight: 800;
}

.serial-b2b-summary-chip-pending {
  background: rgba(154, 107, 0, 0.12);
  border-color: rgba(154, 107, 0, 0.2);
  color: #7f5800;
}

.serial-b2b-summary-chip-approved {
  background: rgba(45, 106, 79, 0.13);
  border-color: rgba(45, 106, 79, 0.2);
  color: #24553f;
}

.serial-b2b-summary-chip-rejected {
  background: rgba(168, 59, 50, 0.13);
  border-color: rgba(168, 59, 50, 0.18);
  color: #8f2f2a;
}

.serial-b2b-summary-chip-withdrawn {
  background: rgba(74, 88, 133, 0.12);
  border-color: rgba(74, 88, 133, 0.2);
  color: #3a486f;
}

.serial-b2b-summary-chip-selected {
  background: rgba(62, 96, 205, 0.12);
  border-color: rgba(62, 96, 205, 0.24);
  color: #284391;
}

#serialAttentionOnlyBtn {
  white-space: nowrap;
}

.serial-view-summary-actions {
  margin-top: 0.85rem;
}

#serialRecordsPanel .serial-main-table {
  table-layout: fixed;
}

#serialRecordsPanel .serial-main-table th:nth-child(2),
#serialRecordsPanel .serial-main-table td:nth-child(2) {
  width: 14%;
}

#serialRecordsPanel .serial-main-table th:nth-child(3),
#serialRecordsPanel .serial-main-table td:nth-child(3) {
  width: 14%;
}

#serialRecordsPanel .serial-main-table th:nth-child(4),
#serialRecordsPanel .serial-main-table td:nth-child(4) {
  width: 20%;
}

#serialRecordsPanel .serial-main-table th:nth-child(5),
#serialRecordsPanel .serial-main-table td:nth-child(5) {
  width: 16%;
}

#serialRecordsPanel .serial-main-table th:nth-child(6),
#serialRecordsPanel .serial-main-table td:nth-child(6) {
  width: 10%;
}

#serialRecordsPanel .serial-main-table th:nth-child(7),
#serialRecordsPanel .serial-main-table td:nth-child(7) {
  width: 10%;
}

#serialRecordsPanel .serial-main-table th:nth-child(8),
#serialRecordsPanel .serial-main-table td:nth-child(8) {
  width: 16%;
}

#serialRecordsPanel .serial-main-table tbody tr:hover {
  background: rgba(111, 99, 255, 0.05);
}

#serialRecordsPanel .serial-main-table tbody td {
  min-width: 0;
  word-break: break-word;
}

.serial-b2b-incoming-panel {
  margin: 0.35rem 0 0.8rem;
}

.serial-home-incoming-panel {
  margin: 0.65rem 0 0.95rem;
}

#serialHomeOpenIncomingBtn .replacement-home-action-copy small {
  color: #4c5e92;
  font-weight: 600;
}

.serial-b2b-incoming-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
}

.serial-b2b-incoming-context {
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  padding: 0.25rem 0.85rem;
  border-radius: 999px;
  background: rgba(111, 99, 255, 0.08);
  color: #2d3e74;
  font-weight: 700;
  font-size: 0.86rem;
}

.serial-b2b-open-products-btn,
.serial-b2b-open-jobs-btn {
  white-space: nowrap;
}

.serial-b2b-product-map-box {
  margin: 0.25rem 0 0.55rem;
  padding: 0.72rem;
  border: 1px solid rgba(20, 33, 61, 0.12);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.86);
}

.serial-b2b-product-map-box .replacement-b2b-item-map-suggest {
  font-weight: 600;
  color: #41538d;
}

.serial-b2b-map-current {
  margin-top: 0.18rem;
  font-size: 0.78rem;
  line-height: 1.34;
  color: #4f5f8f;
  font-weight: 600;
}

.serial-b2b-map-select-control {
  margin-top: 0.1rem;
}

.serial-b2b-map-last {
  margin-top: 0.28rem;
  margin-bottom: 0.08rem;
  font-size: 0.75rem;
  line-height: 1.35;
  color: #4f628f;
  font-weight: 600;
}

.serial-b2b-approve-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 0.55rem;
  margin-top: 0.38rem;
}

.serial-b2b-approve-meta-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.serial-b2b-approve-meta-field > span {
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: 0.01em;
  color: #4a5a89;
}

.serial-b2b-approve-meta-field > small {
  margin-top: -0.03rem;
  font-size: 0.71rem;
  line-height: 1.3;
  color: #6d7ca4;
}

.serial-primary-text {
  display: block;
  color: var(--surface-ink);
  font-weight: 700;
  line-height: 1.26;
}

.serial-no-text {
  font-family: "Space Grotesk", sans-serif;
  letter-spacing: 0.02em;
}

.serial-secondary-text {
  display: block;
  margin-top: 0.16rem;
  color: var(--muted);
  line-height: 1.3;
  font-size: 0.84rem;
}

.serial-meta-label {
  font-weight: 700;
  color: #50629b;
}

.serial-source-manual-sale {
  color: #c83434;
  font-weight: 800;
}

.serial-status-cell,
.serial-warranty-cell {
  white-space: normal;
}

.serial-status-cell .quotation-status-badge {
  font-size: 0.75rem;
  padding: 0.28rem 0.58rem;
}

.serial-warranty-cell .serial-primary-text {
  font-size: 0.9rem;
}

.serial-warranty-badge {
  white-space: normal;
  max-width: 100%;
}

.serial-voucher-toolbar {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(280px, 1fr);
  gap: 1rem;
  align-items: end;
  margin-bottom: 0.85rem;
}

.serial-voucher-search input {
  width: 100%;
}

.serial-voucher-pagination {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.7rem;
  margin-top: 1rem;
}

.serial-voucher-editor-card {
  margin-top: 1rem;
}

.serial-voucher-reference {
  color: var(--surface-ink);
  font-weight: 800;
}

.serial-voucher-serial-list {
  max-width: 260px;
  white-space: normal;
  line-height: 1.35;
}

.serial-action-cell {
  text-align: right;
}

.serial-action-cluster {
  justify-content: flex-end;
  gap: 0.38rem;
}

.serial-action-btn {
  padding: 0.42rem 0.66rem;
  font-size: 0.82rem;
  border-radius: 10px;
  box-shadow: none;
}

.action-menu,
.serial-action-menu {
  position: relative;
  display: inline-block;
}

.action-menu summary,
.serial-action-menu summary {
  list-style: none;
  cursor: pointer;
}

.action-menu summary::-webkit-details-marker,
.serial-action-menu summary::-webkit-details-marker {
  display: none;
}

.action-menu-summary,
.serial-action-summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.42rem 0.8rem;
}

.action-menu-list,
.serial-action-menu-list {
  position: absolute;
  right: 0;
  top: calc(100% + 0.35rem);
  min-width: 182px;
  z-index: 9;
  display: grid;
  gap: 0.36rem;
  padding: 0.5rem;
  border-radius: 12px;
  border: 1px solid rgba(113, 130, 196, 0.35);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 16px 28px rgba(30, 48, 98, 0.16);
  max-height: min(62vh, 420px);
  overflow-y: auto;
}

.action-menu-list .action-menu-btn,
.action-menu-list .serial-action-btn,
.serial-action-menu-list .action-menu-btn,
.serial-action-menu-list .serial-action-btn {
  width: 100%;
  text-align: left;
}

.action-menu-summary {
  white-space: nowrap;
}

.action-menu-up .action-menu-list {
  top: auto;
  bottom: calc(100% + 0.35rem);
}

.action-menu-section {
  display: grid;
  gap: 0.32rem;
}

.action-menu-section + .action-menu-section {
  border-top: 1px solid rgba(113, 130, 196, 0.24);
  padding-top: 0.42rem;
}

.action-menu-section-title {
  margin: 0;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5a6b9e;
  font-weight: 800;
}

.action-menu-quotation .action-menu-list {
  min-width: 232px;
}

.action-cell {
  text-align: right;
}

.action-row-end {
  justify-content: flex-end;
}

.action-row-split {
  justify-content: space-between;
  align-items: flex-start;
}

.renewal-card-actions {
  align-items: center;
}

.renewal-card-primary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.renewal-card-primary-action {
  border: 1px solid rgba(63, 93, 192, 0.24);
  background: rgba(70, 99, 193, 0.1);
  color: #2b417e;
}

.renewal-card-primary-action-renew {
  border-color: rgba(39, 126, 87, 0.28);
  background: rgba(39, 126, 87, 0.13);
  color: #1e6545;
}

.renewal-card-primary-action-plus {
  border-color: rgba(82, 111, 189, 0.28);
  background: rgba(82, 111, 189, 0.12);
  color: #2f4d96;
}

.action-cluster-status {
  gap: 0.45rem;
}

.quotation-card-actions-right {
  margin-left: auto;
  justify-content: flex-end;
  align-items: center;
  gap: 0.45rem;
}

.quotation-print-btn {
  background: rgba(85, 102, 184, 0.12);
  border: 1px solid rgba(85, 102, 184, 0.26);
  color: #2c4087;
}

.quotation-edit-btn {
  background: linear-gradient(135deg, #5865f2 0%, #4957e6 100%);
  border: 1px solid rgba(74, 90, 220, 0.42);
  color: #ffffff;
}

.saved-insight-card {
  background: rgba(255, 255, 255, 0.52);
  border: 1px solid rgba(20, 33, 61, 0.08);
  border-radius: 16px;
  padding: 0.8rem 0.9rem;
  display: grid;
  gap: 0.35rem;
}

.saved-insight-card span {
  color: var(--muted);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
}

.saved-insight-card strong {
  font-family: "Space Grotesk", sans-serif;
  color: var(--surface-ink);
  font-size: 1.08rem;
}

#serialWorkflowGrid[hidden],
#serialPurchasePanel[hidden],
#serialSalePanel[hidden],
#serialViewPanel[hidden],
.serial-view-panel[hidden],
.serial-workflow-card[hidden] {
  display: none !important;
}

.serial-workflow-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
  margin-bottom: 1rem;
}

.serial-workflow-grid.serial-single-view {
  grid-template-columns: minmax(0, 1fr);
}

.serial-view-panel {
  min-width: 0;
}

.serial-workflow-card {
  display: grid;
  gap: 0.75rem;
  padding: 0.9rem;
}

@media (max-width: 960px) {
  .serial-home-product-search-row {
    flex-direction: column;
    align-items: stretch;
  }

  .serial-home-product-search-row .secondary-btn {
    width: 100%;
  }

  .serial-drilldown-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .serial-drilldown-bar .ghost-btn {
    width: 100%;
  }
}

.serial-workflow-card .panel-heading.compact {
  margin-bottom: 0;
}

.serial-preview-card {
  margin-top: 0.75rem;
  display: grid;
  gap: 0.75rem;
}

.serial-preview-insights {
  margin-bottom: 0;
}

.serial-preview-card .data-table {
  max-height: 300px;
}

.serial-search-summary {
  margin-top: -0.45rem;
  margin-bottom: 0.75rem;
}

.serial-sale-pick-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.7rem;
  align-items: start;
}

.serial-sale-pick-wrap select[multiple] {
  min-height: 206px;
}

.serial-sale-pick-wrap .secondary-btn {
  justify-self: start;
  min-width: 220px;
}

.serial-manual-dialog {
  width: min(960px, 100%);
}

.serial-bulk-edit-dialog {
  width: min(760px, 100%);
}

.serial-bulk-edit-dialog .action-row {
  justify-content: flex-end;
}

.serial-manual-dialog .serial-manual-form {
  padding: 0;
}

.serial-manual-dialog .form-grid {
  margin-top: 0.25rem;
}

.serial-manual-dialog .action-row {
  justify-content: flex-end;
  margin-top: 0.25rem;
}

.serial-manual-dialog-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.invoice-serial-dialog {
  width: min(1080px, 100%);
}

.invoice-serial-decision-dialog {
  width: min(620px, 100%);
}

.renewal-history-dialog {
  width: min(1080px, 100%);
}

.renewal-history-summary {
  margin: 0 0 0.62rem;
}

.renewal-history-meta-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid rgba(113, 130, 196, 0.24);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.74);
}

.renewal-history-meta-table th,
.renewal-history-meta-table td {
  padding: 0.42rem 0.58rem;
  text-align: left;
  vertical-align: top;
  border-top: 1px solid rgba(113, 130, 196, 0.14);
  line-height: 1.35;
}

.renewal-history-meta-table tr:first-child th,
.renewal-history-meta-table tr:first-child td {
  border-top: 0;
}

.renewal-history-meta-table th {
  width: 170px;
  color: #4c5e92;
  font-size: 0.78rem;
  font-weight: 800;
  background: rgba(238, 243, 255, 0.72);
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.renewal-history-meta-table td {
  color: #2f437a;
  font-size: 0.87rem;
  font-weight: 600;
  word-break: break-word;
}

.renewal-history-table-wrap {
  border: 1px solid rgba(113, 130, 196, 0.24);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.68);
  max-height: min(58vh, 640px);
  overflow: auto;
}

.renewal-history-table {
  margin: 0;
}

.renewal-history-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: rgba(237, 241, 255, 0.98);
}

.renewal-history-table td {
  vertical-align: top;
}

.renewal-history-key-list {
  display: grid;
  gap: 0.22rem;
}

.renewal-history-key-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.16rem 0.5rem;
  border-radius: 999px;
  border: 1px solid rgba(113, 130, 196, 0.3);
  background: rgba(255, 255, 255, 0.84);
  color: var(--text);
  font-size: 0.78rem;
  font-weight: 700;
}

.rate-list-order-drawer-overlay {
  place-items: stretch end;
  padding: 0;
}

.rate-list-order-preview-dialog {
  width: min(780px, 100%);
  height: 100dvh;
  max-height: 100dvh;
  border-radius: 0;
  border-right: 0;
  display: grid;
  grid-template-rows: auto auto auto auto minmax(0, 1fr) auto;
  gap: 0.75rem;
  overflow: auto;
}

.rate-list-order-preview-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.rate-list-order-preview-kpi {
  border: 1px solid rgba(101, 123, 202, 0.28);
  border-radius: 14px;
  padding: 0.65rem 0.75rem;
  background: linear-gradient(140deg, rgba(255, 255, 255, 0.96), rgba(241, 246, 255, 0.9));
}

.rate-list-order-preview-kpi span {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.rate-list-order-preview-kpi strong {
  display: block;
  color: var(--surface-ink);
  font-size: 1.08rem;
  line-height: 1.25;
  margin-top: 0.18rem;
}

.rate-list-order-preview-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  max-height: min(26vh, 240px);
  overflow: auto;
  align-content: start;
  padding-right: 0.18rem;
}

.rate-list-order-preview-meta-item {
  border: 1px solid rgba(113, 130, 196, 0.24);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.76);
  padding: 0.5rem 0.62rem;
}

.rate-list-order-preview-meta-label {
  display: block;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
}

.rate-list-order-preview-meta-value {
  display: block;
  margin-top: 0.14rem;
  color: var(--surface-ink);
  font-size: 0.9rem;
  line-height: 1.35;
  word-break: break-word;
}

.rate-list-order-preview-table-wrap {
  border: 1px solid rgba(113, 130, 196, 0.24);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.68);
  min-height: 0;
  max-height: none;
  overflow: auto;
}

.rate-list-order-preview-table {
  margin: 0;
}

.rate-list-order-preview-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: rgba(237, 241, 255, 0.98);
}

.rate-list-order-preview-table th:nth-child(1),
.rate-list-order-preview-table td:nth-child(1) {
  width: 68px;
  white-space: nowrap;
}

.rate-list-order-preview-table th:nth-child(3),
.rate-list-order-preview-table td:nth-child(3),
.rate-list-order-preview-table th:nth-child(4),
.rate-list-order-preview-table td:nth-child(4),
.rate-list-order-preview-table th:nth-child(5),
.rate-list-order-preview-table td:nth-child(5) {
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .rate-list-order-preview-kpis,
  .rate-list-order-preview-meta-grid {
    grid-template-columns: 1fr;
  }
}

.invoice-serial-item-list {
  display: grid;
  gap: 0.8rem;
  max-height: min(62vh, 760px);
  overflow-y: auto;
  padding-right: 0.2rem;
}

.invoice-serial-item-card {
  border: 1px solid rgba(113, 130, 196, 0.26);
  border-radius: 14px;
  padding: 0.8rem;
  background: rgba(255, 255, 255, 0.66);
  display: grid;
  gap: 0.65rem;
}

.invoice-serial-item-head {
  display: flex;
  justify-content: space-between;
  gap: 0.8rem;
  align-items: center;
  flex-wrap: wrap;
}

.invoice-serial-item-head strong {
  color: var(--text);
}

.invoice-serial-qty-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.36rem;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  background: rgba(73, 101, 226, 0.12);
  color: var(--text);
  font-weight: 700;
  font-size: 0.86rem;
}

.invoice-serial-entry-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: 0.55rem;
  align-items: end;
}

.invoice-serial-bulk-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.55rem;
  align-items: end;
}

.invoice-serial-entry-row .small-btn,
.invoice-serial-bulk-row .small-btn {
  white-space: nowrap;
}

.invoice-serial-item-card textarea {
  min-height: 84px;
}

.invoice-serial-selected {
  border: 1px dashed rgba(113, 130, 196, 0.35);
  border-radius: 12px;
  padding: 0.6rem 0.7rem;
  background: rgba(255, 255, 255, 0.64);
}

.invoice-serial-selected-label {
  display: block;
  margin-bottom: 0.32rem;
  font-weight: 700;
  color: var(--text);
  font-size: 0.86rem;
}

.invoice-serial-selected-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.invoice-serial-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: 999px;
  border: 1px solid rgba(113, 130, 196, 0.35);
  background: rgba(255, 255, 255, 0.95);
  color: var(--text);
  padding: 0.2rem 0.56rem;
  font-size: 0.8rem;
  font-weight: 700;
}

.invoice-serial-chip button {
  border: 0;
  background: transparent;
  color: var(--text-soft);
  font-weight: 700;
  padding: 0;
  line-height: 1;
  cursor: pointer;
}

.invoice-serial-chip button:hover {
  color: var(--danger);
}

.invoice-serial-item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  color: var(--text-soft);
  font-size: 0.82rem;
}

.invoice-serial-item-meta strong {
  color: var(--text);
}

@media (max-width: 900px) {
  .invoice-serial-entry-row,
  .invoice-serial-bulk-row {
    grid-template-columns: 1fr;
  }
}

.serial-warranty-badge {
  display: inline-flex;
  margin-top: 0.35rem;
  font-size: 0.72rem;
  padding: 0.22rem 0.46rem;
}

.primary-btn,
.secondary-btn,
.ghost-btn,
.icon-btn,
.small-btn {
  border: 0;
  border-radius: 12px;
  padding: 0.9rem 1rem;
  font-weight: 700;
  transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.primary-btn:hover,
.secondary-btn:hover,
.ghost-btn:hover,
.icon-btn:hover,
.small-btn:hover,
.tab-btn:hover {
  transform: translateY(-1px);
}

.primary-btn {
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  color: #fff8f1;
  box-shadow: 0 18px 32px rgba(184, 92, 56, 0.22);
}

.secondary-btn {
  background: rgba(38, 70, 83, 0.1);
  color: var(--accent);
}

.ghost-btn {
  background: transparent;
  color: var(--surface-ink);
  border: 1px solid var(--line-strong);
}

.primary-btn.is-loading,
.secondary-btn.is-loading,
.ghost-btn.is-loading,
.small-btn.is-loading,
.icon-btn.is-loading {
  position: relative;
  pointer-events: none;
}

.primary-btn.is-loading::after,
.secondary-btn.is-loading::after,
.ghost-btn.is-loading::after,
.small-btn.is-loading::after,
.icon-btn.is-loading::after {
  content: "";
  width: 0.9rem;
  height: 0.9rem;
  margin-left: 0.48rem;
  border-radius: 999px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  display: inline-block;
  vertical-align: -0.12rem;
  animation: btn-spin 0.72s linear infinite;
}

@keyframes btn-spin {
  to {
    transform: rotate(360deg);
  }
}

.icon-btn {
  background: rgba(184, 92, 56, 0.1);
  color: var(--primary-deep);
  width: 34px;
  height: 34px;
  padding: 0;
  font-size: 0.92rem;
}

.small-btn {
  background: rgba(20, 33, 61, 0.08);
  color: var(--surface-ink);
  padding: 0.6rem 0.85rem;
  font-size: 0.9rem;
}

.section-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-left: auto;
}

.section-back-btn[hidden] {
  display: none;
}

.toast-stack {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  pointer-events: none;
}

.app-toast {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.8rem;
  align-items: start;
  padding: 0.95rem 1rem;
  width: min(420px, calc(100vw - 2rem));
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(20, 33, 61, 0.08);
  box-shadow: 0 22px 48px rgba(26, 43, 84, 0.18);
  opacity: 0;
  transform: translateY(-12px) scale(0.98);
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: auto;
}

.app-toast.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.app-toast-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 12px;
  background: rgba(45, 106, 79, 0.12);
  color: #2d6a4f;
  font-size: 1.05rem;
}

.app-toast-error .app-toast-icon {
  background: rgba(168, 59, 50, 0.12);
  color: #a83b32;
}

.app-toast-warning .app-toast-icon {
  background: rgba(154, 107, 0, 0.14);
  color: #8a5d00;
}

.app-toast-copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

.app-toast-copy strong {
  color: var(--surface-ink);
  font-size: 0.95rem;
}

.app-toast-copy span {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.35;
}

.app-toast-close {
  border: 0;
  background: rgba(20, 33, 61, 0.06);
  color: var(--muted);
  border-radius: 999px;
  width: 1.8rem;
  height: 1.8rem;
  padding: 0;
}

.action-cluster {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.add-row-controls {
  align-items: center;
}

.add-row-count {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--muted);
  min-width: 120px;
}

.add-row-count select {
  width: auto;
  min-width: 88px;
  padding: 0.56rem 0.6rem;
  border-radius: 10px;
}

.item-master-tab-panel[hidden] {
  display: none !important;
}

.item-master-view-actions {
  margin-bottom: 0.8rem;
}

.product-customization-card {
  margin-top: 1rem;
}

.product-customization-summary-ribbon {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.62rem;
  margin-top: 0.2rem;
}

.product-customization-summary-chip {
  border: 1px solid rgba(118, 136, 212, 0.26);
  border-radius: 14px;
  background: rgba(250, 252, 255, 0.93);
  box-shadow: 0 10px 20px rgba(66, 86, 156, 0.08);
  padding: 0.6rem 0.68rem;
  display: grid;
  gap: 0.2rem;
}

.product-customization-summary-chip span {
  font-size: 0.73rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  font-weight: 700;
}

.product-customization-summary-chip strong {
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: 1.03rem;
  color: #2b4fb8;
}

.product-customization-nav {
  margin-top: 0.85rem;
}

.product-customization-page[hidden] {
  display: none !important;
}

.product-family-post-save-actions {
  margin-top: 0.68rem;
}

.product-customization-rate-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.85rem;
}

.product-customization-rate-split > .product-customization-rate-pane:only-child {
  grid-column: 1 / -1;
}

.product-customization-rate-pane {
  border: 1px solid rgba(121, 139, 214, 0.22);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.84);
  padding: 0.82rem;
}

.product-customization-subhead {
  margin-top: 0;
}

.product-customization-subhead h4 {
  margin: 0.1rem 0 0;
  font-size: 1rem;
}

.product-customization-selected-chips {
  display: flex;
  gap: 0.34rem;
  flex-wrap: wrap;
  margin-top: 0.45rem;
}

.product-customization-selected-chip {
  border: 1px solid rgba(111, 99, 255, 0.28);
  border-radius: 999px;
  background: rgba(238, 242, 255, 0.95);
  color: #2f4b97;
  padding: 0.2rem 0.5rem;
  font-size: 0.77rem;
  font-weight: 700;
}

.product-customization-missing-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.55rem 0 0.25rem;
}

.product-customization-missing-badge {
  border: 1px solid #ffc6c6;
  background: #fff3f3;
  color: #8f2f2f;
  border-radius: 999px;
  padding: 0.32rem 0.58rem;
  font-size: 0.78rem;
  font-weight: 700;
}

.product-customization-missing-badge-link {
  margin-left: 0.35rem;
  border: 0;
  background: transparent;
  color: #2f58cf;
  cursor: pointer;
  font-weight: 800;
  font-size: 0.74rem;
  text-decoration: underline;
}

.product-share-link-filter-row {
  margin: 0.68rem 0 0.3rem;
  align-items: end;
}

.product-share-link-analytics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin-bottom: 0.7rem;
}

.product-share-link-analytics article {
  border: 1px solid rgba(120, 138, 212, 0.24);
  border-radius: 12px;
  background: rgba(247, 250, 255, 0.94);
  padding: 0.5rem 0.58rem;
}

.product-share-link-analytics span {
  display: block;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.product-share-link-analytics strong {
  display: block;
  margin-top: 0.25rem;
  font-family: "Space Grotesk", "Manrope", sans-serif;
  font-size: 0.98rem;
  color: #274fae;
}

.rate-item-tab-card {
  display: grid;
  gap: 0.75rem;
}

.rate-item-tab-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.rate-item-tab-btn {
  border: 1px solid rgba(125, 138, 189, 0.38);
  background: #ffffff;
  color: #34457f;
  border-radius: 999px;
  padding: 0.48rem 0.95rem;
  font-weight: 700;
}

.rate-item-tab-btn.active {
  background: linear-gradient(135deg, #6f63ff, #5648df);
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 10px 20px rgba(80, 68, 224, 0.2);
}

.rate-item-tab-panel[hidden] {
  display: none !important;
}

.rate-item-view-table th:first-child,
.rate-item-view-table td:first-child {
  width: 56px;
}

#rateCardHomeActionsCard {
  --rh-bg-main: #f7f9ff;
  --rh-sidebar-bg: #ffffff;
  --rh-card-bg: #ffffff;
  --rh-primary: #3f46f4;
  --rh-primary-dark: #1e2a78;
  --rh-primary-light: #eef2ff;
  --rh-text-main: #071b52;
  --rh-text-secondary: #4e6394;
  --rh-text-muted: #7b8db8;
  --rh-border: #dde6fa;
  --rh-shadow: 0 14px 35px rgba(20, 40, 90, 0.08);
  margin-bottom: 1rem;
  border: 1px solid rgba(221, 230, 250, 0.92);
  border-radius: 14px;
  overflow: hidden;
  padding: 0;
  background: var(--rh-bg-main);
  box-shadow: 0 16px 35px rgba(20, 40, 90, 0.06);
  font-family: Inter, Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.rate-home-dashboard {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  min-height: 100vh;
}

.rate-home-sidebar {
  width: 240px;
  min-width: 240px;
  background: var(--rh-sidebar-bg);
  border-right: 1px solid var(--rh-border);
  padding: 24px 14px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 18px;
}

.rate-home-brand {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--rh-text-main);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 0 4px;
  text-align: left;
}

.rate-home-brand-mark {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
}

.rate-home-brand-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.rate-home-brand strong,
.rate-home-profile strong {
  display: block;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 800;
  color: var(--rh-text-main);
}

.rate-home-brand small,
.rate-home-profile small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: var(--rh-text-secondary);
}

.rate-home-nav {
  display: grid;
  gap: 6px;
  align-content: start;
}

.rate-home-nav-item {
  height: 56px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--rh-text-main);
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  text-align: left;
  padding: 0 12px;
  font-size: 15px;
  font-weight: 500;
}

.rate-home-nav-item i {
  color: #4e6394;
  font-size: 15px;
}

.rate-home-nav-item.active {
  background: linear-gradient(90deg, #eef2ff, #f4f6ff);
  color: #203bff;
}

.rate-home-nav-item.active i {
  color: #203bff;
}

/* Colorful icons for module sidebars (left pane) */
.quotation-home-nav-item i,
.payment-home-nav-item i,
.rate-home-nav-item i {
  transition: color 0.18s ease;
}

.quotation-home-nav-item i.bi-grid-1x2,
.payment-home-nav-item i.bi-grid-1x2,
.rate-home-nav-item i.bi-grid-1x2,
.quotation-home-nav-item i.bi-house,
.payment-home-nav-item i.bi-house,
.rate-home-nav-item i.bi-house {
  color: #2962ff;
}

.quotation-home-nav-item i.bi-file-earmark-text,
.payment-home-nav-item i.bi-file-earmark-text,
.rate-home-nav-item i.bi-file-earmark-text,
.quotation-home-nav-item i.bi-card-list,
.payment-home-nav-item i.bi-card-list,
.rate-home-nav-item i.bi-card-list,
.quotation-home-nav-item i.bi-cart3,
.payment-home-nav-item i.bi-cart3,
.rate-home-nav-item i.bi-cart3,
.quotation-home-nav-item i.bi-layout-text-window,
.payment-home-nav-item i.bi-layout-text-window,
.rate-home-nav-item i.bi-layout-text-window {
  color: #7c3aed;
}

.quotation-home-nav-item i.bi-people,
.payment-home-nav-item i.bi-people,
.rate-home-nav-item i.bi-people,
.quotation-home-nav-item i.bi-person,
.payment-home-nav-item i.bi-person,
.rate-home-nav-item i.bi-person,
.quotation-home-nav-item i.bi-upc-scan,
.payment-home-nav-item i.bi-upc-scan,
.rate-home-nav-item i.bi-upc-scan {
  color: #1d86cf;
}

.quotation-home-nav-item i.bi-receipt,
.payment-home-nav-item i.bi-receipt,
.rate-home-nav-item i.bi-receipt,
.quotation-home-nav-item i.bi-bell,
.payment-home-nav-item i.bi-bell,
.rate-home-nav-item i.bi-bell,
.quotation-home-nav-item i.bi-check2-square,
.payment-home-nav-item i.bi-check2-square,
.rate-home-nav-item i.bi-check2-square {
  color: #d97706;
}

.quotation-home-nav-item i.bi-shield-check,
.payment-home-nav-item i.bi-shield-check,
.rate-home-nav-item i.bi-shield-check,
.quotation-home-nav-item i.bi-calendar-check,
.payment-home-nav-item i.bi-calendar-check,
.rate-home-nav-item i.bi-calendar-check {
  color: #1f9d55;
}

.quotation-home-nav-item i.bi-box,
.payment-home-nav-item i.bi-box,
.rate-home-nav-item i.bi-box,
.quotation-home-nav-item i.bi-box-seam,
.payment-home-nav-item i.bi-box-seam,
.rate-home-nav-item i.bi-box-seam,
.quotation-home-nav-item i.bi-box2-heart,
.payment-home-nav-item i.bi-box2-heart,
.rate-home-nav-item i.bi-box2-heart,
.quotation-home-nav-item i.bi-bag-check,
.payment-home-nav-item i.bi-bag-check,
.rate-home-nav-item i.bi-bag-check {
  color: #0ea5a3;
}

.quotation-home-nav-item i.bi-arrow-repeat,
.payment-home-nav-item i.bi-arrow-repeat,
.rate-home-nav-item i.bi-arrow-repeat {
  color: #8b5cf6;
}

.quotation-home-nav-item i.bi-database,
.payment-home-nav-item i.bi-database,
.rate-home-nav-item i.bi-database,
.quotation-home-nav-item i.bi-briefcase,
.payment-home-nav-item i.bi-briefcase,
.rate-home-nav-item i.bi-briefcase,
.quotation-home-nav-item i.bi-gear,
.payment-home-nav-item i.bi-gear,
.rate-home-nav-item i.bi-gear,
.quotation-home-nav-item i.bi-bar-chart,
.payment-home-nav-item i.bi-bar-chart,
.rate-home-nav-item i.bi-bar-chart {
  color: #4f67b7;
}

.rate-home-sidebar-note {
  border: 1px solid var(--rh-border);
  border-radius: 12px;
  background: #fbfcff;
  padding: 14px;
  display: grid;
  gap: 8px;
}

.rate-home-sidebar-note span {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  color: var(--rh-primary);
  background: var(--rh-primary-light);
}

.rate-home-sidebar-note strong {
  color: var(--rh-text-main);
  font-size: 14px;
}

.rate-home-sidebar-note small {
  color: var(--rh-text-secondary);
  font-size: 12px;
  line-height: 1.4;
}

.rate-home-sidebar-note button {
  margin-top: 4px;
  height: 40px;
  border: 1px solid var(--rh-border);
  border-radius: 10px;
  background: #f4f7ff;
  color: #304bc8;
  font-size: 13px;
  font-weight: 700;
}

.rate-home-main {
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr;
}

.rate-home-topbar {
  min-height: 66px;
  border-bottom: 1px solid var(--rh-border);
  background: #ffffff;
  padding: 10px 22px;
  display: grid;
  grid-template-columns: minmax(220px, 620px) auto;
  gap: 14px;
  align-items: center;
}

.rate-home-search-box {
  height: 52px;
  border: 1px solid var(--rh-border);
  border-radius: 12px;
  background: #ffffff;
  padding: 0 10px 0 16px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
}

.rate-home-search-box i {
  color: #8ca1cd;
}

.rate-home-search-box input {
  border: 0;
  background: transparent;
  min-width: 0;
  color: var(--rh-text-main);
  font-size: 14px;
  font-weight: 500;
  min-height: 36px;
  padding: 0;
  box-shadow: none;
}

.rate-home-search-box span {
  border-radius: 7px;
  background: #f2f5ff;
  color: #3b4dd7;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 8px;
  white-space: nowrap;
}

.rate-home-search-box button,
.rate-home-icon-btn {
  width: 34px;
  height: 34px;
  border: 1px solid var(--rh-border);
  border-radius: 999px;
  background: #ffffff;
  color: var(--rh-primary-dark);
  display: inline-grid;
  place-items: center;
  padding: 0;
}

.rate-home-toolbar {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 10px;
  align-items: center;
  justify-content: end;
}

.rate-home-icon-btn {
  position: relative;
}

.rate-home-icon-btn em {
  position: absolute;
  top: -4px;
  right: -3px;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #f43f5e;
  color: #ffffff;
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
  display: inline-grid;
  place-items: center;
}

.rate-home-profile {
  min-width: 220px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding-left: 14px;
  border-left: 1px solid var(--rh-border);
}

.rate-home-profile > span {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: #ffffff;
  font-weight: 800;
  font-size: 13px;
}

.rate-home-body {
  padding: 28px 36px;
  display: grid;
  gap: 24px;
}

.rate-home-heading-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
}

.rate-home-heading-row h1 {
  margin: 0;
  color: var(--rh-text-main);
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}

.rate-home-heading-row p {
  margin: 6px 0 0;
  color: var(--rh-text-secondary);
  font-size: 14px;
  font-weight: 500;
}

.rate-home-heading-actions {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 10px;
}

.rate-home-primary-btn,
.rate-home-secondary-btn {
  height: 52px;
  border-radius: 10px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-size: 13px;
  font-weight: 700;
  border: 1px solid transparent;
  white-space: nowrap;
}

.rate-home-primary-btn {
  color: #ffffff;
  background: linear-gradient(135deg, #3f46f4, #5b5ff8);
  box-shadow: 0 12px 24px rgba(63, 70, 244, 0.23);
}

.rate-home-secondary-btn {
  background: #ffffff;
  color: #1e3a8a;
  border-color: var(--rh-border);
}

.rate-home-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.rate-home-stat-card,
.rate-home-card {
  background: var(--rh-card-bg);
  border: 1px solid var(--rh-border);
  border-radius: 14px;
  box-shadow: var(--rh-shadow);
}

.rate-home-stat-card {
  min-height: 130px;
  padding: 24px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.rate-home-stat-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
}

.rate-home-stat-card small {
  display: block;
  color: var(--rh-text-secondary);
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 4px;
}

.rate-home-stat-card strong {
  display: block;
  color: var(--rh-text-main);
  font-size: 40px;
  font-weight: 700;
  line-height: 1;
}

.rate-home-stat-card span:not(.rate-home-stat-icon) {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #16a34a;
}

.rate-home-stat-card span.is-warning {
  color: #d97706;
}

.rate-home-stat-card span.is-muted {
  color: #7b8db8;
}

.rate-home-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 290px);
  gap: 24px;
  align-items: start;
}

.rate-home-actions {
  padding: 0;
}

.rate-home-section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 14px 16px 10px;
}

.rate-home-section-head.tight {
  padding-bottom: 6px;
}

.rate-home-section-head h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--rh-text-main);
  line-height: 1.15;
  letter-spacing: 0;
}

.rate-home-action-list {
  display: grid;
}

.rate-home-action-row {
  border: 0;
  border-top: 1px solid #e6edfa;
  background: #ffffff;
  padding: 12px 14px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  text-align: left;
  color: var(--rh-text-main);
}

.rate-home-action-row:first-child {
  border-top: 1px solid #e6edfa;
}

.rate-home-action-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  font-size: 16px;
}

.rate-home-action-row strong {
  display: block;
  color: var(--rh-text-main);
  font-size: 16px;
  font-weight: 700;
}

.rate-home-action-row small {
  display: block;
  margin-top: 1px;
  color: var(--rh-text-secondary);
  font-size: 13px;
  font-weight: 400;
}

.rate-home-action-row i {
  color: #7f92bd;
}

.rate-home-action-pill {
  border-radius: 999px;
  border: 1px solid #d7f3e1;
  background: #effbf3;
  color: #16a34a;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  white-space: nowrap;
}

.rate-home-side {
  display: grid;
  gap: 12px;
}

.rate-home-glance,
.rate-home-tips {
  padding: 0 0 8px;
}

.rate-home-glance article {
  padding: 10px 16px;
  border-top: 1px solid #e6edfa;
}

.rate-home-glance p {
  margin: 0;
  color: #6f81af;
  font-size: 12px;
  font-weight: 600;
}

.rate-home-glance strong {
  display: block;
  margin-top: 4px;
  color: var(--rh-text-main);
  font-size: 16px;
  font-weight: 700;
}

.rate-home-glance span {
  display: block;
  margin-top: 3px;
  color: var(--rh-text-secondary);
  font-size: 13px;
  font-weight: 600;
}

.rate-home-tips p {
  margin: 0;
  padding: 0 16px 8px;
  color: var(--rh-text-secondary);
  font-size: 14px;
  line-height: 1.45;
}

.rate-home-tips button {
  margin: 0 16px 10px;
  border: 0;
  background: transparent;
  color: #2d4de2;
  font-size: 13px;
  font-weight: 700;
  padding: 0;
}

.rate-home-guidelines {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.rate-home-guidelines article {
  border: 1px solid var(--rh-border);
  border-radius: 12px;
  background: #ffffff;
  padding: 12px;
}

.rate-home-guidelines h3 {
  margin: 0 0 8px;
  color: var(--rh-text-main);
  font-size: 14px;
  font-weight: 700;
}

.rate-home-guidelines dl {
  margin: 0;
  display: grid;
  gap: 5px;
}

.rate-home-guidelines dt,
.rate-home-guidelines dd,
.rate-home-guidelines li {
  margin: 0;
  color: var(--rh-text-secondary);
  font-size: 12px;
  font-weight: 500;
}

.rate-home-guidelines dt {
  color: var(--rh-text-main);
  font-weight: 600;
}

.rate-home-guidelines dd {
  color: #6d7fa9;
}

.rate-home-color-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.rate-home-color-row + .rate-home-color-row {
  margin-top: 8px;
}

.rate-home-color-row span {
  display: grid;
  gap: 4px;
  color: #6a7ca7;
  font-size: 11px;
  font-weight: 600;
}

.rate-home-color-row span::before {
  content: "";
  height: 14px;
  border-radius: 4px;
  background: var(--swatch);
  border: 1px solid rgba(7, 27, 82, 0.08);
}

.rate-home-color-row.soft span::before {
  border-color: rgba(7, 27, 82, 0.16);
}

.rate-home-ui-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.rate-home-ui-row button {
  height: 28px;
  border-radius: 7px;
  border: 1px solid transparent;
  background: linear-gradient(135deg, #3f46f4, #5b5ff8);
  color: #ffffff;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 700;
}

.rate-home-ui-row button.secondary {
  background: #ffffff;
  color: #1f3a8a;
  border-color: var(--rh-border);
}

.rate-home-ui-row.chips {
  margin-top: 9px;
}

.rate-home-ui-row.chips span {
  border-radius: 8px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 700;
  background: #f5f8ff;
  color: #4665b0;
}

.rate-home-ui-row.chips span.good {
  background: #effbf3;
  color: #16a34a;
}

.rate-home-ui-row.chips span.icon {
  width: 28px;
  display: inline-grid;
  place-items: center;
}

.rate-home-guidelines ul {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
}

@media (max-width: 1280px) {
  .rate-home-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rate-home-guidelines {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .rate-home-dashboard {
    grid-template-columns: 1fr;
  }

  .rate-home-sidebar {
    width: 100%;
    min-width: 0;
    border-right: 0;
    border-bottom: 1px solid var(--rh-border);
  }

  .rate-home-sidebar-note {
    display: none;
  }

  .rate-home-nav {
    grid-auto-flow: column;
    grid-auto-columns: minmax(170px, 1fr);
    overflow-x: auto;
  }

  .rate-home-topbar {
    grid-template-columns: 1fr;
  }

  .rate-home-toolbar {
    justify-content: start;
  }

  .rate-home-content-grid {
    grid-template-columns: 1fr;
  }

  .rate-home-heading-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .rate-home-body {
    padding: 20px;
  }

  .rate-home-topbar {
    padding: 10px 14px;
  }

  .rate-home-search-box {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .rate-home-search-box span {
    display: none;
  }

  .rate-home-profile {
    min-width: 0;
  }

  .rate-home-heading-row h1 {
    font-size: 30px;
  }

  .rate-home-heading-actions {
    grid-auto-flow: row;
  }

  .rate-home-primary-btn,
  .rate-home-secondary-btn {
    width: 100%;
  }

  .rate-home-stat-grid,
  .rate-home-guidelines {
    grid-template-columns: 1fr;
  }

  .rate-home-action-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .rate-home-action-row .rate-home-action-pill {
    display: none;
  }
}

#rateCardWorkspacePanel {
  display: grid;
  gap: 1rem;
  position: relative;
  padding: 1rem;
  border-radius: 18px;
  border: 1px solid rgba(125, 145, 212, 0.28);
  background:
    radial-gradient(circle at 100% 0%, rgba(97, 120, 214, 0.14), transparent 46%),
    linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(241, 246, 255, 0.94));
  box-shadow: 0 14px 28px rgba(56, 84, 155, 0.1);
}

#rateCardWorkspacePanel::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.38);
  pointer-events: none;
}

.rate-card-workspace-heading {
  margin-top: 0;
  margin-bottom: 0;
  padding: 0.88rem 0.96rem;
  border-radius: 14px;
  border: 1px solid rgba(123, 141, 206, 0.28);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(241, 247, 255, 0.92));
}

.rate-card-workspace-heading h3 {
  margin: 0.08rem 0 0;
  font-size: 1.42rem;
  line-height: 1.2;
}

.rate-card-workspace-heading .status-pill {
  border: 1px solid rgba(108, 128, 208, 0.28);
  background: rgba(240, 245, 255, 0.96);
  color: #2f4b97;
}

.rate-card-workspace-heading .action-cluster {
  gap: 0.55rem;
  align-items: center;
}

.rate-card-admin-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0;
  padding: 0.48rem;
  border: 1px solid rgba(108, 127, 198, 0.24);
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(245, 249, 255, 0.98), rgba(237, 244, 255, 0.95));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.rate-card-admin-nav-btn {
  border: 1px solid rgba(121, 138, 203, 0.34);
  background: rgba(255, 255, 255, 0.94);
  color: #2a457f;
  border-radius: 999px;
  padding: 0.52rem 0.92rem;
  font-size: 0.87rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 2.45rem;
  transition: transform 0.14s ease, box-shadow 0.16s ease, border-color 0.16s ease, background-color 0.16s ease;
}

.rate-card-admin-nav-btn i {
  font-size: 0.96rem;
}

.rate-card-admin-nav-btn:hover {
  border-color: rgba(94, 117, 194, 0.45);
  box-shadow: 0 8px 18px rgba(66, 88, 164, 0.16);
  transform: translateY(-1px);
}

.rate-card-admin-nav-btn.active {
  border-color: transparent;
  background: linear-gradient(135deg, #4b5fd0, #3648b8);
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(73, 89, 197, 0.24);
}

.rate-card-admin-layout {
  display: grid;
  gap: 0.95rem;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
  align-items: start;
}

.rate-card-admin-section[hidden] {
  display: none !important;
}

.rate-card-admin-section {
  display: grid;
  gap: 0.95rem;
  padding: 1.08rem;
  border-radius: 16px;
  border: 1px solid rgba(123, 142, 209, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 251, 255, 0.92));
  box-shadow: 0 12px 24px rgba(61, 90, 166, 0.08);
}

.rate-card-admin-section-config {
  grid-column: 1 / -1;
  order: 1;
}

.rate-card-admin-section-preview {
  grid-column: 1 / -1;
  order: 2;
}

.rate-builder-grid {
  display: grid;
  gap: 0.85rem;
}

.rate-builder-block {
  border: 1px solid rgba(129, 146, 208, 0.24);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 251, 255, 0.92));
  padding: 0.85rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.rate-builder-block-title {
  margin: 0 0 0.6rem;
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  font-size: 0.98rem;
  font-weight: 800;
  color: #2e498d;
}

.rate-builder-block-title i {
  width: 1.45rem;
  height: 1.45rem;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  color: #3558b8;
  background: rgba(71, 96, 186, 0.14);
  border: 1px solid rgba(71, 96, 186, 0.2);
  font-size: 0.78rem;
}

.rate-builder-controls-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr);
  gap: 0.7rem;
  align-items: end;
}

.rate-builder-toggle-card {
  min-height: 2.75rem;
  border: 1px solid rgba(118, 136, 202, 0.28);
  border-radius: 12px;
  background: rgba(247, 250, 255, 0.92);
  padding: 0.6rem 0.72rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.rate-builder-form-grid {
  gap: 0.72rem;
}

.rate-builder-actions-wrap {
  display: grid;
  gap: 0.7rem;
}

.rate-builder-actions-group {
  align-items: center;
  gap: 0.55rem;
  border: 1px solid rgba(121, 139, 201, 0.24);
  border-radius: 13px;
  background: rgba(245, 249, 255, 0.9);
  padding: 0.65rem;
}

.rate-builder-actions-label {
  margin: 0;
  width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.83rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #3d57a1;
}

.rate-preview-shell {
  border: 1px solid rgba(123, 142, 207, 0.24);
  border-radius: 14px;
  background: rgba(248, 251, 255, 0.92);
  padding: 0.72rem;
}

.rate-preview-table-wrap {
  margin-top: 0.55rem;
  border: 1px solid rgba(118, 137, 205, 0.2);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.95);
}

.rate-card-admin-section-share,
.rate-card-admin-section-orders {
  grid-column: 1 / -1;
}

.rate-card-admin-section-orders {
  background: #f7fbff;
  border: 1px solid #dce6f5;
  border-radius: 22px;
}

.rate-card-admin-section-settings {
  grid-column: 1 / -1;
}

.rate-card-admin-section-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
  border-bottom: 1px dashed rgba(103, 123, 193, 0.34);
  padding-bottom: 0.75rem;
}

.rate-card-admin-section-head .eyebrow {
  margin-bottom: 0.2rem;
  color: #4e63b6;
}

.rate-card-admin-section-head h3 {
  margin: 0;
  color: var(--surface-ink);
  font-size: 1.24rem;
  line-height: 1.24;
}

.rate-card-admin-section-note {
  margin: 0;
  max-width: 42ch;
  color: #465b95;
  font-size: 0.9rem;
  line-height: 1.45;
}

.rate-card-admin-actions .ghost-btn {
  flex: 1 1 210px;
}

.rate-card-admin-info {
  margin-top: -0.2rem;
}

.rate-card-admin-section-preview .data-table table {
  min-width: 640px;
}

.rate-card-admin-section-share .data-table table {
  min-width: 1180px;
}

.rate-card-admin-section-orders .data-table table {
  min-width: 1040px;
}

.customer-orders-shell {
  display: grid;
  gap: 0.92rem;
  font-family: "Inter", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

.customer-orders-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.88rem;
  padding-bottom: 0.84rem;
  border-bottom: 1px solid #dce6f5;
}

.customer-orders-title-block h3 {
  margin: 0.24rem 0 0;
  color: #071b4d;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.12;
}

.customer-orders-title-block p {
  margin: 0.42rem 0 0;
  color: #4c5f91;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.35;
}

.customer-orders-step {
  display: inline-flex;
  align-items: center;
  min-height: 1.72rem;
  border-radius: 999px;
  padding: 0.15rem 0.72rem;
  background: #eef4ff;
  border: 1px solid #dce6f5;
  color: #3a56ae;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.customer-orders-refresh-btn {
  min-height: 52px;
  border-radius: 14px;
  padding: 0.68rem 1.1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 16px;
  font-weight: 600;
  background: #1f5bd8;
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(31, 91, 216, 0.22);
}

.customer-orders-toolbar {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.customer-orders-search-wrap,
.customer-orders-filter-wrap {
  border: 1px solid #dce6f5;
  border-radius: 14px;
  background: #ffffff;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  gap: 0.52rem;
  color: #1f5bd8;
}

.customer-orders-search-wrap {
  flex: 0 1 44%;
  min-width: 340px;
  padding: 0 0.82rem;
}

.customer-orders-search-wrap > i {
  font-size: 1rem;
  color: #5980d8;
}

.customer-orders-search-wrap > input[type="search"] {
  border: 0;
  background: transparent;
  padding: 0;
  min-width: 0;
  width: 100%;
  color: #172554;
  font-size: 15px;
  box-shadow: none;
}

.customer-orders-search-wrap > input[type="search"]::placeholder {
  color: #9aa7c7;
}

.customer-orders-search-wrap .field-control {
  flex: 1 1 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 0;
  background: transparent;
  padding: 0;
  min-height: 0;
  box-shadow: none;
}

.customer-orders-search-wrap .field-control .field-icon {
  position: static;
  transform: none;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: #5980d8;
  font-size: 1rem;
}

.customer-orders-search-wrap .field-control > input[type="search"] {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.customer-orders-filter-wrap {
  min-width: 148px;
  padding: 0 0.72rem;
}

.customer-orders-filter-wrap > i:first-child {
  font-size: 0.94rem;
}

.customer-orders-filter-wrap > i:last-child {
  font-size: 0.82rem;
  color: #738bc0;
}

.customer-orders-filter-wrap select {
  appearance: none;
  border: 0;
  background: transparent;
  color: #255fdb;
  font-weight: 700;
  padding: 0;
  font-size: 16px;
  min-width: 84px;
}

.customer-orders-grid-scroll {
  overflow-x: auto;
  padding-bottom: 0.12rem;
}

.customer-orders-grid {
  --customer-orders-cols: minmax(262px, 1.72fr) minmax(258px, 1.56fr) minmax(106px, 0.68fr) minmax(156px, 0.95fr) minmax(216px, 1.22fr) minmax(170px, 0.98fr);
  min-width: 1090px;
  display: grid;
  gap: 14px;
}

.customer-orders-header-bar {
  display: grid;
  grid-template-columns: var(--customer-orders-cols);
  gap: 0.55rem;
  align-items: center;
  background: #f3f7ff;
  border: 1px solid #dce6f5;
  border-radius: 14px;
  padding: 0.8rem 0.95rem;
}

.customer-orders-header-bar span {
  color: #34456b;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.customer-orders-list {
  display: grid;
  gap: 14px;
}

.customer-orders-row-card {
  display: grid;
  grid-template-columns: var(--customer-orders-cols);
  gap: 0.8rem;
  align-items: start;
  background: #ffffff;
  border: 1px solid #e2eaf7;
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 2px 8px rgba(39, 79, 165, 0.05);
}

.customer-orders-row-card > section {
  min-width: 0;
}

.customer-orders-order-cell {
  min-width: 0;
}

.customer-orders-order-id-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  color: #1f5bd8;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.2;
}

.customer-orders-order-id-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.customer-orders-order-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  border: 1px solid #d7e2fb;
  background: #eef4ff;
  color: #1f5bd8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 0.95rem;
}

.customer-orders-order-meta {
  margin-top: 0.58rem;
  display: inline-flex;
  align-items: center;
  gap: 0.34rem;
  color: #66759a;
  font-size: 14px;
  font-weight: 500;
}

.customer-orders-order-items-meta {
  display: block;
  margin-top: 0.32rem;
  color: #4b62a0;
  font-size: 14px;
  font-weight: 700;
}

.customer-orders-order-time {
  display: block;
  margin-top: 0.16rem;
  margin-left: 1.36rem;
  color: #66759a;
  font-size: 14px;
  font-weight: 500;
}

.customer-orders-action-stack {
  margin-top: 0.74rem;
}

.customer-orders-convert-btn {
  border: 1px solid #1f5bd8;
  background: #ffffff;
  color: #1f5bd8;
  min-height: 48px;
  border-radius: 11px;
  padding: 0.5rem 0.95rem;
  font-size: 15px;
  font-weight: 700;
  box-shadow: none;
}

.customer-orders-customer-cell {
  min-width: 0;
}

.customer-orders-customer-head {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.customer-orders-avatar {
  width: 2.08rem;
  height: 2.08rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  font-size: 0.78rem;
  font-weight: 800;
}

.customer-orders-avatar.tone-violet {
  color: #6650d6;
  background: #f1edff;
  border-color: #ddd5ff;
}

.customer-orders-avatar.tone-green {
  color: #1e8557;
  background: #eafaf1;
  border-color: #c8ecd9;
}

.customer-orders-avatar.tone-blue {
  color: #2958cb;
  background: #edf2ff;
  border-color: #d5dfff;
}

.customer-orders-avatar.tone-orange {
  color: #d17a14;
  background: #fff4e8;
  border-color: #ffdfbe;
}

.customer-orders-avatar.tone-pink {
  color: #c6418f;
  background: #fff0f7;
  border-color: #ffd4e9;
}

.customer-orders-customer-head strong {
  display: block;
  color: #172554;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.22;
}

.customer-orders-customer-head .muted {
  display: block;
  margin-top: 0.16rem;
}

.customer-orders-customer-meta {
  margin-top: 0.48rem;
  margin-left: calc(2.08rem + 0.6rem);
  display: grid;
  gap: 0.26rem;
}

.customer-orders-customer-meta > span {
  display: inline-flex;
  align-items: center;
  gap: 0.34rem;
  color: #66759a;
  font-size: 14px;
}

.customer-orders-customer-meta > span i {
  font-size: 0.78rem;
}

.customer-orders-pin-chip {
  margin-top: 0.2rem;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: #efe9ff;
  border: 1px solid #e3d8ff;
  color: #6d4fd8;
  font-size: 12px;
  font-weight: 800;
  padding: 0.14rem 0.48rem;
  width: fit-content;
}

.customer-orders-items-cell {
  min-width: 0;
}

.customer-orders-item-count {
  color: #172554;
  font-size: 16px;
  font-weight: 700;
}

.customer-orders-items-preview {
  margin-top: 0.42rem;
}

.customer-orders-items-bullets {
  margin: 0;
  padding-left: 0.95rem;
  color: #51668f;
  font-size: 15px;
  line-height: 1.34;
}

.customer-orders-items-bullets li + li {
  margin-top: 0.22rem;
}

.customer-orders-more-items {
  margin-top: 0.34rem;
  border: 0;
  background: transparent;
  color: #1f5bd8;
  font-size: 15px;
  font-weight: 700;
  padding: 0;
}

.customer-orders-qty-cell {
  min-width: 0;
}

.customer-orders-qty-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.2rem;
  height: 2rem;
  border-radius: 8px;
  background: #eaf0ff;
  color: #1f5bd8;
  font-size: 16px;
  font-weight: 800;
  padding: 0 0.6rem;
}

.customer-orders-amount-cell {
  min-width: 0;
}

.customer-orders-amount-cell strong {
  display: block;
  color: #172554;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 800;
}

.customer-orders-amount-cell .muted {
  display: block;
  margin-top: 0.3rem;
  font-size: 0.8rem;
  line-height: 1.3;
}

.customer-orders-link-cell {
  min-width: 0;
  display: flex;
  gap: 0.5rem;
}

.customer-orders-link-badge {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  border: 1px solid #d9e5ff;
  color: #1f5bd8;
  background: #eef4ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.customer-orders-link-cell strong {
  display: block;
  color: #172554;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.22;
}

.customer-orders-link-cell .muted {
  display: block;
  margin-top: 0.22rem;
  line-height: 1.35;
}

.customer-orders-status-cell {
  min-width: 0;
}

.customer-orders-status-select {
  min-width: 124px;
  min-height: 44px;
  border: 1px solid #dce6f5;
  border-radius: 10px;
  background: #ffffff;
  color: #172554;
  font-size: 15px;
  font-weight: 700;
}

.customer-orders-status-cell .muted {
  display: block;
  margin-top: 0.35rem;
  font-size: 14px;
}

.customer-orders-received-cell {
  min-width: 0;
  display: flex;
  gap: 0.48rem;
  color: #172554;
}

.customer-orders-received-icon {
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 999px;
  border: 1px solid #d3e7dc;
  background: #edf8f1;
  color: #2f8b5e;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.customer-orders-received-cell strong {
  display: block;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
}

.customer-orders-received-cell span {
  display: block;
  margin-top: 0.22rem;
  color: #66759a;
  font-size: 14px;
}

.customer-orders-footer {
  border: 1px solid #dce6f5;
  border-radius: 14px;
  background: #ffffff;
  padding: 0.7rem 0.95rem;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 0.72rem;
}

.customer-orders-footer p {
  margin: 0;
  color: #66759a;
  font-size: 14px;
  font-weight: 600;
}

.customer-orders-pagination-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  justify-self: center;
}

.customer-orders-pagination-btn {
  min-width: 34px;
  min-height: 34px;
  border-radius: 10px;
  border: 1px solid #dce6f5;
  background: #f8fbff;
  color: #4c6bb9;
  padding: 0.36rem 0.56rem;
}

.customer-orders-pagination-btn.customer-orders-page-active {
  background: #255fdb;
  color: #ffffff;
  border-color: transparent;
}

.customer-orders-rows-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  color: #66759a;
  font-size: 14px;
  font-weight: 700;
  justify-self: end;
}

.customer-orders-rows-wrap select {
  min-width: 68px;
  min-height: 36px;
  border-radius: 10px;
  border: 1px solid #dce6f5;
  background: #ffffff;
  color: #172554;
  font-weight: 700;
  padding: 0.3rem 1.7rem 0.3rem 0.52rem;
}

.share-link-workflow-shell {
  display: grid;
  gap: 0.95rem;
}

.share-link-workflow-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px dashed rgba(104, 125, 196, 0.34);
}

.share-link-workflow-progress {
  display: grid;
  grid-template-columns: auto minmax(18px, 1fr) auto minmax(18px, 1fr) auto;
  align-items: center;
  gap: 0.45rem;
}

.share-link-progress-step {
  display: inline-flex;
  align-items: center;
  gap: 0.58rem;
}

.share-link-progress-step strong {
  display: block;
  color: #1f326a;
  font-size: 0.95rem;
  line-height: 1.2;
}

.share-link-progress-step small {
  display: block;
  margin-top: 0.12rem;
  color: #5e73af;
  font-size: 0.78rem;
  line-height: 1.2;
}

.share-link-progress-step.is-complete strong {
  color: #1f7146;
}

.share-link-progress-step.is-complete small {
  color: #27804e;
}

.share-link-progress-divider {
  height: 1px;
  background: linear-gradient(90deg, rgba(102, 121, 205, 0.14), rgba(102, 121, 205, 0.62), rgba(102, 121, 205, 0.14));
}

.share-link-progress-dot {
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.92rem;
  color: #fff;
  background: linear-gradient(135deg, #5f43f1 0%, #3d6df5 100%);
  box-shadow: 0 8px 20px rgba(78, 70, 212, 0.28);
}

.share-link-progress-dot-review {
  font-weight: 800;
}

.share-link-progress-step.is-complete .share-link-progress-dot {
  background: linear-gradient(135deg, #36a75f 0%, #248a49 100%);
  box-shadow: 0 8px 20px rgba(41, 138, 73, 0.28);
}

.share-link-summary-strip {
  border: 1px solid rgba(120, 140, 209, 0.27);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr)) minmax(170px, 1.1fr);
  overflow: hidden;
}

.share-link-summary-strip article {
  padding: 0.65rem 0.75rem;
  border-right: 1px solid rgba(116, 134, 199, 0.19);
}

.share-link-summary-strip article:last-child {
  border-right: 0;
}

.share-link-summary-strip span {
  display: block;
  font-size: 0.72rem;
  color: #6379b3;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.share-link-summary-strip strong {
  display: block;
  margin-top: 0.18rem;
  color: #1f3269;
  font-size: 1rem;
  line-height: 1.26;
}

.share-link-summary-strip .share-link-summary-status {
  background: linear-gradient(160deg, #f4f9ff 0%, #eff5ff 100%);
}

.share-link-summary-strip .share-link-summary-status strong {
  color: #1f3d85;
}

.share-link-summary-strip .share-link-summary-status .share-link-ready-text {
  color: #1f7d4a;
}

.share-link-summary-strip .share-link-summary-status small {
  display: block;
  margin-top: 0.18rem;
  color: #5c73aa;
  font-size: 0.82rem;
}

.share-link-summary-strip .share-link-summary-status .share-link-ready-subtext {
  color: #267f4e;
}

.share-link-workflow-form {
  margin-top: 0.1rem;
}

.share-link-workflow-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  gap: 0.95rem;
  align-items: start;
}

.share-link-main-column {
  display: grid;
  gap: 0.74rem;
}

.share-link-card {
  border: 1px solid rgba(120, 139, 207, 0.26);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 18px rgba(79, 98, 171, 0.07);
  overflow: hidden;
}

.share-link-card-head {
  width: 100%;
  border: 0;
  background: rgba(247, 250, 255, 0.76);
  padding: 0.72rem 0.85rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  text-align: left;
  cursor: pointer;
  position: relative;
}

.share-link-card-head::after {
  content: "\F282";
  font-family: "bootstrap-icons";
  font-size: 0.96rem;
  color: #455ea5;
  transition: transform 0.22s ease;
}

.share-link-card-head.is-collapsed::after {
  transform: rotate(-90deg);
}

.share-link-card-title-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.62rem;
}

.share-link-card-step {
  width: 1.74rem;
  height: 1.74rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #3f58bb;
  background: linear-gradient(145deg, #f0ecff, #edf2ff);
  border: 1px solid rgba(114, 131, 207, 0.26);
}

.share-link-card-step i {
  font-size: 0.95rem;
}

.share-link-card-title-wrap strong {
  font-size: 1.03rem;
  color: #1e3167;
}

.share-link-card-body {
  padding: 0.8rem 0.85rem 0.9rem;
}

.share-link-card-body[hidden] {
  display: none !important;
}

.share-link-workflow-actions {
  margin-top: 0.64rem;
  justify-content: flex-end;
  gap: 0.56rem;
}

.generated-link-inline {
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
}

.generated-link-inline input[type="text"] {
  width: 100%;
  min-width: 0;
}

.generated-link-inline .secondary-btn {
  flex: 0 0 auto;
  min-width: 72px;
  padding: 0.72rem 0.86rem;
  white-space: nowrap;
}

.share-link-side-column {
  display: grid;
  gap: 0.74rem;
  position: sticky;
  top: 0.65rem;
}

.share-link-side-card {
  border: 1px solid rgba(119, 138, 207, 0.28);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.93);
  padding: 0.76rem;
  box-shadow: 0 8px 20px rgba(77, 96, 163, 0.08);
}

.share-link-side-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.58rem;
}

.share-link-side-card-head strong {
  color: #243a76;
  font-size: 0.94rem;
}

.share-link-preview-url {
  margin: 0 0 0.56rem;
  border: 1px dashed rgba(106, 126, 201, 0.34);
  border-radius: 11px;
  padding: 0.44rem 0.54rem;
  color: #4b63a8;
  font-size: 0.84rem;
  overflow-wrap: anywhere;
  background: rgba(248, 251, 255, 0.86);
}

.share-link-preview-canvas {
  border-radius: 14px;
  border: 1px solid rgba(83, 106, 189, 0.35);
  background: linear-gradient(160deg, #102457 0%, #173987 58%, #3e52c5 100%);
  color: #fff;
  padding: 0.82rem;
}

.share-link-preview-brand {
  margin: 0;
  font-size: 0.73rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.84;
}

.share-link-preview-canvas h4 {
  margin: 0.26rem 0 0.22rem;
  font-size: 1.22rem;
  line-height: 1.25;
  color: #fff;
}

.share-link-preview-canvas > p:last-of-type {
  margin: 0;
  font-size: 0.87rem;
  color: rgba(237, 242, 255, 0.93);
}

.share-link-preview-categories {
  margin-top: 0.56rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.share-link-preview-chip {
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 999px;
  padding: 0.14rem 0.52rem;
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  font-size: 0.73rem;
  line-height: 1.25;
}

.share-link-preview-stats {
  list-style: none;
  margin: 0.65rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.34rem;
}

.share-link-preview-stats li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.6rem;
  align-items: baseline;
}

.share-link-preview-stats span {
  color: #546ba7;
  font-size: 0.81rem;
}

.share-link-preview-stats strong {
  color: #213a79;
  font-size: 0.88rem;
  text-align: right;
}

.share-link-preview-discount-list {
  display: grid;
  gap: 0.42rem;
}

.share-link-preview-discount-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.4rem;
  border: 1px solid rgba(121, 140, 209, 0.22);
  border-radius: 10px;
  background: rgba(249, 251, 255, 0.95);
  padding: 0.45rem 0.55rem;
}

.share-link-preview-discount-row span {
  color: #365196;
  font-size: 0.82rem;
}

.share-link-preview-discount-row strong {
  color: #1c8a4e;
  font-size: 0.82rem;
}

.share-link-side-help {
  background: linear-gradient(175deg, rgba(255, 251, 243, 0.96), rgba(252, 247, 237, 0.96));
}

.share-link-side-help ol {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.46rem;
}

.share-link-side-help li {
  color: #5c678a;
  font-size: 0.83rem;
}

.share-link-side-help li strong {
  display: block;
  color: #2a3f7d;
  margin-bottom: 0.08rem;
}

.share-link-side-help li span {
  display: block;
}

.share-link-library {
  margin-top: 0.35rem;
  display: grid;
  gap: 0.72rem;
}

.share-link-list-table {
  min-width: 1220px;
}

.rate-card-admin-section-share .data-table table.share-link-list-table {
  min-width: 1220px;
}

.share-link-list-table thead th {
  padding: 1rem 0.85rem;
  color: #263b73;
  letter-spacing: 0.05em;
  border-bottom-color: rgba(126, 144, 206, 0.34);
}

.share-link-list-table tbody td {
  padding: 1.2rem 0.85rem;
  border-bottom-color: rgba(127, 144, 205, 0.24);
}

.share-link-list-label-cell,
.share-link-list-type-cell,
.share-link-list-category-cell,
.share-link-list-rate-cell,
.share-link-list-updated-cell {
  vertical-align: top;
}

.share-link-list-label-link {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  font-size: 1.02rem;
  font-weight: 800;
  color: #142958;
  text-decoration: none;
}

.share-link-list-label-link:hover {
  color: #2f55c3;
}

.share-link-list-label-link i {
  font-size: 0.92rem;
}

.share-link-list-subline {
  display: block;
  font-size: 0.94rem;
  line-height: 1.45;
  color: #4d618f;
  word-break: break-word;
}

.share-link-list-label-cell .share-link-list-subline,
.share-link-list-type-cell .share-link-list-subline,
.share-link-list-category-cell .share-link-list-subline,
.share-link-list-rate-cell .share-link-list-subline {
  margin-top: 0.26rem;
}

.share-link-list-type-cell strong,
.share-link-list-rate-cell strong,
.share-link-list-updated-cell strong {
  color: #152b5a;
  font-size: 0.98rem;
  font-weight: 800;
}

.share-link-list-category-head {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  color: #152b5a;
}

.share-link-list-category-head strong {
  font-size: 0.98rem;
  font-weight: 800;
}

.share-link-list-category-head .bi-chevron-down {
  color: #6d80b6;
  font-size: 0.84rem;
}

.share-link-list-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(73, 106, 209, 0.12);
  color: #355ec2;
  border: 1px solid rgba(88, 120, 216, 0.24);
}

.share-link-list-icon-text {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  color: #223f86;
  font-weight: 700;
}

.share-link-list-icon-text i {
  color: #3d63c7;
}

.share-link-list-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.42rem 0.7rem;
  border-radius: 12px;
  border: 1px solid transparent;
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1;
}

.share-link-list-status.is-active {
  color: #1f7e49;
  background: #dcf5e4;
  border-color: #b7e7c8;
}

.share-link-list-status.is-inactive {
  color: #556089;
  background: rgba(231, 236, 249, 0.9);
  border-color: rgba(156, 170, 216, 0.4);
}

.share-link-list-status.is-expired {
  color: #8b5b12;
  background: #fff1db;
  border-color: #f4d19f;
}

.share-link-list-hits {
  color: #1c3267;
  font-size: 1.06rem;
  font-weight: 800;
}

.share-link-list-updated-cell {
  min-width: 144px;
  white-space: nowrap;
}

.share-link-list-updated-cell strong {
  display: block;
  line-height: 1.26;
}

.share-link-list-updated-cell span {
  display: block;
  margin-top: 0.12rem;
  line-height: 1.24;
  color: #4f628f;
  font-size: 0.92rem;
}

.share-link-list-action-cell {
  min-width: 74px;
}

.share-link-list-actions-menu .action-menu-summary {
  min-width: 2.7rem;
  min-height: 2.55rem;
  padding: 0;
  font-size: 1.3rem;
  font-weight: 800;
  border-radius: 12px;
  border: 1px solid rgba(147, 162, 213, 0.4);
  background: #f7f9ff;
  color: #2b4283;
  box-shadow: none;
}

.share-link-list-actions-menu .action-menu-summary:hover {
  background: #ecf2ff;
}

.share-link-list-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
  padding: 0.2rem 0.1rem 0;
  color: #5d709f;
  font-size: 0.94rem;
}

.share-link-list-footer p {
  margin: 0;
}

.share-link-list-pagination {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
}

.share-link-list-pagination .small-btn {
  min-width: 2.3rem;
  min-height: 2.3rem;
  padding: 0;
  border-radius: 10px;
  border: 1px solid rgba(154, 169, 218, 0.38);
  background: #f7faff;
  color: #2d4896;
  box-shadow: none;
}

.share-link-list-pagination-active {
  font-weight: 800;
  background: rgba(77, 112, 219, 0.16) !important;
}

.status-pill-success {
  color: #1f7e49;
  background: rgba(227, 246, 235, 0.95);
  border-color: rgba(119, 196, 147, 0.62);
}

.rate-link-analytics-panel {
  margin-top: 0;
  border: 1px solid #cfd9f0;
  border-radius: 16px;
  background: linear-gradient(180deg, #f6f9ff 0%, #f2f6ff 100%);
  padding: 1rem;
}

.analytics-shell {
  display: grid;
  gap: 0.95rem;
}

.analytics-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.analytics-header-main {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
}

.analytics-title-icon {
  width: 2.7rem;
  height: 2.7rem;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 30% 25%, #f2f6ff 0%, #e2ebff 100%);
  color: #3d5ac8;
  border: 1px solid rgba(94, 125, 216, 0.24);
  font-size: 1.26rem;
}

.analytics-title {
  margin: 0;
  color: #132754;
  font-size: 2rem;
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: 0;
}

.analytics-subtitle {
  margin: 0.2rem 0 0;
  color: #4f669c;
  font-size: 1.02rem;
  font-weight: 500;
}

.analytics-date-chip {
  border: 1px solid #c9d5ee;
  background: #ffffff;
  color: #1f3266;
  border-radius: 12px;
  min-height: 2.85rem;
  padding: 0.5rem 0.8rem;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.02rem;
  font-weight: 700;
}

.analytics-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.7rem;
}

.analytics-kpi-card {
  border: 1px solid #d3dcf1;
  border-radius: 14px;
  background: #ffffff;
  min-height: 8rem;
  padding: 0.85rem 0.95rem;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 0.72rem;
  box-shadow: 0 8px 18px rgba(30, 52, 112, 0.06);
  overflow: hidden;
}

.analytics-kpi-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  font-size: 1rem;
}

.analytics-kpi-icon.tone-links {
  color: #2f57d8;
  background: #edf2ff;
  border-color: #d4e0ff;
}

.analytics-kpi-icon.tone-hits {
  color: #6a4be6;
  background: #f1ecff;
  border-color: #ddd3ff;
}

.analytics-kpi-icon.tone-orders {
  color: #1fa66e;
  background: #e8fbf3;
  border-color: #c9f0df;
}

.analytics-kpi-icon.tone-submit {
  color: #f09222;
  background: #fff5e8;
  border-color: #ffe2ba;
}

.analytics-kpi-icon.tone-customers {
  color: #1f9cc5;
  background: #e9f8fc;
  border-color: #cceef7;
}

.analytics-kpi-icon.tone-aov {
  color: #e54686;
  background: #fff0f6;
  border-color: #ffd4e6;
}

.analytics-kpi-copy {
  min-width: 0;
}

.analytics-kpi-label {
  display: block;
  color: #3f568c;
  font-size: 0.95rem;
  font-weight: 700;
}

.analytics-kpi-copy strong {
  display: block;
  margin-top: 0.28rem;
  color: #14295a;
  font-size: 2.55rem;
  line-height: 1.02;
  font-weight: 900;
  letter-spacing: 0;
  white-space: nowrap;
}

.analytics-kpi-card-aov .analytics-kpi-copy strong {
  font-size: clamp(1.95rem, 2vw, 2.3rem);
  line-height: 1.08;
}

.analytics-kpi-copy small {
  display: inline-flex;
  align-items: center;
  gap: 0.24rem;
  margin-top: 0.52rem;
  font-size: 0.86rem;
  font-weight: 700;
}

.analytics-kpi-copy .trend-up {
  color: #17995a;
}

.analytics-kpi-copy .trend-down {
  color: #d94858;
}

.analytics-performance-card {
  border: 1px solid #d1dbee;
  border-radius: 14px;
  background: #ffffff;
  overflow: hidden;
}

.analytics-performance-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 0.9rem 0.95rem;
  border-bottom: 1px solid #dce4f4;
}

.analytics-performance-head h5 {
  margin: 0;
  color: #122754;
  font-size: 1.15rem;
  font-weight: 900;
}

.analytics-performance-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.52rem;
}

.analytics-select-wrap {
  border: 1px solid #d0dbef;
  background: #ffffff;
  border-radius: 12px;
  padding: 0 0.68rem;
  min-height: 2.45rem;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.analytics-select-wrap i {
  color: #2e4a95;
}

.analytics-select-wrap select {
  border: 0;
  outline: 0;
  background: transparent;
  color: #1d3163;
  font-weight: 700;
  font-size: 0.95rem;
  min-width: 7.2rem;
  padding-right: 0.2rem;
}

.analytics-export-btn {
  min-height: 2.45rem;
  border-radius: 12px;
}

.analytics-performance-table {
  min-width: 1220px;
}

.analytics-performance-table thead th {
  font-size: 0.9rem;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #4c6298;
  background: #f2f6ff;
  font-weight: 800;
  border-top: 0;
}

.analytics-performance-table tbody td {
  background: #ffffff;
  border-top: 1px solid #e3e9f6;
  color: #182b59;
  font-size: 0.96rem;
  font-weight: 600;
  vertical-align: middle;
  padding: 0.72rem 0.75rem;
}

.analytics-link-cell {
  display: flex;
  align-items: center;
  gap: 0.72rem;
  min-width: 280px;
}

.analytics-link-badge {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  flex: 0 0 auto;
}

.analytics-link-badge.tone-blue {
  background: #e9efff;
  color: #2f57d8;
  border-color: #d3dfff;
}

.analytics-link-badge.tone-green {
  background: #e7f9f1;
  color: #1fa66e;
  border-color: #c8eedc;
}

.analytics-link-badge.tone-violet {
  background: #f0ecff;
  color: #6a4be6;
  border-color: #ddd3ff;
}

.analytics-link-badge.tone-orange {
  background: #fff4e6;
  color: #ea8b1e;
  border-color: #ffe1bb;
}

.analytics-link-badge.tone-pink {
  background: #fff0f6;
  color: #e54686;
  border-color: #ffd4e6;
}

.analytics-link-copy {
  min-width: 0;
  display: grid;
  gap: 0.14rem;
}

.analytics-link-copy strong {
  color: #132754;
  font-size: 1.42rem;
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: 0;
}

.analytics-link-copy .muted {
  color: #2a5ed4;
  font-size: 0.97rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.analytics-num-cell {
  color: #152a5a;
  font-size: 1.32rem;
  font-weight: 800;
  white-space: nowrap;
}

.analytics-submit-cell strong {
  display: block;
  color: #122859;
  font-size: 1.18rem;
  font-weight: 800;
}

.analytics-submit-track {
  margin-top: 0.34rem;
  display: block;
  width: 7.2rem;
  height: 0.28rem;
  border-radius: 999px;
  background: #e2e9f7;
  overflow: hidden;
}

.analytics-submit-track > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #315ddb, #24b172);
}

.analytics-money-cell {
  color: #152a5a;
  font-size: 1.12rem;
  font-weight: 800;
  white-space: nowrap;
}

.analytics-top-items-cell {
  min-width: 270px;
}

.analytics-top-items-box {
  border: 1px solid #e0e7f6;
  border-radius: 12px;
  background: #f7faff;
  padding: 0.5rem 0.62rem;
}

.analytics-top-items-list {
  margin: 0;
  padding-left: 1rem;
  color: #1e3367;
  font-size: 0.93rem;
  line-height: 1.34;
}

.analytics-top-items-list li + li {
  margin-top: 0.2rem;
}

.analytics-more-items-btn {
  margin-top: 0.34rem;
  border: 0;
  background: transparent;
  color: #2a5ed4;
  font-size: 0.88rem;
  font-weight: 800;
  padding: 0;
}

.analytics-actions-cell {
  width: 2.9rem;
  text-align: right;
}

.analytics-row-menu-btn {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 10px;
  border: 1px solid #d8e2f4;
  background: #f8faff;
  color: #3e5695;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.analytics-pagination-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 0.72rem 0.9rem;
  border-top: 1px solid #e3e9f6;
}

.analytics-pagination-foot p {
  margin: 0;
  color: #304882;
  font-size: 0.95rem;
  font-weight: 600;
}

.analytics-pagination-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.analytics-pagination-controls .small-btn {
  min-width: 2.25rem;
  min-height: 2.25rem;
  border-radius: 10px;
  border: 1px solid #d3ddf1;
  background: #f8faff;
  color: #2d4f9f;
}

.analytics-pagination-controls .analytics-page-active {
  background: linear-gradient(135deg, #6172de 0%, #4e5fd1 100%);
  color: #ffffff;
  border-color: transparent;
}

.rate-card-category-row {
  justify-content: space-between;
  margin-bottom: 0.55rem;
  align-items: center;
}

.rate-card-category-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  padding: 0.14rem 0;
}

.rate-card-category-chip {
  display: flex;
  align-items: center;
  gap: 0.42rem;
  padding: 0.45rem 0.72rem;
  border-radius: 999px;
  border: 1px solid rgba(124, 142, 210, 0.34);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 4px 10px rgba(82, 103, 175, 0.08);
  font-size: 0.9rem;
}

.rate-card-category-chip input {
  width: 0.95rem;
  height: 0.95rem;
  margin: 0;
  accent-color: var(--primary);
}

.rate-card-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  color: var(--surface-ink);
}

.rate-card-toggle input {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--primary);
}

.designer-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  color: var(--surface-ink);
}

.designer-toggle input {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--primary);
}

.template-designer-target-note {
  display: flex;
  align-items: center;
  min-height: 2.2rem;
  border: 1px dashed rgba(116, 138, 210, 0.36);
  border-radius: 12px;
  background: rgba(244, 248, 255, 0.84);
  padding: 0.4rem 0.72rem;
  color: #2f4a90;
  font-size: 0.9rem;
  font-weight: 600;
}

.template-designer-target-note-secondary {
  grid-column: 1 / -1;
  margin-top: -0.25rem;
  border-style: solid;
  font-weight: 500;
  color: #4a5f98;
}

.rate-card-hint {
  margin: 0;
  color: #51659c;
}

.discount-rule-entry-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 0.5rem;
  margin-bottom: 0.45rem;
}

.discount-rule-type-hint {
  margin-top: 0.45rem;
}

.discount-rule-type-meta {
  margin-top: 0.2rem;
  font-size: 0.82rem;
  color: #4d629d;
}

.discount-rule-builder-panel {
  border: 1px solid rgba(122, 142, 212, 0.24);
  border-radius: 12px;
  padding: 0.62rem 0.7rem 0.68rem;
  background: rgba(250, 252, 255, 0.88);
}

.discount-rule-builder-panel[hidden] {
  display: none !important;
}

.discount-rule-builder-panel.is-disabled {
  opacity: 0.6;
}

.discount-rule-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  min-height: 1.9rem;
  margin-bottom: 0.35rem;
}

.discount-rule-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  border: 1px solid rgba(124, 142, 210, 0.34);
  border-radius: 999px;
  background: rgba(248, 251, 255, 0.95);
  color: #27407f;
  padding: 0.3rem 0.62rem;
  font-size: 0.82rem;
  line-height: 1.2;
  font-weight: 700;
}

.discount-rule-pill button {
  border: 0;
  background: transparent;
  color: #7a8ec6;
  font-size: 0.92rem;
  line-height: 1;
  cursor: pointer;
  padding: 0;
}

.discount-rule-empty {
  color: #6479b0;
  font-size: 0.8rem;
}

.discount-rule-list.is-disabled {
  opacity: 0.55;
  pointer-events: none;
}

.rate-card-table th:last-child,
.rate-card-table td:last-child {
  text-align: right;
  white-space: nowrap;
}

.rate-card-table th {
  background: rgba(240, 246, 255, 0.95);
  color: #2f4e95;
  position: sticky;
  top: 0;
  z-index: 1;
}

.rate-card-table tbody tr:hover {
  background: rgba(240, 247, 255, 0.62);
}

.rate-card-rate-input {
  width: 100%;
  min-width: 120px;
  text-align: right;
}

.rate-card-note {
  margin-top: 0.65rem;
  font-size: 0.82rem;
  color: #49545a;
}

.rate-list-order-status-select {
  min-width: 132px;
  padding: 0.44rem 0.5rem;
  border-radius: 10px;
  font-weight: 700;
}

.rate-list-order-action-stack {
  display: grid;
  gap: 0.36rem;
  margin-top: 0.42rem;
}

.rate-list-order-id-btn {
  border: 0;
  background: transparent;
  color: #2f4fae;
  font-size: 1.04rem;
  font-weight: 800;
  text-align: left;
  padding: 0;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none;
}

.rate-list-order-id-btn:hover,
.rate-list-order-id-btn:focus-visible {
  color: #1f3f96;
}

.rate-list-order-convert-btn {
  margin-top: 0;
  min-width: 140px;
}

.rate-list-order-items-preview {
  margin-top: 0.34rem;
  display: grid;
  gap: 0.2rem;
}

.rate-list-order-item-line {
  font-size: 0.82rem;
  color: #334778;
  line-height: 1.32;
  word-break: break-word;
}

.rate-list-order-item-line strong {
  color: #233662;
  font-weight: 700;
}

.customer-orders-items-preview .rate-list-order-item-line {
  display: flex;
  align-items: flex-start;
  gap: 0.32rem;
  font-size: 0.86rem;
  line-height: 1.38;
}

.customer-orders-items-preview .rate-list-order-item-line::before {
  content: "•";
  color: #4f69b5;
  font-weight: 700;
}

@media (max-width: 1260px) {
  .rate-card-admin-layout {
    grid-template-columns: 1fr;
  }

  .share-link-workflow-grid {
    grid-template-columns: 1fr;
  }

  .share-link-side-column {
    position: static;
    top: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rate-builder-controls-grid {
    grid-template-columns: 1fr;
  }

  .rate-card-admin-section-config,
  .rate-card-admin-section-preview,
  .rate-card-admin-section-share,
  .rate-card-admin-section-orders,
  .rate-card-admin-section-settings {
    grid-column: 1 / -1;
  }
}

@media (max-width: 820px) {
  #rateCardWorkspacePanel {
    padding: 0.7rem;
    border-radius: 14px;
  }

  .rate-card-admin-nav {
    padding: 0.36rem;
    border-radius: 14px;
  }

  .rate-card-admin-nav-btn {
    flex: 1 1 100%;
    text-align: left;
    justify-content: flex-start;
  }

  .rate-card-admin-section {
    padding: 0.9rem;
  }

  .rate-card-admin-section-head {
    flex-direction: column;
    align-items: stretch;
    gap: 0.6rem;
  }

  .rate-card-admin-section-note {
    max-width: none;
  }

  .share-link-workflow-head {
    flex-direction: column;
    align-items: stretch;
  }

  .share-link-workflow-progress {
    grid-template-columns: 1fr;
    gap: 0.38rem;
  }

  .share-link-progress-divider {
    display: none;
  }

  .share-link-summary-strip {
    grid-template-columns: 1fr 1fr;
  }

  .share-link-summary-strip article {
    border-right: 0;
    border-bottom: 1px solid rgba(116, 134, 199, 0.19);
  }

  .share-link-summary-strip article:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .share-link-card-head {
    padding: 0.66rem 0.72rem;
  }

  .share-link-card-body {
    padding: 0.72rem;
  }

  .customer-orders-head {
    flex-direction: column;
    align-items: stretch;
  }

  .customer-orders-refresh-btn {
    width: 100%;
    justify-content: center;
  }

  .customer-orders-toolbar {
    align-items: stretch;
  }

  .customer-orders-search-wrap,
  .customer-orders-filter-wrap {
    width: 100%;
    min-width: 0;
  }

  .customer-orders-header-bar {
    display: none;
  }

  .customer-orders-grid-scroll {
    overflow-x: visible;
  }

  .customer-orders-grid {
    min-width: 0;
  }

  .customer-orders-row-card {
    min-width: 0;
    grid-template-columns: 1fr;
    gap: 0.7rem;
    padding: 0.9rem;
  }

  .customer-orders-row-card > section {
    border-bottom: 1px dashed #dce6f5;
    padding-bottom: 0.62rem;
  }

  .customer-orders-row-card > section:last-child {
    border-bottom: 0;
    padding-bottom: 0;
  }

  .customer-orders-footer {
    grid-template-columns: 1fr;
    justify-items: flex-start;
  }

  .customer-orders-pagination-controls {
    justify-self: flex-start;
  }

  .customer-orders-rows-wrap {
    justify-self: flex-start;
  }

  .share-link-side-column {
    grid-template-columns: 1fr;
  }

  .share-link-workflow-actions {
    justify-content: stretch;
  }

  .share-link-workflow-actions .secondary-btn,
  .share-link-workflow-actions .primary-btn {
    flex: 1 1 100%;
  }

  .analytics-header {
    flex-direction: column;
    align-items: stretch;
  }

  .analytics-date-chip {
    width: 100%;
    justify-content: center;
  }

  .analytics-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .analytics-performance-head {
    flex-direction: column;
    align-items: stretch;
  }

  .analytics-performance-actions {
    justify-content: stretch;
  }

  .analytics-select-wrap,
  .analytics-export-btn {
    width: 100%;
  }

  .rate-builder-block {
    padding: 0.75rem;
  }

  .rate-builder-actions-group {
    padding: 0.58rem;
  }
}

@media (max-width: 560px) {
  .generated-link-inline {
    grid-template-columns: 1fr;
  }

  .generated-link-inline .secondary-btn {
    width: 100%;
  }

  .share-link-summary-strip {
    grid-template-columns: 1fr;
  }

  .share-link-summary-strip article {
    border-bottom: 1px solid rgba(116, 134, 199, 0.19);
  }

  .share-link-summary-strip article:last-child {
    border-bottom: 0;
  }

  .share-link-card-title-wrap strong {
    font-size: 0.95rem;
  }

  .share-link-preview-canvas h4 {
    font-size: 1.08rem;
  }

  .customer-orders-title-block h3 {
    font-size: 24px;
  }

  .analytics-kpi-grid {
    grid-template-columns: 1fr;
  }

  .analytics-kpi-copy strong {
    font-size: 2rem;
  }

  .analytics-title {
    font-size: 1.5rem;
  }

  .analytics-link-copy strong {
    font-size: 1.12rem;
  }

  .analytics-pagination-foot {
    flex-direction: column;
    align-items: flex-start;
  }
}

.tab-panel-saved-quotations {
  background: #f6f8fc;
}

.saved-quotations-shell {
  width: min(1780px, calc(100% - 48px));
  margin: 0 auto;
  padding: 24px 0 28px;
  display: grid;
  gap: 18px;
  font-family: "Inter", "Manrope", sans-serif;
}

.saved-quotations-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
}

.saved-quotations-eyebrow {
  margin: 0;
  color: #5b4dff;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.saved-quotations-eyebrow i {
  font-size: 18px;
  color: #5b4dff;
}

.saved-quotations-heading h1 {
  margin: 8px 0 0;
  font-size: clamp(2rem, 2.4vw, 42px);
  line-height: 1.2;
  font-weight: 700;
  color: #1f2b5b;
}

.saved-quotations-heading p {
  margin: 8px 0 0;
  font-size: 18px;
  font-weight: 400;
  color: #6f7ca8;
}

.saved-quotations-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px;
}

.saved-top-btn {
  min-height: 52px;
  border-radius: 14px;
  border: 1px solid #e6eaf5;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter", "Manrope", sans-serif;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.saved-top-btn:hover {
  transform: translateY(-1px);
}

.saved-top-btn-secondary {
  background: #ffffff;
  color: #1e2a52;
}

.saved-top-btn-primary {
  background: #5b4dff;
  border-color: #5b4dff;
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(91, 77, 255, 0.26);
}

.saved-top-btn-primary:hover {
  background: #4b3df0;
  border-color: #4b3df0;
}

.saved-quotations-surface {
  background: #ffffff;
  border: 1px solid #e6eaf5;
  border-radius: 24px;
  padding: 18px;
  display: grid;
  gap: 18px;
}

.saved-quotations-toolbar {
  display: grid;
  grid-template-columns:
    minmax(280px, 1.52fr)
    minmax(164px, 0.88fr)
    minmax(164px, 0.88fr)
    minmax(198px, 1.04fr)
    minmax(184px, 0.98fr)
    minmax(170px, 0.92fr);
  gap: 10px;
  align-items: end;
  position: sticky;
  top: 0;
  z-index: 5;
  background: linear-gradient(180deg, #ffffff 78%, rgba(255, 255, 255, 0.92) 100%);
  padding-bottom: 8px;
}

.saved-search-field {
  position: relative;
  display: flex;
  align-items: center;
}

.saved-search-field i {
  position: absolute;
  left: 18px;
  font-size: 15px;
  color: #7b86ad;
  pointer-events: none;
}

.saved-search-field input[type="search"] {
  width: 100%;
  height: 64px;
  border-radius: 18px;
  border: 1px solid #e8ecf5;
  background: #ffffff;
  padding: 0 18px 0 48px;
  font-size: 12px;
  color: #1e2a52;
  font-family: "Inter", "Manrope", sans-serif;
  font-weight: 600;
}

.saved-search-field input[type="search"]::placeholder {
  color: #a0aacb;
  font-size: 12px;
}

.saved-filter-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.saved-filter-field > span {
  font-size: 14px;
  font-weight: 600;
  color: #6e79a5;
  letter-spacing: 0.01em;
}

.saved-filter-field > select,
.saved-filter-field > input {
  width: 100%;
  height: 58px;
  border-radius: 16px;
  border: 1px solid #e6eaf5;
  padding: 0 18px;
  font-size: 16px;
  color: #1e2a52;
  background: #ffffff;
  font-family: "Inter", "Manrope", sans-serif;
  font-weight: 600;
}

.saved-filter-field .field-control {
  width: 100%;
  min-width: 0;
}

.saved-filter-field .field-control > select,
.saved-filter-field .field-control > input {
  width: 100%;
  min-width: 0;
  height: 58px;
  border-radius: 16px;
  border: 1px solid #e6eaf5;
  padding: 0 18px 0 46px;
  font-size: 16px;
  color: #1e2a52;
  background: #ffffff;
  font-family: "Inter", "Manrope", sans-serif;
  font-weight: 600;
}

.saved-filter-field .field-control.is-date {
  position: relative;
}

.saved-filter-field .field-control.is-date::after {
  content: "DD-MM-YYYY";
  position: absolute;
  left: 46px;
  top: 50%;
  transform: translateY(-50%);
  color: #97a2c4;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  pointer-events: none;
}

.saved-filter-field .field-control.is-date.saved-date-has-value::after,
.saved-filter-field .field-control.is-date:focus-within::after {
  content: "";
}

.saved-filter-field .field-control.is-date > input[type="date"] {
  font-size: 13px;
}

.saved-filter-field .field-control.is-date:not(.saved-date-has-value) > input[type="date"] {
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.saved-filter-field .field-control.is-date:not(.saved-date-has-value) > input[type="date"]::-webkit-datetime-edit {
  color: transparent;
}

.saved-filter-field .field-control.is-date.saved-date-has-value > input[type="date"],
.saved-filter-field .field-control.is-date:focus-within > input[type="date"] {
  color: #1e2a52;
  -webkit-text-fill-color: #1e2a52;
}

.saved-filter-field .field-control.is-date.saved-date-has-value > input[type="date"]::-webkit-datetime-edit,
.saved-filter-field .field-control.is-date:focus-within > input[type="date"]::-webkit-datetime-edit {
  color: #1e2a52;
}

.saved-filter-clear-btn {
  height: 58px;
  border-radius: 16px;
  border: 1px solid #e6eaf5;
  background: #ffffff;
  color: #1e2a52;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  font-family: "Inter", "Manrope", sans-serif;
  width: 100%;
}

.saved-quotations-quick-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 2px;
  margin-bottom: 8px;
}

.saved-quick-filter-chip {
  min-height: 52px;
  border-radius: 999px;
  border: 1px solid #dce3f1;
  background: #ffffff;
  color: #39435f;
  padding: 0 20px 0 14px;
  font-size: 15px;
  font-weight: 700;
  font-family: "Inter", "Manrope", sans-serif;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  line-height: 1;
  transition: all 0.24s ease;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset;
}

.saved-quick-filter-text {
  display: inline-block;
  white-space: nowrap;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
}

.saved-quick-filter-icon {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid #dce3f1;
  background: #f7f9ff;
  color: #5b4dff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 36px;
  transition: inherit;
}

.saved-quick-filter-icon i {
  font-size: 20px;
  line-height: 1;
}

.saved-quick-filter-chip.is-active {
  background: linear-gradient(135deg, #7068ff 0%, #5b4dff 65%, #4c40f4 100%);
  border-color: rgba(91, 77, 255, 0.88);
  color: #ffffff;
  box-shadow: 0 10px 26px rgba(91, 77, 255, 0.3);
}

.saved-quick-filter-chip.is-active .saved-quick-filter-icon {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.36);
  color: #ffffff;
}

.saved-quick-filter-chip[data-saved-quick-filter="approved"] .saved-quick-filter-icon {
  color: #17b26a;
  background: rgba(23, 178, 106, 0.12);
  border-color: rgba(23, 178, 106, 0.28);
}

.saved-quick-filter-chip[data-saved-quick-filter="rejected"] .saved-quick-filter-icon {
  color: #f04465;
  background: rgba(240, 68, 101, 0.12);
  border-color: rgba(240, 68, 101, 0.28);
}

.saved-quick-filter-chip[data-saved-quick-filter="hold"] .saved-quick-filter-icon {
  color: #f79009;
  background: rgba(247, 144, 9, 0.12);
  border-color: rgba(247, 144, 9, 0.28);
}

.saved-quick-filter-chip[data-saved-quick-filter="due"] .saved-quick-filter-icon {
  color: #2f80ed;
  background: rgba(47, 128, 237, 0.12);
  border-color: rgba(47, 128, 237, 0.28);
}

.saved-quick-filter-chip[data-saved-quick-filter="high"] .saved-quick-filter-icon {
  color: #7c5cff;
  background: rgba(124, 92, 255, 0.12);
  border-color: rgba(124, 92, 255, 0.28);
}

.saved-quick-filter-chip[data-saved-quick-filter="recent"] .saved-quick-filter-icon {
  color: #667085;
  background: rgba(102, 112, 133, 0.12);
  border-color: rgba(102, 112, 133, 0.28);
}

.saved-quick-filter-chip:hover {
  transform: translateY(-1px);
  border-color: #cfd7ea;
}

.saved-quotations-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 2px;
}

.saved-quotations-shell .saved-insight-card {
  min-height: 104px;
  border-radius: 22px;
  border: 1px solid #eef1f7;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(91, 77, 255, 0.04);
  padding: 14px 16px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.saved-kpi-content {
  min-width: 0;
  display: grid;
  gap: 2px;
  align-content: center;
}

.saved-kpi-icon {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  border: 1px solid transparent;
  background: #eef3ff;
  color: #4f46e5;
  flex: 0 0 auto;
  align-self: center;
}

.saved-kpi-label {
  font-size: 13px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #6f7ca8;
}

.saved-insight-card-total .saved-kpi-icon {
  background: #ecebff;
  border-color: #d8d4ff;
  color: #5b4dff;
}

.saved-insight-card-value .saved-kpi-icon {
  background: #eaf8f0;
  border-color: #cbeedb;
  color: #1e9e5a;
}

.saved-insight-card-hold .saved-kpi-icon {
  background: #eef3ff;
  border-color: #d9e4ff;
  color: #2563eb;
}

.saved-insight-card-approved .saved-kpi-icon {
  background: #f2ecff;
  border-color: #e3d8ff;
  color: #7c3aed;
}

.saved-insight-card-followup .saved-kpi-icon {
  background: #fff5e8;
  border-color: #ffe3bf;
  color: #d97706;
}

.saved-quotations-shell .saved-insight-card strong {
  font-size: clamp(1.55rem, 1.85vw, 30px);
  line-height: 1.04;
  font-weight: 700;
  color: #1e2a52;
  margin-top: 2px;
}

.saved-quotations-shell .saved-insight-card small {
  font-size: 12px;
  color: #7b86ad;
  font-weight: 600;
  margin-top: 1px;
}

.saved-quotation-list {
  gap: 14px;
}

.saved-quotation-card {
  background: #ffffff;
  border: 1px solid #eef1f7;
  border-radius: 24px;
  padding: 26px 22px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.saved-quotation-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 35px rgba(31, 43, 91, 0.08);
}

.saved-quotation-card-main {
  display: grid;
  grid-template-columns: minmax(0, 65%) minmax(0, 35%);
  gap: 24px;
  align-items: stretch;
}

.saved-quotation-card-left {
  display: grid;
  gap: 14px;
}

.saved-quotation-card-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.saved-quotation-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 26px;
  font-weight: 700;
}

.saved-avatar-tone-0 {
  background: #ecebff;
  color: #4f46e5;
}

.saved-avatar-tone-1 {
  background: #eaf7ef;
  color: #1e9e5a;
}

.saved-avatar-tone-2 {
  background: #fff4ea;
  color: #d97706;
}

.saved-avatar-tone-3 {
  background: #eaf2ff;
  color: #2563eb;
}

.saved-avatar-tone-4 {
  background: #fdeeee;
  color: #dc2626;
}

.saved-avatar-tone-5 {
  background: #f1f3ff;
  color: #4338ca;
}

.saved-quotation-card-identify {
  min-width: 0;
}

.saved-quotation-card .saved-quotation-number {
  display: block;
  font-size: clamp(1.3rem, 1.55vw, 30px);
  line-height: 1.1;
  color: #5b4dff;
  font-weight: 700;
}

.saved-quotation-customer-name {
  margin: 8px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  font-size: clamp(1.05rem, 1.2vw, 19px);
  font-weight: 600;
  color: #1e2a52;
}

.saved-quotation-customer-name span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 600;
  color: #4a5788;
}

.saved-quotation-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.saved-quotation-meta-row span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 500;
  color: #7b86ad;
}

.saved-quotation-meta-row i {
  color: #7b86ad;
  font-size: 16px;
}

.saved-quotation-note {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
  color: #475483;
  line-height: 1.4;
}

.saved-quotation-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.saved-status-btn {
  min-height: 39px;
  border-radius: 11px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  border: 1px solid transparent;
  background: #ffffff;
}

.saved-status-btn i {
  font-size: 13px;
}

.saved-status-approve {
  background: #eaf8f0;
  border-color: #b7e6c8;
  color: #1e9e5a;
}

.saved-status-reject {
  background: #fff0f0;
  border-color: #ffcaca;
  color: #d94c4c;
}

.saved-status-hold {
  background: #fff6e7;
  border-color: #f7d89d;
  color: #b7791f;
}

.saved-status-btn.active {
  box-shadow: inset 0 0 0 1px currentColor;
}

.saved-quotation-card-right {
  border-left: 1px solid #edf1f8;
  padding-left: 18px;
  display: grid;
  gap: 14px;
  align-content: space-between;
}

.saved-quotation-value-block {
  display: grid;
  justify-items: end;
  gap: 6px;
}

.saved-quotation-value {
  font-size: clamp(2rem, 2.3vw, 38px);
  line-height: 1.1;
  font-weight: 700;
  color: #1e2a52;
}

.saved-quotation-value-label {
  font-size: 16px;
  color: #7b86ad;
  font-weight: 500;
}

.saved-quotation-updated {
  margin-top: 4px;
  font-size: 14px;
  color: #6f7ca8;
  font-weight: 500;
}

.saved-quotation-action-buttons {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-content: stretch;
  align-items: stretch;
  gap: 10px;
}

.saved-primary-action-btn,
.saved-outline-action-btn,
.saved-soft-action-btn {
  min-height: 44px;
  border-radius: 12px;
  padding: 0 15px;
  font-size: 15px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  justify-content: center;
  width: 100%;
  white-space: nowrap;
}

.saved-primary-action-btn i,
.saved-outline-action-btn i,
.saved-soft-action-btn i,
.saved-card-menu .action-menu-summary i {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

.saved-primary-action-btn {
  background: #5b4dff;
  border: 1px solid #5b4dff;
  color: #ffffff;
}

.saved-primary-action-btn i {
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
}

.saved-primary-action-btn:hover {
  background: #4b3df0;
  border-color: #4b3df0;
}

.saved-outline-action-btn {
  background: #ffffff;
  border: 1px solid #dfe4f1;
  color: #1e2a52;
}

.saved-outline-action-btn i {
  background: #eef2ff;
  color: #4f46e5;
}

.saved-soft-action-btn {
  background: #f2f5ff;
  border: 1px solid #d8def0;
  color: #2f4175;
}

.saved-soft-action-btn i {
  background: #e9eeff;
  color: #3f51cc;
}

.saved-soft-action-btn[data-action="pdf"] i {
  background: #fff0f0;
  color: #d94c4c;
}

.saved-soft-action-btn[data-action="print"] i {
  background: #edf2ff;
  color: #3f51cc;
}

.saved-card-menu .action-menu-summary {
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid #dfe4f1;
  background: #ffffff;
  color: #24366e;
  font-size: 15px;
  font-weight: 600;
  padding: 0 15px;
  width: 100%;
  justify-content: center;
  gap: 8px;
}

.saved-card-menu .action-menu-list {
  border-radius: 14px;
  border-color: #e1e6f3;
}

.saved-quotation-action-buttons .saved-card-menu {
  width: 100%;
}

.saved-card-menu-whatsapp .action-menu-summary i {
  background: #eaf8f0;
  color: #1e9e5a;
}

.saved-card-menu-more .action-menu-summary i {
  background: #eef2ff;
  color: #3f51cc;
}

.saved-card-menu .action-menu-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.saved-card-menu .action-menu-btn i {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  background: #eef2ff;
  color: #4f46e5;
}

.saved-card-menu .action-menu-btn[data-action="delete"] i {
  background: #fff0f0;
  color: #d94c4c;
}

.saved-card-menu .action-menu-btn[data-action="payment-reminder"] i,
.saved-card-menu .action-menu-btn[data-action="followup-custom"] i,
.saved-card-menu .action-menu-btn[data-action="followup-clear"] i {
  background: #fff6e7;
  color: #b7791f;
}

.saved-card-menu .action-menu-btn[data-action="wa-text"] i,
.saved-card-menu .action-menu-btn[data-action="wa-pdf"] i,
.saved-card-menu .action-menu-btn[data-action="wa-image"] i {
  background: #eaf8f0;
  color: #1e9e5a;
}

.saved-action-blocked {
  color: #8f6f6f;
  background: #f4f5fa;
  border-color: #e0e5f2;
}

.saved-quotations-toolbar .field-label-line .field-optional,
.saved-quotations-rows .field-label-line .field-optional {
  display: none !important;
}

.saved-quotations-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 6px 4px 0;
}

.saved-quotations-footer p {
  margin: 0;
  font-size: 16px;
  color: #6f7ca8;
  font-weight: 500;
}

.saved-quotations-footer-controls {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.saved-quotations-pagination {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.saved-pagination-btn {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid #dfe4f1;
  background: #ffffff;
  color: #1f2b5b;
  display: grid;
  place-items: center;
  padding: 0;
}

.saved-pagination-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.saved-quotations-pagination span {
  min-width: 112px;
  text-align: center;
  color: #1e2a52;
  font-weight: 600;
}

.saved-quotations-rows {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.saved-quotations-rows > span {
  font-size: 14px;
  color: #6e79a5;
  font-weight: 600;
}

.saved-quotations-rows select {
  min-width: 86px;
  height: 40px;
  border-radius: 12px;
  border: 1px solid #dfe4f1;
  padding: 0 10px;
  color: #1e2a52;
  font-weight: 600;
  font-family: "Inter", "Manrope", sans-serif;
}

@media (max-width: 1260px) {
  .saved-quotations-toolbar {
    grid-template-columns: minmax(260px, 2fr) repeat(3, minmax(150px, 1fr));
  }
}

@media (max-width: 1240px) {
  .saved-quotations-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .saved-quotation-card-main {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .saved-quotation-card-right {
    border-left: 0;
    border-top: 1px solid #edf1f8;
    padding-left: 0;
    padding-top: 16px;
  }

  .saved-quotation-value-block,
  .saved-quotation-action-buttons {
    justify-items: start;
    justify-content: flex-start;
  }
}

@media (max-width: 980px) {
  .saved-quotations-shell {
    width: min(1780px, calc(100% - 24px));
    padding-top: 14px;
  }

  .saved-quotations-header {
    grid-template-columns: 1fr;
  }

  .saved-quotations-header-actions {
    justify-content: flex-start;
  }

  .saved-quotations-toolbar {
    grid-template-columns: 1fr;
  }

  .saved-search-field input[type="search"],
  .saved-filter-field > select,
  .saved-filter-field > input,
  .saved-filter-clear-btn {
    height: 52px;
  }

  .saved-quotations-kpis {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .saved-quotation-card {
    padding: 18px;
  }

  .saved-quotation-card-head {
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .saved-quotation-avatar {
    width: 56px;
    height: 56px;
    font-size: 23px;
  }

  .saved-quotation-customer-name {
    font-size: 1.12rem;
  }

  .saved-quotation-meta-row span {
    width: 100%;
  }

  .saved-quotation-status-actions,
  .saved-quotation-action-buttons {
    width: 100%;
  }

  .saved-quotation-status-actions > *,
  .saved-quotation-action-buttons > *,
  .saved-card-menu {
    flex: 1 1 100%;
    width: 100%;
  }

  .saved-card-menu .action-menu-summary {
    width: 100%;
    justify-content: center;
  }
}

.quotation-list {
  display: grid;
  gap: 1rem;
}

.quotation-card {
  padding: 0.92rem 1rem 0.98rem;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.56);
  border: 1px solid rgba(20, 33, 61, 0.08);
  display: grid;
  gap: 0.58rem;
}

.quotation-card-header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
  margin-bottom: 0.2rem;
}

.renewal-card-summary-wrap {
  display: grid;
  justify-items: end;
  gap: 0.42rem;
}

.renewal-card-selection {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.76rem;
  font-weight: 700;
  color: #4b5d92;
}

.renewal-card-selection input {
  margin: 0;
}

.quotation-card-summary {
  display: grid;
  justify-items: end;
  gap: 0.55rem;
}

.quotation-card strong {
  color: var(--surface-ink);
}

.quotation-customer-name {
  margin-top: 0.14rem;
  margin-bottom: 0;
  font-weight: 800;
  color: var(--surface-ink);
  line-height: 1.2;
}

.quotation-customer-mobile {
  margin-left: 0.7rem;
  font-weight: 800;
  color: var(--surface-ink);
}

.quotation-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 800;
}

.status-approved {
  background: rgba(45, 106, 79, 0.12);
  color: #2d6a4f;
}

.status-rejected {
  background: rgba(168, 59, 50, 0.12);
  color: #a83b32;
}

.status-hold {
  background: rgba(154, 107, 0, 0.14);
  color: #8a5d00;
}

.status-payment-pending {
  background: rgba(154, 107, 0, 0.14);
  color: #8a5d00;
}

.status-payment-partial {
  background: rgba(20, 52, 95, 0.12);
  color: #14345f;
}

.status-payment-paid {
  background: rgba(45, 106, 79, 0.12);
  color: #2d6a4f;
}

.status-action-btn {
  border: 1px solid transparent;
}

.status-action-btn.active {
  box-shadow: inset 0 0 0 1px currentColor;
}

.quotation-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1rem;
  color: var(--muted);
  font-size: 0.9rem;
  margin-bottom: 0.15rem;
}

.quotation-card > .muted {
  margin: 0;
  line-height: 1.32;
}

.quotation-card .action-row-split {
  margin-top: 0.12rem;
  align-items: center;
  gap: 0.62rem;
}

.renewal-card-selected {
  border-color: rgba(52, 87, 196, 0.42);
  background: linear-gradient(140deg, rgba(241, 247, 255, 0.94), rgba(236, 243, 255, 0.9));
  box-shadow: 0 12px 24px rgba(55, 88, 170, 0.12);
}

.replacement-home-shell {
  display: grid;
  gap: 1rem;
  background: #f7f9ff;
}

.replacement-home-top-actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  justify-content: end;
}

.replacement-home-top-actions .secondary-btn {
  min-height: 2.6rem;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
}

.replacement-home-heading-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.9rem;
  align-items: center;
}

.replacement-home-heading-copy {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.75rem;
}

.replacement-home-heading-icon {
  width: 62px;
  height: 62px;
  border-radius: 14px;
  border: 1px solid #dde6fa;
  background: #eef2ff;
  color: #4b4ff7;
  display: inline-grid;
  place-items: center;
  font-size: 1.7rem;
}

.replacement-home-heading-copy h2 {
  margin: 0;
  font-size: 2.62rem;
  font-size: clamp(1.5rem, 2.2vw, 2.18rem);
  line-height: 1.15;
  color: #071b52;
  font-weight: 700;
}

.replacement-home-heading-copy p {
  margin: 0.25rem 0 0;
  font-size: 0.98rem;
  color: #4e6394;
}

.replacement-home-heading-actions {
  justify-content: flex-end;
}

.replacement-sync-toggle-btn {
  min-height: 2.6rem;
  border-radius: 10px;
  min-width: 192px;
  justify-content: center;
}

.replacement-sync-toggle-btn.is-on {
  background: #ecfdf3;
  border-color: #bde8ce;
  color: #15803d;
}

.replacement-sync-toggle-btn.is-off {
  background: #fff7ed;
  border-color: #f5d3ae;
  color: #b45309;
}

.replacement-sync-state-pill {
  border: 1px solid transparent;
  min-width: 96px;
  text-align: center;
}

.replacement-sync-state-pill.is-on {
  background: #ecfdf3;
  border-color: #bde8ce;
  color: #15803d;
}

.replacement-sync-state-pill.is-off {
  background: #fef2f2;
  border-color: #f3c6cf;
  color: #b91c1c;
}

.replacement-home-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}

.replacement-home-stat-card {
  appearance: none;
  width: 100%;
  text-align: left;
  font: inherit;
  border: 1px solid #dde6fa;
  border-radius: 14px;
  padding: 0.88rem 0.92rem;
  background: #ffffff;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.65rem;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.replacement-home-stat-card:hover {
  border-color: #cfdaf8;
  box-shadow: 0 12px 28px rgba(20, 40, 90, 0.09);
  transform: translateY(-1px);
}

.replacement-home-stat-card:focus-visible {
  outline: 2px solid #5b5ff8;
  outline-offset: 2px;
}

.replacement-home-stat-card.active {
  border-color: #4f5cf7;
  box-shadow: 0 0 0 1px rgba(79, 92, 247, 0.22), 0 14px 32px rgba(34, 52, 120, 0.12);
}

.replacement-home-stat-icon {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  border: 1px solid #dde6fa;
  background: #f6f8ff;
  display: inline-grid;
  place-items: center;
  font-size: 1.45rem;
}

.replacement-home-stat-card small {
  display: block;
  font-size: 1.15rem;
  font-size: clamp(0.88rem, 0.95vw, 1rem);
  color: #1b2f72;
  font-weight: 600;
}

.replacement-home-stat-card strong {
  display: block;
  margin-top: 0.2rem;
  font-size: 2.15rem;
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 1.1;
  color: #071b52;
}

.replacement-home-stat-card span {
  display: block;
  margin-top: 0.16rem;
  color: #4e6394;
  font-size: 0.93rem;
  font-weight: 500;
}

.replacement-home-stat-card.tone-pending {
  border-color: #f6dcc2;
}

.replacement-home-stat-card.tone-pending .replacement-home-stat-icon {
  color: #f08a00;
  background: #fff7ed;
  border-color: #fbe4ce;
}

.replacement-home-stat-card.tone-pending strong {
  color: #f08a00;
}

.replacement-home-stat-card.tone-progress {
  border-color: #d3dffb;
}

.replacement-home-stat-card.tone-progress .replacement-home-stat-icon {
  color: #2563eb;
  background: #eff5ff;
  border-color: #d9e5ff;
}

.replacement-home-stat-card.tone-progress strong {
  color: #2563eb;
}

.replacement-home-stat-card.tone-violet {
  border-color: #ded7ff;
}

.replacement-home-stat-card.tone-violet .replacement-home-stat-icon {
  color: #7c3aed;
  background: #f5f2ff;
  border-color: #e8e1ff;
}

.replacement-home-stat-card.tone-violet strong {
  color: #7c3aed;
}

.replacement-home-stat-card.tone-success {
  border-color: #bde9e7;
}

.replacement-home-stat-card.tone-success .replacement-home-stat-icon {
  color: #0f766e;
  background: #ecfeff;
  border-color: #c5eff1;
}

.replacement-home-stat-card.tone-success strong {
  color: #0f766e;
}

.replacement-home-stat-card.tone-completed {
  border-color: #caead8;
}

.replacement-home-stat-card.tone-completed .replacement-home-stat-icon {
  color: #15803d;
  background: #ecfdf3;
  border-color: #cff1de;
}

.replacement-home-stat-card.tone-completed strong {
  color: #15803d;
}

.replacement-home-stat-card.tone-total .replacement-home-stat-icon {
  color: #5d4dff;
  background: #f3f1ff;
  border-color: #e2ddff;
}

.replacement-home-stat-card.tone-total strong {
  color: #5d4dff;
}

.replacement-home-stat-card.tone-custom-cyan {
  border-color: #bfe7f6;
}

.replacement-home-stat-card.tone-custom-cyan .replacement-home-stat-icon {
  color: #0e7490;
  background: #ecfeff;
  border-color: #c9edf8;
}

.replacement-home-stat-card.tone-custom-cyan strong {
  color: #0e7490;
}

.replacement-home-stat-card.tone-custom-rose {
  border-color: #f8d2df;
}

.replacement-home-stat-card.tone-custom-rose .replacement-home-stat-icon {
  color: #be185d;
  background: #fff1f7;
  border-color: #f8dbe7;
}

.replacement-home-stat-card.tone-custom-rose strong {
  color: #be185d;
}

.replacement-home-stat-card.tone-custom-indigo {
  border-color: #d7ddff;
}

.replacement-home-stat-card.tone-custom-indigo .replacement-home-stat-icon {
  color: #4338ca;
  background: #eef2ff;
  border-color: #dbe3ff;
}

.replacement-home-stat-card.tone-custom-indigo strong {
  color: #4338ca;
}

.replacement-home-stat-card.tone-custom-amber {
  border-color: #f7dfba;
}

.replacement-home-stat-card.tone-custom-amber .replacement-home-stat-icon {
  color: #b45309;
  background: #fffbeb;
  border-color: #f8e5c2;
}

.replacement-home-stat-card.tone-custom-amber strong {
  color: #b45309;
}

.replacement-home-stat-card.tone-custom-emerald {
  border-color: #c8ead8;
}

.replacement-home-stat-card.tone-custom-emerald .replacement-home-stat-icon {
  color: #047857;
  background: #ecfdf5;
  border-color: #d3f2e4;
}

.replacement-home-stat-card.tone-custom-emerald strong {
  color: #047857;
}

.replacement-home-stat-card.tone-custom-sky {
  border-color: #cde5ff;
}

.replacement-home-stat-card.tone-custom-sky .replacement-home-stat-icon {
  color: #0369a1;
  background: #f0f9ff;
  border-color: #d7ecff;
}

.replacement-home-stat-card.tone-custom-sky strong {
  color: #0369a1;
}

.replacement-home-stat-card.tone-cancelled {
  border-color: #f3d3db;
}

.replacement-home-stat-card.tone-cancelled .replacement-home-stat-icon {
  color: #dc2626;
  background: #fef2f2;
  border-color: #f5d6dc;
}

.replacement-home-stat-card.tone-cancelled strong {
  color: #dc2626;
}

.replacement-home-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
  gap: 0.9rem;
}

.replacement-home-actions-card,
.replacement-home-activity-card,
.replacement-home-filter-card {
  border: 1px solid #dde6fa;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 14px 35px rgba(20, 40, 90, 0.08);
  padding: 0.95rem;
}

.replacement-home-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.replacement-home-section-head h3 {
  margin: 0;
  font-size: 1.95rem;
  font-size: clamp(1rem, 1.08vw, 1.3rem);
  line-height: 1.2;
  color: #071b52;
  font-weight: 700;
}

.replacement-home-link-btn {
  border: 0;
  background: transparent;
  color: #3f46f4;
  font-size: 1.2rem;
  font-size: clamp(0.86rem, 0.94vw, 1rem);
  font-weight: 600;
  padding: 0.1rem 0.2rem;
}

.replacement-home-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.replacement-home-action-tile {
  width: 100%;
  min-height: 132px;
  border-radius: 14px;
  border: 1px solid #dde6fa;
  background: #ffffff;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  text-align: left;
  padding: 0.85rem;
  color: #071b52;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.replacement-home-action-tile:hover {
  border-color: #cfdaf8;
  box-shadow: 0 12px 28px rgba(20, 40, 90, 0.09);
  transform: translateY(-1px);
}

.replacement-home-action-icon {
  width: 60px;
  height: 60px;
  border-radius: 14px;
  border: 1px solid #dde6fa;
  display: inline-grid;
  place-items: center;
  font-size: 1.55rem;
}

.replacement-home-action-tile.tone-violet {
  border-color: #d7d4ff;
}

.replacement-home-action-tile.tone-violet .replacement-home-action-icon {
  color: #5b4ff8;
  background: #f1efff;
  border-color: #ddd8ff;
}

.replacement-home-action-tile.tone-blue .replacement-home-action-icon {
  color: #2563eb;
  background: #eff5ff;
  border-color: #d9e6ff;
}

.replacement-home-action-tile.tone-amber {
  border-color: #f6dcc2;
}

.replacement-home-action-tile.tone-amber .replacement-home-action-icon {
  color: #f08a00;
  background: #fff7ed;
  border-color: #fbe4ce;
}

.replacement-home-action-tile.tone-green .replacement-home-action-icon {
  color: #16a34a;
  background: #ecfdf3;
  border-color: #cff1de;
}

.replacement-home-action-copy strong {
  display: block;
  font-size: 1.35rem;
  font-size: clamp(0.96rem, 1.02vw, 1.1rem);
  color: #071b52;
  font-weight: 700;
}

.replacement-home-action-copy small {
  display: block;
  margin-top: 0.26rem;
  font-size: 0.95rem;
  color: #4e6394;
  line-height: 1.4;
}

.replacement-home-action-tile > i {
  color: #6e82b7;
  font-size: 1.2rem;
}

.replacement-home-activity-list {
  display: grid;
  gap: 0.5rem;
}

.replacement-home-activity-item {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: start;
  gap: 0.55rem;
}

.replacement-home-activity-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  margin-top: 0.6rem;
  background: #94a3c8;
}

.replacement-home-activity-item.tone-pending .replacement-home-activity-dot {
  background: #f08a00;
}

.replacement-home-activity-item.tone-progress .replacement-home-activity-dot {
  background: #2563eb;
}

.replacement-home-activity-item.tone-completed .replacement-home-activity-dot {
  background: #16a34a;
}

.replacement-home-activity-item.tone-cancelled .replacement-home-activity-dot {
  background: #ef4444;
}

.replacement-home-activity-item.tone-total .replacement-home-activity-dot {
  background: #7c3aed;
}

.replacement-home-activity-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid #dde6fa;
  background: #f7f9ff;
  color: #5e75ba;
  display: inline-grid;
  place-items: center;
}

.replacement-home-activity-item strong {
  display: block;
  color: #071b52;
  font-size: 0.98rem;
  font-weight: 700;
}

.replacement-home-activity-item p {
  margin: 0.16rem 0 0;
  color: #4e6394;
  font-size: 0.94rem;
}

.replacement-home-activity-status {
  font-style: normal;
  font-weight: 700;
}

.replacement-home-activity-status.tone-pending {
  color: #f08a00;
}

.replacement-home-activity-status.tone-progress {
  color: #2563eb;
}

.replacement-home-activity-status.tone-completed {
  color: #16a34a;
}

.replacement-home-activity-status.tone-cancelled {
  color: #dc2626;
}

.replacement-home-activity-status.tone-total {
  color: #7c3aed;
}

.replacement-home-activity-item small {
  display: block;
  margin-top: 0.12rem;
  color: #6f82b5;
  font-size: 0.86rem;
}

.replacement-home-filter-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 520px);
  gap: 0.85rem;
  align-items: center;
}

.replacement-home-filter-title {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 1.45rem;
  font-size: clamp(0.94rem, 1vw, 1.1rem);
  color: #071b52;
  font-weight: 700;
}

.replacement-home-filter-title i {
  color: #5c70af;
}

.replacement-home-filter-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.6rem;
}

.replacement-home-filter-chip {
  border: 1px solid #dde6fa;
  background: #f6f8ff;
  color: #33498f;
  border-radius: 10px;
  min-height: 2.2rem;
  padding: 0 0.82rem;
  font-size: 0.9rem;
  font-weight: 600;
}

.replacement-home-filter-chip.active {
  border-color: transparent;
  color: #ffffff;
  background: linear-gradient(135deg, #3f46f4, #5b5ff8);
}

.replacement-home-filter-search {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.5rem;
  align-items: center;
  min-height: 52px;
  border: 1px solid #dde6fa;
  border-radius: 12px;
  background: #ffffff;
  padding: 0 8px 0 12px;
}

.replacement-home-filter-search > i {
  color: #5e73b7;
}

.replacement-home-filter-search input {
  border: 0;
  background: transparent;
  min-height: 42px;
  padding: 0;
}

.replacement-home-filter-search input:focus {
  box-shadow: none;
}

.replacement-home-filter-search button {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 10px;
  background: #eef2ff;
  color: #4a56f7;
  display: inline-grid;
  place-items: center;
}

.replacement-home-list-search-row {
  margin-bottom: 0.65rem;
}

.replacement-job-prefix-wrap {
  margin-bottom: 0.8rem;
}

.replacement-job-prefix-field {
  margin-top: 0.35rem;
}

.replacement-job-prefix-note {
  display: inline-block;
  margin-top: 0.45rem;
  font-size: 0.86rem;
}

.replacement-inline-tools {
  display: grid;
  align-content: center;
  gap: 0.45rem;
  font-weight: 700;
  color: var(--surface-ink);
}

.replacement-inline-tools .field-inline-btn {
  width: fit-content;
}

.replacement-product-field {
  position: relative;
  display: block;
}

.replacement-product-field .field-control {
  min-width: 0;
}

.replacement-product-field .field-inline-btn {
  position: static;
  transform: none;
  display: inline-flex;
  margin-top: 0.46rem;
  min-height: 2.62rem;
  padding: 0.42rem 0.82rem;
  border-radius: 10px;
  font-size: 0.82rem;
  line-height: 1.1;
  white-space: nowrap;
}

#replacementForm .replacement-large-field .field-control > input {
  min-height: 3rem;
  font-size: 1rem;
  padding-right: 0.9rem;
}

#replacementForm .replacement-large-field .field-inline-btn {
  min-height: 2.62rem;
}

#replacementForm .replacement-short-textarea textarea {
  min-height: 4.1rem;
}

.replacement-view-actions {
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 0.55rem 0 1rem;
}

.replacement-view-actions > #exportReplacementsExcelBtn {
  min-height: 2.65rem;
  border-radius: 12px;
  align-self: flex-start;
}

.replacement-bulk-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  align-items: stretch;
  gap: 1rem;
  width: 100%;
}

.replacement-bulk-actions > .replacement-bulk-group {
  height: 100%;
}

.replacement-incoming-panel {
  border-color: rgba(57, 82, 196, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 246, 255, 0.96));
  box-shadow: 0 14px 34px rgba(52, 75, 152, 0.15);
  margin-bottom: 0.8rem;
}

.replacement-incoming-heading {
  padding: 0;
  margin: -0.02rem 0 0.22rem;
}

.replacement-incoming-heading h3 {
  margin: 0;
  font-size: 1.14rem;
  font-weight: 700;
  line-height: 1.32;
  color: var(--surface-ink);
}

.replacement-incoming-toolbar {
  margin: 0.1rem 0 0.2rem;
  justify-content: flex-start;
  align-items: center;
  gap: 0.62rem;
}

.replacement-incoming-toolbar .primary-btn,
.replacement-incoming-toolbar .secondary-btn {
  min-width: 170px;
}

.replacement-incoming-table-wrap {
  border: 1px solid rgba(38, 58, 125, 0.16);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  max-height: 430px;
}

.replacement-incoming-table-wrap table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f3f6ff;
  font-size: 0.82rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #374a83;
}

.replacement-incoming-table-wrap table td {
  vertical-align: top;
  font-size: 0.92rem;
  line-height: 1.4;
}

.replacement-bulk-group {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.78rem;
  border: 1px solid rgba(20, 33, 61, 0.14);
  border-radius: 18px;
  padding: 1rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(245, 248, 255, 0.9));
  box-shadow: 0 10px 26px rgba(56, 78, 132, 0.12);
}

.replacement-bulk-group-selection {
  border-color: rgba(72, 98, 172, 0.2);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(236, 245, 255, 0.95));
}

.replacement-bulk-group-dispatch {
  border-color: rgba(86, 102, 238, 0.2);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(240, 245, 255, 0.94));
}

.replacement-bulk-group-supplier-dispatch {
  border-color: rgba(106, 95, 220, 0.23);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(242, 239, 255, 0.95));
}

.replacement-bulk-group-customer-dispatch {
  border-color: rgba(79, 124, 198, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(236, 247, 255, 0.95));
}

.replacement-bulk-group-utility {
  border-color: rgba(75, 132, 118, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(236, 250, 244, 0.95));
  justify-content: flex-start;
}

.replacement-bulk-group-title {
  margin: 0;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  min-height: 1.12rem;
  display: flex;
  align-items: center;
}

.replacement-bulk-helper {
  margin: -0.02rem 0 0.16rem;
  color: #5f6b8d;
  font-size: 0.82rem;
  line-height: 1.4;
  min-height: 3.2rem;
}

.replacement-bulk-group-utility .replacement-utility-actions {
  margin-top: 0.15rem;
}

#replacementB2BConnectedActionsGroup {
  grid-column: 1 / -1;
}

.replacement-b2b-home-panel .replacement-bulk-group-row > *,
#replacementB2BHomePanel .replacement-bulk-group-row > * {
  grid-column: 1 / -1;
}

.replacement-b2b-home-panel .replacement-bulk-group-row select,
.replacement-b2b-home-panel .replacement-bulk-group-row input,
#replacementB2BHomePanel .replacement-bulk-group-row select,
#replacementB2BHomePanel .replacement-bulk-group-row input {
  min-height: 3.08rem;
  padding: 0.68rem 0.9rem;
  font-size: 1.08rem;
  line-height: 1.3;
}

.replacement-bulk-selected-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin: -0.08rem 0 0.04rem;
}

.replacement-bulk-group-row {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: end;
  gap: 0.56rem;
}

.replacement-bulk-group-row > * {
  min-width: 0;
  grid-column: span 4;
}

.replacement-bulk-group-row datalist {
  display: none;
}

.replacement-bulk-group-row select,
.replacement-bulk-group-row input {
  width: 100%;
  min-height: 2.72rem;
  padding: 0.58rem 0.76rem;
  background: rgba(255, 255, 255, 0.96);
  border-radius: 12px;
  font-size: 1rem;
  line-height: 1.25;
}

.replacement-bulk-group-row button {
  min-height: 2.72rem;
  min-width: 0;
  width: 100%;
  border-radius: 12px;
  font-size: 1rem;
}

.replacement-bulk-group-row input[type="date"] {
  min-width: 0;
}

.replacement-bulk-group-row-priority > select,
.replacement-bulk-group-row-priority > input {
  grid-column: span 6;
}

.replacement-bulk-group-row-priority > button {
  grid-column: span 6;
}

.replacement-bulk-group-row-supplier > input {
  grid-column: span 6;
}

.replacement-bulk-group-row-supplier > button {
  grid-column: span 6;
}

.replacement-bulk-group-row-duo > select {
  grid-column: span 7;
}

.replacement-bulk-group-row-duo > input[type="date"] {
  grid-column: span 5;
}

.replacement-bulk-group-row-detail > input:not([hidden]) {
  grid-column: span 6;
}

.replacement-bulk-group-row-detail.is-by-hand > input:not([hidden]) {
  grid-column: span 4;
}

.replacement-bulk-group-row-actions > button {
  grid-column: 1 / -1;
  min-height: 3.02rem;
  font-weight: 800;
}

.replacement-utility-actions {
  grid-column: 1 / -1;
  width: 100%;
  display: grid;
  gap: 0.5rem;
}

.replacement-utility-btn {
  width: 100%;
  min-height: 2.72rem;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.52rem;
  font-size: 1rem;
  font-weight: 700;
}

.replacement-utility-btn i {
  font-size: 1.02rem;
  color: #2d4f97;
}

.replacement-bulk-group-row-priority,
.replacement-bulk-group-row-supplier {
  grid-template-columns: minmax(0, 1fr) minmax(156px, 188px);
}

.replacement-bulk-group-row-priority > *,
.replacement-bulk-group-row-supplier > * {
  grid-column: auto;
}

.replacement-bulk-purpose {
  border: 1px solid rgba(20, 33, 61, 0.12);
  border-radius: 14px;
  padding: 0.62rem 0.62rem 0.7rem;
}

.replacement-bulk-purpose-status {
  background: rgba(78, 123, 205, 0.08);
}

.replacement-bulk-purpose-supplier {
  background: rgba(83, 153, 130, 0.09);
}

.replacement-bulk-purpose-title {
  margin: 0 0 0.38rem;
  color: #44547f;
  font-size: 0.72rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  font-weight: 800;
}

.replacement-bulk-group-row-duo {
  grid-template-columns: minmax(0, 1fr) minmax(158px, 190px);
}

.replacement-bulk-group-row-duo > * {
  grid-column: auto;
}

.replacement-bulk-group-row-detail {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.replacement-bulk-group-row-detail > input:not([hidden]) {
  grid-column: auto;
}

.replacement-bulk-group-row-detail.is-by-hand {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.replacement-bulk-group-row-detail.is-by-hand > input:not([hidden]) {
  grid-column: auto;
}

#replacementBulkDispatchDetailFields,
#replacementBulkCustomerDispatchDetailFields {
  grid-template-columns: 1fr;
}

#replacementBulkDispatchDetailFields > input:not([hidden]),
#replacementBulkCustomerDispatchDetailFields > input:not([hidden]) {
  grid-column: 1 / -1;
}

#replacementBulkDispatchDetailFields.is-by-hand,
#replacementBulkCustomerDispatchDetailFields.is-by-hand {
  grid-template-columns: 1fr;
}

.replacement-bulk-count {
  display: inline-grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  justify-content: space-between;
  min-width: 150px;
  width: 168px;
  min-height: 2.72rem;
  padding: 0.52rem 0.8rem;
  border-radius: 999px;
  background: rgba(20, 33, 61, 0.08);
  color: var(--surface-ink);
  font-size: 0.9rem;
  font-weight: 800;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  text-align: left;
  gap: 0.48rem;
}

.replacement-bulk-count-label {
  font-size: 0.82rem;
  font-weight: 700;
  color: #49557e;
  letter-spacing: 0.02em;
}

.replacement-bulk-count-value {
  min-width: 1.8rem;
  text-align: right;
  font-size: 1rem;
  font-weight: 900;
  color: var(--surface-ink);
}

.replacement-bulk-group-status-manage {
  border-color: rgba(46, 78, 182, 0.2);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 247, 255, 0.95));
}

.replacement-bulk-group-row-status-manage {
  grid-template-columns: minmax(0, 1fr) minmax(128px, 152px);
}

.replacement-bulk-group-row-status-manage > * {
  grid-column: auto;
}

.replacement-status-manage-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.replacement-status-manage-section-title {
  margin: 0.2rem 0 0;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #526395;
}

.replacement-status-manage-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(124px, auto);
  gap: 0.54rem;
  align-items: center;
  border: 1px solid rgba(59, 87, 186, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.9);
  padding: 0.58rem 0.68rem;
}

.replacement-status-manage-row-extra {
  grid-template-columns: minmax(0, 1fr) minmax(94px, 118px);
}

.replacement-status-manage-row-label {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  font-weight: 700;
  color: var(--surface-ink);
}

.replacement-status-manage-row-label .bi {
  color: #4564d7;
}

.replacement-status-manage-row-base {
  font-size: 0.84rem;
  color: #51618e;
  text-align: left;
}

.replacement-status-manage-row-input {
  min-height: 2.25rem;
  border-radius: 10px;
  border: 1px solid rgba(93, 114, 186, 0.26);
  background: rgba(255, 255, 255, 0.94);
  color: var(--surface-ink);
  font-weight: 600;
  padding: 0.36rem 0.64rem;
}

.replacement-status-manage-row-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.replacement-status-manage-row-actions .small-btn {
  min-height: 2.2rem;
  min-width: 84px;
}

.replacement-status-manage-empty {
  margin: 0;
  padding: 0.66rem 0.72rem;
  border-radius: 10px;
  border: 1px dashed rgba(67, 88, 160, 0.28);
  color: #61709c;
  font-size: 0.83rem;
}

.replacement-b2b-meta {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin: -0.08rem 0 0.06rem;
}

.replacement-b2b-meta-label {
  font-size: 0.82rem;
  font-weight: 700;
  color: #5f6b8d;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.replacement-b2b-meta-value {
  font-size: 1rem;
  font-weight: 800;
  color: var(--surface-ink);
  letter-spacing: 0.02em;
}

.replacement-b2b-status {
  margin: 0.08rem 0 0;
  font-size: 0.83rem;
  line-height: 1.42;
  color: #5b6788;
}

.replacement-b2b-home-layout {
  display: grid;
  gap: 1rem;
}

.replacement-b2b-invite-group {
  width: 100%;
}

.replacement-b2b-invite-table-wrap {
  border: 1px solid rgba(20, 33, 61, 0.1);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  max-height: 300px;
}

.replacement-b2b-invite-table th,
.replacement-b2b-invite-table td {
  vertical-align: middle;
}

.replacement-b2b-bottom-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  align-items: stretch;
}

.replacement-b2b-business-group,
.replacement-b2b-connected-group {
  height: 100%;
}

.replacement-b2b-connected-group {
  gap: 0.68rem;
}

.replacement-b2b-utility-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.56rem;
  justify-content: flex-end;
  align-items: center;
}

.replacement-b2b-utility-links > button {
  width: auto;
  min-width: 172px;
  min-height: 2.5rem;
  border-radius: 999px;
  font-weight: 700;
}

.replacement-b2b-connected-table-wrap {
  border: 1px solid rgba(20, 33, 61, 0.1);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  max-height: 280px;
}

.replacement-b2b-connected-table th,
.replacement-b2b-connected-table td {
  vertical-align: middle;
}

.replacement-b2b-connected-table td:last-child {
  text-align: right;
}

.replacement-b2b-connected-map-wrap {
  display: grid;
  gap: 0.36rem;
  min-width: 260px;
  justify-items: end;
}

.replacement-b2b-connected-ledger-map {
  min-width: 240px;
  width: 100%;
}

.replacement-b2b-connected-map-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.4rem;
}

.replacement-b2b-invite-ledger-map {
  min-width: 220px;
  width: 100%;
}

.replacement-b2b-map-helper {
  margin-top: 0.32rem;
  font-size: 0.75rem;
  line-height: 1.32;
  color: #667496;
}

.replacement-b2b-inbox-queue-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin: 0.25rem 0 0.35rem;
}

.replacement-b2b-inbox-queue-btn.active {
  background: linear-gradient(135deg, #5e4cf1, #3e54f0);
  color: #fff;
  border-color: rgba(62, 84, 240, 0.7);
}

.replacement-b2b-inbox-queue-summary {
  margin: 0 0 0.55rem;
  color: #4f5e88;
  font-size: 0.86rem;
  font-weight: 500;
}

.replacement-b2b-item-map-wrap {
  display: grid;
  gap: 0.34rem;
  min-width: 250px;
}

.replacement-b2b-item-map-suggest {
  font-size: 0.74rem;
  line-height: 1.35;
  color: #5c6a90;
}

.replacement-b2b-inbox-item-map-select {
  width: 100%;
  min-width: 240px;
}

.replacement-b2b-inbox-item-map-filter {
  width: 100%;
}

.replacement-b2b-inbox-item-map-custom {
  width: 100%;
}

.replacement-b2b-item-map-match {
  min-width: 180px;
  text-align: left;
}

.replacement-b2b-item-map-match strong {
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  color: #2d3e74;
}

.address-print-card {
  display: grid;
  gap: 1rem;
  border: 1px solid #dde6fa;
  border-radius: 18px;
  background: #f7f9ff;
  padding: 1rem;
}

.address-print-toggle-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
}

.address-print-copy-control {
  display: grid;
  gap: 0.3rem;
  min-width: 130px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--muted);
}

.address-print-copy-control input {
  min-height: 2.2rem;
}

.address-print-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.address-print-block {
  display: grid;
  gap: 0.82rem;
  background: #ffffff;
  border: 1px solid #dde6fa;
  border-radius: 16px;
  padding: 1rem;
  box-shadow: 0 12px 30px rgba(20, 40, 90, 0.08);
}

.address-print-pane-head {
  display: flex;
  align-items: center;
  gap: 0.62rem;
}

.address-print-step {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-size: 0.92rem;
  font-weight: 700;
  color: #334af4;
  background: #ecefff;
}

.address-print-pane-head h3 {
  margin: 0;
  font-size: clamp(1rem, 1.15vw, 1.24rem);
  line-height: 1.25;
  color: #071b52;
  font-weight: 700;
}

.address-print-block .panel-heading {
  margin: 0;
}

.address-print-block .helper-text {
  margin-top: 0;
}

.address-print-block textarea {
  min-height: 180px;
  resize: vertical;
}

.address-print-field {
  display: grid;
  gap: 0.42rem;
}

.address-print-field > span {
  font-size: 0.88rem;
  color: #071b52;
  font-weight: 700;
}

.address-print-field > span em {
  margin-left: 0.25rem;
  font-style: normal;
  font-weight: 500;
  color: #4e6394;
}

.address-print-select-wrap {
  position: relative;
  display: grid;
  align-items: center;
}

.address-print-select-wrap > i {
  position: absolute;
  left: 0.82rem;
  color: #4d63c3;
  font-size: 1.05rem;
  pointer-events: none;
}

.address-print-select-wrap select {
  padding-left: 2.2rem;
}

.address-print-inline-meta {
  display: flex;
  justify-content: flex-end;
}

.address-print-inline-meta small {
  font-size: 0.82rem;
  color: #4e6394;
  font-weight: 600;
}

.address-print-mini-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.address-print-mini-btn {
  min-height: 2.45rem;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.92rem;
}

.address-print-logo-toggle {
  margin-top: 0.1rem;
}

.address-print-actions-row {
  margin-top: 0.2rem;
  gap: 0.75rem;
}

.address-print-actions-row .primary-btn,
.address-print-actions-row .secondary-btn {
  min-height: 2.7rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.address-print-copy-control-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.48rem;
  min-height: 2.7rem;
  padding: 0 0.62rem;
  border: 1px solid #dde6fa;
  border-radius: 10px;
  background: #ffffff;
  color: #4e6394;
  font-size: 0.9rem;
  font-weight: 600;
}

.address-print-copy-control-inline span {
  white-space: nowrap;
}

.address-print-copy-control-inline input {
  width: 78px;
  min-height: 2.05rem;
  padding: 0.2rem 0.4rem;
  border: 1px solid #dde6fa;
  border-radius: 8px;
}

.address-print-preview-card {
  border: 1px solid #dde6fa;
  border-radius: 16px;
  padding: 1rem;
  background: #ffffff;
}

.address-print-preview-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 0.8rem;
  margin-bottom: 0.8rem;
}

.address-print-preview-head p {
  margin: 0;
  display: grid;
  gap: 0.12rem;
  color: #4e6394;
}

.address-print-preview-head p > i {
  color: #3f46f4;
  font-size: 1.06rem;
}

.address-print-preview-head p > strong {
  color: #071b52;
  font-size: 1.3rem;
  font-size: clamp(1rem, 1.3vw, 1.32rem);
  font-weight: 700;
}

.address-print-preview-head p > small {
  color: #4e6394;
  font-size: 0.92rem;
  font-weight: 500;
}

.address-print-preview-fit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.6rem;
  padding: 0 1rem;
  border-radius: 999px;
  border: 1px solid #dde6fa;
  color: #1e2a78;
  background: #f7f9ff;
  font-size: 0.93rem;
  font-weight: 600;
  white-space: nowrap;
}

.address-print-preview-label {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
  border: 1px solid #dde6fa;
  border-radius: 14px;
  padding: 0.85rem;
  background: #fbfcff;
}

.address-print-preview-col {
  display: grid;
  gap: 0.45rem;
  align-content: start;
  min-width: 0;
}

.address-print-preview-col + .address-print-preview-col {
  border-left: 1px dashed #d6def4;
  padding-left: 0.9rem;
}

.address-print-preview-col h4 {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.55rem;
  font-size: clamp(1.06rem, 1.45vw, 1.5rem);
  line-height: 1.2;
  font-weight: 700;
  color: #3f46f4;
}

.address-print-preview-col p {
  margin: 0;
  white-space: pre-line;
  color: #071b52;
  line-height: 1.45;
  font-size: 0.98rem;
}

.address-print-preview-logo-wrap {
  margin-top: 0.15rem;
}

.address-print-preview-logo-wrap img {
  width: 86px;
  max-width: 100%;
  max-height: 58px;
  object-fit: contain;
}

.address-print-status {
  margin: 0;
}

.attendance-table-wrap {
  overflow: auto;
  border: 1px solid rgba(20, 33, 61, 0.1);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 18px 40px rgba(80, 96, 160, 0.12);
}

.attendance-table {
  width: 100%;
  min-width: 1200px;
  border-collapse: collapse;
}

.attendance-table th,
.attendance-table td {
  border-bottom: 1px solid rgba(20, 33, 61, 0.12);
  text-align: center;
  vertical-align: middle;
}

.attendance-table th {
  padding: 0.95rem 0.55rem 0.72rem;
  color: var(--surface-ink);
  font-family: "Space Grotesk", sans-serif;
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.25;
}

.attendance-table td {
  padding: 0.82rem 0.5rem;
  color: var(--surface-ink);
  font-size: 0.92rem;
  line-height: 1.4;
}

.attendance-table tbody tr:hover {
  background: rgba(238, 243, 255, 0.72);
}

.attendance-notes-cell {
  min-width: 160px;
  max-width: 240px;
  white-space: normal;
  word-break: break-word;
  text-align: left;
}

.attendance-meta-text {
  font-size: 0.82rem;
  color: var(--muted);
}

.attendance-correction-section {
  margin-top: 1rem;
}

.attendance-correction-table-wrap {
  overflow: auto;
  border: 1px solid rgba(20, 33, 61, 0.1);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.78);
}

.attendance-correction-table {
  width: 100%;
  min-width: 1150px;
  border-collapse: collapse;
}

.attendance-correction-table th,
.attendance-correction-table td {
  border-bottom: 1px solid rgba(20, 33, 61, 0.12);
  text-align: center;
  vertical-align: middle;
}

.attendance-correction-table th {
  padding: 0.85rem 0.52rem 0.66rem;
  color: var(--surface-ink);
  font-family: "Space Grotesk", sans-serif;
  font-size: 0.92rem;
  font-weight: 600;
}

.attendance-correction-table td {
  padding: 0.72rem 0.46rem;
  color: var(--surface-ink);
  font-size: 0.88rem;
  line-height: 1.35;
}

.attendance-correction-table tbody tr:hover {
  background: rgba(238, 243, 255, 0.72);
}

.attendance-correction-reason {
  min-width: 170px;
  max-width: 260px;
  white-space: normal;
  word-break: break-word;
  text-align: left;
}

.replacement-table-wrap {
  overflow: auto;
  border: 1px solid rgba(20, 33, 61, 0.1);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 18px 40px rgba(80, 96, 160, 0.12);
}

.replacement-table {
  width: 100%;
  min-width: 1120px;
  border-collapse: collapse;
  table-layout: fixed;
}

.replacement-table th,
.replacement-table td {
  border-bottom: 1px solid rgba(20, 33, 61, 0.12);
  text-align: center;
  vertical-align: middle;
}

.replacement-table th {
  padding: 1.15rem 0.6rem 0.75rem;
  color: var(--surface-ink);
  font-family: "Space Grotesk", sans-serif;
  font-size: 1.08rem;
  font-weight: 600;
  line-height: 1.25;
}

.replacement-filter-row th {
  padding: 0.55rem 0.45rem 0.75rem;
}

.replacement-filter-row input {
  min-height: 2.75rem;
  border-radius: 7px;
  padding: 0.62rem 0.7rem;
  text-align: center;
  background: #fff;
}

.replacement-select-all-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--surface-ink);
}

.replacement-select-all-wrap input,
.replacement-row-select {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--primary);
}

.replacement-table td {
  padding: 1rem 0.55rem;
  color: var(--surface-ink);
  font-size: 0.98rem;
  line-height: 1.55;
}

.replacement-docket-cell {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  line-height: 1.2;
}

.replacement-docket-main {
  font-weight: 700;
  letter-spacing: 0.02em;
}

.replacement-docket-sub {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  max-width: 10.5rem;
  overflow-wrap: anywhere;
}

.replacement-docket-meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  border-radius: 999px;
  padding: 0.05rem 0.45rem;
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  background: rgba(20, 33, 61, 0.08);
  color: var(--surface-ink);
}

.replacement-table tbody tr:hover {
  background: rgba(238, 243, 255, 0.72);
}

.replacement-selectable-row {
  cursor: pointer;
}

.replacement-selectable-row button,
.replacement-selectable-row input,
.replacement-selectable-row select,
.replacement-selectable-row textarea {
  cursor: auto;
}

.replacement-row-selected {
  background: rgba(226, 238, 255, 0.9);
}

.replacement-status-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
}

.replacement-stock-note {
  font-size: 0.82rem;
  font-weight: 800;
  color: #2f8f56;
  letter-spacing: 0.02em;
}

.replacement-b2b-sync-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.28rem;
  margin-top: 0.18rem;
}

.replacement-b2b-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.14rem 0.5rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.replacement-b2b-sync-reasons {
  margin-top: 0.22rem;
  font-size: 0.74rem;
  line-height: 1.32;
  color: #8a3e3e;
  text-align: left;
}

.replacement-by-hand-row {
  margin-top: -0.1rem;
}

.replacement-job-btn {
  min-width: 105px;
  border: 0;
  border-radius: 6px;
  padding: 0.78rem 0.95rem;
  background: linear-gradient(135deg, #bd36ca, #8e24aa);
  color: #fff;
  box-shadow: 0 9px 18px rgba(142, 36, 170, 0.24);
  font-weight: 900;
}

.replacement-row-actions {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.replacement-row-actions .action-menu-summary {
  min-width: 90px;
  justify-content: center;
}

.replacement-delete-btn {
  background: rgba(168, 59, 50, 0.1);
  color: #9f3228;
  border: 1px solid rgba(168, 59, 50, 0.28);
}

.replacement-status-table-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 116px;
  border: 2px solid #008bd2;
  border-radius: 0;
  padding: 0.42rem 0.62rem;
  color: #07102d;
  font-weight: 800;
  line-height: 1.2;
}

.replacement-status-received_customer {
  background: #ffe600;
}

.replacement-status-packed {
  background: #1248ff;
  color: #ffffff;
}

.replacement-status-sent_supplier {
  background: #9be7ff;
}

.replacement-status-received_back,
.replacement-status-delivered_closed {
  background: #b7f3c4;
}

.stock-control-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.1rem;
}

.stock-purchase-form .tally-voucher-bar {
  grid-template-columns: minmax(120px, 150px) repeat(3, minmax(0, 1fr));
}

.stock-summary-view-card {
  display: grid;
  gap: 14px;
}

.stock-summary-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.stock-summary-hero .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.stock-summary-hero .eyebrow i {
  color: #3150f3;
  font-size: 0.95rem;
}

.stock-summary-hero h3 {
  margin: 0.15rem 0 0;
  color: #071b52;
  font-size: clamp(1.18rem, 1.9vw, 1.95rem);
  line-height: 1.2;
}

.stock-summary-hero-note {
  margin: 0.38rem 0 0;
  color: #4e6394;
  font-size: 0.95rem;
  font-weight: 500;
}

.stock-summary-hero-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.stock-summary-mode-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid #dde6fa;
  background: #f4f6ff;
  color: #3150f3;
  font-size: 0.95rem;
  font-weight: 700;
}

.stock-summary-filter-card {
  border: 1px solid #dde6fa;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 14px 35px rgba(20, 40, 90, 0.08);
  padding: 14px;
  display: grid;
  gap: 12px;
}

.stock-summary-filter-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.stock-summary-filter-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.stock-summary-filter-field > span {
  font-size: 13px;
  color: #071b52;
  font-weight: 700;
}

.stock-summary-filter-field > span small {
  color: #7b8db8;
  font-weight: 500;
}

.stock-summary-filter-field input,
.stock-summary-filter-field select {
  width: 100%;
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid #dde6fa;
  background: #ffffff;
  color: #071b52;
  font-size: 14px;
  font-weight: 600;
  padding: 0 12px;
}

.stock-summary-filter-search {
  grid-column: span 2;
}

.stock-summary-filter-item {
  grid-column: span 2;
}

.stock-summary-filter-input {
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid #dde6fa;
  background: #ffffff;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 0 12px;
}

.stock-summary-filter-input i {
  color: #3150f3;
  font-size: 14px;
}

.stock-summary-filter-input input {
  border: 0;
  min-height: 42px;
  background: transparent;
  padding: 0;
  min-width: 0;
  font-weight: 500;
}

.stock-summary-filter-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.stock-summary-filter-actions .secondary-btn,
.stock-summary-filter-actions .primary-btn {
  min-height: 44px;
  border-radius: 12px;
  padding: 0 18px;
}

.stock-control-top-head {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) minmax(440px, auto);
  align-items: start;
  gap: 14px;
}

.stock-control-top-head > div:first-child {
  min-width: 0;
}

.stock-control-top-actions {
  justify-self: end;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 440px;
}

#stockBackToHomeBtn {
  grid-column: 1 / -1;
  justify-self: end;
}

.stock-control-top-actions .secondary-btn {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 10px;
  border: 1px solid #d6e2fb;
  background: #f3f6ff;
  color: #2353b8;
  font-size: 0.92rem;
  font-weight: 700;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.42rem;
}

.stock-control-top-actions .status-pill {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid #ccd9f9;
  background: #eef3ff;
  color: #2a4f9e;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.stock-summary-filter-actions .secondary-btn,
.stock-summary-table-head .secondary-btn {
  background: #ffffff;
  border: 1px solid #d7e3fb;
  color: #1e2a78;
  box-shadow: none;
}

.stock-summary-filter-actions .primary-btn {
  background: linear-gradient(135deg, #3f46f4, #5b5ff8);
  color: #ffffff;
  border: 1px solid transparent;
  box-shadow: 0 12px 25px rgba(63, 70, 244, 0.22);
}

.stock-summary-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.stock-summary-stat-card {
  border: 1px solid #dde6fa;
  border-radius: 14px;
  background: #ffffff;
  padding: 14px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.stock-summary-stat-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: inline-grid;
  place-items: center;
  font-size: 22px;
}

.stock-summary-stat-card small {
  display: block;
  font-size: 13px;
  color: #4e6394;
  font-weight: 600;
}

.stock-summary-stat-card strong {
  display: block;
  margin-top: 2px;
  font-size: clamp(28px, 2.2vw, 44px);
  line-height: 1;
  font-weight: 700;
}

.stock-summary-stat-card.tone-blue {
  border-color: #d7e6ff;
  background: #f7faff;
}

.stock-summary-stat-card.tone-blue .stock-summary-stat-icon {
  color: #3150f3;
  background: #eaf0ff;
}

.stock-summary-stat-card.tone-blue strong {
  color: #244ae5;
}

.stock-summary-stat-card.tone-green {
  border-color: #cfeedd;
  background: #f8fdf9;
}

.stock-summary-stat-card.tone-green .stock-summary-stat-icon {
  color: #16934a;
  background: #e9f8ef;
}

.stock-summary-stat-card.tone-green strong {
  color: #16934a;
}

.stock-summary-stat-card.tone-amber {
  border-color: #f6dfc7;
  background: #fffaf4;
}

.stock-summary-stat-card.tone-amber .stock-summary-stat-icon {
  color: #ea8a00;
  background: #fff2e3;
}

.stock-summary-stat-card.tone-amber strong {
  color: #c87400;
}

.stock-summary-stat-card.tone-violet {
  border-color: #e2ddff;
  background: #fbfaff;
}

.stock-summary-stat-card.tone-violet .stock-summary-stat-icon {
  color: #6543ff;
  background: #efebff;
}

.stock-summary-stat-card.tone-violet strong {
  color: #6543ff;
}

.stock-summary-table-card {
  border: 1px solid #dde6fa;
  border-radius: 14px;
  background: #ffffff;
  padding: 12px;
  display: grid;
  gap: 8px;
}

.stock-summary-table-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.stock-summary-table-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.stock-summary-table-title h4 {
  margin: 0;
  font-size: clamp(1.1rem, 1.2vw, 1.35rem);
  line-height: 1.2;
  color: #071b52;
  font-weight: 700;
}

.stock-summary-row-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  border: 1px solid #dde6fa;
  background: #f7f9ff;
  color: #4e6394;
  font-size: 13px;
  font-weight: 600;
  padding: 0 12px;
}

.stock-summary-breadcrumb,
.stock-summary-meta {
  margin-top: 0;
  margin-bottom: 0;
}

.stock-summary-table-wrap {
  border-radius: 12px;
  border: 1px solid #e6edfa;
  background: #ffffff;
}

.stock-summary-table-wrap table {
  min-width: 960px;
}

.stock-summary-table-wrap th {
  font-size: 13px;
  color: #4e6394;
  font-weight: 700;
  background: #fafbff;
}

.stock-summary-table-wrap td {
  font-size: 14px;
  color: #071b52;
}

.stock-summary-index-cell {
  color: #4e6394;
  text-align: center;
  font-weight: 600;
  width: 48px;
  white-space: nowrap;
}

.stock-summary-open-btn {
  min-height: 34px;
  border-radius: 10px;
  padding: 0.42rem 0.72rem;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #ffffff;
  border: 1px solid #d7e3fb;
  color: #244ae5;
  box-shadow: none;
}

.stock-summary-open-btn i {
  font-size: 12px;
}

.stock-balance-value {
  font-weight: 800;
}

.stock-balance-negative {
  color: #a83b32;
}

.stock-balance-low {
  color: #9a6b00;
}

.stock-balance-ok {
  color: #2f8f56;
}

.stock-flow-opening-row td {
  background: rgba(20, 33, 61, 0.04);
}

.stock-flow-inward-row td {
  background: rgba(47, 143, 86, 0.07);
}

.stock-flow-outward-row td {
  background: rgba(168, 59, 50, 0.07);
}

.stock-flow-mixed-row td {
  background: rgba(20, 52, 95, 0.05);
}

.stock-flow-inward-cell {
  color: #216c41;
  font-weight: 700;
}

.stock-flow-outward-cell {
  color: #8f3228;
  font-weight: 700;
}

.stock-row-note {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.78rem;
  color: var(--muted);
}

.stock-negative-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0.18rem 0.52rem;
  font-size: 0.72rem;
  font-weight: 800;
  background: rgba(168, 59, 50, 0.14);
  color: #a83b32;
}

.stock-inline-actions {
  display: flex;
  align-items: center;
  gap: 0.38rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.stock-inline-linkages {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.3rem;
  flex-wrap: wrap;
}

.stock-purchase-link-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0.16rem 0.52rem;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  border: 1px solid transparent;
}

.stock-purchase-link-badge.is-sold {
  background: rgba(168, 59, 50, 0.13);
  border-color: rgba(168, 59, 50, 0.3);
  color: #913329;
}

.stock-purchase-link-badge.is-serial {
  background: rgba(154, 107, 0, 0.14);
  border-color: rgba(154, 107, 0, 0.28);
  color: #7c5600;
}

.followup-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.2rem 0.62rem;
  font-size: 0.76rem;
  font-weight: 800;
}

.followup-overdue {
  background: rgba(168, 59, 50, 0.14);
  color: #a83b32;
}

.followup-due-today {
  background: rgba(154, 107, 0, 0.16);
  color: #8a5d00;
}

.followup-upcoming {
  background: rgba(20, 52, 95, 0.12);
  color: #14345f;
}

.followup-none {
  background: rgba(20, 33, 61, 0.08);
  color: #4d5b66;
}

.revision-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.2rem 0.62rem;
  font-size: 0.76rem;
  font-weight: 800;
  background: rgba(20, 33, 61, 0.1);
  color: #25313b;
}

.empty-state {
  text-align: center;
  padding: 2rem;
  color: var(--muted);
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius-md);
}

.print-sheet {
  display: none;
}

.print-document {
  background: white;
  color: #111;
  padding: 2rem;
}

.compact-print {
  padding: 1rem 1.2rem 1.15rem;
  font-size: 11px;
  line-height: 1.28;
}

.print-header {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  border-bottom: 2px solid #ddd;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}

.compact-header {
  gap: 1.25rem;
  padding-bottom: 0.65rem;
  margin-bottom: 0.65rem;
  align-items: start;
  min-height: 178px;
}

.compact-brand {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
}

.print-business-block {
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
  min-width: 0;
}

.print-business-name {
  display: flex;
  flex-direction: column;
  max-width: 100%;
  margin: 0 0 0.36rem;
  font-size: clamp(1.14rem, 2.15vw, 1.72rem);
  line-height: 1.16;
  letter-spacing: 0.01em;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.print-business-name-line {
  display: block;
}

.print-business-name-line.export-single-line {
  white-space: nowrap;
}

.compact-header h1 {
  font-size: 1.4rem;
  line-height: 1.3;
  margin-bottom: 0.36rem;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.compact-header .print-business-name {
  font-size: clamp(1.14rem, 2.15vw, 1.72rem);
  line-height: 1.16;
}

.print-logo {
  width: 92px;
  max-height: 66px;
  object-fit: contain;
  flex: 0 0 auto;
}

.print-meta-box {
  min-width: 220px;
}

.print-document.quotation-template-classic .print-header,
.print-document.quotation-template-minimal .print-header,
.print-document.quotation-template-professional .print-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.8rem 1rem;
  align-items: start;
}

.print-document.quotation-template-classic .compact-brand,
.print-document.quotation-template-minimal .compact-brand,
.print-document.quotation-template-professional .compact-brand {
  flex: 1 1 520px;
  min-width: 0;
}

.print-document.quotation-template-classic .compact-brand > div,
.print-document.quotation-template-minimal .compact-brand > div,
.print-document.quotation-template-professional .compact-brand > div {
  min-width: 0;
}

.print-document.quotation-template-classic .compact-brand h1,
.print-document.quotation-template-minimal .compact-brand h1,
.print-document.quotation-template-professional .compact-brand h1,
.print-document.quotation-template-classic .compact-brand p,
.print-document.quotation-template-minimal .compact-brand p,
.print-document.quotation-template-professional .compact-brand p {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.print-business-meta p {
  line-height: 1.3;
  margin: 0 0 0.08rem;
}

.print-business-meta {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  margin-top: 0.08rem;
}

.print-document.quotation-template-classic .print-meta-box,
.print-document.quotation-template-minimal .print-meta-box,
.print-document.quotation-template-professional .print-meta-box {
  flex: 0 1 330px;
  margin-left: auto;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.compact-header-export-bottom-meta {
  align-items: stretch;
}

.compact-header-export-bottom-meta .print-meta-bottom-right {
  align-self: flex-end;
}

.compact-header-export-bottom-meta .print-business-name.export-single-line-name {
  display: block;
  white-space: nowrap;
  line-height: 1.22;
  font-size: clamp(1.28rem, 2.0vw, 1.9rem);
}

.print-meta-box p {
  font-size: 0.9rem;
  line-height: 1.28;
  margin: 0 0 0.12rem;
}

.quotation-number-line {
  font-size: 0.84rem;
}

.print-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 2rem;
  margin-bottom: 1.2rem;
}

.single-print-panel {
  grid-template-columns: 1fr;
}

.compact-grid {
  gap: 0.6rem 0.9rem;
  margin-bottom: 0.5rem;
}

.print-box {
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 1rem;
}

.compact-box {
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
}

.compact-box h3 {
  margin-bottom: 0.3rem;
  font-size: 0.98rem;
}

.compact-box p + p {
  margin-top: 0.18rem;
}

.compact-brand p,
.print-meta-box p,
.compact-box p {
  white-space: pre-line;
}

.print-document .eyebrow {
  color: inherit !important;
}

.print-table th,
.print-table td {
  border: 1px solid #ddd;
  padding: 0.7rem;
}

.compact-table th,
.compact-table td {
  padding: 0.42rem 0.48rem;
  font-size: 0.82rem;
  line-height: 1.2;
}

.compact-table tbody td {
  color: #1e2433;
  font-weight: 500;
}

.rate-card-print.compact-print {
  font-size: 13px;
  line-height: 1.36;
}

.rate-card-print .compact-header h1 {
  font-size: 1.8rem;
}

.rate-card-print .compact-table th,
.rate-card-print .compact-table td {
  padding: 0.56rem 0.62rem;
  font-size: 0.94rem;
  line-height: 1.32;
}

.rate-card-print .compact-box h3 {
  font-size: 1.02rem;
}

.rate-card-print .compact-box p {
  font-size: 0.9rem;
}

.rate-card-offer-highlight {
  border: 1px solid #efce67 !important;
  background: linear-gradient(145deg, #fff8e1 0%, #ffeeb3 100%);
  box-shadow: 0 8px 18px rgba(185, 138, 0, 0.14);
}

.rate-card-offer-head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.35rem;
}

.rate-card-offer-icon {
  width: 1.4rem;
  height: 1.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #f2b607;
  color: #6b4d00;
  font-weight: 800;
  font-size: 0.88rem;
  line-height: 1;
}

.rate-card-offer-highlight h3 {
  margin: 0;
  color: #855d00;
}

.rate-card-offer-text {
  color: #5f4900;
  font-weight: 600;
}

.designer-density-comfortable .compact-header {
  gap: 1.55rem;
  padding-bottom: 0.82rem;
  margin-bottom: 0.82rem;
}

.designer-density-comfortable .compact-box {
  padding: 0.76rem 0.82rem;
}

.designer-density-comfortable .compact-table th,
.designer-density-comfortable .compact-table td {
  padding: 0.56rem 0.62rem;
  font-size: 0.88rem;
  line-height: 1.28;
}

.designer-density-comfortable .compact-customer-box p {
  font-size: 0.84rem;
  line-height: 1.24;
}

.designer-density-comfortable .print-summary-wrap {
  gap: 0.9rem;
}

.compact-table tbody tr,
.print-box,
.print-total {
  page-break-inside: avoid;
}

.dispatch-address-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  margin-top: 0.55rem;
}

.dispatch-address-card {
  border: 1px dashed #b7bfd2;
  border-radius: 8px;
  padding: 0.4rem 0.5rem;
  min-height: 88px;
}

.dispatch-address-card h4 {
  margin: 0 0 0.2rem;
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.dispatch-address-card p {
  margin: 0;
  white-space: pre-line;
  line-height: 1.25;
  font-size: 0.77rem;
}

.address-print-label-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
}

.address-print-copies-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.address-print-copy-card {
  border: 1px solid #d3d9e8;
  border-radius: 10px;
  padding: 0.45rem;
  background: #ffffff;
  break-inside: avoid;
  page-break-inside: avoid;
}

.address-print-copy-index {
  margin: 0 0 0.28rem;
  font-size: 0.72rem;
  color: #5e6e97;
  font-weight: 700;
}

.address-print-label-grid.single {
  grid-template-columns: minmax(0, 1fr);
}

.address-print-label-card {
  border: 1px dashed #b7bfd2;
  border-radius: 10px;
  padding: 0.5rem 0.62rem;
  min-height: 130px;
}

.address-print-label-card h3 {
  margin: 0 0 0.22rem;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.address-print-label-card p {
  margin: 0;
  white-space: pre-line;
  line-height: 1.3;
  font-size: 0.82rem;
}

.address-print-from-logo-wrap {
  margin-bottom: 0.35rem;
}

.address-print-from-logo {
  width: 74px;
  max-width: 100%;
  max-height: 52px;
  object-fit: contain;
}

.print-total {
  margin-top: 1rem;
  margin-left: 0;
  width: min(360px, 100%);
}

.print-summary-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
  gap: 0.7rem;
  margin-top: 0.7rem;
  align-items: start;
}

.print-summary-wrap.total-first {
  grid-template-columns: 1fr;
  gap: 0.55rem;
}

.print-summary-wrap.total-first .compact-total {
  max-width: 360px;
  justify-self: end;
}

.print-summary-wrap.single-total {
  grid-template-columns: 1fr;
}

.print-note-box {
  min-height: 100%;
}

.compact-customer-box {
  padding: 0.42rem 0.65rem;
}

.compact-customer-box h3 {
  margin-bottom: 0.2rem;
}

.compact-customer-box p {
  font-size: 0.78rem;
  line-height: 1.18;
}

.compact-customer-box p + p {
  margin-top: 0.08rem;
}

.print-payment-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.8rem;
  align-items: start;
}

.print-payment-panel.single-column {
  grid-template-columns: 1fr;
}

.print-payment-copy {
  display: grid;
  gap: 0.45rem;
}

.print-payment-group h4 {
  margin: 0 0 0.15rem;
  font-size: 0.84rem;
}

.print-payment-group p {
  margin: 0;
}

.print-payment-qr {
  display: flex;
  justify-content: flex-end;
}

.print-qr {
  width: 112px;
  max-width: 100%;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 0.3rem;
  background: #fff;
}

.print-divider {
  height: 1px;
  margin: 0.55rem 0;
  background: #d7d7d7;
}

.compact-total {
  margin-top: 0;
  width: 100%;
  justify-self: end;
}

.quotation-template-minimal .print-header {
  border-bottom-color: #bfc8ce;
}

.quotation-template-minimal .print-box {
  border-color: #cfd6db;
}

.quotation-template-minimal .compact-table th {
  background: #f4f6f8;
  color: #1a2830;
}

.quotation-template-minimal .print-total {
  border: 1px solid #cfd6db;
  border-radius: 8px;
}

.quotation-template-professional .print-header {
  border-bottom-color: #2d3768;
}

.quotation-template-professional .compact-header h1 {
  color: inherit;
}

.quotation-template-professional .print-box {
  border-color: #c8cee2;
}

.quotation-template-professional .compact-table th {
  background: #eef1fb;
  color: #1f2a56;
}

.quotation-template-professional .print-total .compact-table td {
  border-color: #ced6ec;
}

.muted {
  color: var(--muted);
}

@keyframes fade-up {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1500px) {
  .app-header {
    grid-template-columns: minmax(210px, 270px) minmax(220px, 1fr) auto;
    gap: 0.62rem;
  }

  .app-header-brand-icon {
    width: 5.45rem;
    height: 2.55rem;
  }

  .app-header-search {
    grid-template-columns: auto minmax(130px, 1fr) auto auto;
    width: min(100%, 760px);
  }

  .app-header-search-shortcut {
    display: none;
  }

  .app-search-btn span {
    display: none;
  }

  .app-search-btn {
    min-width: 2.2rem;
    padding: 0.38rem 0.62rem;
    justify-content: center;
  }

  .auth-toolbar-actions .secondary-btn {
    min-height: 2.45rem;
    padding: 0.52rem 0.74rem;
    font-size: 0.9rem;
  }

  .page-shell {
    grid-template-columns: minmax(230px, 300px) minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
  }

  .sidebar,
  .brand-panel {
    position: static;
  }

  .brand-panel {
    padding: 1rem;
  }

  .brand-panel h1 {
    font-size: clamp(1.55rem, 2.2vw, 2.05rem);
    margin-bottom: 0.55rem;
  }

  .lede {
    font-size: 0.94rem;
    line-height: 1.5;
  }

  .summary-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.6rem;
  }

  .summary-card {
    border-radius: 14px;
    padding: 0.76rem 0.68rem;
  }

  .summary-label {
    font-size: 0.72rem;
    letter-spacing: 0.04em;
  }

  .summary-card strong {
    font-size: 1.28rem;
    margin-top: 0.25rem;
  }

  .dashboard-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .main-content {
    width: 100%;
  }

  .quotation-header-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1200px) {
  .app-header {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .module-focus-bar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .module-focus-jump {
    grid-template-columns: 1fr auto;
  }

  .module-hub-grid {
    grid-template-columns: 1fr;
  }

  .workspace-home-grid {
    grid-template-columns: 1fr;
  }

  .workspace-home-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-side-card:last-child {
    grid-column: 1 / -1;
  }

  .workspace-module-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-customization-summary-ribbon,
  .product-share-link-analytics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-customization-rate-split {
    grid-template-columns: 1fr;
  }

  .page-shell {
    padding: 0.95rem;
    grid-template-columns: 1fr;
    height: auto !important;
    max-height: none !important;
    overflow: visible;
  }

  .sidebar,
  .brand-panel {
    position: static;
  }

  .sidebar,
  .main-content {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .summary-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.6rem;
  }

  .tally-voucher-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tally-voucher-type {
    grid-column: 1 / -1;
    justify-self: start;
    min-width: 140px;
  }

  .tally-ledger-footer {
    grid-template-columns: 1fr;
  }

  .quotation-v2-shell {
    grid-template-columns: 1fr;
  }

  .quotation-v2-sidebar {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .quotation-v2-quick-card,
  .quotation-v2-tip-card {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1320px) {
  .replacement-home-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .replacement-home-main-grid {
    grid-template-columns: 1fr;
  }

  .replacement-home-filter-card {
    grid-template-columns: 1fr;
  }

  .replacement-bulk-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stock-control-layout {
    grid-template-columns: 1fr;
  }

  .stock-summary-filter-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .stock-summary-filter-search,
  .stock-summary-filter-item {
    grid-column: span 3;
  }

  .stock-summary-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1040px) {
  .replacement-home-heading-row {
    grid-template-columns: 1fr;
  }

  .replacement-home-top-actions {
    justify-content: flex-start;
  }

  .replacement-home-action-grid {
    grid-template-columns: 1fr;
  }

  .address-print-grid {
    grid-template-columns: 1fr;
  }

  .address-print-preview-label {
    grid-template-columns: 1fr;
  }

  .address-print-preview-col + .address-print-preview-col {
    border-left: 0;
    border-top: 1px dashed #d6def4;
    padding-left: 0;
    padding-top: 0.75rem;
  }

  .address-print-copies-grid {
    grid-template-columns: 1fr;
  }

  .replacement-bulk-actions {
    grid-template-columns: 1fr;
  }

  .replacement-b2b-bottom-grid {
    grid-template-columns: 1fr;
  }

  .replacement-b2b-utility-links {
    justify-content: stretch;
  }

  .replacement-b2b-utility-links > button {
    flex: 1 1 220px;
  }

  .replacement-bulk-group-row-status-manage {
    grid-template-columns: 1fr;
  }

  .stock-summary-hero-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .stock-summary-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stock-summary-filter-search,
  .stock-summary-filter-item {
    grid-column: span 2;
  }

  .stock-summary-table-head {
    align-items: flex-start;
  }
}

@media (max-width: 680px) {
  .replacement-home-top-actions .secondary-btn,
  .replacement-home-top-actions .status-pill {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .replacement-home-filter-chip {
    flex: 1 1 120px;
  }

  .replacement-home-action-tile {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .replacement-home-action-tile > i {
    display: none;
  }

  .address-print-actions-row {
    display: grid;
    grid-template-columns: 1fr;
  }

  .address-print-actions-row .primary-btn,
  .address-print-actions-row .secondary-btn,
  .address-print-mini-btn {
    width: 100%;
    justify-content: center;
  }

  .address-print-copy-control-inline {
    width: 100%;
    justify-content: space-between;
  }

  .address-print-preview-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .stock-summary-filter-grid {
    grid-template-columns: 1fr;
  }

  .stock-summary-filter-search,
  .stock-summary-filter-item {
    grid-column: span 1;
  }

  .stock-summary-filter-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
  }

  .stock-summary-filter-actions .secondary-btn,
  .stock-summary-filter-actions .primary-btn {
    width: 100%;
    justify-content: center;
  }

  .stock-summary-stats-grid {
    grid-template-columns: 1fr;
  }

  .stock-summary-table-head .secondary-btn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 820px) {
  .replacement-home-stat-grid {
    grid-template-columns: 1fr;
  }

  .replacement-home-stat-card {
    padding: 0.8rem;
  }

  .login-overlay {
    place-items: start center;
    padding: 0.55rem;
  }

  .dialog-overlay {
    place-items: start center;
    padding: 0.6rem;
  }

  .dialog-card {
    width: min(560px, 100%);
  }

  .page-shell {
    padding: 1rem;
  }

  .app-header {
    position: static;
    padding: 0.7rem;
    gap: 0.55rem;
  }

  .module-focus-jump {
    grid-template-columns: 1fr;
  }

  .auth-toolbar {
    justify-content: flex-start;
  }

  .login-card {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
    overflow: visible;
    min-height: auto;
    border-radius: 20px;
  }

  .login-hero {
    padding: 1rem 0.95rem 0.9rem;
    gap: 0.65rem;
  }

  .login-forms {
    padding: 0.9rem;
    overflow: visible;
  }

  .login-section {
    padding: 0.82rem;
  }

  .signup-header-row {
    flex-direction: column;
    align-items: stretch;
  }

  .summary-grid,
  .form-grid,
  .card-grid,
  .tally-customer-strip,
  .tally-ledger-lines,
  .dashboard-kpi-grid,
  .dashboard-grid,
  .interakt-event-grid,
  .interakt-event-fields,
  .serial-workflow-grid,
  .bundle-quick-add-grid,
  .quotation-header-grid,
  .profile-media-grid,
  .saved-filter-grid,
  .saved-insights,
  .owner-insights-kpis,
  .totals-layout,
  .print-grid,
  .print-summary-wrap {
    grid-template-columns: 1fr;
  }

  .quotation-v2-page {
    padding: 0.72rem;
  }

  .quotation-v2-top-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.45rem;
  }

  .quotation-autosave-status,
  .quotation-v2-top-actions .secondary-btn,
  .quotation-v2-top-actions .status-pill {
    width: 100%;
    justify-content: center;
  }

  .quotation-v2-section {
    padding: 0.78rem;
  }

  .quotation-v2-sidebar {
    grid-template-columns: 1fr;
  }

  .quotation-v2-summary-card {
    position: static;
    box-shadow: 0 8px 18px rgba(72, 96, 178, 0.12);
  }

  .quotation-v2-quick-card {
    grid-template-columns: 1fr;
  }

  #shareWhatsappPaymentReminderBtn {
    grid-column: auto;
  }

  .quotation-v2-submit-row .primary-btn,
  .quotation-v2-submit-row .secondary-btn {
    width: 100%;
    justify-content: center;
  }

  .invoice-additional-entry-row,
  .stock-purchase-additional-entry-row {
    grid-template-columns: 1fr;
  }

  .invoice-additional-entry-remove,
  .stock-purchase-additional-entry-remove {
    width: 100%;
  }

  .workspace-home-modules {
    grid-template-columns: 1fr;
  }

  .product-customization-summary-ribbon,
  .product-share-link-analytics {
    grid-template-columns: 1fr;
  }

  .inline-field-group {
    grid-template-columns: 1fr;
  }

  .discount-rule-entry-row {
    grid-template-columns: 1fr;
  }

  .workspace-favourites-add-panel .action-row > * {
    width: 100%;
  }

  .workspace-module-row,
  .workspace-home-side {
    grid-template-columns: 1fr;
  }

  .replacement-product-field {
    display: block;
  }

  .replacement-product-field .field-inline-btn {
    width: 100%;
    min-height: 3rem;
    font-size: 0.9rem;
  }

  #replacementForm .replacement-large-field .field-control > input {
    padding-right: 0.9rem;
  }

  .replacement-bulk-actions {
    width: 100%;
    grid-template-columns: 1fr;
  }

  .replacement-bulk-group-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .replacement-bulk-group-row > * {
    grid-column: 1 / -1;
    width: 100%;
  }

  .replacement-status-manage-row {
    grid-template-columns: 1fr;
    gap: 0.4rem;
  }

  .replacement-status-manage-row-base,
  .replacement-status-manage-row-actions {
    text-align: left;
    justify-content: flex-start;
  }

  .toast-stack {
    padding: 0.7rem;
  }

  .section-back-btn {
    width: fit-content;
  }

  .action-row,
  .search-row,
  .panel-heading,
  .quotation-card-header,
  .compact-brand {
    flex-direction: column;
    align-items: stretch;
  }

  .renewal-view-sticky {
    position: static;
  }

  .renewal-quick-filter-row {
    align-items: flex-start;
  }

  .renewal-clear-filters-btn {
    margin-left: 0;
  }

  .renewal-bulk-row {
    align-items: stretch;
  }

  .renewal-bulk-row > * {
    width: 100%;
  }

  .renewal-auto-cycle-toggle {
    margin-left: 0;
  }

  .renewal-action-queue-actions {
    justify-content: flex-start;
  }

  .action-row-end .action-menu,
  .action-row-split .action-menu {
    width: 100%;
  }

  .action-row-end .action-menu-summary,
  .action-row-split .action-menu-summary {
    width: 100%;
  }

  .quotation-card-actions-right {
    width: 100%;
    margin-left: 0;
    justify-content: flex-start;
  }

  .quotation-print-btn {
    flex: 1 1 110px;
  }

  .serial-sale-pick-wrap {
    grid-template-columns: 1fr;
  }

  .tally-voucher-bar {
    grid-template-columns: 1fr;
  }

  .tally-voucher-type {
    width: fit-content;
  }

  .tally-items-header {
    flex-direction: column;
    align-items: stretch;
  }

  .serial-bulk-actions {
    min-width: 100%;
  }

  .serial-b2b-sync-actions {
    min-width: 100%;
  }

  .serial-records-row-search,
  .serial-records-row-filters,
  .serial-records-row-actions {
    grid-template-columns: 1fr;
  }

  .serial-records-quick-actions {
    justify-content: stretch;
  }

  .serial-records-quick-actions .secondary-btn {
    width: 100%;
  }

  .serial-records-attention-btn {
    width: 100%;
  }

  .serial-records-action-group {
    padding: 0.68rem 0.72rem 0.74rem;
  }

  .serial-bulk-actions-row {
    display: grid;
    grid-template-columns: 1fr;
  }

  .serial-b2b-sync-row {
    grid-template-columns: 1fr;
  }

  .serial-b2b-sync-row .primary-btn {
    width: 100%;
    min-width: 0;
  }

  .serial-b2b-summary-chip {
    white-space: normal;
  }

  .serial-voucher-toolbar {
    grid-template-columns: 1fr;
  }

  .serial-voucher-pagination {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .action-cell,
  .serial-action-cell {
    text-align: left;
  }

  .stock-inline-actions,
  .stock-inline-linkages {
    justify-content: flex-start;
  }

  .serial-action-cluster {
    justify-content: flex-start;
  }

  .tab-nav {
    grid-template-columns: 1fr;
    position: static;
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.9), rgba(242, 246, 255, 0.84));
    padding: 0.34rem;
    gap: 0.6rem;
    border-radius: 14px;
  }

  .tab-group {
    padding: 0.5rem;
    border-radius: 14px;
  }

  .tab-btn {
    padding: 0.6rem 0.8rem;
    font-size: 0.86rem;
    min-height: 2.15rem;
  }
}

@media print {
  @page {
    size: A4;
    margin: 8mm;
  }

  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  body {
    background: white;
  }

  body > :not(.print-sheet) {
    display: none !important;
  }

  .page-shell {
    display: none;
  }

  .print-sheet,
  .print-document {
    display: block;
  }

  .print-sheet {
    padding: 0;
  }

  .compact-print {
    padding: 0;
  }

  .compact-header,
  .compact-grid,
  .print-summary-wrap {
    gap: 0.45rem;
  }
}

/* ===== Dashboard V3 (Reference Match) ===== */
body:not(.app-auth-screen) {
  background:
    radial-gradient(circle at 8% 2%, rgba(41, 98, 255, 0.1), transparent 38%),
    linear-gradient(160deg, #f5f8ff 0%, #f3f7ff 56%, #eef3ff 100%);
}

.app-header {
  position: sticky;
  top: 0;
  z-index: 48;
  display: grid;
  grid-template-columns: 270px minmax(360px, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid #e4eaf3;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(8px);
}

.app-header-brand {
  min-height: 64px;
  border: 1px solid #e4eaf3;
  border-radius: 14px;
  background: #ffffff;
  padding: 8px 12px;
  gap: 10px;
}

.app-header-brand-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid #d9e4fb;
  box-shadow: none;
}

.app-header-brand-copy strong {
  font-size: 1.06rem;
  font-weight: 700;
  letter-spacing: 0;
  color: #16214a;
}

.app-header-brand-copy small {
  font-size: 13px;
  font-weight: 600;
  color: #6b7a99;
}

.app-header-search {
  min-height: 56px;
  border-radius: 14px;
  border: 1px solid #e4eaf3;
  background: #ffffff;
  padding: 8px 10px;
  grid-template-columns: auto minmax(180px, 1fr) auto auto;
  width: min(100%, 900px);
}

.app-header-search-icon {
  width: 24px;
  color: #7f90b5;
}

.app-header-search input {
  min-height: 38px;
  padding: 0 2px;
  font-size: 14px;
  color: #26345f;
}

.app-header-search-shortcut {
  min-height: 30px;
  border-radius: 8px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  background: #f3f7ff;
  color: #6b7a99;
  font-size: 14px;
}

.app-search-btn {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 11px;
  border: 1px solid #dce5f3;
  background: #ffffff;
  color: #2f58cf;
  font-size: 14px;
  font-weight: 700;
}

.auth-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.auth-toolbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.app-header-alert-btn.icon-btn {
  width: 44px;
  min-width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid #dce5f3;
  background: #ffffff;
  color: #3158c8;
  position: relative;
  display: inline-grid;
  place-items: center;
}

.app-header-alert-btn.icon-btn i {
  font-size: 18px;
}

.app-header-alert-dot {
  position: absolute;
  top: 5px;
  right: 5px;
  min-width: 16px;
  height: 16px;
  border-radius: 999px;
  padding: 0 4px;
  background: #ef4444;
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
}

.app-header-profile {
  min-height: 50px;
  border: none;
  background: transparent;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #16214a;
  padding: 0;
}

.app-header-profile-avatar {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  background: linear-gradient(135deg, #2962ff, #1e4fe0);
}

.app-header-profile-copy {
  display: grid;
  gap: 1px;
  text-align: left;
  line-height: 1.2;
}

.app-header-profile-copy strong {
  font-size: 18px;
  font-weight: 700;
  color: #16214a;
}

.app-header-profile-copy small {
  font-size: 13px;
  font-weight: 600;
  color: #6b7a99;
}

.app-header-profile > i {
  color: #7f90b5;
  font-size: 14px;
}

.auth-toolbar .helper-text {
  margin: 0;
  width: auto;
  text-align: left;
  font-size: 14px;
  font-weight: 600;
  color: #1d2f66;
}

.app-header .secondary-btn {
  min-height: 44px;
  border-radius: 12px;
  padding: 0 16px;
  border: 1px solid #dce5f3;
  background: #ffffff;
  color: #2f58cf;
  font-size: 14px;
  font-weight: 700;
}

#logoutBtn {
  min-height: 44px;
  border-radius: 12px;
  padding: 0 14px;
}

.page-shell.workspace-mode {
  padding: 12px;
}

#tab-dashboard .dashboard-shell {
  --dash-primary: #2962ff;
  --dash-primary-soft: #eef4ff;
  --dash-bg: #f7f9fc;
  --dash-card: #ffffff;
  --dash-border: #e4eaf3;
  --dash-heading: #16214a;
  --dash-subtext: #6b7a99;
  --dash-success: #1f9d55;
  --dash-warning: #d97706;
  --dash-danger: #dc2626;
  --dash-purple: #7c3aed;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0;
  border: 1px solid var(--dash-border);
  border-radius: 22px;
  background: var(--dash-bg);
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
  font-family: "Inter", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  overflow: hidden;
  min-height: calc(100vh - 118px);
}

#tab-dashboard .dashboard-shell-sidebar {
  background: #ffffff;
  border-right: 1px solid var(--dash-border);
  padding: 10px 10px 12px;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
}

#tab-dashboard .dashboard-shell-brand {
  min-height: 66px;
  border: 1px solid #e3ebf9;
  border-radius: 14px;
  background: #ffffff;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
}

#tab-dashboard .dashboard-shell-brand-logo {
  width: 70px;
  height: 42px;
  border-radius: 10px;
  border: 1px solid #dbe6fb;
  background: #ffffff;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
}

#tab-dashboard .dashboard-shell-brand-logo img {
  width: 90%;
  height: 90%;
  object-fit: contain;
}

#tab-dashboard .dashboard-shell-brand-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
  line-height: 1.15;
}

#tab-dashboard .dashboard-shell-brand-copy strong {
  font-size: 2rem;
  font-weight: 700;
  color: #16214a;
}

#tab-dashboard .dashboard-shell-brand-copy small {
  font-size: 13px;
  font-weight: 600;
  color: #6b7a99;
}

#tab-dashboard .dashboard-shell-menu-btn {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  border: 1px solid #e1eaf8;
  background: #f7faff;
  color: #4564b9;
  display: inline-grid;
  place-items: center;
  font-size: 18px;
}

#tab-dashboard .dashboard-shell-nav {
  min-height: 0;
  overflow-y: auto;
  display: grid;
  align-content: start;
  gap: 7px;
  padding-right: 2px;
}

#tab-dashboard .dashboard-shell-label {
  margin: 10px 8px 3px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #7c8ba8;
}

#tab-dashboard .dashboard-shell-label-inline {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

#tab-dashboard .dashboard-shell-label-inline strong {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #7c8ba8;
}

#tab-dashboard .dashboard-shell-link-btn {
  border: none;
  background: transparent;
  color: #2962ff;
  font-size: 14px;
  font-weight: 700;
  padding: 0;
}

#tab-dashboard .dashboard-shell-nav-btn {
  width: 100%;
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: #ffffff;
  color: #1f356f;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  text-align: left;
  font-size: 16px;
  font-weight: 600;
}

#tab-dashboard .dashboard-shell-nav-btn > i:first-child {
  font-size: 18px;
  color: #5873b6;
}

#tab-dashboard .dashboard-shell-nav-btn > i:last-child {
  font-size: 13px;
  color: #9aa9c7;
}

#tab-dashboard .dashboard-shell-nav-btn.active {
  border-color: #d6e4ff;
  background: #eef4ff;
  color: #2962ff;
  box-shadow: inset 3px 0 0 #2962ff;
}

#tab-dashboard .dashboard-shell-nav-btn.active > i:first-child {
  color: #2962ff;
}

#tab-dashboard .dashboard-shell-nav-btn:hover {
  border-color: #dae6fa;
  background: #f9fbff;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-sales {
  color: #2962ff;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-sales > i:first-child {
  color: #2962ff;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-sales > i:last-child {
  color: #83a1e8;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-sales:hover {
  background: #f2f7ff;
  border-color: #dbe7ff;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-accounting {
  color: #1f9d55;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-accounting > i:first-child {
  color: #1f9d55;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-accounting > i:last-child {
  color: #7cb996;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-accounting:hover {
  background: #f1fbf4;
  border-color: #d7efdf;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-master {
  color: #7c3aed;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-master > i:first-child {
  color: #7c3aed;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-master > i:last-child {
  color: #a38adf;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-master:hover {
  background: #f7f3ff;
  border-color: #e9ddff;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-operations {
  color: #d97706;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-operations > i:first-child {
  color: #d97706;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-operations > i:last-child {
  color: #d5a05c;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-operations:hover {
  background: #fff8ef;
  border-color: #f5e5cd;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-business {
  color: #2f58cf;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-business > i:first-child {
  color: #2f58cf;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-business > i:last-child {
  color: #8ba2df;
}

#tab-dashboard .dashboard-shell-nav-btn.dashboard-nav-tone-business:hover {
  background: #f4f8ff;
  border-color: #dce6fb;
}

#tab-dashboard .dashboard-shell-sidebar-favourites {
  display: grid;
  gap: 7px;
}

#tab-dashboard .dashboard-shell-sidebar-favourites .workspace-side-item {
  width: 100%;
  min-height: 42px;
  border-radius: 11px;
  border: 1px solid #dfe8f7;
  background: #ffffff;
  padding: 6px 10px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  text-align: left;
  color: #21366d;
}

#tab-dashboard .dashboard-shell-sidebar-favourites .workspace-side-icon {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  border: 1px solid transparent;
}

#tab-dashboard .dashboard-shell-sidebar-favourites .workspace-side-item span:last-child {
  min-width: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}

#tab-dashboard .dashboard-shell-nav-link {
  width: 100%;
  min-height: 42px;
  border: 1px solid transparent;
  border-radius: 11px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  padding: 8px 11px;
  color: #1f356f;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}

#tab-dashboard .dashboard-shell-nav-link i {
  font-size: 17px;
  color: #2f8e59;
}

#tab-dashboard .dashboard-shell-nav-link:hover {
  border-color: #dae6fa;
  background: #f9fbff;
}

#tab-dashboard .dashboard-shell-main {
  padding: 16px;
  display: grid;
  align-content: start;
  gap: 16px;
  overflow: auto;
}

#tab-dashboard .dashboard-shell-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

#tab-dashboard .dashboard-shell-head h2 {
  margin: 0;
  font-size: 42px;
  line-height: 1.06;
  font-weight: 700;
  color: #16214a;
}

#tab-dashboard .dashboard-shell-head h2 span {
  font-size: 32px;
  vertical-align: middle;
}

#tab-dashboard .dashboard-shell-head p {
  margin: 7px 0 0;
  font-size: 14px;
  color: #6b7a99;
}

#tab-dashboard .dashboard-shell-head p strong {
  color: #16214a;
}

#tab-dashboard .dashboard-shell-customize-btn.secondary-btn {
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid #dce5f3;
  background: #ffffff;
  color: #2f58cf;
  font-size: 14px;
  font-weight: 700;
}

#tab-dashboard .dashboard-shell-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

#tab-dashboard .dashboard-shell-kpi-grid.kpi-layout-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#tab-dashboard .dashboard-shell-kpi-grid.kpi-layout-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#tab-dashboard .dashboard-shell-kpi-card {
  min-height: 120px;
  border: 1px solid #e6edf8;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
  padding: 15px 16px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-blue {
  background: #fbfdff;
  border-color: #dce7ff;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-green {
  background: #f9fefb;
  border-color: #d7ecdf;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-amber {
  background: #fffbf4;
  border-color: #f2dfc3;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-violet {
  background: #fbf8ff;
  border-color: #e8ddff;
}

#tab-dashboard .dashboard-shell-kpi-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: inline-grid;
  place-items: center;
  font-size: 24px;
  border: 1px solid transparent;
}

#tab-dashboard .dashboard-shell-kpi-copy {
  display: grid;
  gap: 4px;
}

#tab-dashboard .dashboard-shell-kpi-copy p {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #16214a;
  line-height: 1.2;
}

#tab-dashboard .dashboard-shell-kpi-copy strong {
  margin: 0;
  font-size: 38px;
  line-height: 1;
  font-weight: 700;
  color: #16214a;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-blue .dashboard-shell-kpi-copy strong {
  color: #2962ff;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-green .dashboard-shell-kpi-copy strong {
  color: #1f9d55;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-amber .dashboard-shell-kpi-copy strong {
  color: #d97706;
}

#tab-dashboard .dashboard-shell-kpi-card.tone-violet .dashboard-shell-kpi-copy strong {
  color: #7c3aed;
}

#tab-dashboard .dashboard-shell-kpi-copy span {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #6b7a99;
  line-height: 1.25;
}

#tab-dashboard .dashboard-shell-kpi-spark {
  width: 96px;
  height: 44px;
  border-radius: 12px;
  background: #eef4ff;
  position: relative;
}

#tab-dashboard .dashboard-shell-kpi-spark::before {
  content: "";
  position: absolute;
  inset: 50% 8px auto 8px;
  height: 2px;
  border-radius: 999px;
  transform: translateY(-50%) rotate(-7deg);
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-blue {
  background: rgba(41, 98, 255, 0.12);
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-blue::before {
  background: #2962ff;
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-green {
  background: rgba(31, 157, 85, 0.12);
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-green::before {
  background: #1f9d55;
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-amber {
  background: rgba(217, 119, 6, 0.12);
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-amber::before {
  background: #d97706;
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-violet {
  background: rgba(124, 58, 237, 0.12);
}

#tab-dashboard .dashboard-shell-kpi-spark.tone-violet::before {
  background: #7c3aed;
}

#tab-dashboard .dashboard-shell-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 14px;
  align-items: start;
}

#tab-dashboard .dashboard-shell-content-main {
  display: grid;
  gap: 14px;
}

#tab-dashboard .dashboard-shell-quick-card,
#tab-dashboard .dashboard-shell-module-card,
#tab-dashboard .dashboard-shell-side-card {
  border: 1px solid #e4eaf3;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
}

#tab-dashboard .dashboard-shell-quick-card {
  padding: 16px;
  display: grid;
  gap: 12px;
}

#tab-dashboard .dashboard-shell-section-head {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#tab-dashboard .dashboard-shell-section-head h3 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: #16214a;
}

#tab-dashboard .dashboard-shell-manage-btn {
  border: none;
  background: transparent;
  color: #2962ff;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0;
}

#tab-dashboard .dashboard-shell-quick-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 12px;
}

#tab-dashboard .dashboard-shell-quick-tile {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
  min-height: 92px;
  border: 1px solid #dce5f3;
  border-radius: 16px;
  background: #ffffff;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  padding: 9px 8px;
  text-align: center;
}

#tab-dashboard .dashboard-shell-quick-tile > span {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-grid;
  place-items: center;
  font-size: 24px;
  border: 1px solid transparent;
}

#tab-dashboard .dashboard-shell-quick-tile > strong {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  color: #16214a;
}

#tab-dashboard .dashboard-shell-quick-tile:hover {
  border-color: #d6e4ff;
  box-shadow: 0 10px 20px rgba(41, 98, 255, 0.15);
  transform: translateY(-2px);
}

#tab-dashboard .dashboard-shell-quick-tile.tile-bg-blue {
  background: #f2f7ff;
  border-color: #dbe7ff;
}

#tab-dashboard .dashboard-shell-quick-tile.tile-bg-green {
  background: #f2fcf4;
  border-color: #d8efdd;
}

#tab-dashboard .dashboard-shell-quick-tile.tile-bg-violet {
  background: #f6f3ff;
  border-color: #e6defd;
}

#tab-dashboard .dashboard-shell-quick-tile.tile-bg-cyan {
  background: #f0fbff;
  border-color: #d8eff7;
}

#tab-dashboard .dashboard-shell-quick-tile.tile-bg-amber {
  background: #fff9ef;
  border-color: #f5e5c5;
}

#tab-dashboard .dashboard-add-shortcut-tile {
  border-style: dashed;
  border-color: #cedcf8;
  background: #f7faff;
  color: #335fcd;
}

#tab-dashboard .dashboard-favourite-tile-wrap {
  position: relative;
  display: inline-flex;
}

#tab-dashboard .dashboard-favourite-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid #f1cada;
  background: #fff5f9;
  color: #c4385b;
  font-size: 10px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

#tab-dashboard .dashboard-favourite-remove:hover {
  background: #ffebf2;
}

#tab-dashboard .dashboard-shortcuts-editor {
  margin-top: 2px;
  padding-top: 11px;
  border-top: 1px dashed #d8e3f8;
}

#tab-dashboard .dashboard-shortcuts-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

#tab-dashboard .dashboard-shortcuts-controls select {
  min-width: 240px;
  height: 38px;
  border: 1px solid #d6e2f7;
  border-radius: 10px;
  background: #ffffff;
  color: #22396f;
  padding: 0 11px;
  font-size: 13px;
  font-weight: 500;
}

#tab-dashboard .dashboard-shortcuts-action-btn {
  min-height: 38px;
  height: 38px;
  border-radius: 10px;
  padding: 0 14px;
  font-size: 13px;
}

#tab-dashboard .dashboard-shortcuts-status {
  margin: 8px 2px 0;
  min-height: 18px;
  font-size: 12px;
  font-weight: 600;
  color: #6b7a99;
}

#tab-dashboard .dashboard-shell-module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

#tab-dashboard .dashboard-shell-module-card {
  padding: 12px;
  display: grid;
  gap: 8px;
}

#tab-dashboard .dashboard-shell-module-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#tab-dashboard .dashboard-shell-module-head h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #16214a;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

#tab-dashboard .dashboard-shell-module-head h3 i {
  color: #3d63d3;
}

#tab-dashboard .dashboard-shell-module-sales .dashboard-shell-module-head h3 {
  color: #2962ff;
}

#tab-dashboard .dashboard-shell-module-sales .dashboard-shell-module-head h3 i {
  color: #2962ff;
}

#tab-dashboard .dashboard-shell-module-accounting .dashboard-shell-module-head h3 {
  color: #1f9d55;
}

#tab-dashboard .dashboard-shell-module-accounting .dashboard-shell-module-head h3 i {
  color: #1f9d55;
}

#tab-dashboard .dashboard-shell-module-master .dashboard-shell-module-head h3 {
  color: #7c3aed;
}

#tab-dashboard .dashboard-shell-module-master .dashboard-shell-module-head h3 i {
  color: #7c3aed;
}

#tab-dashboard .dashboard-shell-module-operations .dashboard-shell-module-head h3 {
  color: #d97706;
}

#tab-dashboard .dashboard-shell-module-operations .dashboard-shell-module-head h3 i {
  color: #d97706;
}

#tab-dashboard .dashboard-shell-module-business .dashboard-shell-module-head h3 {
  color: #2f58cf;
}

#tab-dashboard .dashboard-shell-module-business .dashboard-shell-module-head h3 i {
  color: #2f58cf;
}

#tab-dashboard .dashboard-shell-module-head span {
  min-width: 30px;
  min-height: 24px;
  border-radius: 999px;
  border: 1px solid #d8e4fb;
  background: #f4f8ff;
  color: #4062c5;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#tab-dashboard .dashboard-shell-module-list {
  display: grid;
  gap: 8px;
}

#tab-dashboard .dashboard-shell-module-item {
  width: 100%;
  min-height: 36px;
  border: 1px solid #e6edf8;
  border-radius: 12px;
  background: #ffffff;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  text-align: left;
}

#tab-dashboard .dashboard-shell-module-item span {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #203565;
  font-size: 13px;
  font-weight: 600;
}

#tab-dashboard .dashboard-shell-module-item span i {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1px solid transparent;
  display: inline-grid;
  place-items: center;
  font-size: 12px;
}

#tab-dashboard .dashboard-shell-module-item i:last-child {
  color: #8ea0c5;
}

#tab-dashboard .dashboard-shell-module-item span i.bi-file-earmark-text,
#tab-dashboard .dashboard-shell-module-item span i.bi-people,
#tab-dashboard .dashboard-shell-module-item span i.bi-building,
#tab-dashboard .dashboard-shell-module-item span i.bi-person-gear {
  color: #2962ff;
  background: #eaf1ff;
  border-color: #d8e5ff;
}

#tab-dashboard .dashboard-shell-module-item span i.bi-journal-plus,
#tab-dashboard .dashboard-shell-module-item span i.bi-shield-check,
#tab-dashboard .dashboard-shell-module-item span i.bi-whatsapp,
#tab-dashboard .dashboard-shell-module-item span i.bi-activity {
  color: #1f9d55;
  background: #eafbef;
  border-color: #d7f4e0;
}

#tab-dashboard .dashboard-shell-module-item span i.bi-card-list,
#tab-dashboard .dashboard-shell-module-item span i.bi-box2,
#tab-dashboard .dashboard-shell-module-item span i.bi-arrow-repeat {
  color: #7c3aed;
  background: #f1edff;
  border-color: #e5dbff;
}

#tab-dashboard .dashboard-shell-module-item span i.bi-box-seam,
#tab-dashboard .dashboard-shell-module-item span i.bi-upc-scan,
#tab-dashboard .dashboard-shell-module-item span i.bi-printer,
#tab-dashboard .dashboard-shell-module-item span i.bi-diagram-3 {
  color: #2484c7;
  background: #e9f7ff;
  border-color: #d5eeff;
}

#tab-dashboard .dashboard-shell-module-item span i.bi-sliders,
#tab-dashboard .dashboard-shell-module-item span i.bi-bell,
#tab-dashboard .dashboard-shell-module-item span i.bi-receipt,
#tab-dashboard .dashboard-shell-module-item span i.bi-boxes,
#tab-dashboard .dashboard-shell-module-item span i.bi-check2-square,
#tab-dashboard .dashboard-shell-module-item span i.bi-calendar-check {
  color: #d97706;
  background: #fff7ea;
  border-color: #ffe8bf;
}

#tab-dashboard .dashboard-shell-module-item:hover {
  border-color: #d6e4ff;
}

#tab-dashboard .dashboard-shell-module-view-btn {
  justify-self: flex-start;
  border: none;
  background: transparent;
  color: #2962ff;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0;
}

#tab-dashboard .dashboard-shell-content-side {
  display: grid;
  gap: 14px;
}

#tab-dashboard .dashboard-shell-side-card {
  padding: 14px;
  display: grid;
  gap: 10px;
}

#tab-dashboard .dashboard-shell-side-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

#tab-dashboard .workspace-side-title {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: #16214a;
  text-transform: none;
  letter-spacing: 0;
}

#tab-dashboard .dashboard-link-btn {
  border: none;
  background: transparent;
  color: #2962ff;
  font-size: 14px;
  font-weight: 700;
  padding: 0;
}

#tab-dashboard .dashboard-shell-activity-list {
  display: grid;
  gap: 8px;
}

#tab-dashboard .dashboard-shell-activity-list .dashboard-timeline-item {
  min-height: 68px;
  border: 1px solid #e7edf8;
  border-radius: 14px;
  background: #fbfdff;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 10px;
  align-items: start;
}

#tab-dashboard .dashboard-shell-activity-list .dashboard-timeline-item::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #2f6de7;
  margin-top: 7px;
}

#tab-dashboard .dashboard-shell-activity-list .dashboard-timeline-item strong {
  grid-column: 2;
  margin: 0;
  font-size: 15px;
  line-height: 1.24;
  font-weight: 700;
  color: #1f356d;
}

#tab-dashboard .dashboard-shell-activity-list .dashboard-timeline-item span {
  grid-column: 2;
  margin: 0;
  font-size: 14px;
  line-height: 1.3;
  color: #6c7b9a;
}

#tab-dashboard .dashboard-shell-activity-list .dashboard-timeline-item span:nth-of-type(2) {
  font-size: 12px;
  color: #8b99b7;
}

#tab-dashboard .dashboard-shell-shortcuts-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

#tab-dashboard .dashboard-shell-shortcuts-list .workspace-side-item {
  width: 100%;
  min-height: 38px;
  border: 1px solid #dfe7f3;
  border-radius: 11px;
  background: #ffffff;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  padding: 5px 9px;
  text-align: left;
  color: #1f356e;
}

#tab-dashboard .dashboard-shell-shortcuts-list .workspace-side-icon {
  width: 27px;
  height: 27px;
  border-radius: 8px;
  border: 1px solid transparent;
  display: inline-grid;
  place-items: center;
  font-size: 14px;
}

#tab-dashboard .dashboard-shell-shortcuts-list .workspace-side-item span:last-child {
  min-width: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}

#tab-dashboard .dashboard-shell-shortcuts-list .dashboard-add-shortcut-tile {
  width: 100%;
  min-height: 38px;
  border: 1px dashed #cedcf8;
  border-radius: 11px;
  background: #f8fbff;
  color: #335fcd;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 14px;
  font-weight: 700;
}

#tab-dashboard .dashboard-shell-shortcuts-list .dashboard-add-shortcut-tile:disabled {
  opacity: 0.58;
  cursor: not-allowed;
}

#tab-dashboard .dashboard-shell-support-card {
  background: linear-gradient(145deg, #f4f8ff, #eaf1ff);
}

#tab-dashboard .dashboard-shell-support-card h3 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: #16214a;
}

#tab-dashboard .dashboard-shell-support-card p {
  margin: 6px 0 2px;
  font-size: 14px;
  line-height: 1.35;
  color: #5f7093;
}

#tab-dashboard .dashboard-shell-support-btn {
  min-height: 42px;
  border: 1px solid #cfe0ff;
  border-radius: 12px;
  background: #ffffff;
  color: #1f9d55;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 14px;
}

#tab-dashboard .dashboard-shell-support-btn i {
  font-size: 17px;
}

@media (max-width: 1550px) {
  #tab-dashboard .dashboard-shell-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #tab-dashboard .dashboard-shell-content-grid {
    grid-template-columns: minmax(0, 1fr) 320px;
  }
}

@media (max-width: 1300px) {
  #tab-dashboard .dashboard-shell {
    grid-template-columns: 1fr;
  }

  #tab-dashboard .dashboard-shell-sidebar {
    display: none;
  }

  #tab-dashboard .dashboard-shell-content-grid {
    grid-template-columns: 1fr;
  }

  #tab-dashboard .dashboard-shell-content-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .app-header {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .app-header-search {
    width: 100%;
  }

  #tab-dashboard .dashboard-shell-main {
    padding: 12px;
  }

  #tab-dashboard .dashboard-shell-head {
    flex-direction: column;
  }

  #tab-dashboard .dashboard-shell-head h2 {
    font-size: 36px;
  }

  #tab-dashboard .dashboard-shell-module-grid,
  #tab-dashboard .dashboard-shell-content-side,
  #tab-dashboard .dashboard-shell-shortcuts-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  #tab-dashboard .dashboard-shell-kpi-grid {
    grid-template-columns: 1fr;
  }

  #tab-dashboard .dashboard-shell-quick-grid {
    gap: 8px;
  }

  #tab-dashboard .dashboard-shell-quick-tile {
    width: calc(50% - 4px);
    min-width: calc(50% - 4px);
    max-width: calc(50% - 4px);
  }

  #tab-dashboard .workspace-side-title,
  #tab-dashboard .dashboard-shell-section-head h3,
  #tab-dashboard .dashboard-shell-module-head h3 {
    font-size: 26px;
  }

  #tab-dashboard .dashboard-shell-module-grid,
  #tab-dashboard .dashboard-shell-content-side,
  #tab-dashboard .dashboard-shell-shortcuts-list {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 981px) {
  #tab-dashboard .dashboard-shell-kpi-grid.kpi-layout-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  #tab-dashboard .dashboard-shell-kpi-grid.kpi-layout-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.rfq-supplier-checklist {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 8px;
}

.rfq-supplier-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #d8e3f4;
  border-radius: 10px;
  background: #f9fcff;
}

.rfq-supplier-option span {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rfq-supplier-option small {
  color: #677289;
}

#rfqListTableBody tr.is-active {
  background: #f2f8ff;
}

.rfq-lowest-rate {
  background: #eaf9ef;
  font-weight: 700;
}

.rfq-v2-panel {
  margin-top: 8px;
  font-family: "Inter", "Segoe UI", sans-serif;
}

.rfq-v2-shell {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  min-height: calc(100vh - 220px);
  border: 1px solid #d7e2f2;
  border-radius: 8px;
  overflow: hidden;
  background: #f3f6fb;
}

.rfq-v2-sidebar {
  background: linear-gradient(180deg, #02234d, #041f44 35%, #041935);
  color: #d3e4ff;
  padding: 18px 12px;
  display: grid;
  align-content: start;
  gap: 12px;
  border-right: 1px solid rgba(159, 184, 225, 0.14);
}

.rfq-v2-brand {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 4px 4px 10px;
}

.rfq-v2-brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: rgba(34, 196, 255, 0.14);
  color: #2dc2ff;
  border: 1px solid rgba(80, 214, 255, 0.28);
  display: inline-grid;
  place-items: center;
  font-size: 20px;
}

.rfq-v2-brand strong {
  display: block;
  font-size: 15px;
  line-height: 1.15;
  letter-spacing: 0.01em;
  color: #f1f7ff;
  font-weight: 800;
}

.rfq-v2-brand small {
  display: block;
  margin-top: 3px;
  color: #9db2d2;
  font-size: 13px;
  font-weight: 600;
}

.rfq-v2-sidebar-create {
  width: 100%;
  justify-content: center;
  border-radius: 9px;
  min-height: 44px;
  font-size: 14px;
  background: linear-gradient(135deg, #1c68e6, #2f86ff);
  border-color: rgba(177, 205, 255, 0.28);
}

.rfq-v2-sidebar-nav {
  display: grid;
  gap: 5px;
}

.rfq-v2-nav-item {
  border: 1px solid transparent;
  border-radius: 7px;
  min-height: 44px;
  padding: 0 11px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  background: transparent;
  color: #d0dcf1;
  font-size: 13px;
  font-weight: 600;
  text-align: left;
}

.rfq-v2-nav-item i {
  color: #8cb0df;
}

.rfq-v2-nav-item:hover {
  background: rgba(33, 77, 146, 0.35);
  border-color: rgba(91, 147, 230, 0.25);
}

.rfq-v2-nav-item.is-active,
.rfq-v2-nav-item[aria-current="page"] {
  background: rgba(57, 115, 201, 0.42);
  color: #ffffff;
  border-color: rgba(137, 180, 247, 0.46);
}

.rfq-v2-nav-item.is-active i,
.rfq-v2-nav-item[aria-current="page"] i {
  color: #ffffff;
}

.rfq-v2-main {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  background: #f6f8fb;
}

.rfq-v2-topbar {
  background: #ffffff;
  border-bottom: 1px solid #dde6f2;
  min-height: 68px;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
}

.rfq-v2-topbar-icons {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 8px;
}

.rfq-v2-icon-btn {
  position: relative;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid #d5e2f5;
  background: #ffffff;
  color: #4b5f8a;
  display: inline-grid;
  place-items: center;
  padding: 0;
}

.rfq-v2-icon-btn em {
  position: absolute;
  top: -5px;
  right: -2px;
  min-width: 15px;
  height: 15px;
  border-radius: 999px;
  background: #ef4444;
  color: #ffffff;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
  display: inline-grid;
  place-items: center;
}

.rfq-v2-user-chip {
  display: inline-grid;
  grid-template-columns: auto auto auto;
  align-items: center;
  gap: 8px;
  color: #1f2f4d;
  font-weight: 700;
}

.rfq-v2-user-chip span {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid #dce5f2;
  display: inline-grid;
  place-items: center;
  color: #8497b8;
  font-size: 18px;
}

.rfq-v2-user-chip i:last-child {
  color: #7a8eaf;
  font-size: 11px;
}

.rfq-v2-content {
  padding: 20px 22px 18px;
  display: grid;
  gap: 14px;
  align-content: start;
}

.rfq-v2-content .table-card {
  border: 1px solid #dbe5f2;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(14, 31, 58, 0.04);
}

.rfq-v2-hero-card {
  border: 1px solid #dbe5f2;
  border-radius: 8px;
  background: #ffffff;
  padding: 16px;
}

.rfq-v2-hero-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.rfq-v2-title-wrap h3 {
  margin: 0;
  font-size: 35px;
  line-height: 1.1;
  color: #0f2038;
  font-weight: 800;
}

.rfq-v2-title-wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
}

.rfq-v2-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid transparent;
}

.rfq-v2-status-pill.is-open {
  background: #e9f9ef;
  color: #0f7f3f;
  border-color: #bfe8ce;
}

.rfq-v2-status-pill.is-locked {
  background: #f7f0ff;
  color: #6b39c5;
  border-color: #dbc8ff;
}

.rfq-v2-status-pill.is-expired {
  background: #fff4ef;
  color: #ba4a1e;
  border-color: #f7d4c2;
}

.rfq-v2-detail-line {
  margin: 2px 0 0;
  color: #5e7090;
  font-size: 12px;
  font-weight: 600;
  flex-basis: 100%;
}

.rfq-v2-head-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.rfq-v2-head-actions .secondary-btn {
  min-height: 40px;
  border-radius: 8px;
  border-color: #c8d9f0;
  background: #ffffff;
  color: #1f55b3;
  font-size: 12px;
  font-weight: 700;
  padding: 0 15px;
  white-space: nowrap;
  justify-content: center;
  text-align: center;
}

.rfq-v2-head-btn.is-primary {
  background: linear-gradient(135deg, #2e70e8, #1f5dd9);
  border-color: #2e70e8;
  color: #ffffff;
}

.rfq-v2-head-btn.is-primary:hover {
  background: linear-gradient(135deg, #2867d9, #1a52c4);
}

.rfq-v2-head-btn:not(.is-primary):hover {
  background: #f5f8ff;
}

#rfqOpenCreateBtn {
  min-width: 108px;
}

#rfqShareActiveBtn {
  min-width: 146px;
}

#rfqRefreshBtn {
  min-width: 88px;
}

.rfq-v2-stat-grid {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.rfq-v2-stat-card {
  border: 1px solid #dbe5f2;
  border-radius: 8px;
  background: #ffffff;
  padding: 14px 12px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 118px;
}

.rfq-v2-stat-icon {
  width: 48px;
  height: 48px;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  font-size: 21px;
}

.rfq-v2-stat-card small {
  display: block;
  color: #445b80;
  font-size: 13px;
  font-weight: 700;
}

.rfq-v2-stat-card strong {
  display: block;
  margin-top: 3px;
  color: #09172f;
  font-size: 33px;
  line-height: 1.05;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rfq-v2-stat-card strong.is-text {
  font-size: 26px;
}

.rfq-v2-stat-card #rfqStatLowestTotal {
  font-size: clamp(1.45rem, 1.8vw, 1.95rem);
  line-height: 1.08;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  word-break: break-word;
}

.rfq-v2-stat-card p {
  margin: 5px 0 0;
  color: #6880a5;
  font-size: 11px;
  font-weight: 600;
}

.rfq-v2-stat-card.tone-blue .rfq-v2-stat-icon {
  background: #eaf2ff;
  color: #2b6ee6;
}

.rfq-v2-stat-card.tone-green .rfq-v2-stat-icon {
  background: #eaf7ea;
  color: #1f9246;
}

.rfq-v2-stat-card.tone-amber .rfq-v2-stat-icon {
  background: #fff5df;
  color: #c77d10;
}

.rfq-v2-stat-card.tone-violet .rfq-v2-stat-icon {
  background: #f2ebff;
  color: #7a41dc;
}

.rfq-v2-stat-card.tone-cyan .rfq-v2-stat-icon {
  background: #e6f7fb;
  color: #0c86a9;
}

.rfq-v2-tab-strip {
  display: flex;
  align-items: center;
  gap: 2px;
  border-bottom: 1px solid #dbe5f2;
  padding: 0 8px;
  background: #ffffff;
  border-top: 1px solid #dbe5f2;
  border-left: 1px solid #dbe5f2;
  border-right: 1px solid #dbe5f2;
  border-radius: 8px 8px 0 0;
}

.rfq-v2-tab-btn {
  border: 0;
  background: transparent;
  color: #4f648b;
  font-size: 13px;
  font-weight: 700;
  min-height: 42px;
  padding: 0 14px;
  border-bottom: 2px solid transparent;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.rfq-v2-tab-btn.is-active {
  color: #1d56c6;
  border-bottom-color: #1d56c6;
}

.rfq-v2-new-pill {
  background: #ef4444;
  color: #ffffff;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
}

.rfq-v2-create-card {
  border-style: dashed;
  background: #f9fcff;
}

.rfq-v2-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.rfq-v2-card-head h4 {
  margin: 0;
  color: #122847;
  font-size: 18px;
  font-weight: 800;
}

.rfq-v2-card-head .helper-text {
  margin: 0;
}

.rfq-v2-comparison-head {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 12px;
}

.rfq-v2-comparison-head h4 {
  line-height: 1.16;
  max-width: 480px;
}

.rfq-v2-comparison-actions {
  margin-left: 0;
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) minmax(220px, 1.2fr) minmax(180px, 1fr) minmax(180px, 1fr);
  gap: 10px;
  align-items: end;
}

.rfq-v2-comparison-filter {
  display: grid;
  gap: 0.34rem;
  min-width: 0;
  margin: 0;
  color: #5d7094;
  font-size: 0.85rem;
  font-weight: 700;
}

.rfq-v2-comparison-filter-label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #5d7094;
}

.rfq-v2-comparison-filter-label i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 999px;
  background: #edf3ff;
  color: #2b5ebf;
  font-size: 0.72rem;
}

.rfq-v2-comparison-filter select {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  border-radius: 12px;
  border: 1px solid #d6e2f6;
  background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
  color: #19325e;
  padding: 0 2.05rem 0 12px;
  line-height: 1.2;
}

.rfq-v2-comparison-actions .secondary-btn {
  width: 100%;
  min-height: 46px;
  padding: 0 15px;
  border-radius: 12px;
  border: 1px solid #d6e2fb;
  background: linear-gradient(180deg, #f7f9ff 0%, #eef3ff 100%);
  color: #2353b8;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.38rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.rfq-v2-comparison-actions .secondary-btn i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 1;
  font-size: 1rem;
}

.rfq-v2-comparison-actions .secondary-btn:hover {
  background: linear-gradient(180deg, #eef4ff 0%, #e7efff 100%);
}

.rfq-v2-grid-two {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}

.rfq-v2-grid-single {
  grid-template-columns: minmax(0, 1fr);
}

.rfq-v2-panel .data-table table {
  min-width: 100%;
}

.rfq-v2-panel .data-table th {
  background: #f5f7fb;
  color: #334f77;
  font-size: 12px;
  border-bottom: 1px solid #dfe7f4;
}

.rfq-v2-panel .data-table td {
  font-size: 12px;
  color: #172c49;
  border-bottom-color: #e8eef7;
}

.rfq-v2-panel .data-table th,
.rfq-v2-panel .data-table td {
  padding: 9px 10px;
  vertical-align: middle;
}

.rfq-v2-status-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 84px;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid transparent;
}

.rfq-v2-status-tag.is-submitted {
  background: #e8f8ee;
  border-color: #c8ebd7;
  color: #1d8a43;
}

.rfq-v2-status-tag.is-pending {
  background: #fff5e8;
  border-color: #f5debd;
  color: #c57513;
}

.rfq-v2-status-tag.is-locked {
  background: #f2ebff;
  border-color: #dccbff;
  color: #6b3ecc;
}

.rfq-v2-row-actions {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 4px;
  justify-content: end;
}

.rfq-v2-row-actions .icon-btn {
  min-width: 28px;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid #d5e2f6;
  background: #ffffff;
  color: #2e68da;
  padding: 0;
  display: inline-grid;
  place-items: center;
}

.rfq-v2-row-actions .icon-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

.rfq-v2-note {
  margin-top: 8px;
  color: #6b7f9f;
  font-size: 11px;
}

.rfq-v2-highlight-lowest {
  color: #178a40;
  font-weight: 700;
}

.rfq-v2-all-card-empty {
  padding: 22px 10px;
}

@media (max-width: 1400px) {
  .rfq-v2-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .rfq-v2-shell {
    grid-template-columns: 1fr;
  }

  .rfq-v2-sidebar {
    border-right: 0;
    border-bottom: 1px solid rgba(155, 185, 230, 0.3);
  }

  .rfq-v2-sidebar-nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rfq-v2-grid-two {
    grid-template-columns: 1fr;
  }

  .rfq-v2-comparison-head {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .rfq-v2-comparison-actions {
    width: 100%;
    margin-left: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rfq-v2-comparison-filter {
    min-width: 0;
  }

  .stock-control-top-head {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .stock-control-top-actions {
    justify-self: stretch;
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #stockBackToHomeBtn {
    justify-self: stretch;
  }
}

@media (max-width: 900px) {
  .rfq-v2-head-actions {
    grid-auto-flow: row;
  }

  .rfq-v2-hero-head {
    flex-direction: column;
  }

  .rfq-v2-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rfq-v2-topbar {
    justify-content: space-between;
  }

  .rfq-v2-tab-strip {
    overflow: auto;
    white-space: nowrap;
  }

  .rfq-v2-comparison-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .rfq-v2-stat-grid,
  .rfq-v2-sidebar-nav {
    grid-template-columns: 1fr;
  }

  .rfq-v2-title-wrap h3 {
    font-size: 27px;
  }

  .rfq-v2-comparison-actions {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .rfq-v2-comparison-filter,
  .rfq-v2-comparison-actions .secondary-btn {
    width: 100%;
    min-width: 0;
  }

  .stock-control-top-actions .secondary-btn,
  .stock-control-top-actions .status-pill {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .stock-control-top-actions {
    grid-template-columns: 1fr;
  }
}