:root {
  --blue-50: #eff5ff;
  --blue-100: #dbe7ff;
  --blue-500: #3b82f6;
  --blue-600: #2563eb;
  --blue-700: #1d4ed8;
  --blue-900: #1e3a8a;

  --ink-900: #0b1530;
  --ink-800: #111a36;
  --ink-700: #1f2a4a;
  --ink-500: #5b6b8a;
  --ink-400: #7a89a9;
  --ink-300: #a9b4c9;
  --ink-200: #d8def0;
  --ink-100: #eef1f9;
  --ink-50:  #f6f8fc;
  --app-bg: #f3f6fb;
  --app-surface: #ffffff;
  --app-safe-area-bg: #000000;

  --success: #16a34a;
  --success-soft: #dcfce7;
  --warning: #f59e0b;
  --warning-soft: #fef3c7;
  --danger: #dc2626;
  --danger-soft: #fee2e2;
  --info: #0ea5e9;
  --info-soft: #e0f2fe;

  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --shadow-md: 0 6px 18px rgba(15, 23, 42, .08);
  --shadow-lg: 0 18px 40px rgba(15, 23, 42, .12);

  --radius-sm: 10px;
  --radius: 14px;
  --radius-lg: 20px;

  --sidebar-w: 260px;
}

* { box-sizing: border-box; }
html,
body {
  height: 100%;
  touch-action: manipulation;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior: none;
}
body {
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--ink-900);
  background: var(--app-bg);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
button,
a,
input,
select,
textarea,
[role="button"] {
  touch-action: manipulation;
}
input,
select,
textarea {
  font-size: 16px;
}
a { color: var(--blue-700); text-decoration: none; }
a:hover { color: var(--blue-600); }
h1,h2,h3,h4 { margin: 0 0 .4rem 0; color: var(--ink-900); letter-spacing: -.01em; }
h1 { font-size: 1.55rem; font-weight: 700; }
h2 { font-size: 1.25rem; font-weight: 700; }
h3 { font-size: 1.05rem; font-weight: 600; }
p  { margin: 0 0 .75rem 0; color: var(--ink-700); }
.muted { color: var(--ink-400); font-size: .9rem; margin: 0; }

/* ======================= Buttons ======================= */
.btn {
  display: inline-flex; align-items: center; gap: .45rem;
  border: 1px solid transparent; padding: .6rem 1rem; border-radius: 10px;
  font: 600 .92rem "Inter", sans-serif; cursor: pointer; transition: all .15s ease;
  background: var(--blue-600); color: white;
  box-shadow: var(--shadow-sm);
}
.btn:hover { background: var(--blue-700); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.btn:active { transform: translateY(0); }
.btn-outline { background: white; color: var(--ink-900); border-color: var(--ink-200); box-shadow: none; }
.btn-outline:hover { border-color: var(--blue-500); color: var(--blue-700); background: var(--blue-50); }
.btn-ghost { background: transparent; color: var(--ink-500); box-shadow: none; }
.btn-ghost:hover { background: var(--ink-100); color: var(--ink-900); }
.btn-ghost.config-panel-btn {
  color: #16a34a !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  border-radius: 12px;
  width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  justify-content: center;
  gap: 0;
  font-size: .88rem;
  font-weight: 600;
  line-height: 1.1;
  opacity: 1;
}
.btn-ghost.config-panel-btn i,
.btn-ghost.config-panel-btn .agenda-kpi-gear {
  color: #16a34a !important;
}
.btn-ghost.config-panel-btn:hover {
  color: #15803d !important;
  background: #dcfce7 !important;
  border-color: #86efac !important;
  transform: translateY(-1px);
}
.btn-ghost.config-panel-btn:hover i,
.btn-ghost.config-panel-btn:hover .agenda-kpi-gear {
  color: #15803d !important;
}
.btn-ghost.config-panel-btn.fin-top-kpi-btn {
  opacity: 1 !important;
  padding-inline: 0;
}
.btn-success { background: var(--success); }
.btn-success:hover { background: #15803d; }
.btn-danger { background: var(--danger); }
.btn-danger:hover { background: #b91c1c; }
.btn-whatsapp { background: #25d366; }
.btn-whatsapp:hover { background: #1ebe5d; }
.btn-sm { padding: .4rem .65rem; font-size: .82rem; }
.btn-block { width: 100%; justify-content: center; }
.btn-icon { padding: .45rem .6rem; }

/* ======================= Forms ======================= */
.field { display: flex; flex-direction: column; gap: .35rem; margin-bottom: .8rem; }
.field label { font-weight: 600; font-size: .85rem; color: var(--ink-700); }
.input, .select, .textarea {
  width: 100%; padding: .65rem .85rem; border-radius: 10px;
  border: 1px solid var(--ink-200); background: white;
  font: 400 .95rem "Inter", sans-serif; color: var(--ink-900);
  transition: border-color .15s, box-shadow .15s;
}
.input:focus, .select:focus, .textarea:focus {
  outline: none; border-color: var(--blue-500);
  box-shadow: 0 0 0 4px var(--blue-50);
}
.textarea { resize: vertical; min-height: 90px; }
.form-grid { display: grid; gap: .8rem 1rem; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.form-row { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }

/* ======================= Landing ======================= */
.landing {
  min-height: 100vh;
  background:
    radial-gradient(60rem 40rem at -10% -20%, #dbe7ff 0%, transparent 60%),
    radial-gradient(50rem 40rem at 110% 10%, #ede9fe 0%, transparent 60%),
    linear-gradient(180deg, #f8faff 0%, #eef3fc 100%);
  display: flex; flex-direction: column;
}
.landing-nav {
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.25rem 2rem;
}
.landing-nav .brand-mark { background: var(--blue-600); color: white; }
.landing-hero {
  flex: 1; display: grid; gap: 3rem; align-items: center;
  grid-template-columns: 1.1fr 1fr; max-width: 1200px; margin: 0 auto;
  padding: 3rem 2rem 4rem;
}
.hero-tag {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .35rem .75rem; background: white; border: 1px solid var(--ink-200);
  color: var(--blue-700); font-weight: 600; font-size: .78rem; border-radius: 999px;
  box-shadow: var(--shadow-sm);
}
.hero-title {
  font-size: clamp(2.2rem, 4.2vw, 3.4rem);
  line-height: 1.05; letter-spacing: -.02em; margin: 1rem 0;
  background: linear-gradient(135deg, #0b1530 0%, #2563eb 70%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.hero-sub { font-size: 1.1rem; color: var(--ink-500); max-width: 520px; }
.hero-ctas { display: flex; gap: .75rem; margin-top: 1.6rem; flex-wrap: wrap; }
.hero-points { display: flex; gap: 1.5rem; margin-top: 2rem; flex-wrap: wrap; color: var(--ink-500); font-size: .92rem; }
.hero-points i { color: var(--blue-600); margin-right: .4rem; }
.hero-preview {
  background: white; border: 1px solid var(--ink-200); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg); overflow: hidden;
}
.hero-preview-header {
  display: flex; align-items: center; gap: .45rem;
  padding: .75rem 1rem; border-bottom: 1px solid var(--ink-100);
}
.hero-preview-header span { width: 10px; height: 10px; border-radius: 50%; background: var(--ink-200); }
.hero-preview-body { padding: 1.2rem; }
.hero-preview-body .kpi-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-bottom: .75rem; }
.hero-preview-body .mini-kpi {
  background: var(--ink-50); padding: .6rem; border-radius: 10px;
}
.hero-preview-body .mini-kpi b { font-size: 1.05rem; color: var(--blue-700); }
.hero-preview-body .mini-kpi small { display: block; color: var(--ink-400); font-size: .72rem; }
.hero-preview-body .bars { display: flex; align-items: flex-end; gap: .4rem; height: 110px; padding: .5rem; background: var(--ink-50); border-radius: 12px; }
.hero-preview-body .bars i { flex: 1; background: linear-gradient(180deg, #3b82f6, #1d4ed8); border-radius: 4px; }

.landing-features {
  max-width: 1200px; margin: 0 auto; padding: 0 2rem 4rem;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem;
}
.feature-card {
  background: white; border: 1px solid var(--ink-100); border-radius: var(--radius);
  padding: 1.1rem; box-shadow: var(--shadow-sm);
}
.feature-card .fi {
  width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--blue-50); color: var(--blue-700); border-radius: 10px; margin-bottom: .5rem;
}
.landing-footer { padding: 1.5rem 2rem; text-align: center; color: var(--ink-400); font-size: .88rem; }

@media (max-width: 900px) {
  .landing-hero { grid-template-columns: 1fr; padding: 2rem 1.25rem; }
  .hero-preview { order: -1; }
}

/* ======================= LANDING MOBILE REFACTOR ======================= */
@media (max-width: 768px) {
  /* Header Mobile - Remove redundant buttons */
  .landing-nav {
    padding: 1rem 1.25rem;
    justify-content: center;
  }
  
  .landing-nav .nav-buttons {
    display: none;
  }
  
  .landing-nav .brand {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
    width: 100%;
    justify-content: center;
  }
  
  /* Brand Mark - Premium styling */
  .landing-nav .brand-mark {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--blue-600);
    color: white;
    border-radius: 12px;
    font-size: 1.35rem;
    flex-shrink: 0;
  }
  
  /* Brand Name - Large and elegant */
  .landing-nav .brand-name {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--ink-900);
    letter-spacing: -0.01em;
  }
  
  .landing-nav .brand-name br {
    display: none;
  }
  
  .landing-nav .brand-name strong {
    font-weight: 700;
    margin-left: 0.25rem;
  }
  
  /* Hero Section - Improved spacing */
  .landing-hero {
    grid-template-columns: 1fr;
    padding: 2.5rem 1.25rem 3.5rem;
    gap: 2rem;
  }
  
  .hero-tag {
    margin-bottom: 0.5rem;
    font-size: 0.75rem;
    padding: 0.35rem 0.7rem;
  }
  
  .hero-title {
    font-size: clamp(1.8rem, 5vw, 2.4rem);
    margin: 0.75rem 0;
  }
  
  .hero-sub {
    font-size: 1rem;
    line-height: 1.55;
    color: var(--ink-600);
    margin-bottom: 1.25rem;
  }
  
  /* Hero CTA Buttons - Better mobile layout */
  .hero-ctas {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-top: 1.5rem;
  }
  
  .hero-ctas .btn {
    width: 100%;
    padding: 0.85rem 1.25rem;
    font-size: 0.95rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
  }
  
  /* Hero Points - Stack vertically on small screens */
  .hero-points {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.5rem;
    font-size: 0.9rem;
  }
  
  /* Hero Preview - Improved mobile preview */
  .hero-preview {
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
  }
  
  .hero-preview-body {
    padding: 1rem;
  }
  
  .hero-preview-body .kpi-row {
    gap: 0.5rem;
    margin-bottom: 0.8rem;
  }
  
  .hero-preview-body .mini-kpi {
    padding: 0.5rem;
    border-radius: 8px;
    font-size: 0.85rem;
  }
  
  .hero-preview-body .mini-kpi b {
    font-size: 1rem;
  }
  
  .hero-preview-body .mini-kpi small {
    font-size: 0.65rem;
    margin-bottom: 0.25rem;
  }
  
  .hero-preview-body .bars {
    gap: 0.3rem;
    height: 80px;
  }
  
  /* Feature Cards - Horizontal carousel */
  .landing-features {
    max-width: 100%;
    margin: 0;
    padding: 0;
    padding-bottom: 3rem;
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    /* Hide scrollbar while keeping functionality */
    scrollbar-width: none;
  }
  
  .landing-features::-webkit-scrollbar {
    display: none;
  }
  
  .feature-card {
    flex: 0 0 calc(100vw - 2.5rem);
    max-width: 280px;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    border-radius: 12px;
    padding: 1.25rem;
    background: white;
    border: 1px solid var(--ink-100);
    box-shadow: var(--shadow-md);
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.3s ease;
  }
  
  .feature-card:first-child {
    margin-left: 1.25rem;
  }
  
  .feature-card:last-child {
    margin-right: 1.25rem;
  }
  
  .feature-card:active,
  .feature-card:hover {
    box-shadow: var(--shadow-lg);
  }
  
  .feature-card h3 {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0.75rem 0 0.5rem;
    color: var(--ink-900);
  }
  
  .feature-card p {
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--ink-500);
  }
  
  .feature-card .fi {
    width: 48px;
    height: 48px;
    font-size: 1.5rem;
    border-radius: 10px;
  }
  
  /* Footer Mobile */
  .landing-footer {
    padding: 2rem 1.25rem 1.5rem;
    font-size: 0.85rem;
    margin-top: 2rem;
  }
}

/* Ultra-small screens (360px) */
@media (max-width: 480px) {
  .landing-nav {
    padding: 0.9rem 1rem;
  }
  
  .landing-nav .brand-mark {
    width: 40px;
    height: 40px;
    font-size: 1.2rem;
  }
  
  .landing-nav .brand-name {
    font-size: 1.15rem;
  }
  
  .landing-hero {
    padding: 2rem 1rem 3rem;
    gap: 1.5rem;
  }
  
  .hero-title {
    font-size: clamp(1.6rem, 5.5vw, 2rem);
  }
  
  .hero-sub {
    font-size: 0.95rem;
  }
  
  .feature-card {
    flex: 0 0 calc(100vw - 2rem);
    max-width: 100%;
  }
  
  .feature-card:first-child {
    margin-left: 1rem;
  }
  
  .feature-card:last-child {
    margin-right: 1rem;
  }
  
  .landing-footer {
    padding: 1.5rem 1rem 1rem;
  }
}

/* ======================= LANDING MOBILE PREMIUM - BLACK TOP ======================= */
@media (max-width: 768px) {
  /* Black top bar for premium mobile look */
  body.landing-page {
    background: #000000;
  }
  
  .landing {
    background: linear-gradient(180deg, #000000 0%, #1a1a1a 100%);
    padding-top: max(0px, env(safe-area-inset-top));
  }
  
  .landing-nav {
    background: #000000;
    padding-top: calc(1rem + max(0px, env(safe-area-inset-top)));
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  }
  
  .landing-nav .brand-name {
    color: #ffffff;
  }
  
  .landing-nav .brand-mark {
    background: var(--blue-600);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
  }
  
  /* Smooth transition from black header to light content */
  .landing-hero {
    background: linear-gradient(180deg, #1a1a1a 0%, #f8faff 60%);
  }
  
  .landing-features {
    padding-bottom: calc(3rem + max(0px, env(safe-area-inset-bottom)));
  }
}

/* Ultra-small screens with black top (360px) */
@media (max-width: 480px) {
  .landing {
    background: linear-gradient(180deg, #000000 0%, #1a1a1a 100%);
  }
  
  .landing-nav {
    background: #000000;
    padding-top: calc(0.9rem + max(0px, env(safe-area-inset-top)));
  }
}

/* ======================= Auth ======================= */
.auth-wrap {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 2vw, 1.5rem);
  background:
    radial-gradient(50rem 35rem at -20% -20%, #dbe7ff 0%, transparent 60%),
    linear-gradient(180deg, #f8faff 0%, #eef3fc 100%);
}
.auth-card {
  width: 100%;
  max-width: 460px;
  background: rgba(255,255,255,.97);
  border-radius: 20px;
  box-shadow: var(--shadow-lg);
  padding: clamp(1.35rem, 2.5vw, 2rem);
  border: 1px solid var(--ink-100);
}
.auth-card-register { max-width: 560px; }
.auth-register-screen {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding:
    max(48px, calc(3rem + env(safe-area-inset-top, 0px)))
    clamp(.85rem, 2vw, 1.5rem)
    max(24px, calc(1.5rem + env(safe-area-inset-bottom, 0px)));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.auth-register-screen .auth-card-register {
  flex: 0 0 auto;
  margin-block: auto;
}
.auth-card .brand { margin-bottom: .95rem; }
.auth-card h1 {
  margin: 0 0 .3rem;
  font-size: clamp(1.55rem, 4vw, 2rem);
  line-height: 1.04;
  letter-spacing: 0;
}
.auth-card > .muted {
  margin: 0 0 1rem;
  line-height: 1.35;
}
.auth-card .form-grid { gap: .72rem .82rem; }
.auth-card .field { gap: .28rem; }
.auth-card .field label {
  color: var(--ink-700);
  font-size: .9rem;
  font-weight: 800;
  line-height: 1.1;
}
.auth-card .input {
  min-height: 46px;
  height: 46px;
  padding: .68rem .9rem;
  border-color: #d6def0;
  border-radius: 14px;
  background: #fff;
  font-size: 16px;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.auth-card .input:focus {
  border-color: var(--blue-500);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(37,99,235,.11);
  outline: none;
}
.auth-card .btn-block {
  min-height: 48px;
  margin-top: .9rem;
  border-radius: 14px;
}
.auth-alt { text-align: center; margin-top: 1rem; color: var(--ink-400); font-size: .9rem; }
.alert {
  padding: .7rem .85rem; border-radius: 10px; margin-bottom: .9rem; font-size: .9rem;
  background: var(--danger-soft); color: var(--danger); border: 1px solid #fecaca;
}
.alert-success { background: var(--success-soft); color: #166534; border-color: #bbf7d0; }

@media (max-width: 640px) {
  .auth-wrap {
    align-items: center;
    justify-items: center;
    place-items: center;
    padding: calc(.7rem + env(safe-area-inset-top)) .85rem calc(.95rem + env(safe-area-inset-bottom));
  }

  .auth-register-screen {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding:
      max(68px, calc(4.25rem + env(safe-area-inset-top, 0px)))
      .85rem
      max(24px, calc(1.35rem + env(safe-area-inset-bottom, 0px)));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .auth-card {
    width: min(100%, 460px);
    max-width: 100%;
    margin: 0 auto;
    padding: 1.15rem 1rem 1rem;
    border-radius: 24px;
    box-shadow: 0 20px 54px rgba(15,23,42,.12);
  }

  .auth-card-register {
    align-self: center;
    width: min(100%, 560px);
    margin-block: auto;
    padding: .82rem .9rem .82rem;
  }

  .auth-card-login {
    padding: 1.35rem 1rem 1.05rem;
    border-radius: 20px;
  }

  .auth-card .brand { gap: .55rem; margin-bottom: .75rem; }
  .auth-card .brand-mark {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }
  .auth-card .brand-name { font-size: .88rem; line-height: 1; }
  .auth-card .brand-name strong { font-size: 1rem; letter-spacing: 0; }
  .auth-card h1 {
    margin-bottom: .25rem;
    font-size: clamp(1.62rem, 8vw, 2.15rem);
  }
  .auth-card-login h1 {
    font-size: 1.4rem;
    line-height: 1.12;
  }
  .auth-card-register h1 {
    font-size: clamp(1.45rem, 7vw, 1.86rem);
    line-height: 1.02;
  }
  .auth-card > .muted {
    margin-bottom: .68rem;
    font-size: 1rem;
  }
  .auth-card-login > .muted {
    margin-bottom: .9rem;
    font-size: .92rem;
  }
  .auth-card-register > .muted {
    margin-bottom: .46rem;
    font-size: .9rem;
    line-height: 1.22;
  }
  .auth-card-register .brand {
    margin-bottom: .5rem;
  }
  .auth-card-register .brand-mark {
    width: 34px;
    height: 34px;
    border-radius: 10px;
  }
  .auth-card-register .brand-name {
    font-size: .78rem;
  }
  .auth-card-register .brand-name strong {
    font-size: .9rem;
  }
  .auth-card .form-grid,
  .auth-form-grid {
    grid-template-columns: 1fr;
    gap: .54rem;
  }
  .auth-card-register .form-grid,
  .auth-card-register .auth-form-grid {
    gap: .34rem;
  }
  .auth-card .field { gap: .22rem; }
  .auth-card .field label { font-size: .83rem; }
  .auth-card-register .field {
    gap: .14rem;
  }
  .auth-card-register .field label {
    font-size: .78rem;
    line-height: 1.05;
  }
  .auth-card .input {
    min-height: 42px;
    height: 42px;
    padding: .56rem .78rem;
    border-radius: 13px;
    font-size: 16px;
  }
  .auth-card-register .input {
    min-height: 38px;
    height: 38px;
    padding: .44rem .68rem;
    border-radius: 12px;
  }
  .auth-card .btn-block {
    min-height: 46px;
    margin-top: .72rem;
  }
  .auth-card-register .btn-block {
    min-height: 42px;
    margin-top: .48rem;
    border-radius: 12px;
    padding-block: .54rem;
  }
  .auth-card-register .auth-alt {
    margin-top: .42rem;
    font-size: .88rem;
  }
}

@media (max-width: 380px) {
  .auth-card { padding-inline: .9rem; }
  .auth-card .form-grid,
  .auth-form-grid { gap: .48rem; }
  .auth-card-register .form-grid,
  .auth-card-register .auth-form-grid { gap: .3rem; }
  .auth-card .input {
    min-height: 40px;
    height: 40px;
  }
  .auth-card-register {
    padding: .72rem .78rem .76rem;
  }
  .auth-card-register .input {
    min-height: 36px;
    height: 36px;
  }
  .auth-card-register .brand {
    margin-bottom: .42rem;
  }
  .auth-card-register > .muted {
    margin-bottom: .38rem;
  }
}

/* ======================= Brand ======================= */
.brand {
  display: flex; align-items: center; gap: .6rem;
  color: inherit; font-weight: 700;
}
.brand-mark {
  width: 38px; height: 38px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: white; color: var(--blue-700);
  box-shadow: var(--shadow-sm);
}
.brand-name { font-size: .95rem; line-height: 1.05; }
.brand-name strong { font-size: 1.05rem; letter-spacing: -.01em; }

/* ======================= App Shell ======================= */
.app-shell {
  display: grid; grid-template-columns: var(--sidebar-w) 1fr;
  min-height: 100vh;
  transition: grid-template-columns .22s ease;
}
.sidebar {
  position: sticky; top: 0; height: 100vh;
  background: linear-gradient(180deg, #0b1530 0%, #111a36 100%);
  color: #c9d1e8;
  padding: 1.2rem 1rem;
  display: flex; flex-direction: column;
  border-right: 1px solid #0b1530;
  transition: transform .22s ease, opacity .18s ease;
}
.sidebar .brand { color: white; margin-bottom: 1.25rem; padding: .25rem .25rem; }
.sidebar .brand-mark { background: var(--blue-600); color: white; }
.sidenav { flex: 1; overflow-y: auto; padding-right: .25rem; }
.sidenav-group {
  padding: .75rem .5rem .35rem; font-size: .7rem; letter-spacing: .08em;
  color: #6d7aa0; text-transform: uppercase; font-weight: 700;
}
.sidenav-item {
  display: flex; align-items: center; gap: .7rem;
  padding: .6rem .75rem; border-radius: 10px;
  color: #c9d1e8; font-weight: 500; font-size: .92rem;
  transition: background .15s ease, color .15s ease, transform .15s ease;
  margin-bottom: .1rem;
}
.sidenav-item i { width: 18px; text-align: center; color: #8a97bd; }
.sidenav-item:hover {
  background: rgba(255,255,255,.06);
  color: white;
}
.sidenav-item.is-active {
  background: linear-gradient(135deg, rgba(37,99,235,.25), rgba(59,130,246,.12));
  color: white;
  box-shadow: inset 3px 0 0 var(--blue-500);
}
.sidenav-item.is-active i { color: #93c5fd; }

.sidebar-footer {
  display: flex; align-items: center; justify-content: space-between;
  gap: .5rem; padding-top: .75rem; border-top: 1px solid rgba(255,255,255,.08);
  margin-top: .5rem;
}
.user-chip { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.avatar {
  width: 36px; height: 36px; border-radius: 10px;
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  color: white; font-weight: 700; display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden;
  flex: 0 0 auto;
}
.avatar-business img { width: 100%; height: 100%; object-fit: cover; display: block; }
.user-name { color: white; font-size: .88rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 130px; }
.user-role { color: #8a97bd; font-size: .75rem; }
.sidebar-footer .btn-ghost { color: #c9d1e8; }
.sidebar-footer .btn-ghost:hover { background: rgba(255,255,255,.08); color: white; }
.sidebar-logout-label { display: none; }

.main-panel { display: flex; flex-direction: column; min-width: 0; }
.sidebar-backdrop { display: none; }
.mobile-menu-btn { display: inline-flex; }
.mobile-menu-btn {
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  flex: 0 0 42px;
  border: 1px solid var(--ink-200);
  border-radius: 12px;
  background: white;
  color: var(--ink-700);
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  font-size: 1.05rem;
  line-height: 1;
}
.mobile-menu-btn:hover {
  color: var(--blue-700);
  border-color: var(--blue-500);
  background: var(--blue-50);
}
body.sidebar-collapsed .app-shell { grid-template-columns: 0 1fr; }
body.sidebar-collapsed .sidebar {
  transform: translateX(-102%);
  opacity: 0;
  pointer-events: none;
}
.topbar {
  display: flex; justify-content: flex-start; align-items: center; gap: 1rem;
  padding: 1.25rem 2rem; background: white; border-bottom: 1px solid var(--ink-100);
  position: sticky; top: 0; z-index: 5;
}
.topbar-title {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
}
.topbar-title h1 { font-size: 1.3rem; }
.topbar-actions { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; min-width: 0; justify-content: flex-end; margin-left: auto; }
.fin-period-toolbar {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
  min-height: 40px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: transparent;
}
.fin-period-label {
  font-size: .78rem;
  font-weight: 700;
  color: var(--ink-600);
  white-space: nowrap;
}
.fin-period-select {
  width: 136px;
  min-width: 132px;
  max-width: 100%;
  height: 40px;
  padding-block: .45rem;
  border-radius: 12px;
  font-size: .9rem;
  box-shadow: var(--shadow-sm);
}
.fin-period-custom {
  display: none;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
}
.fin-period-custom.is-visible {
  display: inline-flex;
}
.fin-period-date {
  width: 132px;
  height: 40px;
  padding-block: .45rem;
  border-radius: 12px;
  font-size: .86rem;
}
.topbar-actions .fin-period-toolbar {
  flex: 0 0 auto;
  min-height: 40px;
}
.topbar-actions .fin-period-select,
.topbar-actions .finance-top-control {
  height: 40px;
  min-height: 40px;
  border-radius: 12px;
  align-items: center;
}
.topbar-actions .finance-top-control:not(.finance-top-gear) {
  padding: 0 .85rem;
  font-size: .88rem;
  line-height: 1;
}
.topbar-actions .finance-top-gear {
  width: 40px;
  min-width: 40px;
  padding: 0;
}
.agenda-top-actions {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; justify-content: flex-end; max-width: 100%;
}
.agenda-primary-btn,
.agenda-icon-btn {
  min-height: 44px;
  height: 44px;
  border-radius: 12px;
}
.agenda-primary-btn {
  padding-inline: .9rem;
  box-shadow: var(--shadow-sm);
  white-space: nowrap;
}
.agenda-icon-btn {
  position: relative;
  width: 44px;
  min-width: 44px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-700);
}
.agenda-icon-btn:hover {
  color: var(--blue-700);
  border-color: var(--blue-500);
  background: var(--blue-50);
}
.agenda-actions-menu {
  flex: 0 0 auto;
}
.agenda-icon-btn .agenda-wait-dot {
  position: absolute;
  top: 8px;
  right: 8px;
  margin: 0;
  box-shadow: 0 0 0 2px white;
}
.agenda-kpi-config { font-size: .88rem; padding: 0; font-weight: 600; }
.agenda-kpi-gear { margin-right: .15rem; opacity: .9; }
.menu-sep { margin: .35rem 0; border: 0; border-top: 1px solid var(--ink-100); }
@media (max-width: 600px) {
  .agenda-top-actions { width: 100%; justify-content: flex-start; }
  .agenda-top-actions > .menu { margin-left: 0; }
}
.content { padding: 1.5rem 2rem 3rem; }

@media (max-width: 1024px) {
  .topbar {
    gap: .8rem;
    padding: 1rem 1.2rem;
  }
  .content { padding: 1.2rem; }
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .grid-2[style*="grid-template-columns"],
  .grid-3[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 768px) {
  .app-shell { grid-template-columns: 1fr; }
  .mobile-menu-btn { display: inline-flex; }
  body.sidebar-collapsed .app-shell { grid-template-columns: 1fr; }
  body.sidebar-collapsed .sidebar {
    opacity: 1;
    pointer-events: auto;
  }
  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(82vw, var(--sidebar-w));
    height: 100vh;
    z-index: 70;
    transform: translateX(-105%);
    transition: transform .2s ease;
    box-shadow: var(--shadow-lg);
  }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 65;
    background: rgba(15, 23, 42, .42);
  }
  body.sidebar-open .sidebar-backdrop { display: block; }
  body.sidebar-open { overflow: hidden; }
  h1 { font-size: 1.25rem; }
  h2 { font-size: 1.08rem; }
  .topbar {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .topbar-title { flex: 1 1 calc(100% - 50px); }
  .topbar-title .muted { font-size: .82rem; }
  .topbar-actions {
    width: 100%;
    justify-content: flex-start;
  }
  .topbar-actions .search,
  .topbar-actions .input,
  .topbar-actions form {
    max-width: 100%;
  }
  .fin-period-toolbar {
    width: 100%;
  }
  .fin-period-custom.is-visible {
    width: 100%;
  }
  .fin-period-date {
    flex: 1 1 120px;
    width: auto;
  }
  .content { padding: 1rem; }
  .card { padding: 1rem; }
  .card-header {
    align-items: flex-start;
  }
  .form-grid,
  .form-grid-3,
  .module-grid,
  .fin-pers-grid,
  .fin-perfil-grid {
    grid-template-columns: 1fr;
  }
  .table-wrap {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table { min-width: 680px; }
  .table th,
  .table td { padding: .65rem .75rem; }
  .table .actions {
    min-width: 96px;
    white-space: nowrap;
  }
  .search { min-width: 0; }
  .fin-kpi {
    flex-basis: calc(50% - .5rem);
    min-width: min(220px, 100%);
  }
  .fin-alerts,
  .fin-insights,
  .fin-charts {
    grid-template-columns: 1fr;
  }
  .agenda-toolbar {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    justify-content: flex-start;
  }
  .agenda-card,
  .week-view {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .cal-head,
  .cal-grid,
  .week-head,
  .week-body {
    min-width: 640px;
  }
  .modal-card {
    max-height: calc(100vh - 1.4rem);
  }
}

@media (max-width: 480px) {
  .content { padding: .8rem; }
  .topbar { padding: .85rem; }
  .btn { min-height: 38px; }
  .topbar-actions > *,
  .search,
  .search-sm {
    width: 100%;
    min-width: 0;
  }
  .topbar-actions .btn,
  .topbar-actions .menu > .btn {
    justify-content: center;
  }
  .fin-kpi { flex-basis: 100%; }
  .modal { padding: .65rem; }
  .modal-card {
    width: 100%;
    max-height: calc(100vh - 1.3rem);
  }
  .agenda-top-actions { width: 100%; }
  .agenda-top-actions .agenda-primary-btn {
    flex: 1 1 100%;
    justify-content: center;
    width: 100%;
  }
  .agenda-top-actions .agenda-icon-btn,
  .agenda-top-actions .config-panel-btn {
    flex: 0 0 44px;
    width: 44px;
  }
  .agenda-top-actions .menu { width: 100%; }
  .agenda-top-actions .menu > .btn { width: 100%; justify-content: center; }
  .clientes-toolbar {
    gap: .45rem;
  }
  .clientes-primary-btn {
    flex: 1 1 100%;
    justify-content: center;
  }
  .clientes-search {
    flex: 1 1 calc(100% - 92px);
  }
  .topbar-actions .clientes-tool-menu,
  .topbar-actions .clientes-tool-menu > .clientes-icon-btn {
    flex: 0 0 40px;
    width: 40px;
  }
  .module-help-modal-card {
    width: calc(100vw - 1.2rem);
  }
}

/* ======================= Cards / KPIs ======================= */
.card {
  background: white; border: 1px solid var(--ink-100); border-radius: var(--radius);
  padding: 1.1rem; box-shadow: var(--shadow-sm);
}
.card + .card { margin-top: 1rem; }
.card-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: .9rem; gap: .5rem; flex-wrap: wrap;
}
.card-header h2 { margin: 0; }

.kpi-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem; margin-bottom: 1.25rem;
}
.kpi {
  background: white; border: 1px solid var(--ink-100); border-radius: var(--radius);
  padding: 1.1rem; box-shadow: var(--shadow-sm);
  display: flex; align-items: center; gap: .9rem;
}
.kpi-icon {
  width: 44px; height: 44px; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--blue-50); color: var(--blue-700); font-size: 1.1rem;
}
.kpi.k-green .kpi-icon { background: var(--success-soft); color: var(--success); }
.kpi.k-yellow .kpi-icon { background: var(--warning-soft); color: var(--warning); }
.kpi.k-red .kpi-icon { background: var(--danger-soft); color: var(--danger); }
.kpi.k-purple .kpi-icon { background: #ede9fe; color: #6d28d9; }
.kpi.k-cyan .kpi-icon { background: var(--info-soft); color: var(--info); }

.kpi-label { font-size: .8rem; color: var(--ink-400); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.kpi-value { font-size: 1.45rem; font-weight: 700; color: var(--ink-900); }
.kpi-trend { font-size: .78rem; color: var(--success); font-weight: 600; }
.kpi-trend.neg { color: var(--danger); }

.grid-2 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 1rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
/* Em grids, evita o deslocamento vertical causado por .card + .card */
.grid-2 > .card,
.grid-3 > .card {
  margin-top: 0;
  height: 100%;
}
/* Dashboard principal: alinhamento forçado no topo (evita deslocamento residual) */
.dash-main-row {
  align-items: stretch;
}
.dash-main-row > .dash-main-card {
  margin-top: 0 !important;
  align-self: stretch;
  height: 100%;
}
.chart-wrap {
  position: relative;
  width: 100%;
  min-height: 180px;
}
.chart-wrap-md { height: 260px; }
.chart-wrap-sm { height: 220px; }
.chart-wrap > canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}
@media (max-width: 1000px) {
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .chart-wrap-md, .chart-wrap-sm { height: 220px; }
}

/* ======================= Tables ======================= */
.table-wrap { overflow: auto; border-radius: var(--radius); border: 1px solid var(--ink-100); background: white; box-shadow: var(--shadow-sm); }
.table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.table th, .table td { padding: .75rem 1rem; text-align: left; }
.table thead { background: var(--ink-50); }
.table th { font-size: .78rem; text-transform: uppercase; color: var(--ink-400); letter-spacing: .04em; font-weight: 700; border-bottom: 1px solid var(--ink-100); }
.table tbody tr { border-top: 1px solid var(--ink-100); }
.table tbody tr:hover { background: var(--ink-50); }
.table .actions { display: flex; gap: .35rem; justify-content: flex-end; }
.table-empty { padding: 2rem; text-align: center; color: var(--ink-400); }

.badge {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .2rem .55rem; border-radius: 999px;
  font-size: .75rem; font-weight: 600;
  background: var(--ink-100); color: var(--ink-700);
}
.badge.green { background: var(--success-soft); color: #166534; }
.badge.yellow { background: var(--warning-soft); color: #92400e; }
.badge.red { background: var(--danger-soft); color: #991b1b; }
.badge.blue { background: var(--blue-50); color: var(--blue-700); }
.badge.gray { background: var(--ink-100); color: var(--ink-500); }

/* Search */
.search {
  display: flex; align-items: center; gap: .5rem;
  background: white; border: 1px solid var(--ink-200); border-radius: 10px;
  padding: .3rem .5rem .3rem .85rem; min-width: 240px;
}
.search i { color: var(--ink-300); }
.search input { border: 0; outline: 0; flex: 1; font: 400 .92rem "Inter", sans-serif; padding: .4rem 0; background: transparent; color: var(--ink-900); }
.catalog-row-hidden { display: none !important; }

/* ======================= Setup módulos ======================= */
.setup-wrap { max-width: 1200px; margin: 0 auto; padding: 2rem 1.5rem; }
.module-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; }
.module-card {
  position: relative; background: white; border: 2px solid var(--ink-100);
  border-radius: var(--radius); padding: 1rem; cursor: pointer;
  transition: transform .15s, border-color .15s, box-shadow .15s;
  display: flex; flex-direction: column; gap: .4rem;
}
.module-card:hover { transform: translateY(-2px); border-color: var(--blue-500); box-shadow: var(--shadow-md); }
.module-card input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.module-card .mod-icon {
  width: 44px; height: 44px; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--blue-50); color: var(--blue-700); font-size: 1.1rem;
}
.module-card h3 { font-size: 1rem; }
.module-card small { color: var(--ink-400); font-size: .85rem; line-height: 1.35; }
.module-card.selected { border-color: var(--blue-600); background: var(--blue-50); box-shadow: 0 0 0 4px var(--blue-100); }
.module-card .check {
  position: absolute; top: .6rem; right: .6rem; width: 22px; height: 22px;
  border-radius: 6px; border: 1.5px solid var(--ink-200); background: white;
  display: inline-flex; align-items: center; justify-content: center; color: transparent;
}
.module-card.selected .check { background: var(--blue-600); color: white; border-color: var(--blue-600); }

/* ======================= Misc ======================= */
.flex-between { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.stack-sm > * + * { margin-top: .5rem; }
.stack   > * + * { margin-top: 1rem; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.empty-state {
  text-align: center; padding: 2.5rem 1rem; color: var(--ink-400);
}
.empty-state i { font-size: 2rem; color: var(--ink-300); margin-bottom: .5rem; display: block; }

.construction-page {
  min-height: clamp(360px, calc(100vh - 210px), 620px);
  display: grid;
  place-items: center;
}
.construction-card {
  width: min(680px, 100%);
  display: flex;
  align-items: center;
  gap: 1.1rem;
  padding: 1.35rem;
  border: 1px solid #e4eaf3;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .08);
}
.construction-icon {
  width: 64px;
  height: 64px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 18px;
  background: #eff6ff;
  color: #2563eb;
  font-size: 1.45rem;
}
.construction-kicker {
  display: inline-flex;
  margin-bottom: .28rem;
  color: #2563eb;
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.construction-copy h2 {
  margin: 0 0 .32rem;
  color: var(--ink-900);
  font-size: 1.45rem;
}
.construction-copy p {
  max-width: 480px;
  margin-bottom: .9rem;
  color: #6f7d99;
}

.agenda-public-link-modal-card {
  text-align: center;
}
.agenda-public-link-success-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: .85rem;
  border-radius: 18px;
  color: #1d4ed8;
  background: #dbeafe;
  font-size: 1.25rem;
}
.agenda-public-link-title {
  margin-bottom: .35rem;
  line-height: 1.25;
}
.agenda-public-link-sub {
  margin: 0 0 1rem;
}
.agenda-public-link-hidden-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.modal-actions.agenda-public-link-actions {
  justify-content: center;
  gap: .7rem;
  width: fit-content;
  margin-right: auto;
  margin-left: auto;
}
.agenda-public-link-actions .btn {
  min-width: 142px;
  -webkit-user-select: none;
  user-select: none;
}
.agenda-public-link-feedback {
  min-height: 1.2rem;
  margin-top: .65rem;
  color: #15803d;
  font-size: .82rem;
  font-weight: 700;
}
.agenda-link-toggle {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .75rem;
  border: 1px solid #dbe7ff;
  border-radius: 12px;
  background: #f8fbff;
  cursor: pointer;
}
.agenda-link-toggle input {
  margin-top: .2rem;
  accent-color: var(--blue-600);
}
.agenda-link-toggle strong,
.agenda-link-toggle small {
  display: block;
}
.agenda-link-toggle strong {
  color: var(--ink-900);
  font-size: .84rem;
}
.agenda-link-toggle small {
  color: #7281a0;
  font-size: .74rem;
  margin-top: .12rem;
}
.agenda-notification-item-new {
  border-left-color: #dbe7f7;
  background: #fff;
}

body.public-schedule-body {
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto !important;
  overscroll-behavior-y: auto;
  touch-action: pan-y;
  background: #eef2f7;
}

.public-schedule-page {
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: visible;
  padding:
    max(1.25rem, calc(1rem + env(safe-area-inset-top)))
    1.25rem
    max(3rem, calc(2rem + env(safe-area-inset-bottom)));
  background:
    radial-gradient(circle at 15% 15%, rgba(37, 99, 235, .14), transparent 22%),
    radial-gradient(circle at 85% 18%, rgba(16, 185, 129, .12), transparent 24%),
    linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}
.public-schedule-card {
  width: min(560px, 100%);
  height: auto;
  max-height: none;
  overflow: visible;
  border: 1px solid rgba(226, 232, 240, .75);
  border-radius: 28px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 34px 90px rgba(15, 23, 42, .12);
  padding: 1.6rem;
  backdrop-filter: blur(18px);
}
.public-schedule-page-success {
  align-items: center;
  justify-content: center;
  padding: clamp(.85rem, 3.4svh, 1.35rem) .9rem;
}
.public-schedule-card-success {
  width: min(430px, calc(100vw - 1.4rem));
  max-height: calc(100svh - 1.7rem - env(safe-area-inset-bottom));
  overflow-y: auto;
  padding: clamp(1.05rem, 3.2vw, 1.4rem);
  border-radius: 24px;
  box-shadow: 0 22px 55px rgba(15, 23, 42, .13);
}
.public-schedule-card,
.public-schedule-card * {
  box-sizing: border-box;
}
.public-schedule-head {
  display: flex;
  align-items: center;
  gap: .95rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #eef2f7;
}
.public-schedule-head img,
.public-schedule-logo {
  width: 56px;
  height: 56px;
  border-radius: 18px;
  object-fit: cover;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #2563eb, #0f766e);
  color: #fff;
  font-weight: 900;
}
.public-schedule-head span {
  display: block;
  color: #64748b;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.public-schedule-head h1 {
  margin: .15rem 0 0;
  color: #0f172a;
  font-size: 1.45rem;
  line-height: 1.2;
}
.public-service-summary {
  display: grid;
  gap: .25rem;
  margin: .9rem 0;
  padding: .9rem .95rem;
  border-radius: 18px;
  background: #f8fafc;
  border: 1px solid #e8eef7;
}
.public-service-summary strong {
  color: #0f172a;
  font-size: 1.07rem;
}
.public-service-summary span,
.public-service-summary small {
  color: #64748b;
  font-weight: 700;
}
.public-service-summary span {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.public-service-summary small {
  font-size: .82rem;
}
.public-schedule-alert {
  margin: .85rem 0;
  padding: .75rem .9rem;
  border: 1px solid #bfdbfe;
  border-radius: 14px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: .9rem;
  font-weight: 750;
  line-height: 1.35;
}
.public-service-select {
  display: block;
  min-width: 0;
}
.public-service-select summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  min-height: 54px;
  padding: .7rem .82rem;
  border: 1px solid #dbe7f6;
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
  list-style: none;
}
.public-service-select summary::-webkit-details-marker {
  display: none;
}
.public-service-select summary > span {
  min-width: 0;
  text-transform: none;
  letter-spacing: 0;
}
.public-service-select summary i {
  flex: 0 0 auto;
  color: #2563eb;
  transition: transform .18s ease;
}
.public-service-select[open] summary i {
  transform: rotate(180deg);
}
.public-service-options {
  display: grid;
  gap: .5rem;
  margin-top: .6rem;
  min-height: 0;
}
.public-service-options label {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .65rem .7rem;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
}
.public-service-options label.is-selected {
  border-color: #bfdbfe;
  background: #eff6ff;
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .12);
}
.public-service-options input {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  accent-color: #2563eb;
}
.public-service-options label > span {
  min-width: 0;
  display: grid;
  gap: .08rem;
}
.public-service-options label > span {
  text-transform: none;
  letter-spacing: 0;
}
.public-step {
  padding-top: .8rem;
  border-top: 1px solid #eef2f7;
}
.public-client-fields.public-step {
  padding-top: .75rem;
  border-top: 0;
}
.public-date-form {
  display: grid;
  gap: .38rem;
  margin-bottom: .95rem;
}
.public-date-form .input {
  width: 100%;
  max-width: 100%;
  justify-self: center;
  min-height: 46px;
}
.public-date-form label,
.public-slots > span {
  color: #0f172a;
  font-size: .85rem;
  font-weight: 800;
}
.public-slot-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
  margin: .55rem 0 .9rem;
}
.public-slot-grid.is-single {
  grid-template-columns: minmax(0, 1fr);
}
.public-slot-grid.is-balanced {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.public-slot-grid.is-dense {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.public-slot-grid input {
  position: absolute;
  opacity: 0;
}
.public-slot-grid label:only-child {
  max-width: none;
}
.public-slot-grid span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border: 1px solid #dbe4f0;
  border-radius: 16px;
  color: #1e3a8a;
  background: #fff;
  font-weight: 800;
  transition: all .22s ease;
}
.public-slot-grid input:checked + span {
  border-color: #15803d;
  background: #ecfdf5;
  color: #166534;
  box-shadow: 0 0 0 4px rgba(22, 101, 52, .12);
}
.public-empty-slots {
  margin: .5rem 0 1rem;
  padding: 1rem;
  border-radius: 16px;
  color: #64748b;
  background: #f8fafc;
}
.public-confirm-btn {
  width: 100%;
  margin-top: .8rem;
  padding: 1rem 1.15rem;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.public-schedule-state {
  display: grid;
  justify-items: center;
  text-align: center;
  padding: 1.45rem 1rem;
  animation: publicFadeUp .42s ease both;
}
.public-schedule-icon {
  width: 64px;
  height: 64px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  background: linear-gradient(135deg, #d1fae5, #bbf7d0);
  color: #047857;
  font-size: 1.65rem;
  margin-bottom: .8rem;
  box-shadow: 0 14px 30px rgba(4, 120, 87, .14);
  animation: publicSuccessPop .46s cubic-bezier(.2, .9, .22, 1.25) both;
}
.public-schedule-icon-warn {
  background: #fff7ed;
  color: #c2410c;
}
.public-schedule-state h1 {
  margin: 0 0 .35rem;
  color: #0f172a;
  font-size: clamp(1.7rem, 5.6vw, 2.25rem);
  line-height: 1.08;
  letter-spacing: -0.02em;
}
.public-success-heading {
  margin: 0 0 .35rem;
  letter-spacing: 0;
}
.public-success-copy {
  margin: 0;
  color: #475569;
  font-size: .96rem;
  line-height: 1.42;
}
.public-schedule-success {
  align-content: center;
  gap: 0;
  padding: 0;
}
.public-schedule-success .public-schedule-icon {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  font-size: 1.36rem;
  margin-bottom: .62rem;
}
.public-schedule-success h1 {
  max-width: 340px;
  font-size: clamp(1.72rem, 5vw, 2.08rem);
  line-height: 1.05;
}
.public-success-details {
  width: 100%;
  min-width: 0;
  display: grid;
  gap: .48rem;
  margin: .76rem 0 .68rem;
  padding: .54rem;
  border: 1px solid #e5edf7;
  border-radius: 16px;
  background: #f8fafc;
}
.public-detail-item {
  display: flex;
  align-items: center;
  gap: .62rem;
  min-height: 0;
  min-width: 0;
  padding: .58rem .62rem;
  border-radius: 13px;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(226, 232, 240, .75);
}
.public-detail-icon {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background: #eff6ff;
  color: #0f172a;
  font-size: .86rem;
  flex: 0 0 auto;
}
.public-detail-text {
  min-width: 0;
  display: grid;
  gap: .1rem;
  text-align: left;
}
.public-detail-label {
  color: #64748b;
  font-size: .64rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
}
.public-detail-value {
  display: block;
  max-width: 100%;
  color: #0f172a;
  font-size: .9rem;
  line-height: 1.2;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.public-detail-text small {
  display: block;
  max-width: 100%;
  color: #64748b;
  font-size: .76rem;
  line-height: 1.26;
  overflow-wrap: anywhere;
}
.public-success-note {
  color: #64748b;
  font-size: .86rem;
  line-height: 1.42;
}
.public-success-note p {
  margin: .12rem 0 0;
}
@media (max-width: 520px) {
  .public-schedule-page {
    display: block;
    min-height: 100svh;
    align-items: initial;
    place-items: initial;
    padding:
      max(.62rem, calc(.5rem + env(safe-area-inset-top)))
      .62rem
      max(5.25rem, calc(4rem + env(safe-area-inset-bottom)));
    overflow: visible;
    -webkit-overflow-scrolling: touch;
  }
  @supports (min-height: 100dvh) {
    .public-schedule-page {
      min-height: 100dvh;
    }
  }
  .public-schedule-card {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    overflow: visible;
    padding: .95rem;
    padding-bottom: max(1.25rem, calc(1rem + env(safe-area-inset-bottom)));
    border-radius: 24px;
  }
  .public-schedule-page-success {
    min-height: min(100vh, 680px);
    min-height: min(100svh, 680px);
    padding: .72rem .62rem calc(.85rem + env(safe-area-inset-bottom));
  }
  .public-schedule-card-success,
  .public-schedule-card:has(.public-schedule-success) {
    width: min(360px, calc(100vw - 1.24rem));
    max-height: calc(100svh - 1.57rem - env(safe-area-inset-bottom));
    padding: .9rem;
    border-radius: 22px;
  }
  .public-schedule-success {
    min-height: auto;
    padding: 0;
  }
  @supports (min-height: 100dvh) {
    .public-schedule-success {
      min-height: auto;
    }
  }
  .public-schedule-success .public-schedule-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    font-size: 1.18rem;
    margin-bottom: .5rem;
  }
  .public-schedule-success h1 {
    max-width: 300px;
    font-size: clamp(1.38rem, 6.8vw, 1.8rem);
    line-height: 1.07;
    margin-bottom: .3rem;
  }
  .public-success-copy {
    max-width: 300px;
    font-size: .84rem;
    line-height: 1.36;
  }
  .public-success-details {
    gap: .4rem;
    margin: .62rem 0 .54rem;
    padding: .45rem;
    border-radius: 15px;
  }
  .public-detail-item {
    gap: .55rem;
    padding: .5rem .54rem;
    border-radius: 12px;
  }
  .public-detail-icon {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    font-size: .8rem;
  }
  .public-detail-label {
    font-size: .6rem;
  }
  .public-detail-value {
    font-size: .84rem;
    line-height: 1.16;
  }
  .public-detail-text small {
    font-size: .72rem;
    line-height: 1.24;
  }
  .public-success-note {
    font-size: .78rem;
    line-height: 1.34;
  }
  .public-schedule-head {
    gap: .72rem;
    padding-bottom: .72rem;
  }
  .public-schedule-head img,
  .public-schedule-logo {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }
  .public-schedule-head span {
    font-size: .7rem;
    letter-spacing: .055em;
  }
  .public-schedule-head h1 {
    margin-top: .1rem;
    font-size: 1.25rem;
    line-height: 1.14;
  }
  .public-client-fields.public-step {
    padding-top: .62rem;
    margin-bottom: .58rem;
  }
  .public-client-fields {
    gap: .52rem;
    margin-bottom: .58rem;
  }
  .public-client-fields .field {
    gap: .26rem;
    margin-bottom: 0;
  }
  .public-client-fields .field label,
  .public-date-form label,
  .public-slots > span {
    font-size: .8rem;
    line-height: 1.15;
  }
  .public-client-fields .input {
    min-height: 44px;
    padding: .58rem .72rem;
    font-size: .98rem;
    border-radius: 13px;
  }
  .public-step {
    padding-top: .62rem;
  }
  .public-service-summary {
    gap: .24rem;
    margin: .52rem 0;
    padding: .68rem;
    border-radius: 15px;
  }
  .public-service-summary > span {
    font-size: .68rem;
    letter-spacing: .055em;
  }
  .public-service-summary strong {
    font-size: 1rem;
    line-height: 1.18;
  }
  .public-service-summary small {
    font-size: .75rem;
    line-height: 1.2;
  }
  .public-service-select summary {
    min-height: 46px;
    padding: .58rem .68rem;
    border-radius: 13px;
  }
  .public-service-select summary i {
    font-size: .9rem;
  }
  .public-service-options {
    gap: .42rem;
    margin-top: .5rem;
  }
  .public-service-select[open] .public-service-options {
    max-height: 320px;
    max-height: min(42dvh, 320px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-right: .12rem;
  }
  .public-service-options label {
    position: relative;
    grid-template-columns: 20px minmax(0, 1fr);
    padding: .58rem .64rem;
    border-radius: 12px;
  }
  .public-service-options label.is-selected::after {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: .68rem;
    top: 50%;
    transform: translateY(-50%);
    color: #2563eb;
    font-size: .78rem;
  }
  .public-service-options label.is-selected span {
    padding-right: 1.15rem;
  }
  .public-date-form {
    gap: .3rem;
    margin-bottom: .62rem;
    min-width: 0;
  }
  .public-date-form .input {
    min-height: 42px;
    padding: .5rem .68rem;
    border-radius: 13px;
    font-size: .96rem;
  }
  .public-empty-slots {
    margin: .42rem 0 .66rem;
    padding: .72rem .82rem;
    border-radius: 14px;
    font-size: .9rem;
    line-height: 1.34;
  }
  .public-confirm-btn {
    position: sticky;
    bottom: max(.72rem, calc(.55rem + env(safe-area-inset-bottom)));
    z-index: 10;
    min-height: 48px;
    margin-top: .56rem;
    padding: .82rem 1rem;
    border-radius: 15px;
    line-height: 1.15;
    box-shadow: 0 14px 34px rgba(37, 99, 235, .24);
  }
  .public-schedule-form {
    min-width: 0;
    padding-bottom: 1rem;
  }
  .public-slot-grid {
    gap: .42rem;
    margin: .45rem 0 .58rem;
  }
  .public-slot-grid.is-single {
    grid-template-columns: minmax(0, 1fr);
  }
  .public-slot-grid.is-balanced {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .public-slot-grid.is-dense {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .public-slot-grid span {
    min-height: 40px;
    border-radius: 12px;
    font-size: .86rem;
  }
}
@media (max-width: 520px) and (max-height: 700px) {
  .public-service-select[open] .public-service-options {
    max-height: 240px;
    max-height: min(34dvh, 240px);
  }
}
@media (min-width: 521px) {
  .public-slot-grid.is-dense {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@keyframes publicFadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes publicSuccessPop {
  from { opacity: 0; transform: scale(.88); }
  to { opacity: 1; transform: scale(1); }
}

.tabs { display: flex; gap: .25rem; border-bottom: 1px solid var(--ink-100); margin-bottom: 1rem; overflow-x: auto; }
.tab {
  padding: .6rem .9rem; color: var(--ink-500); font-weight: 600; font-size: .9rem;
  border-bottom: 2px solid transparent; cursor: pointer; white-space: nowrap;
}
.tab.is-active { color: var(--blue-700); border-color: var(--blue-600); }

/* ======================= Tooltips + Modals ======================= */
.module-info-btn {
  position: relative; z-index: 2;
  width: 18px; height: 18px;
  border: 0; border-radius: 999px;
  background: transparent; color: var(--ink-500);
  cursor: pointer;
  font-size: .78rem; line-height: 18px; padding: 0; margin-left: .12rem;
  text-align: center;
  transition: background .14s ease, color .14s ease;
}
.module-info-btn:hover,
.module-info-btn[aria-expanded="true"] {
  background: var(--blue-50);
  color: var(--blue-700);
}
.module-tooltip {
  position: fixed; z-index: 90; max-width: 320px;
  background: #fff; border: 1px solid #e5ebf7; border-radius: 12px;
  box-shadow: 0 16px 36px rgba(15, 23, 42, .13);
  padding: .7rem .78rem; pointer-events: auto;
  opacity: 0; transform: translateY(6px) scale(.98);
  transition: opacity .14s ease, transform .14s ease;
}
.module-tooltip.is-visible { opacity: 1; transform: translateY(0) scale(1); }
.module-tooltip::after {
  content: ""; position: absolute; left: -6px; top: 18px; width: 10px; height: 10px;
  background: #fff; border-left: 1px solid #e5ebf7; border-bottom: 1px solid #e5ebf7;
  transform: rotate(45deg);
}
.module-tooltip-title { font-size: .9rem; font-weight: 800; color: var(--ink-900); margin-bottom: .28rem; }
.module-tooltip-text { font-size: .78rem; color: var(--ink-700); margin-bottom: .34rem; line-height: 1.4; }
.module-tooltip-key { font-weight: 700; color: var(--ink-800); }
.module-tooltip ul { margin: .22rem 0 .34rem .9rem; padding: 0; }
.module-tooltip li { font-size: .76rem; color: var(--ink-700); margin-bottom: .12rem; line-height: 1.35; }

.module-help-modal {
  position: fixed; inset: 0; z-index: 70; background: rgba(15, 23, 42, .45);
  display: none; align-items: center; justify-content: center; padding: 1rem;
}
.module-help-modal.is-open { display: flex; }
.module-help-modal-card {
  width: min(560px, 100%); background: #fff; border-radius: 16px;
  box-shadow: var(--shadow-lg); border: 1px solid var(--ink-100); padding: 1rem;
  max-height: calc(100vh - 2rem); overflow: auto;
}
.module-help-modal-close {
  float: right; border: 0; background: transparent; color: var(--ink-500);
  font-size: 1.05rem; cursor: pointer;
}

/* ======================= Clientes: premium minimal ======================= */
.card-flat {
  padding: 0;
  background: white;
  border: 1px solid var(--ink-100);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

/* Dropdown menu */
.menu { position: relative; display: inline-block; }
.menu > .btn .menu-caret { font-size: .65rem; margin-left: .25rem; opacity: .6; }
.menu-pop {
  position: absolute; top: calc(100% + .35rem); left: 0;
  min-width: 200px; background: #fff;
  border: 1px solid var(--ink-100); border-radius: 12px;
  box-shadow: var(--shadow-lg);
  padding: .35rem;
  opacity: 0; transform: translateY(-4px) scale(.98);
  pointer-events: none;
  transition: opacity .14s ease, transform .14s ease;
  z-index: 50;
}
.menu-pop-right { left: auto; right: 0; }
.menu.is-open > .menu-pop {
  opacity: 1; transform: translateY(0) scale(1); pointer-events: auto;
}
.menu-pop a,
.menu-pop button {
  display: flex; align-items: center; gap: .55rem;
  width: 100%; text-align: left;
  padding: .55rem .7rem; border: 0; background: transparent;
  font: 500 .88rem "Inter", sans-serif; color: var(--ink-800);
  border-radius: 8px; cursor: pointer;
  text-decoration: none;
}
.menu-pop a:hover,
.menu-pop button:hover { background: var(--ink-50); color: var(--ink-900); }
.menu-pop button:disabled {
  color: var(--ink-400);
  cursor: not-allowed;
  opacity: .7;
}
.menu-pop button:disabled:hover {
  background: transparent;
  color: var(--ink-400);
}
.menu-pop a.is-active {
  background: var(--blue-50); color: var(--blue-700);
}
.menu-pop i { width: 14px; text-align: center; color: var(--ink-400); }
.menu-pop a.is-active i,
.menu-pop a:hover i,
.menu-pop button:hover i { color: inherit; }
.menu-dot {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--blue-600); margin-left: .15rem;
}

/* Search compact */
.search-sm { min-width: 200px; padding: .2rem .55rem .2rem .75rem; border-radius: 10px; }
.search-sm input { font-size: .88rem; padding: .35rem 0; }

/* Clientes: toolbar enxuta */
.clientes-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .5rem;
  min-width: 0;
  width: 100%;
}
.clientes-primary-btn,
.clientes-icon-btn {
  min-height: 40px;
  height: 40px;
  border-radius: 12px;
}
.clientes-primary-btn {
  padding-inline: .85rem;
  box-shadow: var(--shadow-sm);
  white-space: nowrap;
}
.clientes-search {
  min-width: 190px;
  width: clamp(190px, 22vw, 280px);
  height: 40px;
  padding: 0 .75rem;
  border-radius: 12px;
  box-shadow: none;
}
.clientes-search input {
  padding: 0;
  font-size: .9rem;
}
.clientes-icon-btn {
  position: relative;
  width: 40px;
  min-width: 40px;
  padding: 0;
  justify-content: center;
  color: var(--ink-700);
}
.clientes-icon-btn .menu-dot {
  position: absolute;
  top: 8px;
  right: 8px;
  margin: 0;
  box-shadow: 0 0 0 2px white;
}

/* Filter chips */
.filter-chips {
  display: flex; flex-wrap: wrap; gap: .4rem;
  padding: .75rem 1rem; border-bottom: 1px solid var(--ink-100);
  background: #fbfcfd;
}
.chip {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .28rem .65rem; border-radius: 999px;
  background: white; border: 1px solid var(--ink-200);
  font-size: .78rem; color: var(--ink-700);
  text-decoration: none; transition: all .15s;
}
.chip i { font-size: .7rem; color: var(--ink-400); }
.chip:hover { border-color: var(--ink-300); color: var(--ink-900); }
.chip:hover i { color: var(--ink-700); }

/* Clean table */
.table-clean { border: 0; border-radius: 0; box-shadow: none; }
.table-clean .table th {
  background: transparent; border-bottom: 1px solid var(--ink-100);
  text-transform: none; letter-spacing: 0;
  font-size: .78rem; font-weight: 600; color: var(--ink-400);
  padding: .9rem 1.1rem;
}
.table-clean .table td { padding: .95rem 1.1rem; border-top: 1px solid var(--ink-100); }
.table-clean .table tbody tr:first-child td { border-top: 0; }
.table-clean .table tbody tr:hover { background: #fbfcfd; }
.cell-main { font-weight: 600; color: var(--ink-900); font-size: .92rem; }
.cell-soft { color: var(--ink-500); font-size: .88rem; }

.table-footer {
  padding: .65rem 1.1rem; border-top: 1px solid var(--ink-100);
  font-size: .78rem; background: #fbfcfd;
}

/* Icon buttons (ações da tabela) */
.icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 8px;
  border: 1px solid transparent; background: transparent;
  color: var(--ink-500); cursor: pointer; text-decoration: none;
  transition: all .15s;
}
.icon-btn:hover {
  background: var(--ink-50); color: var(--ink-900); border-color: var(--ink-100);
}
.icon-btn.icon-wa { color: #16a34a; }
.icon-btn.icon-wa:hover { background: #dcfce7; color: #15803d; border-color: #bbf7d0; }
.icon-btn.icon-danger:hover { background: #fee2e2; color: #b91c1c; border-color: #fecaca; }

/* Modal — variant moderna */
.modal-title { margin: 0 0 1rem; font-size: 1.05rem; color: var(--ink-900); }
.modal-actions {
  display: flex; justify-content: flex-end; gap: .5rem;
  margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--ink-100);
}

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

@media (max-width: 760px) {
  .search-sm { min-width: 0; flex: 1; }
  .menu-pop { min-width: 180px; }
  .menu-pop-right { right: auto; left: 0; }
  .clientes-toolbar {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .clientes-search {
    flex: 1 1 220px;
    width: auto;
  }
}

/* ======================= Agenda: premium ======================= */

/* KPIs */
.kpi-row {
  display: grid; gap: 1rem; margin-bottom: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.kpi-card {
  display: flex; align-items: center; gap: .9rem;
  padding: 1rem 1.1rem; border-radius: var(--radius);
  background: white; border: 1px solid var(--ink-100);
  box-shadow: var(--shadow-sm);
  position: relative; overflow: hidden;
  transition: transform .2s, box-shadow .2s;
}
.kpi-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.kpi-card::before {
  content: ""; position: absolute; top: 0; left: 0; width: 3px; height: 100%;
  background: var(--kpi-color, var(--blue-500));
}
.kpi-icon {
  width: 42px; height: 42px; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.05rem; color: var(--kpi-color, var(--blue-600));
  background: var(--kpi-bg, var(--blue-50));
}
.kpi-body { flex: 1; min-width: 0; }
.kpi-label { font-size: .75rem; color: var(--ink-400); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.kpi-value { font-size: 1.55rem; font-weight: 700; color: var(--ink-900); margin-top: .15rem; }
.kpi-blue   { --kpi-color: var(--blue-600);   --kpi-bg: var(--blue-50); }
.kpi-green  { --kpi-color: var(--success);    --kpi-bg: var(--success-soft); }
.kpi-red    { --kpi-color: var(--danger);     --kpi-bg: var(--danger-soft); }
.kpi-amber  { --kpi-color: #d97706;           --kpi-bg: var(--warning-soft); }
.kpi-purple { --kpi-color: #7c3aed;           --kpi-bg: #ede9fe; }

/* Toolbar */
.agenda-toolbar {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem;
}
.view-switch {
  display: inline-flex; background: white; border: 1px solid var(--ink-200);
  border-radius: 10px; padding: 3px; gap: 2px;
  min-height: 40px;
  box-sizing: border-box;
}
.view-switch .vs-item {
  padding: .4rem .95rem; border-radius: 8px;
  font: 600 .85rem "Inter", sans-serif;
  color: var(--ink-500); text-decoration: none; transition: all .15s;
}
.view-switch .vs-item:hover { color: var(--ink-900); }
.view-switch .vs-item.is-active {
  background: var(--blue-50); color: var(--blue-700); box-shadow: var(--shadow-sm);
}
.nav-range {
  display: inline-flex; align-items: center; gap: .5rem;
  background: white; border: 1px solid var(--ink-200);
  border-radius: 10px; padding: .25rem .55rem;
  min-height: 40px;
  box-sizing: border-box;
}
.nav-label {
  font: 600 .9rem "Inter", sans-serif; color: var(--ink-900);
  min-width: 220px; text-align: center;
}
/* Agenda: alinhamento idêntico entre seletor de visão e navegação */
.agenda-toolbar-equal {
  align-items: stretch;
}
.agenda-toolbar-equal > .agenda-toolbar-box {
  margin-top: 0 !important;
  align-self: stretch;
  height: 40px;
  min-height: 40px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}
.agenda-toolbar-equal .view-switch {
  padding: 3px;
}
.agenda-toolbar-equal .view-switch .vs-item {
  display: inline-flex;
  align-items: center;
  height: 100%;
}
.agenda-toolbar-equal .nav-range {
  padding-top: 3px;
  padding-bottom: 3px;
}

.agenda-card { padding: 0; overflow: hidden; }

/* Tons de evento */
.tone-blue   { --tone: var(--blue-600);  --tone-bg: var(--blue-50);    --tone-soft: #e0ebff; }
.tone-green  { --tone: var(--success);   --tone-bg: var(--success-soft); --tone-soft: #bbf7d0; }
.tone-yellow { --tone: #b45309;          --tone-bg: var(--warning-soft); --tone-soft: #fde68a; }
.tone-red    { --tone: var(--danger);    --tone-bg: var(--danger-soft);  --tone-soft: #fecaca; }
.tone-gray   { --tone: var(--ink-500);   --tone-bg: var(--ink-100);      --tone-soft: var(--ink-200); }

/* ========== Calendário Mensal ========== */
.calendar { padding: 1rem; }
.cal-head {
  display: grid; grid-template-columns: repeat(7, 1fr);
  font: 700 .75rem "Inter", sans-serif;
  text-transform: uppercase; color: var(--ink-400);
  letter-spacing: .05em; padding: 0 .15rem .6rem;
}
.cal-head div { text-align: center; }
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .45rem;
}
.cal-day {
  min-height: 118px;
  background: #fbfcfd;
  border: 1px solid var(--ink-100);
  border-radius: 12px;
  padding: .55rem;
  cursor: pointer;
  transition: background .15s, border-color .15s, box-shadow .15s, transform .15s;
  display: flex;
  flex-direction: column;
  gap: .38rem;
  min-width: 0;
}
.cal-day:hover { background: white; border-color: var(--blue-500); box-shadow: var(--shadow-sm); }
.cal-day.is-out { opacity: .45; }
.cal-day.is-today {
  background: var(--blue-50); border-color: var(--blue-500);
}
.cal-day.is-today .cal-day-num { color: var(--blue-700); }
.cal-day-top {
  display: flex; justify-content: space-between; align-items: center;
}
.cal-day-num { font-size: .85rem; font-weight: 600; color: var(--ink-700); }
.cal-day-count {
  background: var(--blue-600); color: white; font-size: .68rem; font-weight: 700;
  padding: 1px 7px; border-radius: 999px;
}
.cal-day-events { display: flex; flex-direction: column; gap: .24rem; min-width: 0; }
.cal-event {
  display: flex; gap: .35rem; align-items: center;
  min-height: 22px;
  padding: .2rem .42rem; border-radius: 7px;
  background: var(--tone-bg); color: var(--tone);
  font-size: .7rem; font-weight: 600;
  border-left: 2px solid var(--tone);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  min-width: 0;
}
.cal-event-time { font-variant-numeric: tabular-nums; opacity: .88; font-size: .66rem; flex: 0 0 auto; }
.cal-event-title { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cal-event-more {
  width: fit-content;
  font-size: .68rem;
  font-weight: 700;
  color: var(--blue-700);
  background: var(--blue-50);
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: .12rem .45rem;
  margin-top: .04rem;
}

/* ========== Semana ========== */
.week-grid {
  --week-hour-col: 70px;
  --week-day-min: 150px;
  --week-hour-height: 76px;
  display: flex;
  flex-direction: column;
}
.week-scroll {
  max-height: calc(100vh - 235px);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.week-head {
  display: grid;
  grid-template-columns: var(--week-hour-col) repeat(7, minmax(var(--week-day-min), 1fr));
  border-bottom: 1px solid var(--ink-100); background: #fbfcfd;
  position: sticky;
  top: 0;
  z-index: 3;
  min-width: calc(var(--week-hour-col) + (7 * var(--week-day-min)));
}
.wg-corner { border-right: 1px solid var(--ink-100); }
.wg-day {
  text-align: center; padding: .6rem .3rem;
  border-right: 1px solid var(--ink-100);
}
.wg-day:last-child { border-right: 0; }
.wg-day-name { font-size: .72rem; color: var(--ink-400); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.wg-day-num  { font-size: .95rem; color: var(--ink-900); font-weight: 600; }
.wg-day.is-today .wg-day-num { color: var(--blue-700); }
.wg-day.is-today .wg-day-name { color: var(--blue-600); }
.week-body {
  display: grid;
  grid-template-columns: var(--week-hour-col) repeat(7, minmax(var(--week-day-min), 1fr));
  min-width: calc(var(--week-hour-col) + (7 * var(--week-day-min)));
  --week-hours-count: 17;
}
.wg-hours { border-right: 1px solid var(--ink-100); background: #fbfcfd; }
.wg-hour {
  height: var(--week-hour-height); padding: .55rem 8px 0;
  font-size: .7rem; color: var(--ink-400); font-variant-numeric: tabular-nums;
  border-bottom: 1px dashed var(--ink-100);
  box-sizing: border-box;
}
.wg-col {
  position: relative; border-right: 1px solid var(--ink-100); cursor: pointer;
  min-width: 0;
  height: calc(var(--week-hour-height) * var(--week-hours-count));
  transition: background .15s;
}
.wg-col:last-child { border-right: 0; }
.wg-col:hover { background: #fbfcfd; }
.wg-slot {
  height: var(--week-hour-height);
  border-bottom: 1px dashed var(--ink-100);
  padding: 0;
  box-sizing: border-box;
}
.wg-slot:hover { background: rgba(37, 99, 235, .025); }
.wg-slot-events {
  display: contents;
}
.wg-event {
  position: absolute;
  z-index: 2;
  box-sizing: border-box;
  background: var(--tone-bg); color: var(--tone);
  border: 1px solid var(--tone-soft);
  border-left: 3px solid var(--tone);
  border-radius: 8px;
  padding: .34rem .46rem;
  font-size: .72rem;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
  overflow: hidden;
  transition: transform .15s, box-shadow .15s, filter .15s;
}
.wg-event:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
  filter: saturate(1.05);
}
.wg-event-time { font-weight: 800; font-size: .66rem; opacity: .92; font-variant-numeric: tabular-nums; margin-bottom: .04rem; }
.wg-event-title { font-weight: 700; color: var(--ink-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wg-event-sub { color: var(--ink-500); font-size: .67rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: .06rem; }
.wg-event.is-compact .wg-event-sub {
  display: none;
}

/* ========== Dia (Timeline) ========== */
.day-timeline {
  --day-hour-col: 70px;
  height: 100%;
  padding: 0 1rem 1rem;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  position: relative;
}
.agenda-day-layout {
  --agenda-day-panel-height: clamp(520px, calc(100vh - 260px), 620px);
  align-items: stretch;
}
.agenda-day-layout > .card {
  margin-top: 0 !important;
  align-self: stretch !important;
}
.agenda-day-timeline-card {
  height: var(--agenda-day-panel-height) !important;
  overflow: hidden !important;
}
.agenda-day-timeline-card .day-timeline {
  overflow-y: auto !important;
}
.agenda-day-list-card {
  height: var(--agenda-day-panel-height) !important;
  overflow: hidden !important;
}
.agenda-day-list-card .daypanel-inline {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.agenda-day-list-card .daypanel-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  max-height: none;
  padding-right: .35rem;
  overscroll-behavior: contain;
}
.dt-row {
  display: grid; grid-template-columns: var(--day-hour-col) 1fr;
  border-bottom: 1px dashed var(--ink-100);
  min-height: 88px;
  box-sizing: border-box;
}
.dt-hour {
  padding: .68rem .25rem 0; font-size: .78rem; color: var(--ink-400);
  font-weight: 600; font-variant-numeric: tabular-nums;
}
.dt-slot {
  padding: .42rem 0 .5rem;
  overflow: visible;
  display: flex;
  flex-direction: column;
  gap: .46rem;
  min-width: 0;
}
.dt-event {
  position: relative;
  background: var(--tone-bg); border-left: 3px solid var(--tone);
  border-radius: 10px; padding: .48rem .72rem; margin-bottom: 0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
  box-sizing: border-box;
  overflow: hidden;
  min-height: 66px;
}
.dt-event-head { display: flex; justify-content: space-between; gap: .65rem; align-items: center; margin-bottom: .18rem; color: var(--tone); font-variant-numeric: tabular-nums; line-height: 1.2; }
.dt-event-head strong { font-size: .92rem; }
.dt-event-title { font-weight: 700; color: var(--ink-900); font-size: .92rem; line-height: 1.25; }
.dt-event-sub { color: var(--ink-500); font-size: .8rem; margin-top: .16rem; line-height: 1.25; }

/* ========== Painel do dia (drawer + inline) ========== */
.daypanel-inline { padding: 1rem 1.1rem 1.2rem; }
.daypanel-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 1rem; padding-bottom: .8rem; border-bottom: 1px solid var(--ink-100);
  margin-bottom: .8rem;
}
.daypanel-list { display: flex; flex-direction: column; gap: .55rem; }

.agenda-day-list-card .daypanel-head {
  flex-shrink: 0;
}
.agenda-day-list-card .daypanel-list {
  gap: .48rem;
}
.agenda-day-list-card .ag-item {
  grid-template-columns: 62px 1fr;
  gap: .55rem;
  padding: .56rem .68rem;
  border-radius: 10px;
}
.agenda-day-list-card .ag-item-head {
  margin-bottom: .08rem;
}
.agenda-day-list-card .ag-item-title {
  font-size: .88rem;
}
.agenda-day-list-card .ag-item-sub {
  font-size: .74rem;
}
.agenda-day-list-card .ag-item-value {
  margin-top: .06rem;
  font-size: .78rem;
}
.agenda-day-list-card .ag-item-obs {
  margin-top: .25rem;
  padding: .28rem .45rem;
  font-size: .74rem;
}
.agenda-day-list-card .ag-item-actions {
  gap: .2rem;
  padding-top: 0;
}
.agenda-day-list-card .ag-item-actions .icon-btn {
  width: 28px;
  height: 28px;
}

.daypanel {
  position: fixed; inset: 0; z-index: 70;
  display: none; pointer-events: none;
}
.daypanel.is-open { display: block; pointer-events: auto; }
.daypanel-backdrop {
  position: absolute; inset: 0; background: rgba(15, 23, 42, .35);
  opacity: 0; transition: opacity .2s;
}
.daypanel.is-open .daypanel-backdrop { opacity: 1; }
.daypanel-aside {
  position: absolute; right: 0; top: 0; bottom: 0;
  width: min(420px, 100%); background: white;
  box-shadow: var(--shadow-lg);
  transform: translateX(100%); transition: transform .25s ease;
  display: flex; flex-direction: column; padding: 1rem 1.1rem;
  overflow: auto;
}
.daypanel.is-open .daypanel-aside { transform: translateX(0); }
.daypanel-close {
  position: absolute; top: .72rem; right: .9rem;
  width: 40px; height: 40px;
  border: 1px solid #e3eaf6;
  border-radius: 12px;
  background: rgba(255, 255, 255, .95);
  color: var(--ink-500);
  font-size: 1.35rem; line-height: 1;
  cursor: pointer; z-index: 2;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .06);
}
.daypanel-close:hover { color: var(--ink-900); background: #fff; }

/* Item de agendamento (lista) */
.ag-item {
  display: grid; grid-template-columns: 72px 1fr;
  gap: .75rem; align-items: flex-start;
  padding: .68rem .82rem; border-radius: 12px;
  background: #fbfcfd; border: 1px solid var(--ink-100);
  border-left: 3px solid var(--tone);
  transition: all .15s;
}
.ag-item:hover { background: white; box-shadow: var(--shadow-sm); }
.ag-item-time { font-size: .85rem; color: var(--tone); font-weight: 700; font-variant-numeric: tabular-nums; }
.ag-item-time .muted { font-size: .7rem; font-weight: 500; }
.ag-item-head {
  display: flex; justify-content: space-between; align-items: center;
  gap: .5rem; margin-bottom: .15rem;
}
.ag-item-body { display: flex; flex-direction: column; gap: .08rem; min-width: 0; }
.ag-item-title { font-weight: 600; color: var(--ink-900); font-size: .92rem; }
.ag-item-mainline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .45rem;
  margin-bottom: .08rem;
}
.ag-item-status { flex-shrink: 0; }
.ag-item-sub { color: var(--ink-500); font-size: .78rem; }
.ag-item-services {
  margin-top: .22rem;
  padding: .32rem .42rem .34rem;
  border-radius: 9px;
  background: #f8fbff;
  border: 1px solid #e4ecf8;
}
.ag-item-services-title {
  margin-bottom: .18rem;
  color: var(--ink-500);
  font-size: .62rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .025em;
}
.ag-item-services ul {
  display: flex;
  flex-direction: column;
  gap: .12rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ag-item-services li {
  display: grid;
  grid-template-columns: .5rem minmax(0, 1fr);
  align-items: baseline;
  gap: .22rem;
  min-width: 0;
  color: var(--ink-800);
  font-size: .78rem;
  line-height: 1.22;
}
.ag-item-service-bullet {
  color: var(--tone);
  font-size: .82rem;
  line-height: 1.2;
  font-weight: 900;
}
.ag-item-service-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .16rem .24rem;
  min-width: 0;
}
.ag-item-service-name {
  min-width: 0;
  color: var(--ink-900);
  font-size: .78rem;
  line-height: 1.18;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.ag-item-service-meta {
  color: var(--ink-500);
  font-size: .74rem;
  line-height: 1.18;
  font-weight: 700;
}
.ag-item-service-separator {
  color: #94a3b8;
  font-size: .72rem;
  font-weight: 850;
}
.ag-item-value {
  margin-top: .1rem;
  color: var(--ink-800);
  font-size: .82rem;
  font-weight: 600;
}
.ag-item-sub i { width: 12px; text-align: center; margin-right: .15rem; }
.ag-item-obs {
  margin-top: .35rem; font-size: .78rem;
  padding: .35rem .5rem; background: var(--ink-50); border-radius: 6px;
}
.ag-item-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: .28rem;
  padding-top: .05rem;
}

/* Alerta inline (conflito) */
.alert-inline {
  padding: .6rem .75rem; border-radius: 10px;
  background: var(--warning-soft); color: #92400e;
  font-size: .85rem; border: 1px solid #fde68a;
  display: flex; gap: .5rem; align-items: flex-start;
}
.alert-inline.is-error { background: var(--danger-soft); color: #991b1b; border-color: #fecaca; }
.alert-inline.alert-danger { background: var(--danger-soft); color: #991b1b; border-color: #fecaca; }
.alert-inline.alert-success { background: var(--success-soft); color: #166534; border-color: #bbf7d0; }
.config-alert { margin-bottom: 1rem; }

/* Form grids extras */
.form-grid-3 { grid-template-columns: repeat(3, 1fr); }

/* Responsivo */
@media (max-width: 900px) {
  .week-grid {
    --week-hour-col: 56px;
    --week-day-min: 112px;
  }
  .week-head,
  .week-body {
    grid-template-columns: var(--week-hour-col) repeat(7, minmax(var(--week-day-min), 1fr));
    min-width: calc(var(--week-hour-col) + (7 * var(--week-day-min)));
  }
  .form-grid-3 { grid-template-columns: 1fr 1fr; }
  .nav-label { min-width: auto; font-size: .85rem; }
  .wg-event { padding: .3rem .4rem; }
}
@media (max-width: 640px) {
  .calendar { padding: .65rem; }
  .cal-grid { gap: .28rem; }
  .cal-head { font-size: .66rem; padding-bottom: .45rem; }
  .cal-day { min-height: 82px; padding: .38rem; border-radius: 9px; }
  .cal-event-title { display: none; }
  .cal-event { justify-content: center; padding: 2px 4px; min-height: 20px; }
  .cal-event-more { font-size: .62rem; padding: .08rem .35rem; }
  .daypanel-aside {
    width: 100%;
    top: auto;
    max-height: min(82vh, 720px);
    border-radius: 24px 24px 0 0;
    padding: 1.3rem 1rem calc(1rem + env(safe-area-inset-bottom));
    transform: translateY(100%);
  }
  .daypanel.is-open .daypanel-aside { transform: translateY(0); }
  .daypanel .daypanel-head {
    padding-right: 3.1rem;
  }
  .daypanel-close {
    top: .85rem;
    right: .85rem;
  }
  .form-grid-3 { grid-template-columns: 1fr; }
  .ag-item { grid-template-columns: 56px 1fr; }
  .ag-item-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .ag-item-actions .icon-btn { width: 28px; height: 28px; }
  .ag-item-services {
    margin-top: .2rem;
    padding: .3rem .38rem;
  }
  .ag-item-services-title {
    margin-bottom: .14rem;
    font-size: .58rem;
  }
  .ag-item-services ul {
    gap: .1rem;
  }
  .ag-item-services li {
    grid-template-columns: .45rem minmax(0, 1fr);
    gap: .18rem;
    font-size: .74rem;
    line-height: 1.18;
  }
  .ag-item-service-line {
    gap: .12rem .2rem;
  }
  .ag-item-service-name {
    font-size: .76rem;
    line-height: 1.16;
  }
  .ag-item-service-meta {
    font-size: .7rem;
    line-height: 1.16;
  }
  .view-switch .vs-item { padding: .35rem .65rem; font-size: .8rem; }
}

/* ============================================================
   AGENDA INTELIGENTE — Insights, FAB, Lembretes, Espera, Sugestões
   ============================================================ */

/* Painel de insights (colapsável) */
.insights-panel {
  background: rgba(255, 255, 255, .86);
  border: 1px solid #e7edf7;
  border-radius: 16px;
  padding: .9rem 1.05rem;
  margin-bottom: 1rem;
  box-shadow: 0 1px 2px rgba(16,24,40,.025);
}
.insights-panel.insights-panel--agenda {
  background: rgba(255,255,255,.78);
  border-color: #e7edf6;
  box-shadow: 0 8px 18px rgba(15,23,42,.035);
}
.insights-panel > summary {
  display: flex; align-items: center; gap: .55rem;
  cursor: pointer; list-style: none; user-select: none;
  font-weight: 600; color: var(--ink-900); font-size: .9rem;
}
.insights-panel > summary::-webkit-details-marker { display: none; }
.insights-panel > summary::before {
  content: ""; display: inline-block;
  width: 0; height: 0;
  border-left: 5px solid var(--ink-400);
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  transition: transform .18s ease;
}
.insights-panel[open] > summary::before { transform: rotate(90deg); }
.insights-panel > summary .fa-lightbulb { color: #f59e0b; }
.insights-panel--agenda { padding: .95rem 1.1rem; }
.insights-panel--agenda > summary { flex-wrap: wrap; gap: .35rem .5rem; }
.insights-panel-title { font-weight: 600; }
.insights-panel-hint { margin-left: 0; font-size: .74rem; flex-basis: 100%; }
@media (min-width: 700px) {
  .insights-panel-hint { margin-left: auto; font-size: .78rem; flex-basis: auto; }
}
.insights-panel-lead { margin: .35rem 0 0; font-size: .8rem; line-height: 1.4; }

.insights-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: .8rem;
}
.insight-card {
  background: rgba(255,255,255,.78);
  border: 1px solid #e8eef8;
  border-radius: 14px;
  padding: .78rem .9rem;
  display: flex; flex-direction: column; gap: .35rem;
  transition: transform .15s ease, box-shadow .15s ease;
}
.insights-panel--agenda .insight-card {
  background: rgba(255,255,255,.72);
  border-color: #e7edf6;
}
.insight-card:hover { transform: translateY(-1px); box-shadow: 0 5px 12px rgba(16,24,40,.045); }
.insight-card.insight-money { background: linear-gradient(135deg, rgba(236,253,245,.45) 0%, rgba(255,255,255,.84) 76%); border-color: #c9f4dc; }
.insight-head { display:flex; align-items: center; justify-content: space-between; }
.insight-title { font-size: .78rem; color: var(--ink-600); font-weight: 600; display: inline-flex; align-items: center; gap: .4rem; }
.insight-title i { color: var(--brand); }
.insight-money .insight-title i { color: #059669; }
.insight-big { font-size: 1.4rem; font-weight: 700; color: var(--ink-900); line-height: 1.1; }
.insight-money .insight-big { color: #058066; }
.insight-sub { font-size: .78rem; color: var(--ink-500); display: inline-flex; align-items: center; gap: .4rem; flex-wrap: wrap; }

.agenda-recorrencia {
  border: 1px solid var(--ink-100);
  border-radius: 10px;
  background: #f8fafc;
  padding: 0 .65rem;
}
.agenda-recorrencia > summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .48rem 0;
  color: var(--blue-700);
  font-weight: 700;
  font-size: .82rem;
}
.agenda-recorrencia > summary::-webkit-details-marker { display: none; }
.agenda-recorrencia > summary i {
  font-size: .72rem;
  transition: transform .15s ease;
}
.agenda-recorrencia[open] > summary i { transform: rotate(45deg); }
.agenda-recorrencia-field { margin: .1rem 0 .65rem; }
.agenda-schedule-modal-card {
  width: min(760px, calc(100vw - 2rem));
}
.agenda-schedule-form {
  padding: .9rem 1rem 1rem;
}
.agenda-schedule-form .field {
  gap: .28rem;
  margin-bottom: .55rem;
}
.agenda-schedule-form .input,
.agenda-schedule-form .select {
  min-height: 40px;
  padding: .54rem .72rem;
  border-radius: 9px;
  font-size: .92rem;
}
.agenda-schedule-form .form-grid {
  gap: .55rem .75rem;
}
.agenda-services-field { gap: .4rem; }
.agenda-services-list {
  display: grid;
  gap: .42rem;
}
.agenda-service-row {
  display: flex;
  gap: .45rem;
  align-items: center;
}
.agenda-service-row .input {
  min-width: 0;
  flex: 1 1 auto;
}
.agenda-service-row .icon-btn {
  width: 38px;
  height: 38px;
  border-radius: 9px;
  align-self: center;
  flex: 0 0 38px;
}
.agenda-service-remove {
  color: var(--ink-500);
}
.agenda-add-service-inline {
  display: inline-flex;
  align-items: center;
  gap: .32rem;
  border: 0;
  background: transparent;
  color: var(--blue-700);
  font-size: .84rem;
  font-weight: 600;
  line-height: 1.2;
  padding: .1rem 0 0;
  cursor: pointer;
}
.agenda-add-service-inline:hover {
  color: var(--blue-800);
}
.agenda-manual-service-picker,
.agenda-manual-slots-field {
  display: none;
}
.agenda-manual-slots {
  min-width: 0;
}
.agenda-services-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
  margin: .05rem 0 .1rem;
}
.agenda-summary-item {
  border: 1px solid var(--ink-100);
  border-radius: 10px;
  background: #f8fafc;
  padding: .48rem .62rem;
  display: grid;
  gap: .08rem;
}
.agenda-summary-item span {
  color: var(--ink-500);
  font-size: .73rem;
  font-weight: 600;
}
.agenda-summary-item strong {
  color: var(--ink-900);
  font-size: .96rem;
}
.agenda-schedule-form .agenda-link-toggle {
  margin: 0;
  min-height: 40px;
  border: 1px solid var(--ink-100);
  background: #f8fafc;
  align-items: center;
  gap: .55rem;
  padding: .5rem .62rem;
  border-radius: 10px;
}
.agenda-schedule-form .agenda-link-toggle input {
  margin-top: 0;
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}
.agenda-schedule-form .agenda-link-toggle strong {
  font-size: .8rem;
  line-height: 1.25;
}
.agenda-schedule-form .agenda-link-toggle small {
  font-size: .7rem;
  line-height: 1.25;
  margin-top: .05rem;
}
.agenda-schedule-form .agenda-observacoes {
  min-height: 38px;
  max-height: 150px;
  resize: none;
  overflow-y: hidden;
  padding: .54rem .72rem;
  border-radius: 9px;
  font-size: .92rem;
  line-height: 1.35;
}
.agenda-schedule-modal-card .modal-head {
  padding: .9rem 1rem;
}
.agenda-schedule-modal-card .modal-foot {
  margin-top: .65rem;
  padding-top: .75rem;
}
@media (max-width: 720px) {
  .agenda-schedule-modal-card {
    width: min(100%, calc(100vw - 1rem));
    max-height: calc(100dvh - 1rem);
    border-radius: 14px;
  }
  .agenda-schedule-form {
    padding: .8rem;
  }
  .agenda-services-summary,
  .agenda-schedule-form .form-grid {
    grid-template-columns: 1fr;
  }
  .agenda-schedule-modal-card .modal-foot {
    position: sticky;
    bottom: -.8rem;
    background: #fff;
    padding-bottom: .8rem;
  }
  #agendaModalNovo .agenda-service-legacy-rows,
  #agendaModalNovo .agenda-add-service-inline {
    display: none !important;
  }
  #agendaModalNovo .agenda-manual-service-picker,
  #agendaModalNovo .agenda-manual-slots-field {
    display: block;
  }
  #agendaModalNovo .agenda-manual-service-select summary {
    min-height: 46px;
    padding: .58rem .68rem;
    border-radius: 13px;
  }
  #agendaModalNovo .agenda-manual-service-select summary strong {
    display: block;
    color: #0f172a;
    font-size: .96rem;
    line-height: 1.18;
    overflow-wrap: anywhere;
  }
  #agendaModalNovo .agenda-manual-service-options {
    gap: .42rem;
    margin-top: .5rem;
    max-height: 220px;
    overflow-y: auto;
    padding-right: .08rem;
    -webkit-overflow-scrolling: touch;
  }
  #agendaModalNovo .agenda-manual-service-options label {
    position: relative;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    padding: .58rem .64rem;
    border-radius: 12px;
  }
  #agendaModalNovo .agenda-manual-service-options label.is-selected::after {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: .68rem;
    top: 50%;
    transform: translateY(-50%);
    color: #2563eb;
    font-size: .78rem;
  }
  #agendaModalNovo .agenda-manual-service-options label.is-selected span {
    padding-right: 1.15rem;
  }
  #agendaModalNovo #agDataHoraWrap {
    display: none !important;
  }
  #agendaModalNovo .agenda-manual-slots-field {
    margin-bottom: .5rem;
  }
  #agendaModalNovo .agenda-manual-slots-field label {
    font-weight: 800;
  }
  #agendaModalNovo .agenda-manual-slots .public-slot-grid {
    gap: .42rem;
    margin: .44rem 0 .32rem;
  }
  #agendaModalNovo .agenda-manual-slots .public-slot-grid.is-dense {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #agendaModalNovo .agenda-manual-slots .public-slot-grid span {
    min-height: 40px;
    border-radius: 12px;
    font-size: .86rem;
  }
  #agendaModalNovo .agenda-manual-slots-empty {
    margin: .42rem 0 .3rem;
    padding: .72rem .82rem;
    border-radius: 14px;
    font-size: .86rem;
    line-height: 1.34;
  }
  #agendaModalNovo .agenda-services-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .44rem;
    margin: .1rem 0 .45rem;
  }
  #agendaModalNovo .agenda-summary-item {
    min-height: 48px;
    padding: .44rem .52rem;
    border-radius: 13px;
  }
  #agendaModalNovo .agenda-summary-item span {
    font-size: .66rem;
    line-height: 1;
  }
  #agendaModalNovo .agenda-summary-item strong {
    font-size: .9rem;
    line-height: 1.1;
  }
  #agendaModalNovo .agenda-observacoes {
    min-height: 44px;
    max-height: 88px;
  }
}
@media (max-width: 460px) {
  .agenda-add-service-inline {
    font-size: .81rem;
  }
}

.pill-delta {
  display: inline-flex; align-items: center; gap: .25rem;
  padding: 2px 8px; border-radius: 999px;
  background: var(--ink-100); color: var(--ink-700);
  font-size: .72rem; font-weight: 600;
}
.pill-delta.up { background: #dcfce7; color: #166534; }
.pill-delta.down { background: #fee2e2; color: #991b1b; }

.bar { height: 6px; background: var(--ink-100); border-radius: 999px; overflow: hidden; margin-top: .35rem; }
.bar-fill { height: 100%; background: linear-gradient(90deg, var(--brand), #60a5fa); border-radius: 999px; transition: width .3s ease; }

.insight-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .38rem; }
.insight-list li { display: flex; align-items: center; gap: .55rem; font-size: .82rem; }
.insight-list .rank {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--ink-100); color: var(--ink-700);
  font-size: .68rem; font-weight: 700;
}
.insight-list li:first-child .rank { background: #fef3c7; color: #92400e; }
.insight-list li:nth-child(2) .rank { background: #e0e7ff; color: #3730a3; }
.insight-list li:nth-child(3) .rank { background: #fce7f3; color: #9d174d; }
.insight-list .key { font-weight: 600; color: var(--ink-900); }

/* Central operacional de notificações */
.agenda-notification-btn {
  position: relative;
  overflow: visible;
}
.agenda-notification-badge {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2563eb;
  color: #fff;
  border: 2px solid #fff;
  font: 800 .68rem/1 "Inter", sans-serif;
  box-shadow: 0 5px 12px rgba(37,99,235,.22);
}
.agenda-notification-badge.is-hidden { display: none; }

.agenda-event-fresh-focus .mobile-agenda-event-card,
.agenda-event-fresh-focus.ag-item {
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .16), 0 14px 30px rgba(37, 99, 235, .16);
}

.agenda-notifications-backdrop {
  position: fixed;
  inset: 0;
  z-index: 88;
  background: rgba(15, 23, 42, .18);
  backdrop-filter: blur(2px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
}
.agenda-notifications-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}
.agenda-notifications-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 89;
  width: min(420px, calc(100vw - 18px));
  height: 100vh;
  background: rgba(255,255,255,.96);
  border-left: 1px solid #e4ebf7;
  box-shadow: -22px 0 46px rgba(15,23,42,.14);
  transform: translateX(104%);
  transition: transform .22s ease;
  display: flex;
  flex-direction: column;
}
.agenda-notifications-drawer.is-open { transform: translateX(0); }
.agenda-notifications-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.15rem 1.1rem .8rem;
  border-bottom: 1px solid #edf2fb;
}
.agenda-notifications-head h2 {
  margin: 0;
  font-size: 1rem;
  color: var(--ink-900);
}
.agenda-notifications-head p {
  margin: .18rem 0 0;
  font-size: .8rem;
  color: var(--ink-400);
}
.agenda-notifications-close {
  width: 32px;
  height: 32px;
  border: 1px solid #e3eaf6;
  border-radius: 10px;
  background: #fff;
  color: var(--ink-500);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.agenda-notifications-close:hover {
  background: var(--ink-50);
  color: var(--ink-900);
}
.agenda-notifications-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: .7rem .72rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.agenda-notification-item {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: .72rem;
  align-items: center;
  padding: .72rem .78rem;
  border: 1px solid #dfe9f7;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .05);
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.agenda-notification-item:hover,
.agenda-notification-item:focus-visible {
  background: #f8fbff;
  border-color: #cfe0f7;
  box-shadow: 0 10px 22px rgba(37, 99, 235, .08);
  outline: none;
}
.agenda-notification-item:active {
  transform: translateY(1px);
}
.agenda-notification-time {
  font: 900 1.08rem/1 "Inter", sans-serif;
  color: #1d4ed8;
  letter-spacing: 0;
  text-align: left;
}
.agenda-notification-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.agenda-notification-main strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.agenda-notification-title {
  font-size: .72rem;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0;
  font-weight: 800;
}
.agenda-notification-main .agenda-notification-client {
  font-size: .9rem;
  font-weight: 850;
  color: var(--ink-900);
}
.agenda-notification-main .agenda-notification-service {
  font-size: .8rem;
  font-weight: 650;
  color: var(--ink-700);
}
.agenda-notification-main span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .78rem;
  color: var(--ink-700);
}
.agenda-notification-main small,
.agenda-notification-muted {
  font-size: .72rem;
  color: var(--ink-400);
}
.agenda-notification-phone {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.agenda-notification-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.agenda-notification-whatsapp {
  min-height: 34px;
  padding: .38rem .62rem;
  border-color: #22c55e !important;
  background: #22c55e !important;
  color: #fff !important;
  box-shadow: none;
  white-space: nowrap;
}
.agenda-notification-whatsapp:hover {
  background: #16a34a !important;
  color: #fff !important;
}
.agenda-notification-edit-proxy {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.agenda-notifications-empty {
  min-height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .28rem;
  text-align: center;
  color: var(--ink-400);
}
.agenda-notifications-empty i {
  color: #22c55e;
  font-size: 1.35rem;
  margin-bottom: .2rem;
}
.agenda-notifications-empty strong {
  color: var(--ink-800);
  font-size: .9rem;
}
.agenda-notifications-empty span {
  font-size: .78rem;
}
.agenda-notifications-empty.is-hidden { display: none; }

/* FAB */
.fab {
  position: fixed; right: 1.1rem; bottom: 1.1rem;
  width: 58px; height: 58px; border-radius: 50%;
  background: linear-gradient(135deg, var(--brand), #60a5fa);
  color: #fff; border: none; cursor: pointer;
  box-shadow: 0 10px 24px rgba(59,130,246,.45), 0 4px 8px rgba(0,0,0,.08);
  display: none; align-items: center; justify-content: center;
  font-size: 1.35rem; z-index: 80;
  transition: transform .15s ease, box-shadow .15s ease;
}
.fab:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 14px 28px rgba(59,130,246,.5); }
.fab:active { transform: scale(.97); }
@media (max-width: 768px) { .fab { display: flex; } }
@media (max-width: 768px) {
  body.agenda-daypanel-open .main-panel-agenda .fab {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(12px) scale(.92) !important;
  }
}

/* Sugestões de horário */
.slot-suggest {
  background: #eff6ff; border: 1px dashed #93c5fd;
  border-radius: 10px; padding: .5rem .7rem;
  display: flex; flex-direction: column; gap: .4rem;
}
.slot-suggest .fa-wand-sparkles { color: var(--brand); }
.slot-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.slot-chip {
  padding: .32rem .7rem; border-radius: 999px;
  background: #fff; border: 1px solid #bfdbfe; color: var(--brand-dark, #1e40af);
  font-size: .78rem; font-weight: 600; cursor: pointer;
  transition: all .12s;
}
.slot-chip:hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.slot-chip.is-active { background: var(--brand); color: #fff; border-color: var(--brand); }

/* Bloqueios visualmente distintos */
.wg-event.is-blocked,
.dt-event.is-blocked {
  background-image: repeating-linear-gradient(
    45deg, transparent 0 6px, rgba(0,0,0,.04) 6px 12px
  );
  color: var(--ink-700) !important;
}

/* Menu dot (indicador de filtro ativo) */
.menu-dot {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--brand); margin-left: .15rem;
}

/* Badge purple/gray/yellow/blue completos (caso ainda não tenham) */
.badge.purple { background: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }

/* Drag & drop agenda */
.drag-event {
  cursor: grab;
  user-select: none;
  touch-action: none;
}
.drag-event:active { cursor: grabbing; }
.drag-event.is-dragging {
  opacity: .55;
  transform: scale(.98);
  box-shadow: 0 8px 18px rgba(0,0,0,.16);
}
.drop-target-active {
  outline: 2px dashed #60a5fa;
  outline-offset: -2px;
  background: rgba(96,165,250,.08) !important;
}
.toast-agenda {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 120;
  background: #0f172a;
  color: #fff;
  border-radius: 10px;
  padding: .6rem .8rem;
  font-size: .82rem;
  box-shadow: 0 10px 20px rgba(0,0,0,.2);
}
.toast-agenda.ok { background: #166534; }
.toast-agenda.err { background: #991b1b; }

/* Responsivo insights */
@media (max-width: 1100px) {
  .insights-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .insights-grid { grid-template-columns: 1fr; }
  .settings-subhead { align-items: flex-start; flex-direction: column; }
  .business-hours-row {
    grid-template-columns: 1fr;
  }
  .business-hours-times {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) 30px;
  }
  .business-hours-modal-card {
    max-height: calc(100vh - 1.3rem);
  }
  .agenda-notifications-drawer { width: 100vw; }
  .agenda-notification-item {
    grid-template-columns: 56px minmax(0, 1fr) auto;
    gap: .55rem;
    padding: .65rem .58rem;
  }
  .agenda-notification-action {
    grid-column: auto;
    justify-content: flex-end;
  }
  .agenda-notification-whatsapp {
    width: 34px;
    min-width: 34px;
    padding: 0;
    justify-content: center;
  }
  .agenda-notification-whatsapp i { margin: 0; }
  .agenda-notification-whatsapp {
    font-size: 0;
  }
  .agenda-notification-whatsapp i {
    font-size: .95rem;
  }
  .agenda-notification-time { font-size: 1rem; }
  .agenda-notification-main .agenda-notification-client { font-size: .84rem; }
  .agenda-notification-main .agenda-notification-service { font-size: .76rem; }
}

#editarPagamentoModal .agenda-payment-edit-card {
  width: min(430px, 100%) !important;
  max-width: calc(100vw - 2rem) !important;
  box-sizing: border-box !important;
}

@media (min-width: 1025px) {
  #editarPagamentoModal .agenda-payment-edit-card {
    width: min(780px, calc(100vw - 3rem)) !important;
    max-width: 780px !important;
    padding: 1.15rem 1.25rem 1.05rem !important;
  }

  #editarPagamentoModal .modal-title {
    margin-bottom: 1rem !important;
  }

  #editarPagamentoForm.agenda-payment-edit-form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: .9rem !important;
    row-gap: .78rem !important;
    align-items: start !important;
  }

  #editarPagamentoForm.agenda-payment-edit-form > * {
    min-width: 0 !important;
    margin-top: 0 !important;
  }

  #editarPagamentoForm.agenda-payment-edit-form .field {
    margin: 0 !important;
  }

  #editarPagamentoForm.agenda-payment-edit-form .field:has(#epObs),
  #editarPagamentoForm.agenda-payment-edit-form .modal-actions {
    grid-column: 1 / -1 !important;
  }

  #editarPagamentoForm.agenda-payment-edit-form .textarea {
    min-height: 92px !important;
    resize: vertical;
  }

  #editarPagamentoForm.agenda-payment-edit-form .modal-actions {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: .62rem !important;
    padding-top: .82rem !important;
    margin-top: .12rem !important;
    border-top: 1px solid #edf2f8 !important;
  }
}

/* =============================================================
   FINANCEIRO PREMIUM
   Painel inteligente com KPIs configuráveis, insights, gráficos e alertas.
   Estilo Nubank + Conta Azul.
   ============================================================= */

/* Modal genérico (usado pelo financeiro e próximos módulos) */
.modal {
  position: fixed; inset: 0; z-index: 80; background: rgba(15, 23, 42, .45);
  display: none; align-items: center; justify-content: center; padding: 1rem;
  backdrop-filter: saturate(140%) blur(2px);
}
.modal.is-open { display: flex; }
.modal-card {
  width: min(640px, 100%); background: #fff; border-radius: 18px;
  border: 1px solid var(--ink-100); box-shadow: 0 24px 60px rgba(15, 23, 42, .25);
  max-height: calc(100vh - 2rem); overflow: hidden; display: flex; flex-direction: column;
  animation: modal-in .16s ease-out;
}
@keyframes modal-in { from { opacity: 0; transform: translateY(8px) scale(.98);} to {opacity:1; transform:none;} }
.modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.1rem; border-bottom: 1px solid var(--ink-100);
}
.modal-head h2 {
  margin: 0; font-size: 1.02rem; font-weight: 700; color: var(--ink-900);
  display: flex; align-items: center; gap: .55rem;
}
.modal-head h2 i { color: var(--blue-600, #3b82f6); }
.modal-close {
  width: 34px; height: 34px; border-radius: 10px; border: 0; background: transparent;
  color: var(--ink-500); cursor: pointer; font-size: .95rem;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s ease, color .15s ease;
}
.modal-close:hover { background: var(--ink-50); color: var(--ink-800); }
.modal-body { padding: 1.1rem; overflow: auto; }
.modal-foot {
  display: flex; justify-content: flex-end; gap: .55rem;
  padding-top: 1rem; margin-top: 1rem; border-top: 1px solid var(--ink-100);
}

.fin-check {
  display: inline-flex; align-items: center; gap: .55rem;
  font-size: .88rem; color: var(--ink-800); margin: .4rem 0 .2rem;
  cursor: pointer; user-select: none;
}
.fin-check input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: var(--blue-600);
  flex: 0 0 auto;
}

/* ---------- Alertas ---------- */
.fin-alerts {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: .7rem; margin-bottom: 1rem;
}
.fin-alert {
  display: flex; align-items: center; gap: .7rem;
  padding: .75rem .9rem; border-radius: 12px;
  border: 1px solid var(--ink-100); background: #fff;
  box-shadow: var(--shadow-sm); border-left-width: 4px;
}
.fin-alert-icon {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .95rem;
}
.fin-alert-body { display: flex; flex-direction: column; line-height: 1.25; }
.fin-alert-body strong { color: var(--ink-900); font-size: .9rem; }
.fin-alert-body span { color: var(--ink-600); font-size: .78rem; }
.fin-alert-danger  { border-left-color: #ef4444; background: #fef2f2; }
.fin-alert-danger  .fin-alert-icon { background: #fee2e2; color: #b91c1c; }
.fin-alert-warning { border-left-color: #f59e0b; background: #fffbeb; }
.fin-alert-warning .fin-alert-icon { background: #fef3c7; color: #92400e; }
.fin-alert-info    { border-left-color: #3b82f6; background: #eff6ff; }
.fin-alert-info    .fin-alert-icon { background: #dbeafe; color: #1d4ed8; }

/* ---------- KPIs configuráveis ---------- */
.fin-kpi-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-bottom: 1.2rem;
}
.fin-kpi {
  flex: 1 1 220px;
  min-width: 220px;
  position: relative;
  background: #fff;
  border: 1px solid var(--ink-100);
  border-radius: 16px;
  padding: 1rem 1.05rem 1.05rem;
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  cursor: grab;
  overflow: hidden;
}
.fin-kpi:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.fin-kpi::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--tone, #3b82f6); opacity: .9;
}
.fin-kpi.dragging { opacity: .45; cursor: grabbing; }
.fin-kpi.drop-hover { border-color: var(--tone, #3b82f6); box-shadow: 0 0 0 3px rgba(59,130,246,.12); }
.fin-kpi[data-kpi="meta_mes"] { cursor: pointer; }
.fin-kpi[data-kpi="meta_mes"] .fin-kpi-value {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 1.75rem;
}
.fin-kpi[data-kpi="meta_mes"] .fin-kpi-foot .muted {
  overflow: hidden;
  text-overflow: ellipsis;
}

.fin-kpi-edit {
  position: absolute; top: 8px; right: 36px;
  width: 26px; height: 26px; border-radius: 8px; border: 0;
  background: transparent; color: #7c3aed; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .15s, background .15s, color .15s;
}
.fin-kpi:hover .fin-kpi-edit { opacity: 1; }
.fin-kpi[data-kpi="meta_mes"] .fin-kpi-edit { opacity: 1; }
.fin-kpi-edit:hover { background: #f5f3ff; color: #6d28d9; }

.fin-kpi-drag {
  position: absolute; top: 10px; left: 8px;
  color: var(--ink-300); font-size: .75rem;
  opacity: 0; transition: opacity .15s;
}
.fin-kpi:hover .fin-kpi-drag { opacity: 1; }

.fin-kpi-head {
  display: flex; align-items: center; gap: .55rem;
  color: var(--ink-600); font-size: .82rem; margin-bottom: .35rem;
  padding-left: 14px;
}
.fin-kpi-icon {
  width: 30px; height: 30px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--tone-bg, #dbeafe); color: var(--tone, #1d4ed8);
  font-size: .88rem;
}
.fin-kpi-label { font-weight: 600; color: var(--ink-700); }
.fin-kpi-value {
  font: 700 1.45rem/1.15 "Inter", sans-serif;
  color: var(--ink-900); letter-spacing: -.01em;
  padding-left: 14px;
}
.fin-kpi-foot {
  margin-top: .35rem; padding-left: 14px;
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  font-size: .76rem; color: var(--ink-500);
}
.fin-delta {
  display: inline-flex; align-items: center; gap: .25rem;
  padding: .14rem .5rem; border-radius: 999px;
  font: 700 .72rem/1 "Inter", sans-serif;
}
.fin-delta.fin-up   { background: #dcfce7; color: #166534; }
.fin-delta.fin-down { background: #fee2e2; color: #991b1b; }
.fin-up  { color: #16a34a; }
.fin-down { color: #dc2626; }

.fin-kpi-bar {
  margin-top: .8rem; margin-left: 14px; margin-right: -2px;
  height: 6px; background: var(--ink-100); border-radius: 999px; overflow: hidden;
}
.fin-kpi-bar span {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--tone, #3b82f6), var(--tone-strong, #1d4ed8));
  border-radius: 999px; transition: width .5s ease;
}

/* Tons dos KPIs */
.fin-kpi.tone-green   { --tone:#16a34a; --tone-bg:#dcfce7; --tone-strong:#15803d; }
.fin-kpi.tone-red     { --tone:#dc2626; --tone-bg:#fee2e2; --tone-strong:#991b1b; }
.fin-kpi.tone-blue    { --tone:#2563eb; --tone-bg:#dbeafe; --tone-strong:#1d4ed8; }
.fin-kpi.tone-cyan    { --tone:#0891b2; --tone-bg:#cffafe; --tone-strong:#0e7490; }
.fin-kpi.tone-yellow  { --tone:#d97706; --tone-bg:#fef3c7; --tone-strong:#b45309; }
.fin-kpi.tone-indigo  { --tone:#4f46e5; --tone-bg:#e0e7ff; --tone-strong:#3730a3; }
.fin-kpi.tone-purple  { --tone:#9333ea; --tone-bg:#f3e8ff; --tone-strong:#6b21a8; }
.fin-kpi.tone-gray    { --tone:#6b7280; --tone-bg:#f3f4f6; --tone-strong:#374151; }

/* ---------- Configurações do negócio ---------- */
.settings-page-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px;
  align-items: stretch;
  max-width: 1280px;
  margin: 0 auto;
}
.settings-main-column,
.settings-side-column {
  min-width: 0;
  display: flex;
}
.business-settings-card {
  max-width: none;
  margin: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.business-settings-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: .85rem;
  margin-bottom: .9rem;
  border-bottom: 1px solid var(--ink-100);
}
.business-settings-head h2 {
  margin: 0 0 .2rem;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
}
.business-settings-form {
  margin: 0;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.business-logo-panel {
  padding: .62rem .68rem;
  border: 1px solid #e6edf7;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fbff 0%, #fff 100%);
  margin-bottom: .72rem;
}
.business-logo-row {
  display: flex;
  align-items: center;
  gap: .72rem;
}
.business-logo-preview {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #2563eb, #0f766e);
  color: white;
  font-size: 1.35rem;
  font-weight: 850;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .09);
  flex: 0 0 auto;
}
.business-logo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.business-logo-upload {
  cursor: pointer;
  width: fit-content;
  min-height: 32px;
  padding: .35rem .58rem;
}
.business-logo-upload input {
  display: none;
}
.business-logo-copy {
  display: grid;
  gap: .22rem;
  min-width: 0;
}
.business-logo-copy strong {
  color: var(--ink-900);
  font-size: .88rem;
}
.business-logo-copy small {
  color: var(--ink-400);
  font-size: .75rem;
}
.business-fields-panel {
  min-width: 0;
}
.business-main-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .58rem .65rem;
}
.business-main-grid .field {
  margin-bottom: 0;
}
.business-main-grid .field-wide {
  grid-column: 1 / -1;
}
.business-save-btn {
  margin-top: auto;
  min-height: 42px;
}

.business-hours-section {
  margin: .78rem 0;
  padding-top: .72rem;
  border-top: 1px solid var(--ink-100);
}
.settings-subhead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .48rem;
}
.settings-subhead h3 {
  margin: 0;
  font-size: .94rem;
  color: var(--ink-800);
}
.business-hours-summary {
  display: flex;
  flex-wrap: wrap;
  gap: .28rem;
  margin: .2rem 0 .55rem;
}
.business-hours-summary span {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: .22rem .55rem;
  border: 1px solid #e5ebf7;
  border-radius: 999px;
  background: #f8fbff;
  color: var(--ink-700);
  font-size: .8rem;
  font-weight: 700;
}
.business-hours-edit {
  min-height: 34px;
  border-radius: 10px;
}
.business-hours-helper {
  display: block;
  margin-top: .42rem;
  color: var(--ink-400);
  font-size: .76rem;
  line-height: 1.3;
}
.settings-modules-card .card-header {
  align-items: flex-start;
  margin-bottom: .65rem;
}
.settings-modules-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: visible;
}
.settings-modules-card .card-header h2 {
  margin-bottom: .15rem;
}
.settings-modules-card form {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.settings-module-grid {
  grid-template-columns: 1fr;
  gap: .34rem;
  max-height: none;
  overflow: visible;
  padding-right: 0;
}
.settings-module-card {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 38px;
  align-items: center;
  gap: .5rem;
  padding: .42rem .54rem;
  border-width: 1px;
  border-color: #e9eef7;
  border-radius: 11px;
  min-height: 50px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .025);
}
.settings-module-card:hover {
  transform: translateY(-1px);
  border-color: #d7e2f2;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .055);
}
.settings-module-card .mod-icon {
  width: 29px;
  height: 29px;
  border-radius: 9px;
  font-size: .85rem;
}
.settings-module-card .check {
  position: static;
  grid-column: 3;
  grid-row: 1;
  width: 36px;
  height: 20px;
  justify-self: end;
  border-radius: 999px;
  color: transparent;
  background: #f1f5f9;
  border: 1px solid #dbe3ef;
  transition: background .15s ease, border-color .15s ease;
}
.settings-module-card .check i {
  display: none;
}
.settings-module-card .check::after {
  content: "";
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .18);
  transform: translateX(-7px);
  transition: transform .15s ease;
}
.settings-module-card.selected {
  border-color: #c7d7ee;
  background: #f8fbff;
  box-shadow: 0 4px 12px rgba(37, 99, 235, .055);
}
.settings-module-card.selected .check {
  background: #2563eb;
  border-color: #2563eb;
}
.settings-module-card.selected .check::after {
  transform: translateX(7px);
}
.settings-module-copy {
  min-width: 0;
}
.settings-module-copy h3 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: .2rem;
  font-size: .84rem;
}
.settings-module-copy small {
  display: block;
  margin-top: .08rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: .7rem;
  line-height: 1.25;
  color: var(--ink-400);
}
.settings-module-save {
  margin-top: auto;
  min-height: 40px;
}
.business-hours-modal-card {
  max-width: 640px;
}
.business-hours-modal-body {
  max-height: min(64vh, 560px);
}
.business-agenda-section {
  display: grid;
  gap: .7rem;
  padding: .78rem;
  border: 1px solid #edf2fb;
  border-radius: 14px;
  background: #fff;
}
.business-agenda-section + .business-agenda-section {
  margin-top: .8rem;
}
.business-agenda-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .85rem;
}
.business-agenda-section-head h3 {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--ink-800);
  font-size: .94rem;
}
.business-agenda-section-head .muted {
  margin: .12rem 0 0;
  font-size: .78rem;
  line-height: 1.25;
}
.business-agenda-section-head-action .btn {
  flex: 0 0 auto;
  min-height: 32px;
  border-radius: 10px;
}
.business-hours-quick-actions {
  display: grid;
  gap: .42rem;
  padding: .55rem .62rem;
  border: 1px solid #edf2fb;
  border-radius: 12px;
  background: #f8fbff;
}
.business-hours-quick-title {
  color: var(--ink-500);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.business-hours-presets {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.business-hours-presets .btn {
  min-height: 28px;
  border-radius: 999px;
  padding: .26rem .5rem;
  font-size: .76rem;
  font-weight: 750;
  background: #fff;
}
.business-hours-list {
  display: grid;
  gap: .48rem;
}
.business-hours-row {
  display: grid;
  gap: .42rem;
  padding: .5rem .55rem;
  border: 1px solid #eef3fb;
  border-radius: 12px;
  background: #fff;
}
.business-hours-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  min-width: 0;
}
.business-hours-toggle {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 700;
  color: var(--ink-700);
  min-width: 0;
}
.business-hours-times {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: .5rem;
  width: 100%;
  min-width: 0;
}
.business-hours-times .input {
  min-height: 34px;
  height: 34px;
  padding: .35rem .5rem;
  border-radius: 9px;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}
.business-hours-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  color: var(--ink-500);
  font-weight: 800;
  line-height: 1;
}
.business-hours-copy {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border-radius: 9px;
  color: var(--ink-500);
}
.business-hours-row:first-child .business-hours-copy {
  opacity: .35;
  pointer-events: none;
}
@media (max-width: 900px) {
  .settings-page-grid {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .settings-main-column,
  .settings-side-column,
  .business-settings-card,
  .business-settings-form,
  .settings-modules-card,
  .settings-modules-card form {
    display: block;
  }
  .business-save-btn,
  .settings-module-save {
    margin-top: .65rem;
  }
  .business-logo-panel {
    margin-bottom: .75rem;
  }
  .business-logo-preview {
    width: 68px;
    height: 68px;
    border-radius: 15px;
    font-size: 1.2rem;
  }
}
@media (max-width: 640px) {
  .settings-page-grid {
    gap: 1rem;
  }
  .business-settings-head,
  .settings-subhead {
    align-items: flex-start;
    flex-direction: column;
  }
  .business-main-grid {
    grid-template-columns: 1fr;
  }
  .business-logo-row {
    align-items: flex-start;
  }
  .business-agenda-section {
    padding: .68rem;
    border-radius: 13px;
  }
  .business-agenda-section-head-action {
    flex-direction: column;
    align-items: stretch;
  }
  .business-agenda-section-head-action .btn {
    width: 100%;
  }
  .business-hours-times {
    grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr);
    gap: .38rem;
  }
  .business-hours-presets .btn {
    flex: 1 1 calc(50% - .35rem);
    justify-content: center;
  }
}

/* Card "+ adicionar KPI" */
.fin-kpi-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: .45rem;
  margin-bottom: 1rem;
}
.fin-kpi-add {
  display: inline-flex; flex-direction: row; align-items: center; justify-content: center;
  min-height: 32px; gap: .3rem;
  padding: .2rem .5rem;
  border-radius: 999px;
  border: 1px dashed var(--ink-300); background: transparent;
  color: var(--ink-500); font-weight: 500; font-size: .72rem;
  cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease;
  opacity: .9;
}
.fin-kpi-add:hover { background: var(--blue-50); color: var(--blue-700); border-color: #3b82f6; }
.fin-kpi-add i { font-size: .72rem; }

.fin-top-kpi-btn {
  opacity: .8;
  padding-inline: .45rem;
}
/* Agenda: botão "Configurar painel" sempre verde */
.agenda-top-actions .agenda-kpi-config.config-panel-btn,
.agenda-top-actions .agenda-kpi-config.config-panel-btn.btn-ghost {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #16a34a !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  opacity: 1 !important;
  box-shadow: var(--shadow-sm);
}
.agenda-top-actions .agenda-kpi-config.config-panel-btn i,
.agenda-top-actions .agenda-kpi-config.config-panel-btn .agenda-kpi-gear {
  color: #16a34a !important;
}
.agenda-top-actions .agenda-kpi-config.config-panel-btn:hover {
  color: #15803d !important;
  background: #dcfce7 !important;
  border-color: #86efac !important;
}
.agenda-top-actions .agenda-kpi-config.config-panel-btn:hover i,
.agenda-top-actions .agenda-kpi-config.config-panel-btn:hover .agenda-kpi-gear {
  color: #15803d !important;
}

/* ---------- Painel de insights ---------- */
.fin-panel {
  background: #fff; border: 1px solid var(--ink-100); border-radius: 16px;
  box-shadow: var(--shadow-sm); padding: 1rem 1.1rem 1.1rem; margin-bottom: 1.2rem;
}
.fin-panel-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: .9rem;
}
.fin-panel-head h3 { margin: 0; font-size: 1rem; color: var(--ink-900); display:flex; align-items:center; gap:.5rem; }
.fin-panel-head h3 i { color: #eab308; }

.fin-insights {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: .75rem;
}
.fin-insight {
  padding: .8rem .9rem; border-radius: 12px;
  background: var(--ink-50); border: 1px solid var(--ink-100);
}
.fin-insight-label { color: var(--ink-600); font-size: .76rem; font-weight: 600; letter-spacing: .01em; }
.fin-insight-value { font: 700 1.15rem/1.2 "Inter", sans-serif; color: var(--ink-900); margin-top: .15rem; }
.fin-insight-sub { font-size: .74rem; margin-top: .1rem; }

/* ---------- Gráficos ---------- */
.fin-charts {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 1rem; margin-bottom: 1.3rem;
}
.fin-chart {
  background: #fff; border: 1px solid var(--ink-100); border-radius: 16px;
  box-shadow: var(--shadow-sm); padding: 1rem 1.1rem;
  display: flex; flex-direction: column;
}
.fin-chart-head {
  display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .55rem;
}
.fin-chart-head h4 {
  margin: 0; font-size: .93rem; color: var(--ink-900);
  display: inline-flex; align-items: center; gap: .45rem;
}
.fin-chart-head h4 i { color: var(--blue-600, #3b82f6); }
.fin-chart-body { position: relative; height: 240px; }
.fin-chart-body canvas { max-height: 240px; }

.fin-advanced {
  background: #fff;
  border: 1px solid var(--ink-100);
  border-radius: 14px;
  box-shadow: var(--shadow-sm);
  margin: 1rem 0;
  overflow: hidden;
}
.fin-advanced > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .9rem 1rem;
  cursor: pointer;
  font-weight: 700;
  color: var(--ink-800);
  list-style: none;
}
.fin-advanced > summary::-webkit-details-marker { display: none; }
.fin-advanced-options {
  border: 1px solid var(--ink-100);
  border-radius: 10px;
  background: #f8fafc;
  padding: .58rem .65rem;
}
.fin-advanced-options > summary {
  cursor: pointer;
  color: var(--ink-700);
  font-size: .82rem;
  font-weight: 700;
  list-style: none;
}
.fin-advanced-options > summary::-webkit-details-marker { display: none; }
.fin-advanced-options-body {
  display: grid;
  gap: .55rem;
  padding-top: .55rem;
}
.fin-recurring-toggle {
  margin: 0;
  padding: .55rem .6rem;
  border: 1px solid var(--ink-100);
  border-radius: 10px;
  background: #fff;
  align-items: flex-start;
}
.fin-recurring-toggle span {
  display: grid;
  gap: .05rem;
}
.fin-recurring-toggle strong {
  color: var(--ink-900);
  font-size: .84rem;
  line-height: 1.25;
}
.fin-recurring-toggle small {
  color: var(--ink-500);
  font-size: .72rem;
  line-height: 1.25;
}
.fin-recurring-fields {
  display: grid;
  gap: .42rem;
}
.fin-manual-modal-card {
  width: min(760px, calc(100vw - 2rem));
}
.fin-manual-form {
  padding: .9rem 1rem 1rem;
}
.fin-manual-form .field {
  gap: .28rem;
  margin-bottom: .55rem;
}
.fin-manual-form .form-grid {
  gap: .55rem .75rem;
}
.fin-manual-form .input,
.fin-manual-form .select {
  min-height: 40px;
  padding: .54rem .72rem;
  border-radius: 9px;
  font-size: .92rem;
}
.fin-manual-form .fin-advanced-options {
  margin-bottom: .45rem;
}
.fin-recurring-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fin-recurring-hint {
  margin: -.1rem 0 0;
  font-size: .74rem;
  line-height: 1.35;
  color: var(--ink-500);
}
.fin-manual-observacoes {
  min-height: 38px;
  max-height: 150px;
  resize: none;
  overflow-y: hidden;
  padding: .54rem .72rem;
  border-radius: 9px;
  font-size: .92rem;
  line-height: 1.35;
}
#finLancarModal .modal-head {
  padding: .9rem 1rem;
}
#finLancarModal .modal-foot {
  margin-top: .65rem;
  padding-top: .75rem;
}
@media (max-width: 640px) {
  .fin-manual-modal-card {
    width: min(100%, calc(100vw - 1rem));
    max-height: calc(100dvh - 1rem);
    border-radius: 14px;
  }
  .fin-manual-form {
    padding: .8rem;
  }
  .fin-recurring-grid {
    grid-template-columns: 1fr;
  }
  #finLancarModal .modal-foot {
    position: sticky;
    bottom: -.8rem;
    background: #fff;
    padding-bottom: .8rem;
  }
}
.public-service-list {
  margin: .35rem 0 .15rem;
  padding-left: 1.1rem;
  color: var(--ink-700);
  font-size: .86rem;
}
.fin-advanced > summary span {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
}
.fin-advanced-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .65rem;
  padding: 0 1rem 1rem;
}
.fin-advanced-item {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-height: 48px;
  padding: .65rem .75rem;
  border: 1px solid var(--ink-100);
  border-radius: 12px;
  background: #f8fafc;
}
.fin-advanced-item strong {
  margin-left: auto;
  color: var(--ink-900);
  white-space: nowrap;
}

/* ---------- Tabela ---------- */
.fin-table-card {
  padding: 0;
  overflow: hidden;
}
.fin-table {
  font-size: .86rem;
  border-collapse: separate;
  border-spacing: 0;
}
.fin-table thead {
  background: #fafcff;
}
.fin-table th {
  color: #7c8aa5;
  font-size: .68rem;
  letter-spacing: .04em;
  padding-top: .72rem;
  padding-bottom: .72rem;
}
.fin-table td {
  padding-top: .72rem;
  padding-bottom: .72rem;
  border-color: #edf2f7;
}
.fin-table tbody tr:hover {
  background: #fcfdff;
}
.fin-table .fin-cell-date { white-space: nowrap; color: var(--ink-600); font-size: .8rem; }
.fin-table .fin-cell-value { font-weight: 800; white-space: nowrap; font-size: .9rem; }
.fin-table .fin-cell-receita { color: #16a34a; }
.fin-table .fin-cell-despesa { color: #dc2626; }
.fin-move-desc strong {
  display: block;
  color: var(--ink-900);
  font-size: .9rem;
  line-height: 1.25;
}
.fin-move-sub {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
  margin-top: .12rem;
  color: #7483a3;
  font-size: .73rem;
}
.fin-pay-badge {
  display: inline-flex;
  align-items: center;
  height: 17px;
  padding: 0 .36rem;
  border-radius: 999px;
  background: #f6f8fb;
  color: #7b879a;
  border: 1px solid #e8eef5;
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .02em;
}

.fin-origin {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .13rem .4rem; border-radius: 999px;
  background: var(--ink-50); color: var(--ink-700);
  font-size: .64rem; font-weight: 700;
  border: 1px solid var(--ink-100);
}
.fin-origin i { font-size: .62rem; }
.fin-origin-agenda,
.fin-origin-agenda_receber { background: #eef5ff; color: #2563eb; border-color: #d7e6ff; }
.fin-origin-venda   { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.fin-origin-aluguel { background: #e0e7ff; color: #3730a3; border-color: #c7d2fe; }
.fin-origin-manual  { background: var(--ink-50); color: var(--ink-700); }
.fin-status {
  appearance: none;
  padding: .18rem .5rem;
  border: 0;
  font-size: .68rem;
  font-family: inherit;
  font-weight: 700;
  line-height: 1.2;
}
.fin-status.green {
  background: #e8f8ef;
  color: #147a3f;
}
.fin-status.yellow {
  background: #fff7df;
  color: #9a6511;
}
.fin-status-cell {
  position: relative;
  white-space: nowrap;
}
.fin-status-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.fin-status-wrap .fin-status {
  cursor: default;
  transition: box-shadow .15s ease, filter .15s ease;
}
.fin-status-wrap .fin-status:hover,
.fin-status-wrap .fin-status:focus-visible {
  filter: saturate(1.04);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .08);
  outline: 0;
}
.fin-status-tooltip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + .55rem);
  z-index: 40;
  width: min(290px, calc(100vw - 2rem));
  transform: translateX(-50%) translateY(4px) scale(.98);
  padding: .7rem .76rem;
  border: 1px solid #e4eaf3;
  border-radius: 12px;
  background: #fff;
  color: var(--ink-700);
  box-shadow: 0 18px 38px rgba(15, 23, 42, .14);
  opacity: 0;
  pointer-events: none;
  transition: opacity .14s ease, transform .14s ease;
}
.fin-status-tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  width: 10px;
  height: 10px;
  transform: translate(-50%, -5px) rotate(45deg);
  background: #fff;
  border-right: 1px solid #e4eaf3;
  border-bottom: 1px solid #e4eaf3;
}
.fin-status-wrap:hover .fin-status-tooltip,
.fin-status-wrap:focus-within .fin-status-tooltip {
  opacity: 1;
  transform: translateX(-50%) translateY(0) scale(1);
}
.fin-status-tooltip-row {
  display: grid;
  gap: .08rem;
}
.fin-status-tooltip-row + .fin-status-tooltip-row {
  margin-top: .5rem;
  padding-top: .5rem;
  border-top: 1px solid #eef2f7;
}
.fin-status-tooltip-row b {
  color: var(--ink-900);
  font-size: .68rem;
  line-height: 1.2;
}
.fin-status-tooltip-row em {
  color: #69758f;
  font-size: .74rem;
  font-style: normal;
  line-height: 1.25;
  white-space: normal;
}
.fin-action-btn {
  width: 30px;
  height: 30px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #64748b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  line-height: 1;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.fin-action-btn:hover {
  background: #f8fafc;
  border-color: #e2e8f0;
  transform: translateY(-1px);
}
.fin-action-btn i { font-size: .82rem; line-height: 1; }
.fin-action-ok:hover {
  color: #15803d;
  background: #ecfdf5;
  border-color: #bbf7d0;
}
.fin-action-danger:hover {
  color: #dc2626;
  background: #fff1f2;
  border-color: #fecdd3;
}
.fin-table th:last-child {
  width: 104px;
  text-align: center;
}
.fin-table td:last-child {
  text-align: center;
}
.table .actions.fin-actions-cell {
  justify-content: end;
}
.fin-actions-cell {
  display: grid;
  grid-template-columns: 30px 30px;
  align-items: center;
  justify-content: end;
  gap: .35rem;
  min-height: 52px;
  width: 104px;
  margin: 0 auto;
  padding-left: 0;
  padding-right: 0;
}
.fin-actions-cell form {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.fin-action-placeholder {
  display: inline-flex;
  width: 30px;
  height: 30px;
  visibility: hidden;
}
.fin-quick-confirm {
  position: fixed;
  z-index: 180;
  width: min(310px, calc(100vw - 1.5rem));
  padding: .85rem;
  border: 1px solid #dfe7f2;
  border-radius: 14px;
  background: #fff;
  color: var(--ink-800);
  box-shadow: 0 22px 48px rgba(15, 23, 42, .18);
  animation: fin-confirm-in .12s ease-out;
}
.fin-quick-confirm p {
  margin: 0 0 .75rem;
  font-size: .86rem;
  line-height: 1.35;
  font-weight: 650;
}
.fin-quick-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: .45rem;
}
.fin-quick-confirm .btn {
  min-height: 34px;
  padding: 0 .75rem;
}
@keyframes fin-confirm-in {
  from { opacity: 0; transform: translateY(4px) scale(.98); }
  to { opacity: 1; transform: none; }
}

/* ---------- Produtos e Serviços ---------- */
.catalog-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .6rem;
  width: 100%;
}
.catalog-search {
  width: min(320px, 42vw);
}
.catalog-primary-btn {
  min-height: 42px;
  border-radius: 12px;
  box-shadow: 0 10px 18px rgba(37, 99, 235, .14);
}
.catalog-config-btn {
  width: 42px;
  height: 42px;
  min-width: 42px;
  padding: 0;
  border-radius: 12px;
}
.catalog-kpis {
  margin-bottom: 1rem;
}
.catalog-kpi-text {
  font-size: 1.08rem;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.catalog-card {
  padding: 0;
  overflow: hidden;
}
.catalog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1rem .75rem;
  border-bottom: 1px solid #edf2f7;
}
.catalog-head h2 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: 1rem;
}
.catalog-head h2 i {
  color: #4f46e5;
}
.catalog-head p {
  margin: .18rem 0 0;
  color: #7382a0;
  font-size: .82rem;
}
.catalog-filter-pills {
  display: inline-flex;
  gap: .25rem;
  padding: .22rem;
  border: 1px solid #dbe5f2;
  border-radius: 12px;
  background: #fff;
}
.catalog-pill {
  border: 0;
  background: transparent;
  color: #64748b;
  padding: .42rem .7rem;
  border-radius: 9px;
  font-weight: 700;
  font-size: .78rem;
  cursor: pointer;
}
.catalog-pill.is-active {
  background: #eff6ff;
  color: #2563eb;
}
.catalog-table-wrap {
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0;
}
.catalog-table th {
  font-size: .68rem;
  color: #7c8aa5;
  background: #fafcff;
}
.catalog-table td {
  vertical-align: middle;
  border-color: #edf2f7;
}
.catalog-item-main {
  display: flex;
  align-items: center;
  gap: .7rem;
  min-width: 230px;
}
.catalog-item-main strong {
  display: block;
  color: var(--ink-900);
  font-size: .93rem;
}
.catalog-item-main .catalog-item-subtitle {
  display: block;
  margin-top: .1rem;
  color: #7382a0;
  font-size: .76rem;
  max-width: 460px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.catalog-tags {
  display: block;
  margin-top: .18rem;
  color: #8a97ae;
  font-size: .68rem;
}
.catalog-item-icon {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.catalog-item-icon.is-product {
  color: #4f46e5;
  background: #eef2ff;
}
.catalog-item-icon.is-service {
  color: #2563eb;
  background: #dbeafe;
}
.catalog-badge {
  display: inline-flex;
  align-items: center;
  padding: .18rem .5rem;
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 800;
}
.catalog-badge.is-product {
  background: #eef2ff;
  color: #4f46e5;
}
.catalog-badge.is-service {
  background: #e0f2fe;
  color: #0369a1;
}
.catalog-meta {
  color: #64748b;
  font-size: .82rem;
}
.catalog-meta > span {
  display: inline-flex;
  align-items: center;
  margin-right: .35rem;
}
.catalog-health {
  padding: .12rem .42rem;
  border-radius: 999px;
  font-size: .64rem;
  font-weight: 800;
}
.catalog-health.good,
.catalog-price-health.good { background: #dcfce7; color: #15803d; }
.catalog-health.warn,
.catalog-price-health.warn { background: #fef3c7; color: #a16207; }
.catalog-health.danger,
.catalog-price-health.danger { background: #fee2e2; color: #dc2626; }
.catalog-alert {
  display: inline-flex;
  margin-left: .35rem;
  padding: .12rem .38rem;
  border-radius: 999px;
  background: #fff1f2;
  color: #dc2626;
  font-size: .64rem;
  font-weight: 800;
}
.catalog-price {
  color: var(--ink-900);
  font-weight: 800;
  white-space: nowrap;
}
.catalog-price span {
  display: block;
  margin-top: .12rem;
  color: #7b879a;
  font-size: .68rem;
  font-weight: 650;
}
.catalog-table tr.is-inactive {
  opacity: .58;
}
.catalog-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .35rem;
  min-width: 96px;
}
.catalog-action-btn {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  border: 1px solid transparent;
  color: #64748b;
  background: transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.catalog-action-btn:hover {
  transform: translateY(-1px);
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #2563eb;
}
.catalog-action-btn.danger:hover {
  color: #dc2626;
  background: #fff1f2;
  border-color: #fecdd3;
}
.catalog-empty {
  padding: 4rem 1rem;
}
.catalog-modal-card {
  max-width: 840px;
}
.catalog-type-toggle {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .85rem;
}
.catalog-type-toggle input {
  display: none;
}
.catalog-type-toggle span {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  border: 1px solid #dbe5f2;
  border-radius: 12px;
  background: #fff;
  color: #64748b;
  font-weight: 800;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.catalog-type-toggle input:checked + span {
  color: #2563eb;
  border-color: #93c5fd;
  background: #eff6ff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .08);
}
.catalog-soft-note {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-height: 42px;
  margin-bottom: .85rem;
  padding: .7rem .8rem;
  border: 1px solid #dbeafe;
  border-radius: 12px;
  background: #f8fbff;
  color: #526384;
  font-size: .82rem;
  font-weight: 650;
}
.catalog-soft-note i {
  color: #2563eb;
}
.catalog-pricing-box {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .55rem;
  margin: .2rem 0 .75rem;
  padding: .7rem;
  border: 1px solid #e3eaf5;
  border-radius: 14px;
  background: #fbfdff;
}
.catalog-pricing-box div {
  min-width: 0;
}
.catalog-pricing-box span,
.catalog-suggest-row label {
  display: block;
  color: #71809a;
  font-size: .68rem;
  font-weight: 800;
}
.catalog-pricing-box strong {
  display: block;
  margin-top: .12rem;
  color: var(--ink-900);
  font-size: .95rem;
}
.catalog-price-health {
  grid-column: 1 / -1;
  margin: .15rem 0 0;
  padding: .38rem .55rem;
  border-radius: 10px;
  font-size: .78rem;
  font-weight: 800;
}
.catalog-suggest-row {
  margin-bottom: .8rem;
  padding: .7rem;
  border: 1px solid #eef2f7;
  border-radius: 14px;
  background: #fff;
}
.catalog-profit-options {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .45rem 0;
}
.catalog-profit-options button {
  border: 1px solid #dbe5f2;
  background: #fff;
  color: #64748b;
  border-radius: 999px;
  padding: .32rem .6rem;
  font-size: .72rem;
  font-weight: 800;
  cursor: pointer;
}
.catalog-profit-options button.is-active {
  border-color: #93c5fd;
  background: #eff6ff;
  color: #2563eb;
}
.catalog-profit-options .input {
  width: 58px;
  max-width: 100%;
  min-height: 34px;
  padding: 0 .45rem;
  text-align: center;
}
.catalog-profit-options-inline {
  flex-wrap: nowrap;
}
.catalog-profit-options-inline button {
  flex: 0 0 auto;
}
.catalog-profit-options-inline .input {
  flex: 0 0 58px;
}
.catalog-suggest-row > span {
  color: #526384;
  font-size: .82rem;
}
.field-help {
  display: block;
  margin: .12rem 0 .38rem;
  color: #7b879a;
  font-size: .72rem;
  font-weight: 600;
}
.catalog-advanced {
  margin-bottom: .85rem;
  border: 1px solid #e6edf7;
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}
.catalog-advanced summary {
  padding: .72rem .85rem;
  cursor: pointer;
  font-size: .84rem;
  font-weight: 800;
  color: #526384;
  list-style: none;
}
.catalog-advanced summary::-webkit-details-marker { display: none; }
.catalog-advanced .form-grid {
  padding: 0 .85rem .85rem;
}
.catalog-advanced-product,
.catalog-advanced-service {
  padding: 0 .85rem .9rem;
}
.catalog-advanced-step {
  border: 1px solid #e6edf7;
  border-radius: 14px;
  background: #fbfdff;
  padding: .8rem;
  margin-bottom: .75rem;
}
.catalog-step-head {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  margin-bottom: .7rem;
}
.catalog-step-head > span {
  width: 26px;
  height: 26px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background: #dbeafe;
  color: #1d4ed8;
  font-weight: 900;
  font-size: .78rem;
}
.catalog-step-head strong {
  display: block;
  color: #17233d;
  font-size: .9rem;
}
.catalog-step-head small {
  display: block;
  margin-top: .12rem;
  color: #7281a0;
  font-size: .78rem;
  font-weight: 600;
}
.catalog-cost-list {
  display: grid;
  gap: .45rem;
  margin-bottom: .55rem;
}
.catalog-cost-table {
  display: grid;
  gap: .45rem;
  margin-bottom: .65rem;
}
.catalog-cost-header {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) 92px 104px 132px 34px;
  gap: .45rem;
  color: #7b879a;
  font-size: .7rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.catalog-cost-header::after {
  content: "";
}
.catalog-cost-row {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) 92px 104px 132px 34px;
  gap: .45rem;
  align-items: center;
}
.catalog-mini-btn {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  color: #64748b;
  background: #fff;
  cursor: pointer;
}
.catalog-mini-btn:hover {
  color: #dc2626;
  background: #fff1f2;
  border-color: #fecdd3;
}
.catalog-advanced-totals {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .65rem;
}
.catalog-advanced-totals span {
  display: inline-flex;
  gap: .3rem;
  align-items: center;
  padding: .35rem .55rem;
  border: 1px solid #e6edf7;
  border-radius: 999px;
  color: #526384;
  background: #f8fafc;
  font-size: .76rem;
  font-weight: 750;
}
.catalog-advanced-grid-two {
  display: grid;
  grid-template-columns: minmax(300px, .9fr) minmax(0, 1.1fr);
  gap: .75rem;
}
.catalog-advanced-grid-two .catalog-advanced-step {
  margin-bottom: 0;
}
.catalog-advanced-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
}
.catalog-advanced-results span {
  display: grid;
  gap: .15rem;
  padding: .55rem .6rem;
  border: 1px solid #e6edf7;
  border-radius: 12px;
  background: #fff;
  color: #6d7894;
  font-size: .74rem;
  font-weight: 760;
}
.catalog-advanced-results b {
  color: #101b33;
  font-size: .96rem;
}
.catalog-advanced-grid {
  padding: .65rem 0 0 !important;
}
.catalog-suggest-row-compact {
  margin: .65rem 0 0;
}

/* ---------- Personalizar painel ---------- */
.fin-pers-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: .55rem;
}
.fin-pers-section-title {
  margin: .95rem 0 .55rem;
  font-size: .82rem;
  font-weight: 850;
  color: #526384;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.dashboard-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1rem;
  align-items: stretch;
}
.dashboard-card-grid > .dashboard-card-item,
.dashboard-card-grid > .card + .card {
  margin-top: 0 !important;
}
.dashboard-card-grid > .dashboard-card-item {
  align-self: stretch;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.dashboard-agenda-list,
.dashboard-receivables-list {
  display: flex;
  flex-direction: column;
  gap: .45rem;
  max-height: 258px;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: .15rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.dashboard-agenda-row,
.dashboard-receivable-row,
.dashboard-top-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .65rem;
  padding: .55rem .35rem;
  border-bottom: 1px solid var(--ink-100);
}
.dashboard-agenda-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  min-height: 44px;
  border: 1px solid #e5edf8;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(15, 23, 42, .035);
}
.dashboard-agenda-time {
  flex: 0 0 auto;
  color: var(--ink-900);
  font-size: .88rem;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}
.dashboard-agenda-copy {
  display: flex;
  align-items: baseline;
  gap: .34rem;
  min-width: 0;
  color: var(--ink-900);
  font-size: .88rem;
  font-weight: 750;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard-agenda-service,
.dashboard-agenda-client {
  display: block;
  min-width: 0;
  color: inherit;
  font: inherit;
  line-height: inherit;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard-agenda-service {
  flex: 1 1 auto;
}
.dashboard-agenda-copy.has-client .dashboard-agenda-service {
  flex: 0 1 auto;
  max-width: 54%;
}
.dashboard-agenda-client {
  flex: 1 1 auto;
}
.dashboard-agenda-separator {
  flex: 0 0 auto;
  color: #94a3b8;
  font-size: .86em;
  font-weight: 800;
}
.dashboard-agenda-row .badge {
  flex: 0 0 auto;
  min-height: 22px;
  padding: .14rem .5rem;
  font-size: .68rem;
  line-height: 1;
  font-weight: 850;
}
.dashboard-upcoming {
  display: none !important;
}
@media (min-width: 769px) {
  .dashboard-upcoming {
    display: none !important;
  }
}
.dashboard-receivables-list {
  max-height: 300px;
}
.dashboard-receivable-copy {
  min-width: 0;
}
.dashboard-receivable-name {
  min-width: 0;
  font-weight: 600;
}
.dashboard-receivable-service,
.dashboard-receivable-client,
.dashboard-receivable-badge {
  display: none;
}
.dashboard-receivable-meta {
  font-size: .8rem;
}
.dashboard-receivable-value {
  flex: 0 0 auto;
  color: var(--blue-700);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.dashboard-top-list {
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.fin-pers-item {
  display: flex; align-items: center; gap: .55rem;
  padding: .65rem .7rem; border-radius: 12px;
  background: #fff; border: 1px solid var(--ink-100);
  cursor: pointer; user-select: none;
  position: relative;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.fin-pers-item:hover { background: var(--ink-50); }
.fin-pers-item input { accent-color: var(--tone, #3b82f6); }
.fin-pers-item:has(input:checked) {
  background: var(--tone-bg, #dbeafe);
  border-color: var(--tone, #3b82f6);
  box-shadow: 0 0 0 2px rgba(59,130,246,.08);
}
.fin-pers-icon {
  width: 30px; height: 30px; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--tone-bg, #dbeafe); color: var(--tone, #1d4ed8); font-size: .82rem;
}
.fin-pers-label { font-weight: 600; color: var(--ink-800); font-size: .85rem; }
.fin-pers-item.meta-selected { padding-right: 2.25rem; }
.fin-pers-meta-edit {
  position: absolute; right: .6rem; top: 50%; transform: translateY(-50%);
  width: 22px !important; height: 22px !important; border-radius: 7px !important;
  border: 0 !important; outline: 0 !important;
  background: transparent !important; color: #7c3aed !important; cursor: pointer;
  display: inline-flex !important; align-items: center; justify-content: center;
  box-shadow: none !important;
  opacity: 0; pointer-events: none;
  transition: opacity .15s, background .15s, color .15s;
}
.fin-pers-item.meta-selected .fin-pers-meta-edit {
  opacity: 1;
  pointer-events: auto;
}
.fin-pers-meta-edit:hover { background: #f5f3ff !important; color: #6d28d9 !important; }

.fin-meta-popover {
  position: fixed;
  z-index: 130;
  width: min(300px, calc(100vw - 2rem));
  padding: .75rem;
  border: 1px solid var(--ink-100);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--shadow-lg);
}
.fin-meta-popover strong {
  display: block;
  color: var(--ink-900);
  margin-bottom: .45rem;
  font-size: .9rem;
}
.fin-meta-popover .input { margin-bottom: .55rem; }
.fin-meta-popover-actions { display: flex; justify-content: flex-end; gap: .45rem; }

.fin-pers-item.tone-green   { --tone:#16a34a; --tone-bg:#dcfce7; }
.fin-pers-item.tone-red     { --tone:#dc2626; --tone-bg:#fee2e2; }
.fin-pers-item.tone-blue    { --tone:#2563eb; --tone-bg:#dbeafe; }
.fin-pers-item.tone-cyan    { --tone:#0891b2; --tone-bg:#cffafe; }
.fin-pers-item.tone-yellow  { --tone:#d97706; --tone-bg:#fef3c7; }
.fin-pers-item.tone-indigo  { --tone:#4f46e5; --tone-bg:#e0e7ff; }
.fin-pers-item.tone-purple  { --tone:#9333ea; --tone-bg:#f3e8ff; }
.fin-pers-item.tone-gray    { --tone:#6b7280; --tone-bg:#f3f4f6; }

/* ---------- Perfil do negócio ---------- */
.fin-perfil-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: .55rem;
}
.fin-perfil-item {
  display: grid; grid-template-columns: 22px 1fr;
  align-items: center; gap: .6rem;
  padding: .75rem .8rem; border-radius: 12px;
  background: #fff; border: 1px solid var(--ink-100);
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.fin-perfil-item:hover { background: var(--ink-50); }
.fin-perfil-item input { display: none; }
.fin-perfil-radio {
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid var(--ink-200); background: #fff;
  display: inline-block; position: relative; transition: border-color .15s ease;
}
.fin-perfil-item:has(input:checked) { background: #eff6ff; border-color: #3b82f6; }
.fin-perfil-item:has(input:checked) .fin-perfil-radio { border-color: #3b82f6; }
.fin-perfil-item:has(input:checked) .fin-perfil-radio::after {
  content: ""; position: absolute; inset: 3px;
  background: #3b82f6; border-radius: 50%;
}
.fin-perfil-item strong { display: block; color: var(--ink-900); font-size: .88rem; }
.fin-perfil-item small { font-size: .74rem; display: block; margin-top: .1rem; }

/* ---------- Responsive ---------- */
@media (max-width: 760px) {
  .construction-card {
    align-items: flex-start;
    flex-direction: column;
    padding: 1.1rem;
  }
  .construction-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    font-size: 1.2rem;
  }
  .agenda-public-link-actions {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }
  .agenda-public-link-actions .btn {
    width: 100%;
  }
  .fin-kpi-grid { grid-template-columns: 1fr 1fr; }
  .fin-kpi-value { font-size: 1.2rem; }
  .fin-insights { grid-template-columns: 1fr 1fr; }
  .fin-charts { grid-template-columns: 1fr; }
  .fin-chart-body { height: 220px; }
  .fin-table th:nth-child(3),
  .fin-table td:nth-child(3) { display: none; } /* origem */
  .fin-table .fin-cell-date { font-size: .78rem; }
  .fin-table .fin-cell-value { font-size: .86rem; }
  .fin-status-cell { white-space: normal; }
  .fin-status-tooltip {
    left: auto;
    right: 0;
    transform: translateY(4px);
  }
  .fin-status-tooltip::after {
    left: auto;
    right: 18px;
  }
  .fin-status-wrap:hover .fin-status-tooltip,
  .fin-status-wrap:focus-within .fin-status-tooltip {
    transform: translateY(0);
  }
  .catalog-toolbar {
    justify-content: stretch;
    flex-wrap: wrap;
  }
  .catalog-search {
    width: 100%;
    order: 3;
  }
  .catalog-primary-btn {
    flex: 1;
  }
  .catalog-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .catalog-filter-pills {
    width: 100%;
    overflow-x: auto;
  }
  .catalog-pill {
    flex: 1;
    white-space: nowrap;
  }
  .catalog-table {
    min-width: 720px;
  }
  .catalog-type-toggle {
    grid-template-columns: 1fr;
  }
  .catalog-pricing-box {
    grid-template-columns: 1fr;
  }
  .catalog-profit-options {
    flex-wrap: wrap;
  }
  .catalog-profit-options-inline {
    flex-wrap: wrap;
  }
  .catalog-profit-options-inline .input {
    flex-basis: 72px;
  }
  .catalog-cost-row {
    grid-template-columns: 1fr;
    padding: .55rem;
    border: 1px solid #e6edf7;
    border-radius: 12px;
    background: #fff;
  }
  .catalog-cost-header { display: none; }
  .catalog-mini-btn {
    width: 100%;
  }
  .catalog-advanced-grid-two,
  .catalog-advanced-results {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 480px) {
  .fin-kpi-grid { grid-template-columns: 1fr; }
  .fin-insights { grid-template-columns: 1fr; }
  .fin-perfil-grid, .fin-pers-grid, .dashboard-card-grid { grid-template-columns: 1fr; }
  .fin-table {
    min-width: 680px;
  }
  .catalog-kpi-text {
    white-space: normal;
  }
  .catalog-modal-card {
    width: calc(100vw - 1rem);
  }
}

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

.fin-mini-stat {
  border: 1px solid var(--ink-100);
  border-radius: 8px;
  padding: .75rem;
  background: #fff;
}

.fin-mini-stat span {
  display: block;
  color: var(--ink-500);
  font-size: .78rem;
  font-weight: 600;
  margin-bottom: .25rem;
}

.fin-mini-stat strong {
  color: var(--ink-900);
  font-size: 1.05rem;
}

.clientes-action-modal {
  width: min(720px, calc(100vw - 1.25rem));
}

.cliente-edit-modal-card {
  overflow: visible;
}

.cliente-edit-modal-card .select {
  appearance: auto;
  -webkit-appearance: menulist;
}

/* Clientes: alinhamento real da coluna Ações.
   A coluna tem largura fixa e os 3 slots iguais deixam o ícone Perfil no centro. */
#tbClientes th.clientes-actions-head,
#tbClientes td.clientes-actions-cell {
  width: 148px !important;
  min-width: 148px !important;
  max-width: 148px !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  text-align: center !important;
}

#tbClientes td.clientes-actions-cell {
  display: table-cell !important;
  vertical-align: middle !important;
}

#tbClientes .clientes-actions-group {
  display: grid !important;
  grid-template-columns: 32px 32px 32px;
  align-items: center;
  justify-content: center;
  justify-items: center;
  gap: .45rem;
  width: 100%;
  white-space: nowrap;
}

#tbClientes .clientes-actions-group .icon-btn,
#tbClientes .clientes-actions-group .clientes-action-placeholder {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
}

#tbClientes .clientes-actions-group form {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin: 0;
}

@media (max-width: 640px) {
  #tbClientes th.clientes-actions-head,
  #tbClientes td.clientes-actions-cell {
    width: 132px !important;
    min-width: 132px !important;
    max-width: 132px !important;
    padding-left: .75rem !important;
    padding-right: .75rem !important;
  }

  #tbClientes .clientes-actions-group {
    gap: .32rem;
  }

  .client-action-summary {
    grid-template-columns: 1fr;
  }
  .clientes-action-modal .modal-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .clientes-action-modal .modal-actions .btn {
    width: 100%;
  }
}

/* ---------- Mobile-first shell + KPIs compactos ---------- */
@media (max-width: 768px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }
  .topbar {
    gap: .65rem;
  }
  .topbar-title h1 {
    font-size: 1.08rem;
    line-height: 1.15;
  }
  .topbar-title .muted {
    line-height: 1.35;
  }
  .sidebar {
    width: min(84vw, 288px);
    will-change: transform;
  }
  .sidebar-backdrop {
    backdrop-filter: blur(2px);
    transition: opacity .2s ease;
  }
  .content {
    overflow-x: hidden;
  }
  .table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .fin-kpi-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: .55rem !important;
    margin: 0 -.8rem 1rem !important;
    padding: .05rem .8rem .55rem !important;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .fin-kpi-grid::-webkit-scrollbar {
    height: 4px;
  }
  .fin-kpi-grid::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 999px;
  }
  .fin-kpi {
    flex: 0 0 clamp(148px, 44vw, 184px) !important;
    min-width: 0 !important;
    min-height: 96px;
    padding: .64rem .68rem !important;
    border-radius: 12px !important;
    scroll-snap-align: start;
  }
  .fin-kpi:hover {
    transform: none;
  }
  .fin-kpi-drag {
    display: none;
  }
  .fin-kpi-head {
    gap: .42rem;
    margin-bottom: .28rem;
    padding-left: 0 !important;
    font-size: .72rem;
    line-height: 1.15;
  }
  .fin-kpi-icon {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    font-size: .78rem;
  }
  .fin-kpi-label {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .fin-kpi-value {
    padding-left: 0 !important;
    font-size: clamp(1rem, 4.4vw, 1.22rem) !important;
    line-height: 1.08;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .fin-kpi-foot {
    margin-top: .28rem;
    padding-left: 0 !important;
    font-size: .68rem;
    line-height: 1.2;
  }
  .fin-kpi-foot .muted {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .fin-kpi-bar {
    margin: .45rem 0 0;
    height: 4px;
  }
}

@media (max-width: 390px) {
  .fin-kpi {
    flex-basis: 152px !important;
  }
  .mobile-menu-btn {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }
}

/* ============================================================
   MOBILE APP EXPERIENCE
   Mantem o desktop intacto e redesenha somente celular/tablet.
   ============================================================ */
@media (max-width: 768px) {
  :root {
    --mobile-gutter: clamp(.78rem, 3.6vw, 1rem);
    --mobile-control: 42px;
  }

  html {
    -webkit-text-size-adjust: 100%;
  }

  body {
    background: var(--app-bg);
    overscroll-behavior-x: none;
  }

  .main-panel {
    min-width: 0;
    overflow-x: hidden;
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 8;
    display: grid !important;
    grid-template-columns: var(--mobile-control) minmax(0, 1fr);
    align-items: center !important;
    gap: .5rem .7rem !important;
    padding: .74rem var(--mobile-gutter) .72rem !important;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid #e8eef8;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .035);
    backdrop-filter: blur(12px);
  }

  .mobile-menu-btn {
    width: var(--mobile-control) !important;
    height: var(--mobile-control) !important;
    flex: 0 0 var(--mobile-control) !important;
    border-radius: 12px;
    font-size: 1rem;
    box-shadow: 0 5px 14px rgba(37, 99, 235, .08);
  }

  .topbar-title {
    grid-column: 2;
    min-width: 0;
    flex: none !important;
  }

  .topbar-title h1 {
    margin: 0;
    font-size: clamp(1.02rem, 4.7vw, 1.22rem) !important;
    line-height: 1.1;
    letter-spacing: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .topbar-title .muted {
    margin-top: .18rem;
    font-size: .74rem !important;
    line-height: 1.25;
    color: #7180a0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  .topbar-actions {
    grid-column: 1 / -1;
    width: 100%;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .42rem !important;
    flex-wrap: wrap !important;
    margin: .1rem 0 0 !important;
    min-width: 0;
  }

  .topbar:has(.dash-period-toolbar) {
    grid-template-columns: var(--mobile-control) minmax(0, 1fr) auto;
  }

  .topbar:has(.dash-period-toolbar) .topbar-actions {
    grid-column: 3;
    grid-row: 1;
    width: auto;
    flex-wrap: nowrap !important;
    margin: 0 !important;
    justify-self: end;
  }

  .topbar:has(.dash-period-toolbar) .topbar-title {
    grid-column: 2;
    grid-row: 1;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) {
    grid-template-columns: var(--mobile-control) minmax(0, 1fr) var(--mobile-control);
    align-items: start !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .topbar-title {
    display: none;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .topbar-actions {
    display: contents !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar {
    display: contents !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar .fin-period-select {
    grid-column: 2;
    grid-row: 1;
    width: 100% !important;
    min-width: 0 !important;
    height: var(--mobile-control) !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar .fin-period-custom {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: stretch;
    gap: .36rem;
    width: 100%;
    min-width: 0;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .config-panel-btn {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    justify-self: end;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .mobile-menu-btn {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
  }

  .topbar-actions .btn,
  .topbar-actions .select,
  .topbar-actions .search,
  .topbar-actions .menu > .btn,
  .topbar-actions .finance-top-control,
  .topbar-actions .clientes-icon-btn,
  .topbar-actions .agenda-icon-btn,
  .topbar-actions .catalog-config-btn,
  .topbar-actions .config-panel-btn {
    min-height: var(--mobile-control) !important;
    height: var(--mobile-control) !important;
    border-radius: 13px !important;
    font-size: .84rem !important;
  }

  .topbar-actions .btn {
    padding: 0 .72rem;
    justify-content: center;
    white-space: nowrap;
  }

  .topbar-actions .btn i,
  .topbar-actions .search i {
    font-size: .9rem;
  }

  .topbar-actions .search {
    padding: 0 .72rem !important;
    box-shadow: none;
    background: #fff;
  }

  .topbar-actions .search input {
    min-width: 0;
    font-size: .84rem !important;
  }

  .topbar-actions .menu,
  .topbar-actions .menu > .btn,
  .topbar-actions .config-panel-btn,
  .topbar-actions .finance-top-gear,
  .topbar-actions .catalog-config-btn {
    flex: 0 0 var(--mobile-control) !important;
    width: var(--mobile-control) !important;
    min-width: var(--mobile-control) !important;
    padding: 0 !important;
  }

  .content {
    padding: .86rem var(--mobile-gutter) calc(2.2rem + env(safe-area-inset-bottom)) !important;
    overflow-x: hidden;
  }

  .card,
  .card-flat,
  .fin-chart,
  .fin-panel,
  .insights-panel {
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .045);
  }

  .card {
    padding: .9rem;
  }

  .card-header {
    gap: .45rem;
    margin-bottom: .65rem;
  }

  .card-header h2,
  .catalog-head h2,
  .fin-panel-head h3,
  .fin-chart-head h4,
  .insights-panel-title {
    font-size: .96rem !important;
    line-height: 1.2;
  }

  .empty-state {
    padding: 1.25rem .75rem !important;
  }

  .empty-state i {
    font-size: 1.4rem;
  }

  .empty-state p {
    font-size: .9rem;
    line-height: 1.35;
  }

  .fin-kpi-grid {
    gap: .5rem !important;
    margin: 0 calc(var(--mobile-gutter) * -1) .92rem !important;
    padding: .05rem var(--mobile-gutter) .48rem !important;
    scroll-padding-left: var(--mobile-gutter);
    scrollbar-width: none;
  }

  .fin-kpi-grid::-webkit-scrollbar {
    display: none;
  }

  .fin-kpi {
    flex: 0 0 clamp(118px, 31vw, 138px) !important;
    min-height: 82px !important;
    padding: .54rem .58rem .6rem !important;
    border-radius: 13px !important;
    box-shadow: 0 5px 16px rgba(15, 23, 42, .05);
  }

  .fin-kpi::before {
    height: 3px;
  }

  .fin-kpi-head {
    gap: .36rem !important;
    margin-bottom: .22rem !important;
    font-size: .66rem !important;
    line-height: 1.13;
  }

  .fin-kpi-icon {
    width: 24px !important;
    height: 24px !important;
    border-radius: 8px !important;
    font-size: .72rem !important;
  }

  .fin-kpi-label {
    font-size: .66rem !important;
    line-height: 1.12;
    letter-spacing: 0;
  }

  .fin-kpi-value {
    font-size: clamp(.98rem, 4vw, 1.12rem) !important;
    letter-spacing: 0;
  }

  .fin-kpi-foot {
    margin-top: .22rem !important;
    font-size: .62rem !important;
    line-height: 1.15;
    gap: .25rem;
  }

  .fin-kpi-foot .muted {
    font-size: .62rem;
  }

  .clientes-toolbar,
  .catalog-toolbar,
  .agenda-top-actions {
    display: flex !important;
    width: 100%;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .42rem !important;
    flex-wrap: nowrap !important;
  }

  .clientes-toolbar {
    flex-wrap: wrap !important;
  }

  .clientes-toolbar .clientes-tool-menu:first-of-type {
    order: 1;
  }

  .clientes-search {
    order: 2;
    flex: 1 1 150px !important;
    width: auto !important;
    min-width: 140px !important;
  }

  .clientes-primary-btn {
    order: 3;
    flex: 0 1 auto !important;
    min-width: 0;
    max-width: 154px;
    padding-inline: .7rem !important;
  }

  .clientes-toolbar .clientes-tool-menu:last-of-type {
    order: 4;
  }

  .catalog-primary-btn {
    order: 1;
    flex: 0 0 auto !important;
    max-width: 144px;
  }

  .catalog-config-btn {
    order: 2;
  }

  .catalog-search {
    order: 3;
    flex: 1 1 150px !important;
    width: auto !important;
    min-width: 140px !important;
  }

  .agenda-primary-btn {
    flex: 1 1 170px !important;
    min-width: 0 !important;
    max-width: none;
  }

  .agenda-actions-menu {
    flex: 0 0 var(--mobile-control) !important;
    width: var(--mobile-control) !important;
  }

  .agenda-top-actions .menu > .btn {
    width: var(--mobile-control) !important;
  }

  .fin-period-toolbar,
  .dash-period-toolbar {
    flex: 0 0 auto !important;
    width: auto !important;
    min-height: var(--mobile-control) !important;
  }

  .fin-period-select {
    width: 126px !important;
    min-width: 126px !important;
    height: var(--mobile-control) !important;
    padding: 0 2rem 0 .75rem !important;
    font-size: .84rem !important;
  }

  .fin-period-custom.is-visible {
    flex: 1 1 100%;
    display: grid !important;
    grid-template-columns: 1fr 1fr auto;
    gap: .42rem;
  }

  .fin-period-date {
    width: 100% !important;
    min-width: 0;
    height: var(--mobile-control) !important;
    font-size: .78rem !important;
  }

  .finance-top-control:not(.finance-top-gear) {
    flex: 1 1 168px !important;
    padding-inline: .7rem !important;
  }

  .fin-alerts {
    gap: .5rem;
    margin-bottom: .85rem;
  }

  .fin-alert {
    padding: .58rem .68rem;
    border-radius: 12px;
    gap: .55rem;
  }

  .fin-alert-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
  }

  .fin-charts {
    gap: .75rem;
    margin-bottom: .9rem;
  }

  .fin-chart {
    padding: .82rem .84rem;
  }

  .fin-chart-head {
    align-items: flex-start;
    gap: .6rem;
    margin-bottom: .45rem;
  }

  .fin-chart-head .muted {
    font-size: .74rem;
    line-height: 1.25;
  }

  .fin-chart-body {
    height: 174px !important;
  }

  .fin-chart-body canvas {
    max-height: 174px !important;
  }

  .dashboard-card-grid {
    gap: .85rem !important;
  }

  .dash-main-card,
  .dashboard-card-item {
    margin-top: 0 !important;
  }

  .fin-insights,
  .fin-mini-grid {
    gap: .5rem;
  }

  .fin-insight,
  .fin-mini-stat {
    padding: .62rem .68rem;
    border-radius: 12px;
  }

  .agenda-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    gap: .55rem !important;
    margin-bottom: .82rem !important;
    overflow: visible !important;
  }

  .agenda-toolbar-equal > .agenda-toolbar-box {
    width: 100%;
    height: 40px !important;
  }

  .view-switch {
    width: min(100%, 260px);
  }

  .view-switch .vs-item {
    flex: 1 1 0;
    justify-content: center;
    padding-inline: .55rem !important;
  }

  .nav-range {
    width: 100%;
    justify-content: space-between;
  }

  .nav-label {
    min-width: 0 !important;
    flex: 1;
    font-size: .82rem !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .insights-panel.insights-panel--agenda {
    padding: .76rem .82rem !important;
    margin-bottom: .82rem;
  }

  .insights-panel--agenda > summary {
    gap: .45rem !important;
  }

  .insights-grid {
    gap: .55rem !important;
  }

  .insight-card {
    padding: .7rem !important;
    border-radius: 12px !important;
  }

  .day-timeline {
    --day-hour-col: 52px;
    padding: 0 .7rem .7rem;
  }

  .dt-row {
    min-height: 70px;
  }

  .dt-hour {
    font-size: .72rem;
    padding-top: .55rem;
  }

  .dt-event {
    min-height: 56px;
    padding: .42rem .55rem;
    border-radius: 10px;
  }

  .agenda-day-layout {
    --agenda-day-panel-height: auto;
  }

  .agenda-day-timeline-card,
  .agenda-day-list-card {
    height: auto !important;
    min-height: 0 !important;
  }

  .agenda-day-list-card .daypanel-list {
    max-height: 360px;
  }

  .catalog-head {
    padding: .82rem .82rem .68rem;
    align-items: flex-start;
    flex-direction: column;
    gap: .65rem;
  }

  .catalog-filter-pills {
    width: 100%;
  }

  .catalog-pill {
    flex: 1 1 0;
    padding: .4rem .45rem;
  }

  .modal {
    padding: .62rem;
  }

  .modal-card {
    border-radius: 16px;
  }

  .modal-head,
  .modal-body {
    padding: .88rem;
  }

  .modal-foot,
  .modal-actions {
    gap: .45rem;
  }

  body:has(#dashPersonalizarModal.is-open) {
    overflow: hidden;
  }

  #dashPersonalizarModal {
    align-items: stretch;
    justify-content: center;
    padding:
      max(.62rem, env(safe-area-inset-top))
      .62rem
      max(.62rem, env(safe-area-inset-bottom));
  }

  #dashPersonalizarModal .modal-card {
    width: min(100%, 520px);
    height: min(100%, calc(100dvh - max(1.24rem, env(safe-area-inset-top) + env(safe-area-inset-bottom))));
    max-height: calc(100dvh - max(1.24rem, env(safe-area-inset-top) + env(safe-area-inset-bottom)));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 16px;
  }

  #dashPersonalizarModal .modal-head {
    flex: 0 0 auto;
    padding: .82rem .92rem;
    min-height: 58px;
    background: #fff;
    position: relative;
    z-index: 2;
  }

  #dashPersonalizarModal .modal-head h2 {
    min-width: 0;
    font-size: .98rem;
    line-height: 1.15;
  }

  #dashPersonalizarModal .modal-close {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
  }

  #dashPersonalizarModal .modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: .88rem .92rem 1rem;
  }

  #dashPersonalizarModal .modal-body > .muted {
    font-size: .86rem;
    line-height: 1.38;
  }

  #dashPersonalizarModal .modal-foot {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
    gap: .5rem;
    flex: 0 0 auto;
    margin: 0;
    padding: .72rem .92rem max(.72rem, env(safe-area-inset-bottom));
    background: #fff;
    border-top: 1px solid var(--ink-100);
    box-shadow: 0 -10px 22px rgba(15, 23, 42, .06);
    position: relative;
    z-index: 2;
  }

  #dashPersonalizarModal .modal-foot form {
    min-width: 0;
  }

  #dashPersonalizarModal .modal-foot .btn {
    width: 100%;
    min-height: 40px;
    padding-inline: .58rem;
    font-size: .78rem;
    white-space: nowrap;
  }
}

@media (max-width: 640px) {
  .table-wrap {
    border: 0;
    box-shadow: none;
    background: transparent;
    overflow: visible !important;
  }

  #tbClientes,
  .catalog-table,
  .fin-table,
  .dashboard-card-item .table {
    display: block;
    min-width: 0 !important;
    width: 100%;
    border-collapse: separate;
  }

  #tbClientes thead,
  .catalog-table thead,
  .fin-table thead,
  .dashboard-card-item .table thead {
    display: none;
  }

  #tbClientes tbody,
  .catalog-table tbody,
  .fin-table tbody,
  .dashboard-card-item .table tbody {
    display: grid;
    gap: .58rem;
    width: 100%;
  }

  #tbClientes tr,
  .catalog-table tr,
  .fin-table tr,
  .dashboard-card-item .table tr {
    display: grid;
    width: 100%;
    border: 1px solid #e7edf7 !important;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(15, 23, 42, .045);
    overflow: hidden;
  }

  #tbClientes td,
  .catalog-table td,
  .fin-table td,
  .dashboard-card-item .table td {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: .52rem .72rem !important;
    border: 0 !important;
    text-align: left !important;
  }

  #tbClientes td:first-child,
  .catalog-table td:first-child,
  .fin-table td:first-child,
  .dashboard-card-item .table td:first-child {
    padding-top: .72rem !important;
  }

  #tbClientes td:last-child,
  .catalog-table td:last-child,
  .fin-table td:last-child,
  .dashboard-card-item .table td:last-child {
    padding-bottom: .72rem !important;
  }

  #tbClientes td:not(:first-child)::before,
  .catalog-table td:not(:first-child)::before,
  .fin-table td:not(:first-child)::before,
  .dashboard-card-item .table td:not(:first-child)::before,
  .fin-table td:first-child::before,
  .dashboard-card-item .table td:first-child::before {
    display: block;
    margin-bottom: .14rem;
    color: #7d8aa6;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
  }

  #tbClientes td:nth-child(2)::before { content: "Telefone"; }
  #tbClientes td:nth-child(3)::before { content: "Ultima movimentacao"; }
  #tbClientes td:nth-child(4)::before { content: "Agenda"; }
  #tbClientes td:nth-child(5)::before { content: "Acoes"; }

  #tbClientes .cell-main {
    font-size: .98rem;
    line-height: 1.25;
  }

  #tbClientes .cell-soft {
    overflow-wrap: anywhere;
    font-size: .84rem;
    line-height: 1.25;
  }

  #tbClientes td.clientes-actions-cell {
    display: block !important;
  }

  #tbClientes .clientes-actions-group {
    width: 100%;
    display: flex !important;
    justify-content: flex-start !important;
    gap: .42rem !important;
  }

  .clientes-action-placeholder {
    display: none !important;
  }

  .catalog-table td:nth-child(2)::before { content: "Tipo"; }
  .catalog-table td:nth-child(3)::before { content: "Saude"; }
  .catalog-table td:nth-child(4)::before { content: "Preco"; }
  .catalog-table td:nth-child(5)::before { content: "Acoes"; }

  .catalog-item-main {
    min-width: 0;
    align-items: flex-start;
    gap: .58rem;
  }

  .catalog-item-main strong {
    font-size: .96rem;
    line-height: 1.2;
  }

  .catalog-item-main span:last-child {
    white-space: normal;
    max-width: none;
    line-height: 1.25;
  }

  .catalog-meta > span {
    margin-bottom: .25rem;
  }

  .catalog-price {
    text-align: left !important;
  }

  .catalog-actions {
    justify-content: flex-start !important;
  }

  .fin-table td:nth-child(1)::before { content: "Data"; }
  .fin-table td:nth-child(2)::before { content: "Descricao"; }
  .fin-table td:nth-child(3)::before { content: "Origem"; }
  .fin-table td:nth-child(4)::before { content: "Valor"; }
  .fin-table td:nth-child(5)::before { content: "Status"; }
  .fin-table td:nth-child(6)::before { content: "Acoes"; }

  .dashboard-card-item .table td:nth-child(1)::before { content: "Hora"; }
  .dashboard-card-item .table td:nth-child(2)::before { content: "Servico"; }
  .dashboard-card-item .table td:nth-child(3)::before { content: "Status"; }

  .fin-table .fin-cell-date,
  .fin-table .fin-cell-value {
    font-size: .88rem;
  }

  .fin-actions-cell {
    display: flex !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    justify-content: flex-start !important;
    gap: .42rem !important;
  }

  .fin-action-placeholder {
    display: none;
  }

  .filter-chips {
    padding: .62rem .72rem;
  }

  .dashboard-agenda-list {
    max-height: 244px;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: .16rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .dashboard-agenda-row {
    min-height: 42px;
    gap: .42rem;
    padding: .46rem .52rem;
    border-radius: 10px;
  }

  .dashboard-agenda-time,
  .dashboard-agenda-copy {
    font-size: .82rem;
  }

  .dashboard-agenda-copy.has-client .dashboard-agenda-service {
    max-width: 52%;
  }

  .dashboard-agenda-row .badge {
    max-width: 92px;
    padding: .12rem .42rem;
    font-size: .62rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .dashboard-receivables-list {
    max-height: 260px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .dashboard-receivable-row,
  .dashboard-top-row {
    gap: .55rem;
    padding: .5rem .18rem;
  }

  .dashboard-receivable-row {
    align-items: flex-start;
    gap: .6rem;
    min-width: 0;
    padding: .54rem 0;
  }

  .dashboard-receivable-copy {
    flex: 1 1 auto;
    min-width: 0;
    display: grid;
    gap: .18rem;
  }

  .dashboard-receivable-name {
    display: block;
    min-width: 0;
    color: var(--ink-900);
    font-size: .94rem;
    line-height: 1.18;
    font-weight: 850;
  }

  .dashboard-receivable-full {
    display: none;
  }

  .dashboard-receivable-service {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dashboard-receivable-meta {
    display: flex;
    align-items: center;
    gap: .34rem;
    min-width: 0;
    color: #7281a2;
    font-size: .78rem;
    line-height: 1.18;
    white-space: nowrap;
    overflow: hidden;
  }

  .dashboard-receivable-client {
    display: inline-block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dashboard-receivable-client::after {
    content: "·";
    margin-left: .34rem;
    color: #9aa7bf;
  }

  .dashboard-receivable-date {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .dashboard-receivable-badge {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    min-height: 18px;
    padding: .08rem .36rem;
    border-radius: 999px;
    background: #eaf2ff;
    color: #2563eb;
    font-size: .64rem;
    line-height: 1;
    font-weight: 850;
    white-space: nowrap;
  }

  .dashboard-receivable-value {
    flex: 0 0 auto;
    align-self: flex-start;
    max-width: 42%;
    color: #1d4ed8;
    font-size: .94rem;
    line-height: 1.18;
    font-weight: 900;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    font-variant-numeric: tabular-nums;
  }

  .dashboard-agenda-table,
  .dashboard-agenda-table tbody {
    display: grid !important;
    gap: .38rem !important;
  }

  .dashboard-agenda-table tr {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: .48rem;
    padding: .52rem .58rem;
    border-radius: 12px !important;
    border: 1px solid #e5edf8 !important;
    background: #fff;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .035);
  }

  .dashboard-agenda-table td {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    min-width: 0 !important;
  }

  .dashboard-agenda-table td::before {
    display: none !important;
    content: none !important;
  }

  .dashboard-agenda-table td:first-child {
    color: var(--ink-900);
    font-size: .86rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }

  .dashboard-agenda-table td:nth-child(2) {
    color: var(--ink-900);
    font-size: .84rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .dashboard-agenda-table td:nth-child(3) {
    justify-self: end;
  }

  .dashboard-agenda-table .badge {
    min-height: 22px;
    padding: .14rem .46rem;
    font-size: .65rem;
    line-height: 1;
    font-weight: 800;
  }

  .dashboard-upcoming {
    margin-top: .62rem;
  }

  .dashboard-upcoming-title {
    margin-bottom: .34rem !important;
    color: #7887a5;
    font-size: .82rem !important;
    font-weight: 800 !important;
  }

  .dashboard-upcoming-list {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    max-height: 72px;
    overflow-y: auto;
    padding-right: .1rem;
    -webkit-overflow-scrolling: touch;
  }

  .dashboard-upcoming-list .badge {
    padding: .15rem .48rem;
    min-height: 22px;
    font-size: .66rem;
    line-height: 1.1;
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  :root {
    --mobile-control: 40px;
  }

  .topbar {
    padding-top: .68rem !important;
  }

  .topbar-actions {
    gap: .38rem !important;
  }

  .clientes-primary-btn,
  .catalog-primary-btn,
  .finance-top-control:not(.finance-top-gear),
  .agenda-primary-btn {
    font-size: .8rem !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .clientes-primary-btn,
  .catalog-primary-btn {
    max-width: 138px;
    padding-inline: .62rem !important;
  }

  .agenda-top-actions {
    flex-wrap: wrap !important;
  }

  .agenda-primary-btn {
    flex: 1 1 calc(100% - 130px) !important;
  }

  .agenda-top-actions .agenda-icon-btn,
  .agenda-top-actions .config-panel-btn,
  .agenda-top-actions .menu {
    flex: 0 0 var(--mobile-control) !important;
    width: var(--mobile-control) !important;
  }

  .catalog-toolbar {
    flex-wrap: wrap !important;
  }

  .catalog-search {
    flex-basis: 100% !important;
  }

  .finance-top-control:not(.finance-top-gear) {
    flex-basis: calc(100% - 172px) !important;
  }

  .fin-period-select {
    width: 118px !important;
    min-width: 118px !important;
  }

  .fin-period-custom.is-visible {
    grid-template-columns: 1fr;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar {
    display: contents !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar .fin-period-select {
    grid-column: 2;
    grid-row: 1;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar .fin-period-custom {
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar .fin-period-date {
    min-width: 0 !important;
    width: 100% !important;
    padding-inline: .62rem !important;
    font-size: .78rem !important;
    text-align: center;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar .fin-period-custom .btn {
    width: var(--mobile-control);
    min-width: var(--mobile-control);
    padding: 0 !important;
    font-size: 0 !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .dash-period-toolbar .fin-period-custom .btn i {
    font-size: .9rem !important;
  }

  .fin-kpi {
    flex-basis: clamp(112px, 30vw, 126px) !important;
  }

  .fin-kpi-grid {
    margin-bottom: .78rem !important;
  }

  .fin-chart-body {
    height: 154px !important;
  }

  .fin-chart-body canvas {
    max-height: 154px !important;
  }

  .business-logo-row {
    gap: .58rem;
  }

  .business-logo-preview {
    width: 58px !important;
    height: 58px !important;
  }

  .business-logo-copy strong {
    font-size: .82rem;
  }

  .business-logo-copy small {
    font-size: .68rem;
  }
}

/* ============================================================
   MOBILE APP BASELINE V2 - FINAL OVERRIDES
   Mantem prioridade sobre regras antigas do mobile.
   ============================================================ */
@media (max-width: 768px) {
  :root {
    --mobile-gutter: clamp(.72rem, 3.4vw, 1rem);
    --mobile-control: 40px;
    --mobile-radius: 13px;
    --mobile-soft-border: #e6edf8;
  }

  html,
  body {
    max-width: 100%;
    overflow-x: hidden !important;
  }

  body:has(.modal.is-open),
  body:has(.module-help-modal.is-open) {
    overflow: hidden;
  }

  body:has(.modal.is-open) .fab,
  body:has(.module-help-modal.is-open) .fab {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .topbar {
    display: grid !important;
    grid-template-columns: var(--mobile-control) minmax(0, 1fr);
    align-items: center !important;
    gap: .5rem .64rem !important;
    padding: max(.66rem, env(safe-area-inset-top)) var(--mobile-gutter) .66rem !important;
    background: rgba(255, 255, 255, .97) !important;
    overflow: visible !important;
  }

  .mobile-menu-btn {
    grid-column: 1;
    grid-row: 1;
    width: var(--mobile-control) !important;
    height: var(--mobile-control) !important;
    min-width: var(--mobile-control) !important;
    flex-basis: var(--mobile-control) !important;
  }

  .topbar-title {
    grid-column: 2;
    grid-row: 1;
    min-width: 0 !important;
  }

  .topbar-title h1 {
    font-size: clamp(1rem, 4.6vw, 1.2rem) !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .topbar-title .muted {
    margin-top: .15rem !important;
    font-size: .72rem !important;
    line-height: 1.18 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .topbar-actions {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .4rem !important;
    flex-wrap: nowrap !important;
    margin: .05rem 0 0 !important;
    min-width: 0;
    overflow: visible !important;
  }

  .topbar-actions .btn,
  .topbar-actions .select,
  .topbar-actions .search,
  .topbar-actions .menu > .btn,
  .topbar-actions .finance-top-control,
  .topbar-actions .clientes-icon-btn,
  .topbar-actions .agenda-icon-btn,
  .topbar-actions .catalog-config-btn,
  .topbar-actions .config-panel-btn {
    height: var(--mobile-control) !important;
    min-height: var(--mobile-control) !important;
    border-radius: var(--mobile-radius) !important;
    font-size: .82rem !important;
  }

  .topbar-actions .menu,
  .topbar-actions .menu > .btn,
  .topbar-actions .config-panel-btn,
  .topbar-actions .finance-top-gear,
  .topbar-actions .catalog-config-btn,
  .topbar-actions .agenda-icon-btn,
  .topbar-actions .clientes-icon-btn {
    flex: 0 0 var(--mobile-control) !important;
    width: var(--mobile-control) !important;
    min-width: var(--mobile-control) !important;
    padding: 0 !important;
  }

  .content {
    padding: .82rem var(--mobile-gutter) calc(2rem + env(safe-area-inset-bottom)) !important;
  }

  .fin-kpi-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: .48rem !important;
    margin: 0 calc(var(--mobile-gutter) * -1) .82rem !important;
    padding: .03rem var(--mobile-gutter) .46rem !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .fin-kpi-grid::-webkit-scrollbar {
    display: none;
  }

  .fin-kpi {
    flex: 0 0 clamp(112px, 30vw, 126px) !important;
    min-height: 76px !important;
    padding: .5rem .54rem .54rem !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 15px rgba(15, 23, 42, .05) !important;
  }

  .fin-kpi-drag,
  .fin-kpi-edit {
    display: none !important;
  }

  .fin-kpi-head {
    gap: .34rem !important;
    margin-bottom: .2rem !important;
    padding-left: 0 !important;
  }

  .fin-kpi-icon {
    width: 24px !important;
    height: 24px !important;
    border-radius: 8px !important;
    font-size: .72rem !important;
  }

  .fin-kpi-label {
    font-size: .65rem !important;
    line-height: 1.1 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi-value {
    padding-left: 0 !important;
    font-size: clamp(.96rem, 3.8vw, 1.12rem) !important;
    line-height: 1.05 !important;
  }

  .fin-kpi-foot,
  .fin-kpi-foot .muted {
    padding-left: 0 !important;
    margin-top: .2rem !important;
    font-size: .61rem !important;
    line-height: 1.12 !important;
  }

  .clientes-toolbar,
  .catalog-toolbar,
  .agenda-top-actions {
    width: 100%;
    display: flex !important;
    align-items: center !important;
    gap: .4rem !important;
    flex-wrap: nowrap !important;
    min-width: 0;
  }

  .clientes-primary-btn,
  .catalog-primary-btn,
  .agenda-primary-btn,
  .finance-top-control:not(.finance-top-gear) {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .clientes-search,
  .catalog-search {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
  }

  .fin-period-select {
    width: clamp(112px, 34vw, 138px) !important;
    min-width: 0 !important;
  }

  .fin-period-custom.is-visible {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) var(--mobile-control) !important;
    gap: .38rem !important;
  }

  .dash-period-toolbar .fin-period-custom,
  .dash-period-toolbar .fin-period-custom.is-visible {
    display: none !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) {
    grid-template-columns: var(--mobile-control) minmax(0, 1fr) auto !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .topbar-title {
    display: block !important;
  }

  .topbar:has(.dash-period-toolbar .fin-period-custom.is-visible) .topbar-actions {
    grid-column: 3;
    grid-row: 1;
    width: auto;
    display: flex !important;
  }

  .modal {
    align-items: stretch !important;
    padding:
      max(.58rem, env(safe-area-inset-top))
      .58rem
      max(.58rem, env(safe-area-inset-bottom)) !important;
  }

  .modal-card {
    width: min(100%, 540px) !important;
    max-height: calc(100dvh - max(1.16rem, env(safe-area-inset-top) + env(safe-area-inset-bottom))) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  .modal-head {
    flex: 0 0 auto !important;
    min-height: 56px;
    padding: .8rem .9rem !important;
    background: #fff;
    z-index: 2;
  }

  .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: .86rem .9rem !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  .modal-actions {
    flex: 0 0 auto !important;
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch !important;
    gap: .52rem !important;
    margin: .72rem -.9rem -.86rem !important;
    padding: .68rem .9rem calc(16px + env(safe-area-inset-bottom)) !important;
    background: #fff;
    border-top: 1px solid var(--mobile-soft-border);
    box-shadow: 0 -10px 22px rgba(15, 23, 42, .06);
  }

  .modal-actions .btn {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding-inline: .62rem;
    border-radius: 12px;
    white-space: nowrap;
  }

  #dashPersonalizarModal .modal-foot,
  #finPersonalizarModal .modal-foot,
  #agendaPersonalizarModal .modal-foot,
  #clientesPersonalizarModal .modal-foot,
  #prodPersonalizarModal .modal-foot {
    position: sticky;
    bottom: 0;
    z-index: 3;
    margin: .75rem -.9rem -.86rem !important;
    padding: .68rem .9rem max(.68rem, env(safe-area-inset-bottom)) !important;
    background: #fff;
    border-top: 1px solid var(--mobile-soft-border);
    box-shadow: 0 -10px 22px rgba(15, 23, 42, .06);
  }

  #dashPersonalizarModal .modal-foot {
    position: relative;
    margin: 0 !important;
  }

  .dash-period-sheet {
    align-items: flex-end !important;
    padding: 0 .58rem max(.58rem, env(safe-area-inset-bottom)) !important;
  }

  .dash-period-sheet .modal-card {
    width: min(100%, 520px) !important;
    max-height: calc(100dvh - max(1.2rem, env(safe-area-inset-top))) !important;
    border-radius: 18px 18px 0 0 !important;
    animation: dash-period-sheet-in .18s ease-out;
  }

  .dash-period-sheet-form {
    display: flex;
    flex-direction: column;
    gap: .86rem;
  }

  .dash-period-sheet-form .form-grid {
    grid-template-columns: 1fr !important;
    gap: .72rem;
  }

  .dash-period-sheet-form .input {
    min-height: 44px;
    font-size: .92rem;
  }

  .period-filter-error {
    margin: -.25rem 0 0;
    color: #dc2626;
    font-weight: 700;
    line-height: 1.3;
  }

  .dash-period-sheet-actions {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1fr);
    gap: .5rem !important;
    margin: .1rem 0 0 !important;
    padding-top: .72rem !important;
  }

  .dash-period-sheet-actions .btn {
    width: 100%;
    min-height: 42px;
    justify-content: center;
  }
}

@keyframes dash-period-sheet-in {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 480px) {
  .topbar-title .muted {
    display: none !important;
  }

  .clientes-toolbar {
    flex-wrap: wrap !important;
  }

  .clientes-primary-btn {
    order: 1;
    flex: 1 1 calc(100% - 88px) !important;
  }

  .clientes-search {
    order: 4;
    flex: 1 1 100% !important;
  }

  .clientes-tool-menu:first-of-type {
    order: 2;
  }

  .clientes-tool-menu:last-of-type {
    order: 3;
  }

  .catalog-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--mobile-control);
  }

  .catalog-primary-btn {
    grid-column: 1;
    grid-row: 1;
  }

  .catalog-config-btn {
    grid-column: 2;
    grid-row: 1;
  }

  .catalog-search {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .agenda-top-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) repeat(3, var(--mobile-control));
  }
}

.mobile-search-toggle {
  display: none;
}

/* ============================================================
   MOBILE FINAL UNIFIED EXPERIENCE
   Mantem desktop intacto e padroniza celular/tablet.
   ============================================================ */
@media (max-width: 768px) {
  .topbar {
    grid-template-columns: var(--mobile-control) minmax(0, 1fr) auto !important;
    align-items: center !important;
  }

  .topbar-title .muted {
    display: none !important;
  }

  .topbar-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: auto !important;
    margin: 0 !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: .36rem !important;
    overflow: visible !important;
  }

  .topbar-actions .menu,
  .topbar-actions .menu > .btn,
  .topbar-actions .config-panel-btn,
  .topbar-actions .finance-top-gear,
  .topbar-actions .catalog-config-btn,
  .topbar-actions .agenda-icon-btn,
  .topbar-actions .clientes-icon-btn,
  .topbar-actions .mobile-search-toggle {
    flex: 0 0 var(--mobile-control) !important;
    width: var(--mobile-control) !important;
    min-width: var(--mobile-control) !important;
    height: var(--mobile-control) !important;
    min-height: var(--mobile-control) !important;
    padding: 0 !important;
  }

  .topbar-actions .mobile-search-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }

  .topbar-actions .fin-period-toolbar,
  .topbar-actions .dash-period-toolbar {
    width: auto !important;
    flex: 0 0 auto !important;
    min-height: var(--mobile-control) !important;
  }

  .topbar-actions .fin-period-select {
    width: clamp(112px, 34vw, 138px) !important;
    min-width: 112px !important;
    height: var(--mobile-control) !important;
    padding-inline: .68rem 1.8rem !important;
    font-size: .82rem !important;
  }

  .topbar-actions .fin-period-custom,
  .topbar-actions .fin-period-custom.is-visible {
    display: none !important;
  }

  .topbar-actions .clientes-primary-btn,
  .topbar-actions .agenda-primary-btn,
  .topbar-actions .catalog-primary-btn,
  .topbar-actions .finance-top-control:not(.finance-top-gear) {
    display: none !important;
  }

  .clientes-toolbar,
  .catalog-toolbar,
  .agenda-top-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: .36rem !important;
    width: auto !important;
    min-width: 0 !important;
    overflow: visible !important;
    position: relative;
  }

  .main-panel-clientes .clientes-search.mobile-search-panel,
  .main-panel-produtos .catalog-search.mobile-search-panel {
    display: none !important;
    position: absolute;
    top: calc(100% + .42rem);
    right: 0;
    width: min(88vw, 320px) !important;
    height: 40px !important;
    min-width: 0 !important;
    z-index: 65;
    border: 1px solid #d8e3f6;
    box-shadow: 0 12px 26px rgba(15, 23, 42, .14);
    background: #fff;
  }

  .main-panel-clientes .clientes-search.mobile-search-panel.is-open,
  .main-panel-produtos .catalog-search.mobile-search-panel.is-open {
    display: flex !important;
  }

  .menu-pop {
    max-width: min(88vw, 320px) !important;
    max-height: min(62dvh, 380px);
    overflow-y: auto;
  }

  .menu-pop-right {
    right: 0 !important;
    left: auto !important;
  }

  .menu-pop.menu-pop-sheet {
    position: fixed !important;
    left: .62rem !important;
    right: .62rem !important;
    top: auto !important;
    bottom: calc(.62rem + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(66dvh, 420px) !important;
    border-radius: 14px !important;
    transform: none !important;
    opacity: 1 !important;
    z-index: 82;
  }

  .fab {
    right: 1rem !important;
    bottom: calc(1rem + env(safe-area-inset-bottom)) !important;
    width: 56px;
    height: 56px;
    z-index: 78;
  }

  .agenda-toolbar,
  .week-view,
  .agenda-card {
    overflow-x: auto;
  }
}

@media (max-width: 640px) {
  #tbClientes td::before,
  .catalog-table td::before {
    display: none !important;
    content: none !important;
  }

  #tbClientes tbody,
  .catalog-table tbody {
    gap: .45rem !important;
  }

  #tbClientes tr,
  .catalog-table tr {
    border-radius: 12px !important;
    box-shadow: 0 5px 16px rgba(15, 23, 42, .05) !important;
  }

  #tbClientes td,
  .catalog-table td {
    padding: .38rem .62rem !important;
  }

  #tbClientes td:first-child,
  .catalog-table td:first-child {
    padding-top: .6rem !important;
  }

  #tbClientes td:last-child,
  .catalog-table td:last-child {
    padding-bottom: .62rem !important;
  }

  #tbClientes .cell-main {
    font-size: .92rem !important;
    line-height: 1.2 !important;
  }

  #tbClientes .cell-soft {
    font-size: .8rem !important;
    line-height: 1.2 !important;
  }

  #tbClientes .clientes-actions-group {
    gap: .34rem !important;
  }

  #tbClientes .clientes-actions-group .icon-btn {
    width: 30px !important;
    height: 30px !important;
    border-radius: 8px !important;
  }

  .catalog-item-main strong {
    font-size: .9rem !important;
    line-height: 1.18 !important;
  }

.catalog-item-main span {
  font-size: .78rem !important;
  line-height: 1.18 !important;
}
}

/* ============================================================
   FAB GLOBAL RESPONSIVO (telas intermediarias + mobile)
   Mantem desktop amplo com botoes completos no topo.
   ============================================================ */
@media (max-width: 1279px) {
  .main-panel-clientes .topbar-title .muted,
  .main-panel-agenda .topbar-title .muted,
  .main-panel-financeiro .topbar-title .muted,
  .main-panel-produtos .topbar-title .muted {
    display: none !important;
  }

  .main-panel-clientes .topbar-actions,
  .main-panel-agenda .topbar-actions,
  .main-panel-financeiro .topbar-actions,
  .main-panel-produtos .topbar-actions {
    flex-wrap: nowrap !important;
    gap: .38rem !important;
    min-width: 0 !important;
    overflow: visible !important;
    justify-content: flex-end !important;
  }

  .main-panel-clientes .topbar-actions .clientes-primary-btn,
  .main-panel-agenda .topbar-actions .agenda-primary-btn,
  .main-panel-produtos .topbar-actions .catalog-primary-btn,
  .main-panel-financeiro .topbar-actions .finance-top-control:not(.finance-top-gear) {
    display: none !important;
  }

  .main-panel-clientes .clientes-toolbar,
  .main-panel-produtos .catalog-toolbar,
  .main-panel-agenda .agenda-top-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .38rem !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    min-width: 0 !important;
    overflow: visible !important;
    position: relative;
  }

  .main-panel-clientes .mobile-search-toggle,
  .main-panel-produtos .mobile-search-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    padding: 0 !important;
    border-radius: 12px !important;
  }

  .main-panel-clientes .clientes-search.mobile-search-panel,
  .main-panel-produtos .catalog-search.mobile-search-panel {
    display: none !important;
    position: absolute;
    top: calc(100% + .42rem);
    right: 0;
    width: min(86vw, 340px) !important;
    height: 40px !important;
    min-width: 0 !important;
    z-index: 65;
    border: 1px solid #d8e3f6;
    box-shadow: 0 12px 26px rgba(15, 23, 42, .14);
    background: #fff;
  }

  .main-panel-clientes .clientes-search.mobile-search-panel.is-open,
  .main-panel-produtos .catalog-search.mobile-search-panel.is-open {
    display: flex !important;
  }

  .fab {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 56px !important;
    height: 56px !important;
    border-radius: 50%;
    border: 0 !important;
    background: #2563eb !important;
    color: #fff !important;
    opacity: 1 !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, .34), 0 4px 10px rgba(15, 23, 42, .16) !important;
    position: fixed;
    right: max(1rem, env(safe-area-inset-right));
    bottom: calc(max(1rem, env(safe-area-inset-bottom)) + 8px);
    z-index: 88 !important;
  }
}

@media (max-width: 768px) {
  .sidebar {
    box-sizing: border-box;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden;
    padding-bottom: calc(16px + env(safe-area-inset-bottom)) !important;
  }

  .sidebar .brand {
    flex: 0 0 auto;
  }

  .sidenav {
    min-height: 0;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  .sidebar-footer {
    flex: 0 0 auto;
    align-items: center;
    gap: .65rem;
    margin-top: .85rem;
    padding-top: .85rem;
  }

  .sidebar-footer .user-chip {
    flex: 1 1 auto;
    min-width: 0;
  }

  .sidebar-logout-form {
    flex: 0 0 auto;
  }

  .sidebar-logout-btn {
    min-height: 40px;
    padding: .5rem .68rem;
    border-radius: 12px;
    white-space: nowrap;
  }

  .sidebar-logout-label {
    display: inline;
  }
}

/* ============================================================
   LANDING MOBILE PREMIUM FINAL
   Ajustes somente responsivos; desktop permanece com o grid base.
   ============================================================ */
@media (max-width: 768px) {
  .landing {
    min-height: 100dvh;
    overflow-x: clip;
    background:
      radial-gradient(28rem 18rem at 50% -7rem, rgba(37, 99, 235, .16), transparent 68%),
      radial-gradient(24rem 18rem at 105% 10rem, rgba(79, 70, 229, .1), transparent 62%),
      linear-gradient(180deg, #f8fbff 0%, #eef4ff 58%, #f6f9ff 100%) !important;
    padding-top: max(.7rem, env(safe-area-inset-top));
  }

  .landing-nav {
    width: min(100%, 560px);
    margin: 0 auto;
    justify-content: flex-start !important;
    padding: .92rem clamp(1rem, 5vw, 1.5rem) .7rem !important;
    background: transparent !important;
    border-bottom: 0 !important;
  }

  .landing-nav-actions {
    display: none !important;
  }

  .landing-nav .brand {
    width: auto !important;
    min-width: 0;
    justify-content: flex-start !important;
    gap: .72rem !important;
    color: #0f1f44 !important;
  }

  .landing-nav .brand-mark {
    width: 52px !important;
    height: 52px !important;
    border-radius: 14px !important;
    font-size: 1.28rem !important;
    background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, .26) !important;
  }

  .landing-nav .brand-name {
    display: block;
    color: #0f1f44 !important;
    font-size: clamp(1.28rem, 6vw, 1.62rem) !important;
    font-weight: 850 !important;
    line-height: .98 !important;
    letter-spacing: 0 !important;
  }

  .landing-nav .brand-name br {
    display: block !important;
  }

  .landing-nav .brand-name strong {
    display: inline;
    margin-left: 0 !important;
    font-size: 1em !important;
    font-weight: 850 !important;
  }

  .landing-hero {
    width: min(100%, 560px);
    margin: 0 auto;
    display: flex !important;
    flex-direction: column;
    gap: 1.45rem !important;
    padding: 1.1rem clamp(1rem, 5vw, 1.5rem) 2.1rem !important;
    background: transparent !important;
  }

  .landing-hero > div:first-child {
    order: 1;
  }

  .hero-preview {
    order: 0 !important;
    width: 100%;
    border-radius: 20px !important;
    border-color: #d9e3f5 !important;
    background: rgba(255, 255, 255, .9) !important;
    box-shadow: 0 20px 48px rgba(15, 23, 42, .1) !important;
    overflow: hidden;
  }

  .hero-preview-header {
    padding: .74rem .95rem !important;
    gap: .48rem !important;
  }

  .hero-preview-header span {
    width: 10px !important;
    height: 10px !important;
    background: #d9e1f2 !important;
  }

  .hero-preview-body {
    padding: 1rem !important;
  }

  .hero-preview-body .kpi-row {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .55rem !important;
    margin-bottom: .78rem !important;
  }

  .hero-preview-body .mini-kpi {
    min-width: 0;
    padding: .72rem .68rem !important;
    border-radius: 13px !important;
    background: #f3f7fc !important;
  }

  .hero-preview-body .mini-kpi small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: clamp(.66rem, 2.8vw, .78rem) !important;
    line-height: 1.2;
  }

  .hero-preview-body .mini-kpi b {
    display: block;
    margin-top: .16rem;
    font-size: clamp(1rem, 4.6vw, 1.28rem) !important;
    line-height: 1.05;
    white-space: nowrap;
  }

  .hero-preview-body .bars {
    height: clamp(88px, 25vw, 116px) !important;
    gap: .42rem !important;
    padding: .7rem .65rem !important;
    border-radius: 15px !important;
    background: #f3f7fc !important;
  }

  .hero-preview-body .bars i {
    min-width: 0;
    border-radius: 6px !important;
  }

  .hero-tag {
    max-width: 100%;
    margin-bottom: .95rem !important;
    padding: .46rem .78rem !important;
    border-color: #d7e1f2 !important;
    border-radius: 999px !important;
    color: #1d4ed8 !important;
    background: rgba(255, 255, 255, .9) !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .07) !important;
    font-size: clamp(.76rem, 3.2vw, .88rem) !important;
    line-height: 1.15;
  }

  .hero-title {
    margin: 0 0 .82rem !important;
    font-size: clamp(2.45rem, 10.6vw, 4rem) !important;
    line-height: .95 !important;
    letter-spacing: 0 !important;
  }

  .hero-sub {
    max-width: none !important;
    margin: 0 !important;
    color: #5f6f8d !important;
    font-size: clamp(1.08rem, 4.7vw, 1.34rem) !important;
    line-height: 1.48 !important;
  }

  .hero-ctas {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: .72rem !important;
    margin-top: 1.55rem !important;
  }

  .hero-ctas .btn {
    width: 100% !important;
    min-height: 50px;
    justify-content: center;
    padding: .78rem .85rem !important;
    border-radius: 13px !important;
    font-size: clamp(.92rem, 3.8vw, 1rem) !important;
    line-height: 1.1;
    white-space: nowrap;
    box-shadow: 0 12px 22px rgba(37, 99, 235, .18);
  }

  .hero-ctas .btn-outline {
    background: rgba(255, 255, 255, .82) !important;
    border-color: #d5dfef !important;
    color: #0f1f44 !important;
    box-shadow: 0 10px 20px rgba(15, 23, 42, .06);
  }

  .hero-points {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .72rem .9rem !important;
    margin-top: 1.45rem !important;
    color: #5f6f8d !important;
    font-size: .96rem !important;
  }

  .hero-points span {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    line-height: 1.25;
  }

  .hero-points i {
    flex: 0 0 auto;
    margin-right: 0 !important;
  }

  .landing-features {
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
    display: flex !important;
    grid-template-columns: none !important;
    gap: .9rem !important;
    padding: .15rem clamp(1rem, 5vw, 1.5rem) calc(2rem + env(safe-area-inset-bottom)) !important;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: clamp(1rem, 5vw, 1.5rem);
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }

  .landing-features::-webkit-scrollbar {
    display: none;
  }

  .feature-card {
    flex: 0 0 min(78vw, 330px) !important;
    max-width: none !important;
    min-height: 210px;
    margin: 0 !important;
    scroll-snap-align: center;
    scroll-snap-stop: always;
    border-radius: 20px !important;
    border: 1px solid #e1e8f4 !important;
    padding: 1.35rem !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 16px 36px rgba(15, 23, 42, .08) !important;
  }

  .feature-card:first-child {
    margin-left: 0 !important;
  }

  .feature-card:last-child {
    margin-right: 0 !important;
  }

  .feature-card .fi {
    width: 52px !important;
    height: 52px !important;
    margin-bottom: .9rem !important;
    border-radius: 15px !important;
    background: #edf4ff !important;
    color: #1d4ed8 !important;
    font-size: 1.15rem !important;
  }

  .feature-card h3 {
    margin: 0 0 .55rem !important;
    color: #0f1f44 !important;
    font-size: clamp(1.12rem, 4.8vw, 1.38rem) !important;
    line-height: 1.12 !important;
  }

  .feature-card p {
    margin: 0 !important;
    color: #7281a0 !important;
    font-size: clamp(.94rem, 4vw, 1.08rem) !important;
    line-height: 1.45 !important;
  }

  .landing-footer {
    width: min(100%, 560px);
    margin: 0 auto;
    padding: .8rem clamp(1rem, 5vw, 1.5rem) calc(1.5rem + env(safe-area-inset-bottom)) !important;
    color: #7c8baa !important;
    font-size: .9rem !important;
    line-height: 1.35;
  }
}

@media (max-width: 380px) {
  .landing-nav .brand-mark {
    width: 48px !important;
    height: 48px !important;
  }

  .hero-preview-body {
    padding: .85rem !important;
  }

  .hero-preview-body .kpi-row {
    gap: .45rem !important;
  }

  .hero-preview-body .mini-kpi {
    padding: .62rem .55rem !important;
  }

  .hero-ctas {
    gap: .58rem !important;
  }

  .hero-ctas .btn {
    min-height: 48px;
    padding-inline: .62rem !important;
    font-size: .9rem !important;
  }

  .feature-card {
    flex-basis: min(82vw, 310px) !important;
  }
}

@media (max-width: 900px) and (orientation: landscape) {
  .landing {
    min-height: 100dvh;
    overflow-x: clip;
    padding-top: max(.35rem, env(safe-area-inset-top));
    background:
      radial-gradient(28rem 18rem at 50% -7rem, rgba(37, 99, 235, .16), transparent 68%),
      radial-gradient(24rem 18rem at 105% 10rem, rgba(79, 70, 229, .1), transparent 62%),
      linear-gradient(180deg, #f8fbff 0%, #eef4ff 58%, #f6f9ff 100%) !important;
  }

  .landing-nav {
    width: min(100%, 860px);
    margin: 0 auto;
    justify-content: flex-start !important;
    padding-top: .55rem !important;
    padding-bottom: .35rem !important;
    background: transparent !important;
    border-bottom: 0 !important;
  }

  .landing-nav-actions {
    display: none !important;
  }

  .landing-nav .brand {
    justify-content: flex-start !important;
    gap: .62rem !important;
  }

  .landing-nav .brand-mark {
    width: 48px !important;
    height: 48px !important;
    border-radius: 13px !important;
    background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, .24) !important;
  }

  .landing-nav .brand-name {
    color: #0f1f44 !important;
    font-size: 1.34rem !important;
    font-weight: 850 !important;
    line-height: .98 !important;
  }

  .landing-nav .brand-name br {
    display: block !important;
  }

  .landing-hero {
    display: grid !important;
    grid-template-columns: minmax(0, .95fr) minmax(260px, 1fr);
    align-items: center;
    gap: 1rem !important;
    width: min(100%, 860px);
    padding-top: .65rem !important;
    padding-bottom: 1.1rem !important;
  }

  .landing-hero > div:first-child {
    order: 0;
  }

  .hero-preview {
    order: 1 !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 36px rgba(15, 23, 42, .09) !important;
  }

  .hero-title {
    font-size: clamp(2rem, 6vw, 3rem) !important;
  }

  .hero-sub {
    font-size: clamp(.95rem, 2.7vw, 1.12rem) !important;
    line-height: 1.38 !important;
  }

  .hero-ctas {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: .58rem !important;
    margin-top: 1rem !important;
  }

  .hero-ctas .btn {
    width: 100% !important;
    min-height: 48px;
    justify-content: center;
    padding: .66rem .72rem !important;
    border-radius: 12px !important;
    white-space: nowrap;
  }

  .hero-points {
    grid-template-columns: 1fr 1fr;
    font-size: .86rem !important;
  }

  .landing-features {
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
    display: flex !important;
    grid-template-columns: none !important;
    gap: .9rem !important;
    padding: .15rem clamp(1rem, 4vw, 1.5rem) calc(1rem + env(safe-area-inset-bottom)) !important;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: clamp(1rem, 4vw, 1.5rem);
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }

  .landing-features::-webkit-scrollbar {
    display: none;
  }

  .feature-card {
    flex: 0 0 min(40vw, 280px) !important;
    max-width: none !important;
    min-height: 180px;
    margin: 0 !important;
    scroll-snap-align: center;
    scroll-snap-stop: always;
    border-radius: 18px !important;
    border: 1px solid #e1e8f4 !important;
    padding: 1.15rem !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .07) !important;
  }

  .feature-card .fi {
    width: 46px !important;
    height: 46px !important;
    border-radius: 13px !important;
  }
}

/* ============================================================
   CLIENTES MOBILE COMPACT LIST
   Linhas enxutas para leitura rapida em mobile/tablet.
   ============================================================ */
@media (max-width: 1024px) {
  .main-panel-clientes .card-flat {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .main-panel-clientes .table-wrap.table-clean {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  #tbClientes {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  #tbClientes thead {
    display: none !important;
  }

  #tbClientes tbody {
    display: grid !important;
    gap: .42rem !important;
    width: 100% !important;
  }

  #tbClientes tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "name actions"
      "phone actions"
      "badges actions";
    align-items: center !important;
    column-gap: .55rem !important;
    row-gap: .1rem !important;
    width: 100% !important;
    min-height: 76px !important;
    padding: .68rem .72rem !important;
    border: 1px solid #e2eaf6 !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .055) !important;
  }

  #tbClientes td {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
  }

  #tbClientes td::before {
    display: none !important;
    content: none !important;
  }

  #tbClientes td:nth-child(1) {
    grid-area: name;
    align-self: end;
  }

  #tbClientes td:nth-child(2) {
    grid-area: phone;
    align-self: start;
  }

  #tbClientes td:nth-child(3) {
    display: none !important;
  }

  #tbClientes td:nth-child(4) {
    grid-area: badges;
    margin-top: .1rem;
  }

  #tbClientes td:nth-child(5) {
    grid-area: actions;
    align-self: center;
    justify-self: end;
  }

  #tbClientes .cell-main {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: #101b35 !important;
    font-size: clamp(.94rem, 4vw, 1.04rem) !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
  }

  #tbClientes .cell-soft {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: #2563eb !important;
    font-size: clamp(.82rem, 3.6vw, .94rem) !important;
    line-height: 1.18 !important;
  }

  #tbClientes .clientes-agenda-cell:not(.has-clientes-badges) {
    display: none !important;
  }

  .clientes-mini-badges {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    min-width: 0;
  }

  .clientes-mini-badge {
    display: inline-flex;
    align-items: center;
    gap: .22rem;
    height: 20px;
    padding: 0 .42rem;
    border-radius: 999px;
    background: #f1f5fb;
    color: #64748b;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1;
  }

  .clientes-mini-badge i {
    color: #2563eb;
    font-size: .67rem;
  }

  #tbClientes .clientes-actions-cell {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
  }

  #tbClientes .clientes-actions-group {
    display: grid !important;
    grid-template-columns: repeat(3, 30px) !important;
    align-items: center !important;
    justify-content: end !important;
    justify-items: center !important;
    gap: .26rem !important;
    width: auto !important;
    white-space: nowrap !important;
  }

  #tbClientes .clientes-actions-group form {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
  }

  #tbClientes .clientes-actions-group .icon-btn,
  #tbClientes .clientes-actions-group .clientes-action-placeholder {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    flex: 0 0 30px !important;
    border-radius: 10px !important;
    font-size: .86rem !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #tbClientes .clientes-actions-group .icon-wa {
    color: #16a34a !important;
  }

  #tbClientes .clientes-actions-group .icon-danger {
    color: #64748b !important;
  }

  .main-panel-clientes .fab {
    background: #2563eb !important;
    color: #fff !important;
    opacity: 1 !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, .36), 0 5px 12px rgba(15, 23, 42, .16) !important;
  }
}

/* ============================================================
   CLIENTE PROFILE MOBILE HEADER
   Topo compacto do perfil sem acoes redundantes em mobile/tablet.
   ============================================================ */
@media (max-width: 1024px) {
  .topbar:has(.cliente-profile-whatsapp) {
    grid-template-columns: var(--mobile-control) minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: .54rem !important;
    padding-top: .62rem !important;
    padding-bottom: .62rem !important;
    min-height: 0 !important;
  }

  .topbar:has(.cliente-profile-whatsapp) .topbar-title {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  .topbar:has(.cliente-profile-whatsapp) .topbar-title h1 {
    font-size: clamp(1.06rem, 4.4vw, 1.24rem) !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .topbar:has(.cliente-profile-whatsapp) .topbar-title .muted {
    display: none !important;
  }

  .topbar:has(.cliente-profile-whatsapp) .topbar-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: .34rem !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .cliente-profile-return {
    display: none !important;
  }

  .topbar-actions .cliente-profile-back,
  .topbar-actions .cliente-profile-whatsapp {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    flex: 0 0 40px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .055) !important;
  }

  .topbar-actions .cliente-profile-back {
    color: #1f2a44 !important;
    background: rgba(255, 255, 255, .94) !important;
    border: 1px solid #dbe4f3 !important;
  }

  .topbar-actions .cliente-profile-whatsapp {
    color: #16a34a !important;
    background: #ecfdf3 !important;
    border: 1px solid #bbf7d0 !important;
  }

  .topbar-actions .cliente-profile-back i,
  .topbar-actions .cliente-profile-whatsapp i {
    font-size: 1.02rem !important;
  }

  .cliente-profile-back-label,
  .cliente-profile-whatsapp-label {
    display: none !important;
  }
}

/* ============================================================
   PRODUTOS MOBILE COMPACT CATALOG
   Catalogo enxuto e escaneavel para mobile/tablet.
   ============================================================ */
@media (max-width: 1024px) {
  .main-panel-produtos .catalog-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .56rem !important;
    margin-bottom: .72rem !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi {
    min-height: 84px !important;
    padding: .62rem .58rem !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .055) !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi-head {
    gap: .38rem !important;
    margin-bottom: .32rem !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 10px !important;
    font-size: .82rem !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi-label {
    font-size: clamp(.68rem, 2.6vw, .78rem) !important;
    line-height: 1.08 !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi-value,
  .main-panel-produtos .catalog-kpis .catalog-kpi-text {
    font-size: clamp(1rem, 4.8vw, 1.22rem) !important;
    line-height: 1.04 !important;
    margin: 0 !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi-foot {
    margin-top: .26rem !important;
    line-height: 1.05 !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi-foot .muted {
    font-size: clamp(.62rem, 2.6vw, .72rem) !important;
    line-height: 1.08 !important;
  }

  .main-panel-produtos .catalog-card {
    padding: .78rem !important;
    overflow: visible !important;
    border-radius: 18px !important;
  }

  .main-panel-produtos .catalog-head {
    padding: 0 0 .7rem !important;
    border-bottom: 1px solid #edf2f7 !important;
    gap: .58rem !important;
  }

  .main-panel-produtos .catalog-head h2 {
    font-size: clamp(1rem, 4.4vw, 1.12rem) !important;
    line-height: 1.12 !important;
  }

  .main-panel-produtos .catalog-head p {
    margin-top: .12rem !important;
    font-size: .74rem !important;
    line-height: 1.15 !important;
  }

  .main-panel-produtos .catalog-filter-pills {
    height: 38px !important;
    padding: .18rem !important;
    border-radius: 13px !important;
    gap: .14rem !important;
  }

  .main-panel-produtos .catalog-pill {
    min-height: 32px !important;
    padding: 0 .44rem !important;
    border-radius: 10px !important;
    font-size: clamp(.74rem, 3.2vw, .84rem) !important;
  }

  .main-panel-produtos .catalog-table-wrap {
    margin-top: .58rem !important;
    border: 0 !important;
    background: transparent !important;
    overflow: visible !important;
  }

  .main-panel-produtos .catalog-table {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    border-collapse: separate !important;
  }

  .main-panel-produtos .catalog-table thead {
    display: none !important;
  }

  .main-panel-produtos .catalog-table tbody {
    display: grid !important;
    gap: .5rem !important;
    width: 100% !important;
  }

  .main-panel-produtos .catalog-table tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "main actions"
      "type price"
      "meta price";
    column-gap: .58rem !important;
    row-gap: .28rem !important;
    width: 100% !important;
    min-height: 112px !important;
    padding: .72rem .72rem .68rem !important;
    border: 1px solid #e2eaf6 !important;
    border-radius: 15px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .055) !important;
    overflow: hidden !important;
  }

  .main-panel-produtos .catalog-table td {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
  }

  .main-panel-produtos .catalog-table td::before {
    display: none !important;
    content: none !important;
  }

  .main-panel-produtos .catalog-table td:nth-child(1) {
    grid-area: main;
    align-self: start;
  }

  .main-panel-produtos .catalog-table td:nth-child(2) {
    grid-area: type;
    align-self: center;
  }

  .main-panel-produtos .catalog-table td:nth-child(3) {
    grid-area: meta;
    align-self: center;
  }

  .main-panel-produtos .catalog-table td:nth-child(4) {
    grid-area: price;
    align-self: end;
    justify-self: end;
    text-align: right !important;
  }

  .main-panel-produtos .catalog-table td:nth-child(5) {
    grid-area: actions;
    align-self: start;
    justify-self: end;
  }

  .main-panel-produtos .catalog-item-main {
    min-width: 0 !important;
    max-width: 100% !important;
    gap: .56rem !important;
    align-items: flex-start !important;
  }

  .main-panel-produtos .catalog-item-main > div {
    min-width: 0 !important;
  }

  .main-panel-produtos .catalog-item-icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 12px !important;
    font-size: .92rem !important;
  }

  .main-panel-produtos .catalog-item-main strong {
    max-width: 100% !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: #101b35 !important;
    font-size: clamp(.94rem, 4vw, 1.04rem) !important;
    font-weight: 850 !important;
    line-height: 1.12 !important;
  }

  .main-panel-produtos .catalog-item-main .catalog-item-subtitle {
    max-width: 100% !important;
    margin-top: .12rem !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: #7a88a2 !important;
    font-size: clamp(.72rem, 3vw, .82rem) !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  .main-panel-produtos .catalog-tags {
    display: none !important;
  }

  .main-panel-produtos .catalog-badge,
  .main-panel-produtos .catalog-health,
  .main-panel-produtos .catalog-alert {
    min-height: 20px !important;
    padding: 0 .46rem !important;
    font-size: .65rem !important;
    line-height: 1 !important;
    border-radius: 999px !important;
  }

  .main-panel-produtos .catalog-meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: .24rem !important;
    color: #64748b !important;
    font-size: clamp(.7rem, 3vw, .78rem) !important;
    line-height: 1.1 !important;
  }

  .main-panel-produtos .catalog-meta > span {
    margin: 0 !important;
  }

  .main-panel-produtos .catalog-price {
    color: #071229 !important;
    font-size: clamp(1.02rem, 4.5vw, 1.18rem) !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
  }

  .main-panel-produtos .catalog-price span {
    display: none !important;
  }

  .main-panel-produtos .catalog-actions {
    display: grid !important;
    grid-template-columns: repeat(2, 30px) !important;
    align-items: center !important;
    justify-content: end !important;
    justify-items: center !important;
    gap: .24rem !important;
    min-width: 0 !important;
  }

  .main-panel-produtos .catalog-actions form {
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
  }

  .main-panel-produtos .catalog-action-btn {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 10px !important;
    font-size: .82rem !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .main-panel-produtos .fab {
    background: #2563eb !important;
    color: #fff !important;
    opacity: 1 !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, .36), 0 5px 12px rgba(15, 23, 42, .16) !important;
  }
}

/* ============================================================
   CLIENTE MOBILE MODAL
   Bottom sheet compacto com footer sempre acessivel.
   ============================================================ */
@media (max-width: 1024px) {
  #clienteModalNovo {
    align-items: flex-end !important;
    justify-content: center !important;
    padding:
      max(.58rem, env(safe-area-inset-top))
      .58rem
      max(.58rem, env(safe-area-inset-bottom)) !important;
    background: rgba(15, 23, 42, .58) !important;
  }

  #clienteModalNovo .cliente-modal-card {
    width: min(100%, 540px) !important;
    max-height: calc(100dvh - max(1.16rem, env(safe-area-inset-top) + env(safe-area-inset-bottom))) !important;
    border-radius: 20px 20px 18px 18px !important;
    overflow: hidden !important;
  }

  #clienteModalNovo .modal-head {
    flex: 0 0 auto !important;
    min-height: 56px !important;
    padding: .78rem .92rem !important;
  }

  #clienteModalNovo .modal-head h2 {
    font-size: clamp(1rem, 4.6vw, 1.16rem) !important;
    line-height: 1.12 !important;
  }

  #clienteModalNovo .modal-close {
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
  }

  #clienteModalNovo .cliente-mobile-form {
    display: flex !important;
    flex-direction: column !important;
    gap: .62rem !important;
    padding: .82rem .92rem 0 !important;
  }

  #clienteModalNovo .field {
    display: grid;
    gap: .28rem;
  }

  #clienteModalNovo .field label {
    font-size: .82rem !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    color: #1f2a44 !important;
  }

  #clienteModalNovo .form-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .62rem !important;
  }

  #clienteModalNovo .input,
  #clienteModalNovo .select,
  #clienteModalNovo .textarea {
    width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 .74rem !important;
    border-radius: 12px !important;
    border-color: #dbe4f3 !important;
    color: #0f172a !important;
    font-size: .94rem !important;
    line-height: 1.2 !important;
    background-color: #fff !important;
    box-shadow: none !important;
  }

  #clienteModalNovo input[type="date"].input {
    appearance: auto;
    -webkit-appearance: none;
    display: flex !important;
    align-items: center !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  #clienteModalNovo .select {
    appearance: auto;
    -webkit-appearance: menulist;
  }

  #clienteModalNovo .cliente-observacao-textarea {
    min-height: 46px !important;
    height: 46px;
    max-height: 104px !important;
    padding-top: .72rem !important;
    padding-bottom: .72rem !important;
    resize: none !important;
    overflow-y: auto !important;
  }

  #clienteModalNovo .modal-actions {
    margin: .74rem -.92rem 0 !important;
    padding: .66rem .92rem calc(16px + env(safe-area-inset-bottom)) !important;
  }

  #clienteModalEditar {
    align-items: flex-end !important;
    justify-content: center !important;
    padding:
      max(.58rem, env(safe-area-inset-top))
      .58rem
      max(.58rem, env(safe-area-inset-bottom)) !important;
    background: rgba(15, 23, 42, .58) !important;
  }

  #clienteModalEditar .cliente-edit-modal-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: min(100%, 540px) !important;
    max-height: calc(100dvh - max(1.16rem, env(safe-area-inset-top) + env(safe-area-inset-bottom))) !important;
    padding: 0 !important;
    border-radius: 20px 20px 18px 18px !important;
    overflow: hidden !important;
  }

  #clienteModalEditar .module-help-modal-close {
    position: absolute !important;
    top: .58rem !important;
    right: .62rem !important;
    z-index: 2 !important;
    float: none !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
    color: #64748b !important;
    font-size: 1.18rem !important;
    line-height: 1 !important;
  }

  #clienteModalEditar .modal-title {
    flex: 0 0 auto !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: .78rem 3.25rem .78rem .92rem !important;
    color: #0f172a !important;
    font-size: clamp(1rem, 4.6vw, 1.16rem) !important;
    line-height: 1.12 !important;
    font-weight: 850 !important;
  }

  #clienteModalEditar #clienteEditForm {
    display: flex !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    flex-direction: column !important;
    gap: .62rem !important;
    overflow-y: auto !important;
    padding: .82rem .92rem 0 !important;
    -webkit-overflow-scrolling: touch;
  }

  #clienteModalEditar #clienteEditForm > * {
    margin-top: 0 !important;
  }

  #clienteModalEditar .field {
    display: grid !important;
    gap: .28rem !important;
    margin-bottom: 0 !important;
  }

  #clienteModalEditar .field label {
    color: #1f2a44 !important;
    font-size: .82rem !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
  }

  #clienteModalEditar .form-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .62rem !important;
  }

  #clienteModalEditar .input,
  #clienteModalEditar .select,
  #clienteModalEditar .textarea {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 .74rem !important;
    border-radius: 12px !important;
    border-color: #dbe4f3 !important;
    color: #0f172a !important;
    font-size: .94rem !important;
    line-height: 1.2 !important;
    background-color: #fff !important;
    box-shadow: none !important;
  }

  #clienteModalEditar input[type="date"].input {
    appearance: auto;
    -webkit-appearance: none;
    display: flex !important;
    align-items: center !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  #clienteModalEditar .select {
    appearance: auto;
    -webkit-appearance: menulist;
  }

  #clienteModalEditar .cliente-observacao-textarea {
    min-height: 46px !important;
    height: 46px;
    max-height: 104px !important;
    padding-top: .72rem !important;
    padding-bottom: .72rem !important;
    resize: none !important;
    overflow-y: auto !important;
  }

  #clienteModalEditar .modal-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 1 !important;
    margin: .74rem -.92rem 0 !important;
    padding: .66rem .92rem calc(16px + env(safe-area-inset-bottom)) !important;
    background: #fff !important;
  }
}

/* ============================================================
   iOS MOBILE INPUT STABILITY
   Mantem o desktop intacto e evita o zoom automatico do Safari
   ao focar campos com tipografia compacta em telas mobile.
   ============================================================ */
@media (max-width: 768px) {
  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  body {
    min-height: 100dvh;
    min-height: -webkit-fill-available;
    overscroll-behavior-y: none;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  select,
  textarea,
  .input,
  .select,
  .textarea,
  .search input,
  .search-sm input,
  .clientes-search input,
  .catalog-search input,
  .topbar-actions .search input,
  .fin-period-select,
  .fin-period-date,
  .dash-period-sheet-form .input,
  .agenda-schedule-form .input,
  .agenda-schedule-form .select,
  .fin-manual-form .input,
  .fin-manual-form .select,
  .catalog-profit-options .input,
  .catalog-profit-options-inline .input,
  #clienteModalNovo .input,
  #clienteModalNovo .select,
  #clienteModalNovo .textarea {
    font-size: 16px !important;
    line-height: 1.25;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  input,
  select,
  textarea {
    transform: none;
    touch-action: manipulation;
  }

  input::placeholder,
  textarea::placeholder {
    font-size: 16px !important;
    line-height: 1.25;
  }

  .modal {
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
  }

  .modal-card {
    max-height: calc(100dvh - max(2rem, env(safe-area-inset-top)) - max(1rem, env(safe-area-inset-bottom)));
    -webkit-overflow-scrolling: touch;
  }

  .main-panel-clientes .clientes-search.mobile-search-panel,
  .main-panel-produtos .catalog-search.mobile-search-panel {
    min-height: 44px !important;
    height: auto !important;
  }
}

.main-panel-produtos .catalog-table tr.catalog-row-hidden,
.catalog-table tr.catalog-row-hidden {
  display: none !important;
}

/* ============================================================
   PRODUTOS MOBILE ITEM MODAL
   Refinamento compacto do modal "Novo item" sem alterar desktop.
   ============================================================ */
@media (max-width: 1024px) {
  #produtoModal {
    align-items: flex-end;
    padding:
      max(.58rem, env(safe-area-inset-top))
      .58rem
      max(.58rem, env(safe-area-inset-bottom)) !important;
  }

  #produtoModal .catalog-modal-card {
    width: min(100%, 560px) !important;
    max-height: calc(100dvh - max(1.16rem, env(safe-area-inset-top) + env(safe-area-inset-bottom))) !important;
    border-radius: 20px 20px 18px 18px !important;
  }

  #produtoModal .modal-head {
    flex: 0 0 auto;
    min-height: 54px;
    padding: .74rem .92rem !important;
  }

  #produtoModal .modal-head h2 {
    font-size: clamp(1rem, 4.4vw, 1.14rem);
    line-height: 1.12;
  }

  #produtoModal .modal-close {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  #produtoModal .modal-body {
    padding: .72rem .82rem 0 !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  #produtoModal .field {
    gap: .26rem;
    margin-bottom: .58rem !important;
  }

  #produtoModal .field label {
    font-size: .82rem;
    line-height: 1.15;
  }

  #produtoModal .field-help {
    margin: .04rem 0 .26rem;
    font-size: .7rem;
    line-height: 1.2;
  }

  #produtoModal .input,
  #produtoModal .select,
  #produtoModal .textarea {
    min-height: 44px;
    padding-block: .54rem;
    border-radius: 12px;
  }

  #produtoModal .catalog-type-toggle {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .42rem !important;
    margin-bottom: .62rem !important;
  }

  #produtoModal .catalog-type-toggle label {
    min-width: 0;
  }

  #produtoModal .catalog-type-toggle span {
    min-height: 42px;
    padding: 0 .5rem;
    border-radius: 13px;
    gap: .36rem;
    font-size: .94rem;
    line-height: 1;
    white-space: nowrap;
  }

  #produtoModal .catalog-type-toggle span i {
    font-size: .96rem;
  }

  #produtoModal .catalog-product-fields .form-grid,
  #produtoModal .catalog-service-fields .form-grid {
    gap: .52rem !important;
    margin-bottom: .1rem;
  }

  #produtoModal .catalog-suggest-row {
    margin-bottom: .58rem;
    padding: .58rem .62rem;
    border-radius: 13px;
  }

  #produtoModal .catalog-suggest-row label {
    font-size: .7rem;
  }

  #produtoModal .catalog-profit-options {
    flex-wrap: nowrap !important;
    gap: .32rem;
    margin: .36rem 0 .42rem;
  }

  #produtoModal .catalog-profit-options button {
    min-height: 34px;
    padding: 0 .56rem;
    font-size: .72rem;
  }

  #produtoModal .catalog-profit-options .input {
    flex: 0 0 58px;
    width: 58px;
    min-height: 36px;
    padding: 0 .36rem;
  }

  #produtoModal .catalog-suggest-row > span {
    font-size: .78rem;
    line-height: 1.2;
  }

  #produtoModal .catalog-pricing-box {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .42rem;
    margin: .08rem 0 .58rem;
    padding: .58rem;
    border-radius: 13px;
  }

  #produtoModal .catalog-pricing-box span {
    font-size: .66rem;
    line-height: 1.12;
  }

  #produtoModal .catalog-pricing-box strong {
    margin-top: .06rem;
    font-size: .9rem;
    line-height: 1.14;
  }

  #produtoModal [data-service-summary] {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .38rem .48rem;
  }

  #produtoModal .catalog-pricing-row {
    min-width: 0;
  }

  #produtoModal .catalog-price-health {
    margin: .04rem 0 0;
    padding: .34rem .48rem;
    border-radius: 10px;
    font-size: .72rem;
    line-height: 1.18;
  }

  #produtoModal .catalog-soft-note {
    min-height: 38px;
    margin-bottom: .58rem;
    padding: .56rem .62rem;
    border-radius: 12px;
    font-size: .76rem;
    line-height: 1.25;
  }

  #produtoModal .catalog-advanced {
    margin-bottom: .58rem;
    border-radius: 13px;
  }

  #produtoModal .catalog-advanced summary {
    padding: .6rem .68rem;
    font-size: .78rem;
  }

  #produtoModal .catalog-advanced-product,
  #produtoModal .catalog-advanced-service {
    padding: 0 .62rem .68rem;
  }

  #produtoModal .catalog-advanced-step {
    margin-bottom: .56rem;
    padding: .62rem;
    border-radius: 13px;
  }

  #produtoModal .catalog-step-head {
    gap: .48rem;
    margin-bottom: .52rem;
  }

  #produtoModal .catalog-cost-row {
    gap: .44rem;
    padding: .48rem;
  }

  #produtoModal .catalog-observation-textarea {
    min-height: 44px !important;
    height: 44px;
    max-height: 108px !important;
    padding-top: .62rem;
    padding-bottom: .62rem;
    resize: none;
    overflow-y: auto;
  }

  #produtoModal .modal-foot {
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1fr);
    gap: .5rem;
    margin: .58rem -.82rem 0 !important;
    padding: .62rem .82rem calc(.62rem + env(safe-area-inset-bottom)) !important;
    background: rgba(255, 255, 255, .98);
    border-top: 1px solid #e6edf7;
    box-shadow: 0 -10px 22px rgba(15, 23, 42, .06);
  }

  #produtoModal .modal-foot .btn {
    width: 100%;
    min-height: 42px;
    justify-content: center;
    padding-inline: .72rem;
  }
}

@media (max-width: 420px) {
  #produtoModal .modal-body {
    padding-inline: .68rem !important;
  }

  #produtoModal .catalog-type-toggle {
    gap: .36rem !important;
  }

  #produtoModal .catalog-type-toggle span {
    min-height: 40px;
    padding-inline: .38rem;
    font-size: .9rem;
  }

  #produtoModal .catalog-profit-options button {
    padding-inline: .48rem;
  }

  #produtoModal .modal-foot {
    margin-inline: -.68rem !important;
    padding-inline: .68rem !important;
  }
}

/* ============================================================
   PRODUTOS MOBILE KPI CONFIG MODAL
   Compacta o modal "Configurar painel" apenas no mobile/tablet.
   ============================================================ */
@media (max-width: 768px) {
  #prodPersonalizarModal {
    align-items: flex-end !important;
    padding:
      max(.58rem, env(safe-area-inset-top))
      .58rem
      max(.58rem, env(safe-area-inset-bottom)) !important;
  }

  #prodPersonalizarModal .modal-card {
    width: min(100%, 520px) !important;
    height: auto !important;
    max-height: min(64dvh, 480px) !important;
    flex: 0 1 auto !important;
    border-radius: 20px 20px 18px 18px !important;
  }

  #prodPersonalizarModal .modal-head {
    min-height: 52px !important;
    padding: .72rem .88rem !important;
  }

  #prodPersonalizarModal .modal-head h2 {
    font-size: clamp(1rem, 4.4vw, 1.13rem) !important;
    line-height: 1.12 !important;
  }

  #prodPersonalizarModal .modal-close {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  #prodPersonalizarModal .modal-body {
    display: flex;
    flex-direction: column;
    flex: 0 1 auto !important;
    min-height: 0 !important;
    padding: .68rem .82rem 0 !important;
    overflow: hidden !important;
  }

  #prodPersonalizarModal .prod-pers-help {
    flex: 0 0 auto;
    margin: 0 0 .5rem !important;
    color: #7a89a9;
    font-size: .82rem !important;
    line-height: 1.28 !important;
  }

  #prodPersonalizarModal #prodPersGrid {
    flex: 0 1 auto;
    min-height: 0;
    max-height: min(38dvh, 280px);
    grid-template-columns: 1fr !important;
    gap: .42rem !important;
    margin-top: 0 !important;
    padding: .02rem .02rem .16rem;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }

  #prodPersonalizarModal .fin-pers-item {
    min-height: 48px;
    padding: .5rem .58rem !important;
    gap: .46rem !important;
    border-radius: 13px !important;
    box-shadow: none !important;
  }

  #prodPersonalizarModal .fin-pers-item input {
    width: 18px;
    height: 18px;
    margin: 0;
    flex: 0 0 auto;
  }

  #prodPersonalizarModal .fin-pers-icon {
    width: 28px;
    height: 28px;
    border-radius: 9px;
    font-size: .78rem;
    flex: 0 0 auto;
  }

  #prodPersonalizarModal .fin-pers-label {
    min-width: 0;
    font-size: .88rem;
    line-height: 1.15;
    font-weight: 750;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #prodPersonalizarModal .prod-pers-foot {
    flex: 0 0 auto;
    position: sticky !important;
    bottom: 0;
    display: grid !important;
    grid-template-columns: .78fr .74fr .82fr;
    align-items: stretch !important;
    gap: .42rem !important;
    margin: .54rem -.82rem 0 !important;
    padding: .56rem .82rem calc(.56rem + env(safe-area-inset-bottom)) !important;
    background: rgba(255, 255, 255, .98);
    border-top: 1px solid #e6edf7;
    box-shadow: 0 -8px 18px rgba(15, 23, 42, .055);
  }

  #prodPersonalizarModal .prod-pers-reset-wrap,
  #prodPersonalizarModal .prod-pers-actions {
    display: contents !important;
  }

  #prodPersonalizarModal .prod-pers-foot .btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 .42rem !important;
    border-radius: 12px !important;
    justify-content: center !important;
    gap: .3rem !important;
    white-space: nowrap !important;
    line-height: 1 !important;
  }

  #prodPersonalizarModal .prod-pers-reset-btn,
  #prodPersonalizarModal .prod-pers-save-btn {
    font-size: 0 !important;
  }

  #prodPersonalizarModal .prod-pers-reset-btn i,
  #prodPersonalizarModal .prod-pers-save-btn i {
    font-size: .88rem !important;
  }

  #prodPersonalizarModal .prod-pers-reset-btn::after {
    content: "Resetar";
    font-size: .78rem;
    font-weight: 800;
  }

  #prodPersonalizarModal .prod-pers-save-btn::after {
    content: "Salvar";
    font-size: .82rem;
    font-weight: 850;
  }

  #prodPersonalizarModal .prod-pers-cancel-btn {
    font-size: .8rem !important;
    font-weight: 800;
  }
}

@media (max-width: 380px) {
  #prodPersonalizarModal .modal-body {
    padding-inline: .68rem !important;
  }

  #prodPersonalizarModal .prod-pers-foot {
    grid-template-columns: .72fr .72fr .8fr;
    gap: .34rem !important;
    margin-inline: -.68rem !important;
    padding-inline: .68rem !important;
  }

  #prodPersonalizarModal .prod-pers-foot .btn {
    min-height: 38px !important;
    height: 38px !important;
    padding-inline: .32rem !important;
  }

  #prodPersonalizarModal .prod-pers-reset-btn::after,
  #prodPersonalizarModal .prod-pers-cancel-btn,
  #prodPersonalizarModal .prod-pers-save-btn::after {
    font-size: .74rem !important;
  }
}

/* ============================================================
   MOBILE KPI STANDARD + CLIENTES LIST SURFACE
   Padroniza KPIs mobile/tablet pelo visual de Produtos e Servicos.
   ============================================================ */
.clientes-list-head {
  display: none;
}

.clientes-kpi-config-menu-item {
  display: none !important;
}

@media (max-width: 1024px) {
  .clientes-kpi-config-menu-item {
    display: flex !important;
  }

  .fin-kpi-grid {
    display: flex !important;
    grid-template-columns: none !important;
    align-items: stretch !important;
    gap: .56rem !important;
    width: auto !important;
    margin: 0 calc(var(--mobile-gutter, 1rem) * -1) .92rem !important;
    padding: .05rem var(--mobile-gutter, 1rem) .56rem !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .fin-kpi-grid::-webkit-scrollbar {
    display: none;
  }

  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    flex: 0 0 clamp(120px, calc((100vw - 2.2rem) / 3), 320px) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 86px !important;
    padding: .62rem .58rem !important;
    border-radius: 14px !important;
    scroll-snap-align: start;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .055) !important;
  }

  .fin-kpi-grid .fin-kpi::before {
    height: 3px !important;
  }

  .fin-kpi-grid .fin-kpi-head {
    gap: .38rem !important;
    margin-bottom: .32rem !important;
    align-items: flex-start !important;
  }

  .fin-kpi-grid .fin-kpi-icon {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    border-radius: 10px !important;
    font-size: .82rem !important;
  }

  .fin-kpi-grid .fin-kpi-label {
    min-width: 0 !important;
    color: #1f2a44 !important;
    font-size: clamp(.68rem, 2.6vw, .78rem) !important;
    line-height: 1.08 !important;
    font-weight: 800 !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text {
    margin: 0 !important;
    color: #0f172a !important;
    font-size: clamp(1rem, 4.8vw, 1.22rem) !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-foot {
    margin-top: .26rem !important;
    line-height: 1.05 !important;
  }

  .fin-kpi-grid .fin-kpi-foot .muted {
    font-size: clamp(.62rem, 2.6vw, .72rem) !important;
    line-height: 1.08 !important;
  }

  .fin-kpi-grid .fin-kpi-drag,
  .fin-kpi-grid .fin-kpi-edit {
    top: .42rem !important;
    right: .42rem !important;
  }

  .main-panel-clientes .clientes-list-card {
    padding: .78rem !important;
    border: 1px solid #e2eaf6 !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .07) !important;
    overflow: visible !important;
  }

  .main-panel-clientes .clientes-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .58rem;
    padding: 0 0 .7rem !important;
    margin: 0 0 .58rem !important;
    border-bottom: 1px solid #edf2f7 !important;
  }

  .main-panel-clientes .clientes-list-head h2 {
    display: flex;
    align-items: center;
    gap: .42rem;
    margin: 0;
    color: #0f172a;
    font-size: clamp(1rem, 4.4vw, 1.12rem) !important;
    line-height: 1.12 !important;
    font-weight: 850;
    letter-spacing: 0;
  }

  .main-panel-clientes .clientes-list-head h2 i {
    color: #4f46e5;
    font-size: 1rem;
  }

  .main-panel-clientes .clientes-list-head p {
    margin: .12rem 0 0;
    color: #71809c;
    font-size: .74rem !important;
    line-height: 1.15 !important;
    font-weight: 650;
  }

  .main-panel-clientes .clientes-list-card .filter-chips {
    margin: 0 0 .56rem !important;
  }

  .main-panel-clientes .clientes-list-card .table-wrap.table-clean {
    margin-top: 0 !important;
  }

  .main-panel-clientes .clientes-list-card #tbClientes tbody {
    gap: .5rem !important;
  }
}

@media (max-width: 380px) {
  .fin-kpi-grid {
    gap: .48rem !important;
  }

  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    flex-basis: clamp(116px, calc((100vw - 2rem) / 3), 128px) !important;
    min-height: 84px !important;
    padding: .58rem .52rem !important;
  }

  .main-panel-clientes .clientes-list-card {
    padding: .68rem !important;
  }
}

/* ============================================================
   MOBILE POLISH PASS - KPIs, Agenda e Configurar painel
   Refinamento final apenas mobile/tablet.
   ============================================================ */
@media (max-width: 1024px) {
  html,
  body {
    height: auto !important;
    min-height: 100% !important;
    overflow-y: auto !important;
  }

  .app-shell,
  .main-panel {
    min-height: 100dvh !important;
  }

  .topbar {
    overflow: visible !important;
  }

  .topbar-title {
    min-width: 0 !important;
    overflow: visible !important;
  }

  .topbar-title h1 {
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.12 !important;
    padding-inline-start: .02rem;
  }

  .main-panel-agenda .topbar-title h1 {
    padding-inline-start: .08rem;
  }

  .fin-kpi-grid {
    gap: .5rem !important;
    margin-bottom: .95rem !important;
    scroll-padding-left: var(--mobile-gutter, 1rem);
  }

  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    flex-basis: clamp(118px, calc((100vw - 2.06rem) / 3), 248px) !important;
    min-height: 104px !important;
    padding: .58rem .52rem .62rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
  }

  .fin-kpi-grid .fin-kpi-head {
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .42rem !important;
    min-height: 34px !important;
    margin: 0 0 .32rem !important;
    padding: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 10px !important;
    font-size: .82rem !important;
  }

  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
  }

  .fin-kpi-grid .fin-kpi-label {
    display: -webkit-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    color: #1c2942 !important;
    font-size: clamp(.66rem, 2.45vw, .78rem) !important;
    line-height: 1.04 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text {
    margin-top: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    font-size: clamp(1.03rem, 4.7vw, 1.25rem) !important;
    line-height: 1.02 !important;
    font-weight: 900 !important;
  }

  .fin-kpi-grid .fin-kpi-foot {
    min-width: 0 !important;
    margin-top: .28rem !important;
    line-height: 1.08 !important;
  }

  .fin-kpi-grid .fin-kpi-foot .muted {
    display: -webkit-box !important;
    overflow: hidden !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    color: #71809c !important;
    font-size: clamp(.62rem, 2.55vw, .72rem) !important;
    line-height: 1.08 !important;
  }

  .fin-kpi-grid .fin-delta {
    height: 18px;
    padding-inline: .36rem;
    font-size: .6rem;
    line-height: 1;
  }

  .fin-kpi[data-kpi="hoje"] .fin-kpi-label,
  .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label,
  .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label,
  .fin-kpi[data-kpi="receita_prevista"] .fin-kpi-label,
  .fin-kpi[data-kpi="receita_prevista_hoje"] .fin-kpi-label,
  .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label,
  .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label,
  .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label,
  .fin-kpi[data-kpi="ocupacao_dia"] .fin-kpi-label,
  .fin-kpi[data-kpi="total_clientes"] .fin-kpi-label,
  .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label,
  .fin-kpi[data-kpi="sem_retorno_60"] .fin-kpi-label {
    font-size: 0 !important;
    line-height: 0 !important;
  }

  .fin-kpi[data-kpi="hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label::after {
    content: "Agendamentos";
  }

  .fin-kpi[data-kpi="receita_prevista"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista_hoje"] .fin-kpi-label::after {
    content: "Receita prevista";
  }

  .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label::after {
    content: "Horários livres";
  }

  .fin-kpi[data-kpi="ocupacao_dia"] .fin-kpi-label::after {
    content: "Ocupação";
  }

  .fin-kpi[data-kpi="total_clientes"] .fin-kpi-label::after {
    content: "Clientes";
  }

  .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label::after {
    content: "Aniversários";
  }

  .fin-kpi[data-kpi="sem_retorno_60"] .fin-kpi-label::after {
    content: "Sem retorno";
  }

  .fin-kpi[data-kpi="hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ocupacao_dia"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="total_clientes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="sem_retorno_60"] .fin-kpi-label::after {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
    color: #1c2942;
    font-size: clamp(.68rem, 2.55vw, .78rem);
    line-height: 1.04;
    font-weight: 850;
  }

  .main-panel-agenda .day-timeline {
    scroll-margin-top: 88px;
  }
}

@media (max-width: 420px) {
  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    flex-basis: clamp(110px, calc((100vw - 1.9rem) / 3), 128px) !important;
    min-height: 104px !important;
    padding-inline: .48rem !important;
  }

  .fin-kpi-grid .fin-kpi-head {
    grid-template-columns: 30px minmax(0, 1fr) !important;
    gap: .34rem !important;
  }
}

@media (max-width: 370px) {
  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    flex-basis: clamp(112px, calc((100vw - 1.75rem) / 3), 118px) !important;
    padding-inline: .42rem !important;
  }

  .fin-kpi-grid .fin-kpi-head {
    grid-template-columns: 30px minmax(0, 1fr) !important;
    gap: .3rem !important;
  }

  .fin-kpi-grid .fin-kpi-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
  }
}

@media (max-width: 768px) {
  #dashPersonalizarModal,
  #finPersonalizarModal,
  #agendaPersonalizarModal,
  #clientesPersonalizarModal,
  #prodPersonalizarModal {
    align-items: flex-end !important;
    padding:
      max(.58rem, env(safe-area-inset-top))
      .58rem
      max(.58rem, env(safe-area-inset-bottom)) !important;
  }

  #dashPersonalizarModal .modal-card,
  #finPersonalizarModal .modal-card,
  #agendaPersonalizarModal .modal-card,
  #clientesPersonalizarModal .modal-card,
  #prodPersonalizarModal .modal-card {
    width: min(100%, 520px) !important;
    height: auto !important;
    max-height: min(72dvh, 520px) !important;
    flex: 0 1 auto !important;
    border-radius: 20px 20px 18px 18px !important;
    overflow: hidden !important;
  }

  #dashPersonalizarModal .modal-head,
  #finPersonalizarModal .modal-head,
  #agendaPersonalizarModal .modal-head,
  #clientesPersonalizarModal .modal-head,
  #prodPersonalizarModal .modal-head {
    min-height: 52px !important;
    padding: .72rem .88rem !important;
  }

  #dashPersonalizarModal .modal-head h2,
  #finPersonalizarModal .modal-head h2,
  #agendaPersonalizarModal .modal-head h2,
  #clientesPersonalizarModal .modal-head h2,
  #prodPersonalizarModal .modal-head h2 {
    min-width: 0 !important;
    font-size: clamp(1rem, 4.4vw, 1.13rem) !important;
    line-height: 1.12 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #agendaPersonalizarModal .modal-head h2 {
    font-size: 0 !important;
  }

  #agendaPersonalizarModal .modal-head h2 i {
    font-size: 1rem !important;
  }

  #agendaPersonalizarModal .modal-head h2::after {
    content: "Configurar painel";
    font-size: clamp(1rem, 4.4vw, 1.13rem);
    line-height: 1.12;
    font-weight: 850;
  }

  #dashPersonalizarModal .modal-close,
  #finPersonalizarModal .modal-close,
  #agendaPersonalizarModal .modal-close,
  #clientesPersonalizarModal .modal-close,
  #prodPersonalizarModal .modal-close {
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
  }

  #dashPersonalizarModal .modal-body,
  #finPersonalizarModal .modal-body,
  #agendaPersonalizarModal .modal-body,
  #clientesPersonalizarModal .modal-body,
  #prodPersonalizarModal .modal-body {
    display: flex !important;
    flex-direction: column !important;
    flex: 0 1 auto !important;
    min-height: 0 !important;
    padding: .68rem .82rem 0 !important;
    overflow: hidden !important;
  }

  #agendaPersonalizarModal form {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  #dashPersonalizarModal .modal-body > .muted,
  #finPersonalizarModal .modal-body > .muted,
  #agendaPersonalizarModal .modal-body .muted:first-child,
  #clientesPersonalizarModal .modal-body > .muted,
  #prodPersonalizarModal .prod-pers-help {
    flex: 0 0 auto;
    margin: 0 0 .5rem !important;
    color: #7a89a9 !important;
    font-size: .82rem !important;
    line-height: 1.28 !important;
  }

  #dashPersonalizarModal .fin-pers-section-title {
    margin: .12rem 0 .34rem !important;
    font-size: .78rem !important;
    line-height: 1.1;
  }

  #dashPersonalizarModal .fin-pers-grid,
  #finPersonalizarModal .fin-pers-grid,
  #agendaPersonalizarModal .fin-pers-grid,
  #clientesPersonalizarModal .fin-pers-grid,
  #prodPersonalizarModal .fin-pers-grid {
    flex: 0 1 auto;
    min-height: 0;
    max-height: min(38dvh, 280px);
    grid-template-columns: 1fr !important;
    gap: .42rem !important;
    margin-top: 0 !important;
    padding: .02rem .02rem .16rem;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }

  #dashPersonalizarModal #dashCardsGrid {
    max-height: min(24dvh, 190px);
  }

  #dashPersonalizarModal .fin-pers-item,
  #finPersonalizarModal .fin-pers-item,
  #agendaPersonalizarModal .fin-pers-item,
  #clientesPersonalizarModal .fin-pers-item,
  #prodPersonalizarModal .fin-pers-item {
    min-height: 48px !important;
    padding: .5rem .58rem !important;
    gap: .46rem !important;
    border-radius: 13px !important;
    box-shadow: none !important;
  }

  #dashPersonalizarModal .fin-pers-item input,
  #finPersonalizarModal .fin-pers-item input,
  #agendaPersonalizarModal .fin-pers-item input,
  #clientesPersonalizarModal .fin-pers-item input,
  #prodPersonalizarModal .fin-pers-item input {
    width: 18px;
    height: 18px;
    margin: 0;
    flex: 0 0 auto;
  }

  #dashPersonalizarModal .fin-pers-icon,
  #finPersonalizarModal .fin-pers-icon,
  #agendaPersonalizarModal .fin-pers-icon,
  #clientesPersonalizarModal .fin-pers-icon,
  #prodPersonalizarModal .fin-pers-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 9px !important;
    font-size: .78rem !important;
    flex: 0 0 auto;
  }

  #dashPersonalizarModal .fin-pers-label,
  #finPersonalizarModal .fin-pers-label,
  #agendaPersonalizarModal .fin-pers-label,
  #clientesPersonalizarModal .fin-pers-label,
  #prodPersonalizarModal .fin-pers-label {
    min-width: 0;
    font-size: .88rem !important;
    line-height: 1.15;
    font-weight: 750;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #dashPersonalizarModal .modal-foot,
  #finPersonalizarModal .modal-foot,
  #agendaPersonalizarModal .modal-foot,
  #clientesPersonalizarModal .modal-foot,
  #prodPersonalizarModal .modal-foot {
    flex: 0 0 auto;
    position: sticky !important;
    bottom: 0;
    display: grid !important;
    align-items: stretch !important;
    gap: .42rem !important;
    margin: .54rem -.82rem 0 !important;
    padding: .56rem .82rem calc(.56rem + env(safe-area-inset-bottom)) !important;
    background: rgba(255, 255, 255, .98) !important;
    border-top: 1px solid #e6edf7 !important;
    box-shadow: 0 -8px 18px rgba(15, 23, 42, .055) !important;
  }

  #dashPersonalizarModal .modal-foot,
  #agendaPersonalizarModal .modal-foot {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  #finPersonalizarModal .modal-foot,
  #clientesPersonalizarModal .modal-foot,
  #prodPersonalizarModal .modal-foot {
    grid-template-columns: .78fr .74fr .82fr !important;
  }

  #dashPersonalizarModal .modal-foot form,
  #finPersonalizarModal .modal-foot form,
  #clientesPersonalizarModal .modal-foot > div,
  #finPersonalizarModal .modal-foot > div,
  #prodPersonalizarModal .prod-pers-reset-wrap,
  #prodPersonalizarModal .prod-pers-actions {
    display: contents !important;
  }

  #dashPersonalizarModal .modal-foot .btn,
  #finPersonalizarModal .modal-foot .btn,
  #agendaPersonalizarModal .modal-foot .btn,
  #clientesPersonalizarModal .modal-foot .btn,
  #prodPersonalizarModal .modal-foot .btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 .42rem !important;
    border-radius: 12px !important;
    justify-content: center !important;
    gap: .3rem !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    font-size: .8rem !important;
    font-weight: 800;
  }

  #dashPersonalizarModal .modal-foot form .btn,
  #agendaPersonalizarModal .modal-foot .btn-outline,
  #finPersonalizarModal .modal-foot form .btn,
  #clientesPersonalizarModal .modal-foot form .btn,
  #prodPersonalizarModal .prod-pers-reset-btn,
  #finPersonalizarModal #finPersSalvar,
  #clientesPersonalizarModal #clientesPersSalvar,
  #prodPersonalizarModal .prod-pers-save-btn {
    font-size: 0 !important;
  }

  #dashPersonalizarModal .modal-foot form .btn i,
  #agendaPersonalizarModal .modal-foot .btn-outline i,
  #finPersonalizarModal .modal-foot form .btn i,
  #clientesPersonalizarModal .modal-foot form .btn i,
  #prodPersonalizarModal .prod-pers-reset-btn i,
  #finPersonalizarModal #finPersSalvar i,
  #clientesPersonalizarModal #clientesPersSalvar i,
  #prodPersonalizarModal .prod-pers-save-btn i {
    font-size: .88rem !important;
  }

  #dashPersonalizarModal .modal-foot form .btn::after,
  #agendaPersonalizarModal .modal-foot .btn-outline::after,
  #finPersonalizarModal .modal-foot form .btn::after,
  #clientesPersonalizarModal .modal-foot form .btn::after,
  #prodPersonalizarModal .prod-pers-reset-btn::after {
    content: "Resetar";
    font-size: .78rem;
    font-weight: 800;
  }

  #finPersonalizarModal #finPersSalvar::after,
  #clientesPersonalizarModal #clientesPersSalvar::after,
  #prodPersonalizarModal .prod-pers-save-btn::after {
    content: "Salvar";
    font-size: .82rem;
    font-weight: 850;
  }
}

/* ---------- Birthday UX - Clientes e Dashboard ---------- */
.fin-kpi-clickable {
  cursor: pointer;
}

.fin-kpi-clickable:hover {
  border-color: color-mix(in srgb, var(--tone, #2563eb) 34%, #e5e7eb);
}

.fin-kpi.is-filter-active {
  border-color: color-mix(in srgb, var(--tone, #2563eb) 44%, #e5e7eb);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tone, #2563eb) 14%, transparent), var(--shadow-sm);
}

.fin-kpi-action-link {
  display: flex;
  min-height: 100%;
  color: inherit;
  text-decoration: none;
  flex-direction: column;
}

.clientes-birthday-badge {
  display: inline-flex;
  align-items: center;
  gap: .32rem;
  width: fit-content;
  max-width: 100%;
  margin-top: .32rem;
  padding: .22rem .52rem;
  border-radius: 999px;
  background: #fffbeb;
  color: #92400e;
  border: 1px solid #fde68a;
  font-size: .72rem;
  line-height: 1;
  font-weight: 850;
  white-space: nowrap;
}

.clientes-birthday-badge i {
  color: #d97706;
  font-size: .72rem;
}

.clientes-birthday-badge.is-today {
  background: #ecfdf5;
  color: #047857;
  border-color: #86efac;
}

.clientes-birthday-badge.is-today i {
  color: #16a34a;
}

#tbClientes tr.cliente-birthday-month {
  background: linear-gradient(0deg, rgba(255, 251, 235, .76), rgba(255, 255, 255, .98));
  border-color: #fde68a;
}

#tbClientes tr.cliente-birthday-today {
  background: linear-gradient(0deg, rgba(236, 253, 245, .88), rgba(255, 255, 255, .98));
  border-color: #86efac;
  box-shadow: 0 10px 24px rgba(22, 163, 74, .10);
}

.dashboard-birthday-alert {
  position: relative;
  display: grid;
  gap: .7rem;
  margin: 0 0 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid #bfdbfe;
  border-radius: 18px;
  background: linear-gradient(135deg, #eff6ff 0%, #ecfdf5 100%);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.dashboard-birthday-alert:hover,
.dashboard-birthday-alert:focus-visible {
  border-color: #93c5fd;
  box-shadow: 0 14px 32px rgba(37, 99, 235, .12), var(--shadow-sm);
  transform: translateY(-1px);
  outline: 0;
}

.dashboard-birthday-dismiss {
  all: unset;
  box-sizing: border-box;
  position: absolute;
  top: .72rem;
  right: .72rem;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  min-width: 28px;
  max-width: 28px;
  height: 28px;
  min-height: 28px;
  max-height: 28px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, .66);
  color: #64748b;
  font-size: .86rem;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, transform .15s ease;
}

.dashboard-birthday-dismiss i {
  pointer-events: none;
  display: block;
  font-size: .84rem;
  line-height: 1;
}

.dashboard-birthday-dismiss:hover,
.dashboard-birthday-dismiss:focus-visible {
  background: #fff;
  color: var(--ink-900);
  transform: scale(1.04);
  outline: 0;
}

.dashboard-birthday-head {
  display: flex;
  align-items: center;
  gap: .72rem;
}

.dashboard-birthday-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: linear-gradient(135deg, #dbeafe 0%, #dcfce7 100%);
  color: #2563eb;
  flex: 0 0 auto;
}

.dashboard-birthday-icon i {
  display: block;
  font-size: 1.05rem;
  line-height: 1;
}

.dashboard-birthday-cake {
  display: block;
  width: 32px;
  height: 32px;
  overflow: visible;
}

.dashboard-birthday-cake .cake-flame {
  fill: #f59e0b;
}

.dashboard-birthday-cake .cake-candle {
  fill: none;
  stroke: #2563eb;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.dashboard-birthday-cake .cake-top {
  fill: #bfdbfe;
}

.dashboard-birthday-cake .cake-icing {
  fill: none;
  stroke: #16a34a;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dashboard-birthday-cake .cake-base {
  fill: #2563eb;
}

.dashboard-birthday-head strong {
  display: block;
  color: var(--ink-900);
  font-size: .98rem;
  line-height: 1.15;
  font-weight: 850;
}

.dashboard-birthday-head span {
  display: block;
  margin-top: .12rem;
  color: #64748b;
  font-size: .82rem;
  line-height: 1.25;
}

.dashboard-birthday-list {
  display: grid;
  gap: .45rem;
}

.dashboard-birthday-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  min-width: 0;
  padding: .52rem .58rem;
  border: 1px solid rgba(191, 219, 254, .88);
  border-radius: 14px;
  background: rgba(255, 255, 255, .82);
  cursor: default;
}

.dashboard-birthday-row > span:first-child {
  display: flex;
  align-items: center;
  gap: .36rem;
  min-width: 0;
  color: var(--ink-800);
  font-size: .86rem;
  line-height: 1.25;
  font-weight: 750;
}

.dashboard-birthday-row > span:first-child i {
  color: #16a34a;
  flex: 0 0 auto;
  margin-right: 0;
}

.dashboard-birthday-names {
  display: grid;
  gap: .14rem;
  min-width: 0;
}

.dashboard-birthday-names span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dashboard-birthday-row .icon-wa {
  color: #16a34a;
  background: #ecfdf5;
  border-color: #bbf7d0;
  flex: 0 0 auto;
}

.dashboard-birthday-no-phone {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 .5rem;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
  font-size: .72rem;
  font-weight: 800;
  white-space: nowrap;
}

@media (max-width: 1024px) {
  .clientes-birthday-badge {
    height: 20px;
    margin-top: .22rem;
    padding: 0 .42rem;
    font-size: .66rem;
    gap: .24rem;
  }

  .clientes-birthday-badge i {
    font-size: .64rem;
  }

  #tbClientes tr.cliente-birthday-month,
  #tbClientes tr.cliente-birthday-today {
    background: rgba(255, 255, 255, .96) !important;
  }

  #tbClientes tr.cliente-birthday-month {
    border-color: #facc15 !important;
    box-shadow: 0 8px 20px rgba(217, 119, 6, .08) !important;
  }

  #tbClientes tr.cliente-birthday-today {
    border-color: #4ade80 !important;
    box-shadow: 0 10px 24px rgba(22, 163, 74, .13) !important;
  }

  .dashboard-birthday-alert {
    margin: 0 0 .95rem;
    padding: .82rem .78rem .78rem;
    border-radius: 18px;
  }

  .dashboard-birthday-head {
    gap: .58rem;
    padding-right: 2rem;
  }

  .dashboard-birthday-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
  }

  .dashboard-birthday-icon i {
    font-size: 1rem;
  }

  .dashboard-birthday-cake {
    width: 32px;
    height: 32px;
  }

  .dashboard-birthday-head strong {
    font-size: .9rem;
  }

  .dashboard-birthday-head span {
    font-size: .76rem;
  }

  .dashboard-birthday-row {
    padding: .46rem .5rem;
    border-radius: 13px;
    gap: .48rem;
  }

  .dashboard-birthday-row > span:first-child {
    font-size: .8rem;
  }

  .dashboard-birthday-dismiss {
    top: .58rem;
    right: .58rem;
    width: 28px;
    min-width: 28px;
    max-width: 28px;
    height: 28px;
    min-height: 28px;
    max-height: 28px;
  }
}

/* ---------- Agenda Mobile App Experience ---------- */
.agenda-mobile-day-timeline {
  display: none;
}

.agenda-mobile-week-card {
  display: none;
}

@media (max-width: 1024px) {
  .main-panel-agenda .content {
    padding-top: .72rem !important;
  }

  .main-panel-agenda .insights-panel--agenda {
    margin-bottom: .64rem !important;
    border-radius: 14px !important;
  }

  .main-panel-agenda .insights-panel--agenda summary {
    min-height: 42px !important;
    padding: .68rem .78rem !important;
  }

  .main-panel-agenda .agenda-toolbar {
    gap: .52rem !important;
    margin-bottom: .66rem !important;
  }

  .main-panel-agenda .agenda-toolbar-box {
    min-height: 38px !important;
    height: 38px !important;
    border-radius: 13px !important;
  }

  .main-panel-agenda .view-switch {
    width: 100% !important;
  }

  .main-panel-agenda .view-switch .vs-item {
    min-height: 34px !important;
    padding: 0 .48rem !important;
    font-size: .8rem !important;
  }

  .main-panel-agenda .nav-range {
    width: 100% !important;
    justify-content: space-between !important;
  }

  .main-panel-agenda .nav-range .nav-label {
    max-width: calc(100vw - 8.4rem);
    font-size: .8rem !important;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .main-panel-agenda .agenda-day-layout {
    display: block !important;
    --agenda-day-panel-height: auto !important;
  }

  .main-panel-agenda .agenda-day-timeline-card {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .07) !important;
  }

  .main-panel-agenda .agenda-day-list-card {
    display: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop {
    display: none !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline {
    --day-hour-col: 54px;
    display: block !important;
    height: auto !important;
    max-height: none !important;
    padding: .5rem .68rem .72rem !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-row {
    display: grid !important;
    grid-template-columns: var(--day-hour-col) minmax(0, 1fr) !important;
    min-height: 58px !important;
    border-bottom: 1px solid #edf2fb !important;
    column-gap: .34rem;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-row:last-child {
    border-bottom: 0 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-row.has-events {
    min-height: 74px !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-hour {
    padding: .62rem .12rem 0 .02rem !important;
    color: #6b7da2 !important;
    font-size: .76rem !important;
    line-height: 1;
    font-weight: 850 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-slot {
    min-width: 0;
    padding: .46rem 0 .48rem !important;
    gap: .38rem !important;
  }

  .main-panel-agenda .mobile-empty-slot {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 26px;
    padding: 0 .46rem;
    border: 1px dashed #dbe5f3;
    border-radius: 999px;
    color: #9aa8bf;
    background: #f8fbff;
    font-size: .68rem;
    font-weight: 750;
  }

  .main-panel-agenda .mobile-dt-event {
    min-height: 0 !important;
    margin: 0 !important;
    padding: .48rem .56rem .5rem !important;
    border-radius: 13px !important;
    border-left-width: 4px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .065) !important;
  }

  .main-panel-agenda .mobile-dt-event .dt-event-head {
    margin-bottom: .16rem !important;
    gap: .42rem !important;
  }

  .main-panel-agenda .mobile-dt-event .dt-event-head strong {
    color: var(--tone);
    font-size: .72rem !important;
    line-height: 1;
    white-space: nowrap;
  }

  .main-panel-agenda .mobile-event-status {
    max-width: 88px;
    padding: .14rem .38rem;
    border-radius: 999px;
    background: rgba(255,255,255,.62);
    color: var(--tone);
    font-size: .58rem;
    line-height: 1;
    font-weight: 850;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .main-panel-agenda .mobile-dt-event .dt-event-title {
    color: #111c35 !important;
    font-size: .86rem !important;
    line-height: 1.12 !important;
    font-weight: 850 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .main-panel-agenda .mobile-dt-event .dt-event-sub {
    margin-top: .12rem !important;
    color: #64748b !important;
    font-size: .68rem !important;
    line-height: 1.1 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* ---------- Agenda mobile: semana em timeline vertical ---------- */
@media (max-width: 1024px) {
  .main-panel-agenda .agenda-week-desktop-card {
    display: none !important;
  }

  .main-panel-agenda .agenda-mobile-week-card {
    display: block !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .07) !important;
  }

  .main-panel-agenda .mobile-week-head {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 40px;
    align-items: center;
    gap: .38rem;
    min-height: 52px;
    padding: .42rem .62rem;
    border-bottom: 1px solid #edf2fb;
    background: #fff;
  }

  .main-panel-agenda .mobile-week-head .icon-btn {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 12px;
  }

  .main-panel-agenda .mobile-week-head .icon-btn:disabled {
    opacity: .38;
    pointer-events: none;
  }

  .main-panel-agenda .mobile-week-title {
    min-width: 0;
    overflow: hidden;
    color: #0f172a;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: .98rem;
    line-height: 1.1;
    font-weight: 900;
  }

  .main-panel-agenda .mobile-week-days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .24rem;
    padding: .5rem .56rem;
    border-bottom: 1px solid #edf2fb;
    background: #f8fbff;
  }

  .main-panel-agenda .mobile-week-day-chip {
    min-width: 0;
    min-height: 48px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: transparent;
    color: #64748b;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: .12rem;
    padding: .28rem .12rem;
    cursor: pointer;
    font: inherit;
  }

  .main-panel-agenda .mobile-week-day-chip span {
    overflow: hidden;
    max-width: 100%;
    text-transform: uppercase;
    font-size: .58rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .04em;
  }

  .main-panel-agenda .mobile-week-day-chip strong {
    color: #18233e;
    font-size: .9rem;
    line-height: 1;
    font-weight: 900;
  }

  .main-panel-agenda .mobile-week-day-chip.is-today {
    border-color: #cfe0ff;
    background: #eef5ff;
  }

  .main-panel-agenda .mobile-week-day-chip.is-active {
    border-color: #2563eb;
    background: #2563eb;
    color: #fff;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .2);
  }

  .main-panel-agenda .mobile-week-day-chip.is-active strong {
    color: #fff;
  }

  .main-panel-agenda .mobile-week-panel {
    display: none;
  }

  .main-panel-agenda .mobile-week-panel.is-active {
    display: block;
  }

  .main-panel-agenda .agenda-mobile-week-timeline {
    --day-hour-col: 54px;
    display: block !important;
    height: min(640px, calc(100dvh - 15.2rem)) !important;
    min-height: min(520px, calc(100dvh - 15.2rem)) !important;
    max-height: none !important;
    padding: .5rem .68rem .72rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-row {
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) !important;
    min-height: 66px !important;
    padding: .42rem 0 !important;
    border-bottom: 1px solid #edf2fb !important;
    column-gap: .26rem !important;
  }

  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-row:last-child {
    border-bottom: 0 !important;
  }

  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-row.has-events {
    min-height: 116px !important;
  }

  .main-panel-agenda .agenda-mobile-week-timeline .dt-hour {
    padding: .48rem .12rem 0 .02rem !important;
    color: #6b7da2 !important;
    font-size: .78rem !important;
    line-height: 1 !important;
    font-weight: 850 !important;
  }

  .main-panel-agenda .agenda-mobile-week-timeline .dt-slot {
    min-width: 0 !important;
    padding: .22rem 0 !important;
    gap: .34rem !important;
  }
}

/* ---------- Agenda mobile: mês compacto sem corte lateral ---------- */
@media (max-width: 768px) {
  .main-panel-agenda .calendar {
    width: 100% !important;
    max-width: 100% !important;
    padding: .62rem .48rem .72rem !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .main-panel-agenda .cal-head,
  .main-panel-agenda .cal-grid {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    box-sizing: border-box !important;
  }

  .main-panel-agenda .cal-head {
    gap: .14rem !important;
    padding: 0 0 .42rem !important;
    color: #7c8aa7 !important;
    font-size: .58rem !important;
    letter-spacing: .04em !important;
  }

  .main-panel-agenda .cal-grid {
    gap: .14rem !important;
  }

  .main-panel-agenda .cal-day {
    min-width: 0 !important;
    min-height: clamp(54px, 15.2vw, 70px) !important;
    padding: .24rem .22rem !important;
    border-radius: 9px !important;
    gap: .16rem !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .cal-day-num {
    font-size: clamp(.72rem, 3.3vw, .86rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  .main-panel-agenda .cal-day-count {
    min-width: 16px !important;
    padding: 1px 4px !important;
    font-size: .56rem !important;
    line-height: 1.15 !important;
  }

  .main-panel-agenda .cal-day-events {
    gap: .12rem !important;
  }

  .main-panel-agenda .cal-event {
    min-height: 14px !important;
    padding: 1px 3px !important;
    border-left-width: 2px !important;
    border-radius: 5px !important;
    justify-content: center !important;
    font-size: .56rem !important;
  }

  .main-panel-agenda .cal-event-time {
    font-size: .54rem !important;
  }

  .main-panel-agenda .cal-event-more {
    max-width: 100% !important;
    padding: 1px 3px !important;
    font-size: .54rem !important;
    line-height: 1.1 !important;
  }
}

@media (max-width: 370px) {
  .main-panel-agenda .calendar {
    padding-inline: .36rem !important;
  }

  .main-panel-agenda .cal-head,
  .main-panel-agenda .cal-grid {
    gap: .1rem !important;
  }

  .main-panel-agenda .cal-day {
    min-height: 52px !important;
    padding: .2rem .18rem !important;
    border-radius: 8px !important;
  }
}

@media (max-width: 420px) {
  .main-panel-agenda .agenda-mobile-day-timeline {
    --day-hour-col: 50px;
    padding-inline: .58rem !important;
  }

  .main-panel-agenda .mobile-dt-event .dt-event-title {
    font-size: .82rem !important;
  }

  .main-panel-agenda .mobile-event-status {
    display: none;
  }
}

/* ---------- Mobile KPI Edge Alignment ---------- */
@media (max-width: 1024px) {
  .fin-kpi-grid,
  .main-panel-produtos .catalog-kpis {
    --mobile-kpi-edge: max(var(--mobile-gutter, 1rem), 1.125rem);
    --mobile-kpi-gap: .56rem;
    gap: var(--mobile-kpi-gap) !important;
    margin-left: calc(var(--mobile-gutter, 1rem) * -1) !important;
    margin-right: calc(var(--mobile-gutter, 1rem) * -1) !important;
    padding-left: var(--mobile-kpi-edge) !important;
    padding-right: var(--mobile-kpi-edge) !important;
    scroll-padding-left: var(--mobile-kpi-edge) !important;
    scroll-padding-right: var(--mobile-kpi-edge) !important;
    box-sizing: border-box !important;
  }

  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    flex: 0 0 calc((100vw - (2 * var(--mobile-kpi-edge)) - (2 * var(--mobile-kpi-gap))) / 3) !important;
    box-sizing: border-box !important;
  }

  .fin-kpi-grid::after,
  .main-panel-produtos .catalog-kpis::after {
    content: "";
    flex: 0 0 calc(var(--mobile-kpi-edge) - var(--mobile-kpi-gap));
    min-width: calc(var(--mobile-kpi-edge) - var(--mobile-kpi-gap));
    pointer-events: none;
  }
}

@media (max-width: 370px) {
  .fin-kpi-grid,
  .main-panel-produtos .catalog-kpis {
    --mobile-kpi-edge: max(var(--mobile-gutter, .92rem), .92rem);
    --mobile-kpi-gap: .48rem;
  }
}

/* ---------- Mobile KPI Fit Polish ---------- */
@media (max-width: 1024px) {
  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    min-height: 108px !important;
    padding: .52rem .46rem .58rem !important;
    row-gap: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-head {
    display: grid !important;
    grid-template-columns: 27px minmax(0, 1fr) !important;
    grid-template-rows: 27px auto !important;
    align-items: start !important;
    gap: .28rem .34rem !important;
    min-height: 50px !important;
    margin-bottom: .28rem !important;
  }

  .fin-kpi-grid .fin-kpi-icon,
  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    border-radius: 9px !important;
    font-size: .76rem !important;
    grid-column: 1;
    grid-row: 1;
  }

  .fin-kpi-grid .fin-kpi-label {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    text-overflow: clip !important;
    -webkit-line-clamp: unset !important;
    font-size: clamp(.66rem, 2.28vw, .76rem) !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi[data-kpi="hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ocupacao_dia"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="total_clientes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="sem_retorno_60"] .fin-kpi-label::after {
    display: block !important;
    overflow: visible !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    -webkit-line-clamp: unset !important;
    font-size: clamp(.66rem, 2.28vw, .76rem) !important;
    line-height: 1.02 !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text {
    font-size: clamp(1.04rem, 4.45vw, 1.22rem) !important;
  }

  .fin-kpi-grid .fin-kpi-foot .muted {
    font-size: clamp(.61rem, 2.42vw, .7rem) !important;
    line-height: 1.06 !important;
  }
}

@media (max-width: 370px) {
  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    min-height: 110px !important;
    padding-inline: .38rem !important;
  }

  .fin-kpi-grid .fin-kpi-head {
    grid-template-columns: 26px minmax(0, 1fr) !important;
    grid-template-rows: 26px auto !important;
    min-height: 50px !important;
  }

  .fin-kpi-grid .fin-kpi-icon,
  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    font-size: .72rem !important;
  }

  .fin-kpi-grid .fin-kpi-label,
  .fin-kpi[data-kpi="hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ocupacao_dia"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="total_clientes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="sem_retorno_60"] .fin-kpi-label::after {
    font-size: .64rem !important;
  }
}

/* ---------- Mobile KPI Inline Header + Dashboard Agenda Cleanup ---------- */
@media (max-width: 1024px) {
  .fin-kpi-grid .fin-kpi-head {
    grid-template-columns: 27px minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    gap: .34rem !important;
    min-height: 30px !important;
    margin-bottom: .34rem !important;
  }

  .fin-kpi-grid .fin-kpi-label {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: block !important;
    line-height: 1.05 !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text,
  .fin-kpi-grid .fin-kpi-foot {
    margin-left: calc(27px + .34rem) !important;
  }

  .fin-kpi[data-kpi="hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ocupacao_dia"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="total_clientes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="sem_retorno_60"] .fin-kpi-label::after {
    line-height: 1.05 !important;
  }

  .dashboard-upcoming {
    display: none !important;
  }

  .dashboard-agenda-list {
    gap: .48rem !important;
    max-height: 182px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  .dashboard-agenda-row {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: .5rem !important;
    padding: .58rem .62rem !important;
  }

  .dashboard-agenda-copy {
    display: flex !important;
    min-width: 0 !important;
    align-items: baseline !important;
    gap: .3rem !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    line-height: 1.12 !important;
  }

  .dashboard-agenda-service,
  .dashboard-agenda-client {
    display: block !important;
    min-width: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  .dashboard-agenda-copy.has-client .dashboard-agenda-service {
    flex: 0 1 auto !important;
    max-width: 52% !important;
  }

  .dashboard-agenda-client {
    flex: 1 1 auto !important;
    margin-top: 0 !important;
  }

  .dashboard-agenda-separator {
    flex: 0 0 auto !important;
    color: #94a3b8 !important;
    font-size: .86em !important;
    font-weight: 800 !important;
  }
}

@media (max-width: 370px) {
  .fin-kpi-grid .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text,
  .fin-kpi-grid .fin-kpi-foot {
    margin-left: calc(26px + .3rem) !important;
  }
}

/* ---------- Mobile Panel Config Sheet - single scroll ---------- */
@media (max-width: 768px) {
  #dashPersonalizarModal,
  #finPersonalizarModal,
  #agendaPersonalizarModal,
  #clientesPersonalizarModal,
  #prodPersonalizarModal {
    align-items: flex-end !important;
    padding:
      max(.5rem, env(safe-area-inset-top))
      .58rem
      max(.5rem, env(safe-area-inset-bottom)) !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet,
  #finPersonalizarModal .mobile-panel-config-sheet,
  #agendaPersonalizarModal .mobile-panel-config-sheet,
  #clientesPersonalizarModal .mobile-panel-config-sheet,
  #prodPersonalizarModal .mobile-panel-config-sheet {
    width: min(100%, 540px) !important;
    height: auto !important;
    max-height: min(92dvh, 720px) !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 0 1 auto !important;
    overflow: hidden !important;
    border-radius: 22px 22px 18px 18px !important;
    background: #fff !important;
  }

  #agendaPersonalizarModal .mobile-panel-config-sheet > form,
  #clientesPersonalizarModal .mobile-panel-config-sheet > form,
  #prodPersonalizarModal .mobile-panel-config-sheet > form {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-head,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-head,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-head,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-head,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-head {
    flex: 0 0 auto !important;
    min-height: 58px !important;
    padding: .82rem .94rem !important;
    border-bottom: 1px solid #e8eef8 !important;
    background: rgba(255, 255, 255, .98) !important;
    z-index: 2;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-head h2,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-head h2,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-head h2,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-head h2,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-head h2 {
    min-width: 0 !important;
    color: #111c35 !important;
    font-size: clamp(1.02rem, 4.5vw, 1.18rem) !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-head h2 {
    font-size: 0 !important;
  }

  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-head h2 i {
    font-size: 1.04rem !important;
  }

  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-head h2::after {
    content: "Configurar painel";
    font-size: clamp(1.02rem, 4.5vw, 1.18rem);
    line-height: 1.08;
    font-weight: 850;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-body,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-body,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-body,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-body,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: block !important;
    padding: .74rem .82rem 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, .35) transparent;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar {
    width: 4px;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar-thumb,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar-thumb,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar-thumb,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar-thumb,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-body::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, .35);
    border-radius: 999px;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-body > .muted,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-body > .muted,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-body .muted:first-child,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-body > .muted,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-help {
    display: block !important;
    margin: 0 0 .62rem !important;
    color: #7a89a9 !important;
    font-size: .82rem !important;
    line-height: 1.28 !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-section-title,
  #finPersonalizarModal .mobile-panel-config-sheet .fin-pers-section-title,
  #agendaPersonalizarModal .mobile-panel-config-sheet .fin-pers-section-title,
  #clientesPersonalizarModal .mobile-panel-config-sheet .fin-pers-section-title,
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-section-title {
    margin: .58rem 0 .34rem !important;
    color: #53627e !important;
    font-size: .74rem !important;
    line-height: 1.1 !important;
    letter-spacing: .02em;
    font-weight: 850 !important;
    text-transform: uppercase;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-grid,
  #finPersonalizarModal .mobile-panel-config-sheet .fin-pers-grid,
  #agendaPersonalizarModal .mobile-panel-config-sheet .fin-pers-grid,
  #clientesPersonalizarModal .mobile-panel-config-sheet .fin-pers-grid,
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-grid,
  #dashPersonalizarModal .mobile-panel-config-sheet #dashCardsGrid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .46rem !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 0 .5rem !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #finPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #agendaPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #clientesPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-item {
    display: grid !important;
    grid-template-columns: 22px 30px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .5rem !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 56px !important;
    padding: .52rem .58rem !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    box-shadow: none !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet #dashCardsGrid .fin-pers-item {
    align-items: flex-start !important;
    min-height: 72px !important;
    padding-block: .55rem !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-item input,
  #finPersonalizarModal .mobile-panel-config-sheet .fin-pers-item input,
  #agendaPersonalizarModal .mobile-panel-config-sheet .fin-pers-item input,
  #clientesPersonalizarModal .mobile-panel-config-sheet .fin-pers-item input,
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-item input {
    grid-column: 1;
    width: 20px !important;
    height: 20px !important;
    margin: .05rem 0 0 !important;
    align-self: start;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-icon,
  #finPersonalizarModal .mobile-panel-config-sheet .fin-pers-icon,
  #agendaPersonalizarModal .mobile-panel-config-sheet .fin-pers-icon,
  #clientesPersonalizarModal .mobile-panel-config-sheet .fin-pers-icon,
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-icon {
    grid-column: 2;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 10px !important;
    font-size: .82rem !important;
    align-self: start;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-label,
  #finPersonalizarModal .mobile-panel-config-sheet .fin-pers-label,
  #agendaPersonalizarModal .mobile-panel-config-sheet .fin-pers-label,
  #clientesPersonalizarModal .mobile-panel-config-sheet .fin-pers-label,
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-label {
    display: -webkit-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
    color: #111c35 !important;
    font-size: .9rem !important;
    line-height: 1.12 !important;
    font-weight: 850 !important;
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-item > span:last-child:not(.fin-pers-icon):not(.fin-pers-label) {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-item small.muted {
    display: -webkit-box !important;
    margin-top: .14rem;
    color: #7a89a9 !important;
    font-size: .73rem !important;
    line-height: 1.16 !important;
    white-space: normal !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-foot,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-foot {
    flex: 0 0 auto !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 3;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: .5rem !important;
    margin: .7rem -.82rem 0 !important;
    padding: .62rem .82rem calc(.62rem + env(safe-area-inset-bottom)) !important;
    background: rgba(255, 255, 255, .98) !important;
    border-top: 1px solid #e8eef8 !important;
    box-shadow: 0 -10px 20px rgba(15, 23, 42, .06) !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet > .modal-foot {
    position: relative !important;
    margin: 0 !important;
  }

  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot form,
  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot form,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot > div,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-reset-wrap,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-actions {
    display: contents !important;
  }

  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot > div,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot > div,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-actions {
    gap: 0 !important;
  }

  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot [data-close-modal],
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot [data-close-modal],
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-cancel-btn {
    display: none !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn {
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 .5rem !important;
    border-radius: 13px !important;
    justify-content: center !important;
    gap: .34rem !important;
    white-space: nowrap !important;
    font-size: .82rem !important;
    line-height: 1 !important;
    font-weight: 850 !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot form .btn,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn-outline,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot form .btn,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot form .btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-reset-btn,
  #finPersonalizarModal .mobile-panel-config-sheet #finPersSalvar,
  #clientesPersonalizarModal .mobile-panel-config-sheet #clientesPersSalvar,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-save-btn {
    font-size: 0 !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot form .btn::after,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn-outline::after,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot form .btn::after,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot form .btn::after,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-reset-btn::after {
    content: "Resetar";
    font-size: .82rem;
    font-weight: 850;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet #dashPersSalvar::after,
  #finPersonalizarModal .mobile-panel-config-sheet #finPersSalvar::after,
  #agendaPersonalizarModal .mobile-panel-config-sheet #agendaPersSalvar::after,
  #clientesPersonalizarModal .mobile-panel-config-sheet #clientesPersSalvar::after,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-save-btn::after {
    content: "Salvar";
    font-size: .84rem;
    font-weight: 850;
  }
}

@media (max-width: 360px) {
  #dashPersonalizarModal .mobile-panel-config-sheet,
  #finPersonalizarModal .mobile-panel-config-sheet,
  #agendaPersonalizarModal .mobile-panel-config-sheet,
  #clientesPersonalizarModal .mobile-panel-config-sheet,
  #prodPersonalizarModal .mobile-panel-config-sheet {
    max-height: min(92dvh, 690px) !important;
    border-radius: 20px 20px 16px 16px !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #finPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #agendaPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #clientesPersonalizarModal .mobile-panel-config-sheet .fin-pers-item,
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-item {
    grid-template-columns: 20px 28px minmax(0, 1fr) !important;
    gap: .42rem !important;
    padding-inline: .52rem !important;
  }
}

/* ---------- Panel Config Footer Labels ---------- */
@media (max-width: 768px) {
  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn {
    font-size: .82rem !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn::after,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn::after,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn::after,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn::after,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn::after {
    content: none !important;
    display: none !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn i,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn i,
  #agendaPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn i,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn i,
  #prodPersonalizarModal .mobile-panel-config-sheet .modal-foot .btn i {
    font-size: .92rem !important;
  }
}

/* ---------- Agenda Mobile Smart Timeline ---------- */
.agenda-create-choice-card {
  width: min(460px, calc(100vw - 1.4rem));
}

.agenda-create-choice-body {
  display: grid;
  gap: .72rem;
  padding-bottom: 1.5rem;
}

.agenda-create-choice-body h3 {
  margin: 0 0 .1rem;
  color: var(--ink-900);
  font-size: 1rem;
  line-height: 1.2;
}

.agenda-create-choice-body form {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

.agenda-create-option {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 76px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: .78rem;
  padding: .86rem;
  border: 1px solid #dbe5f4;
  border-radius: 16px;
  background: #fff;
  color: var(--ink-900);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .055);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.agenda-create-option:hover,
.agenda-create-option:focus-visible {
  transform: translateY(-1px);
  border-color: #93c5fd;
  background: #f8fbff;
  box-shadow: 0 14px 28px rgba(37, 99, 235, .1);
  outline: none;
}

.agenda-create-option:active {
  transform: scale(.985);
}

.agenda-create-option-icon {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #dbeafe;
  color: #2563eb;
  font-size: 1rem;
}

.agenda-create-option strong,
.agenda-create-option small {
  display: block;
}

.agenda-create-option strong {
  font-size: .92rem;
  line-height: 1.15;
}

.agenda-create-option small {
  margin-top: .16rem;
  color: #71809c;
  font-size: .75rem;
  line-height: 1.25;
}

.public-service-options {
  display: grid;
  gap: .5rem;
  margin-top: .55rem;
}

.public-service-options label {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  gap: .55rem;
  padding: .62rem .7rem;
  border: 1px solid #dbe7f6;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
}

.public-service-options input {
  accent-color: var(--blue-600);
}

.public-service-options strong,
.public-service-options small {
  display: block;
}

.public-service-options strong {
  color: var(--ink-900);
  font-size: .86rem;
  line-height: 1.15;
}

.public-service-options small {
  margin-top: .14rem;
  color: #71809c;
  font-size: .74rem;
}

.public-client-fields {
  margin-bottom: .72rem;
}

@media (max-width: 1024px) {
  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-row {
    grid-template-columns: 64px minmax(0, 1fr) !important;
    min-height: 82px !important;
    padding: .72rem 0 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-row.has-events {
    min-height: 174px !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-hour {
    padding-top: .42rem !important;
    color: #66789c !important;
    font-size: .82rem !important;
    font-weight: 850 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-slot {
    min-width: 0 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event {
    position: relative !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .main-panel-agenda .mobile-agenda-event-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: .7rem;
    padding: .74rem;
    border: 1px solid #dbe7f6;
    border-left: 4px solid var(--tone, #2563eb);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow: 0 12px 26px rgba(15, 23, 42, .065);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  }

  .main-panel-agenda .mobile-agenda-event-card:active {
    transform: scale(.99);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
  }

  .main-panel-agenda .mobile-agenda-event-time strong,
  .main-panel-agenda .mobile-agenda-event-time span {
    display: block;
  }

  .main-panel-agenda .mobile-agenda-event-time strong {
    color: #2563eb;
    font-size: .86rem;
    line-height: 1.05;
    font-weight: 900;
  }

  .main-panel-agenda .mobile-agenda-event-time span {
    margin-top: .18rem;
    color: #71809c;
    font-size: .68rem;
    line-height: 1.15;
    font-weight: 750;
  }

  .main-panel-agenda .mobile-agenda-event-main {
    min-width: 0;
    display: grid;
    gap: .2rem;
  }

  .main-panel-agenda .mobile-agenda-event-top {
    display: flex;
    justify-content: flex-end;
    min-height: 20px;
    margin-bottom: .02rem;
  }

  .main-panel-agenda .mobile-agenda-event-kicker {
    color: #71809c;
    font-size: .64rem;
    line-height: 1;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .04em;
  }

  .main-panel-agenda .mobile-agenda-event-title {
    min-width: 0;
    color: #0f172a;
    font-size: .92rem !important;
    line-height: 1.12 !important;
    font-weight: 900;
    overflow-wrap: anywhere;
  }

  .main-panel-agenda .mobile-agenda-event-sub {
    min-width: 0;
    color: #53627f;
    font-size: .78rem !important;
    line-height: 1.2 !important;
    font-weight: 650;
    overflow-wrap: anywhere;
  }

  .main-panel-agenda .mobile-agenda-event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .34rem;
    margin-top: .24rem;
  }

  .main-panel-agenda .mobile-agenda-event-meta span {
    display: inline-flex;
    align-items: center;
    gap: .24rem;
    min-height: 22px;
    padding: .18rem .42rem;
    border-radius: 999px;
    background: #eef4ff;
    color: #52627f;
    font-size: .68rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
  }

  .main-panel-agenda .mobile-agenda-event-meta .payment-pago,
  .main-panel-agenda .mobile-agenda-event-meta .payment-concluido {
    background: #dcfce7;
    color: #15803d;
  }

  .main-panel-agenda .mobile-agenda-event-meta .payment-parcial,
  .main-panel-agenda .mobile-agenda-event-meta .payment-agendado {
    background: #fef3c7;
    color: #b45309;
  }

  .main-panel-agenda .mobile-agenda-event-note {
    margin-top: .2rem;
    color: #71809c;
    font-size: .72rem;
    line-height: 1.25;
  }

  .main-panel-agenda .mobile-agenda-event-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: .36rem;
    margin-top: .52rem;
    padding-top: .52rem;
    border-top: 1px solid #edf2f7;
  }

  .main-panel-agenda .mobile-agenda-event-actions .icon-btn {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 10px;
    background: #f8fafc;
  }

  .main-panel-agenda .mobile-empty-slot {
    min-height: 28px;
    padding: .3rem .62rem !important;
    border-radius: 999px;
    background: #f8fbff;
    border: 1px dashed #d8e5f5;
    color: #8a9ab7;
    font-size: .75rem;
    font-weight: 850;
  }

  .agenda-create-choice-card {
    align-self: flex-end;
    margin: 0 auto max(.6rem, env(safe-area-inset-bottom));
    border-radius: 22px 22px 18px 18px;
  }
}

/* ---------- Final mobile polish: KPI alignment, Agenda cards and modal buttons ---------- */
@media (max-width: 1024px) {
  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    min-height: 108px !important;
    padding: .54rem .48rem .58rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
  }

  .fin-kpi-grid .fin-kpi-head,
  .main-panel-produtos .catalog-kpis .fin-kpi-head {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    gap: .28rem !important;
    min-height: 24px !important;
    margin: 0 0 .28rem !important;
    padding: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-icon,
  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    border-radius: 8px !important;
    font-size: .64rem !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .fin-kpi-grid .fin-kpi-label,
  .main-panel-produtos .catalog-kpis .fin-kpi-label {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: -webkit-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    color: #1c2942 !important;
    font-size: clamp(.62rem, 2.36vw, .74rem) !important;
    line-height: 1.02 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi[data-kpi="hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="receita_prevista_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="ocupacao_dia"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="total_clientes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label::after,
  .fin-kpi[data-kpi="sem_retorno_60"] .fin-kpi-label::after {
    display: -webkit-box !important;
    overflow: hidden !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(.62rem, 2.36vw, .74rem) !important;
    line-height: 1.02 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .main-panel-produtos .catalog-kpis .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text,
  .main-panel-produtos .catalog-kpis .catalog-kpi-text,
  .fin-kpi-grid .fin-kpi-foot,
  .main-panel-produtos .catalog-kpis .fin-kpi-foot {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin-left: calc(22px + .28rem) !important;
    text-align: left !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .main-panel-produtos .catalog-kpis .fin-kpi-value {
    margin-top: .18rem !important;
    overflow: visible !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    font-size: clamp(1.02rem, 4.2vw, 1.24rem) !important;
    line-height: 1.03 !important;
    font-weight: 900 !important;
  }

  .fin-kpi-grid .catalog-kpi-text,
  .main-panel-produtos .catalog-kpis .catalog-kpi-text {
    margin-top: .18rem !important;
    display: -webkit-box !important;
    overflow: hidden !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(.86rem, 3.6vw, 1.06rem) !important;
    line-height: 1.04 !important;
    font-weight: 900 !important;
  }

  .fin-kpi-grid .fin-kpi-foot,
  .main-panel-produtos .catalog-kpis .fin-kpi-foot {
    margin-top: .16rem !important;
    line-height: 1.05 !important;
  }

  .fin-kpi-grid .fin-kpi-foot .muted,
  .main-panel-produtos .catalog-kpis .fin-kpi-foot .muted {
    font-size: clamp(.58rem, 2.22vw, .68rem) !important;
    line-height: 1.06 !important;
    text-align: left !important;
  }
}

@media (max-width: 370px) {
  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    padding-inline: .36rem !important;
  }

  .fin-kpi-grid .fin-kpi-head,
  .main-panel-produtos .catalog-kpis .fin-kpi-head {
    grid-template-columns: 20px minmax(0, 1fr) !important;
    gap: .22rem !important;
  }

  .fin-kpi-grid .fin-kpi-icon,
  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    font-size: .6rem !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .main-panel-produtos .catalog-kpis .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text,
  .main-panel-produtos .catalog-kpis .catalog-kpi-text,
  .fin-kpi-grid .fin-kpi-foot,
  .main-panel-produtos .catalog-kpis .fin-kpi-foot {
    margin-left: calc(20px + .22rem) !important;
  }
}

/* ---------- Dashboard mobile-only polish ---------- */
@media (max-width: 768px) {
  .main-panel-dashboard #dashKpiGrid .fin-kpi {
    display: grid !important;
    grid-template-rows: 28px minmax(34px, 1fr) auto !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    min-height: 108px !important;
    padding: .52rem .48rem .5rem !important;
    row-gap: .08rem !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-head {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .28rem !important;
    min-height: 24px !important;
    margin: 0 !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-icon {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    border-radius: 8px !important;
    font-size: .64rem !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-label {
    grid-column: 2 !important;
    display: -webkit-box !important;
    min-width: 0 !important;
    overflow: hidden !important;
    color: #17233d !important;
    font-size: clamp(.64rem, 2.38vw, .76rem) !important;
    font-weight: 850 !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-value,
  .main-panel-dashboard #dashKpiGrid .catalog-kpi-text {
    align-self: center !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: #071126 !important;
    text-align: center !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    font-size: clamp(1.18rem, 5vw, 1.45rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-foot {
    align-self: end !important;
    width: 100% !important;
    margin: 0 !important;
    min-width: 0 !important;
    text-align: center !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-foot .muted {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: #72809d !important;
    text-align: center !important;
    font-size: clamp(.62rem, 2.34vw, .72rem) !important;
    line-height: 1.04 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  .main-panel-dashboard .dashboard-card-grid .card-header {
    margin-bottom: .68rem;
  }

  .main-panel-dashboard .fin-alerts {
    margin-bottom: .62rem !important;
  }

  .main-panel-dashboard .fin-alerts .empty-state {
    padding: .58rem .45rem !important;
  }

  .main-panel-dashboard .fin-alerts .empty-state i {
    font-size: 1.35rem;
    margin-bottom: .35rem;
  }

  .main-panel-dashboard .fin-alerts .empty-state p {
    font-size: .9rem;
    line-height: 1.22;
  }

  .main-panel-dashboard .fin-insights {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .42rem !important;
  }

  .main-panel-dashboard .fin-insight {
    min-width: 0 !important;
    padding: .52rem .42rem !important;
    border-radius: 12px !important;
    text-align: center !important;
  }

  .main-panel-dashboard .fin-insight-label {
    overflow: hidden;
    color: #5c6a86;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: .68rem;
    line-height: 1.05;
    font-weight: 850;
  }

  .main-panel-dashboard .fin-insight-value {
    margin-top: .28rem !important;
    overflow: hidden;
    color: #071126;
    text-align: center;
    white-space: nowrap;
    text-overflow: clip;
    font-size: clamp(.8rem, 3.1vw, 1rem) !important;
    line-height: 1.05 !important;
    font-weight: 900 !important;
  }
}

@media (max-width: 370px) {
  .main-panel-dashboard #dashKpiGrid .fin-kpi {
    padding-inline: .4rem !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-head {
    grid-template-columns: 20px minmax(0, 1fr) !important;
    gap: .22rem !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-icon {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    font-size: .6rem !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi-label {
    font-size: .63rem !important;
  }

  .main-panel-dashboard .fin-insight {
    padding-inline: .32rem !important;
  }

  .main-panel-dashboard .fin-insight-value {
    font-size: .78rem !important;
  }
}

.smart-autocomplete-field {
  position: relative;
}

.smart-suggestions {
  position: absolute;
  z-index: 80;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 220px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  border: 1px solid #dbe5f6;
  border-radius: 14px;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
  padding: .35rem;
}

.smart-suggestion {
  width: 100%;
  border: 0;
  background: transparent;
  color: #0f172a;
  display: flex;
  flex-direction: column;
  gap: .14rem;
  align-items: flex-start;
  padding: .62rem .7rem;
  border-radius: 10px;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.smart-suggestion:hover,
.smart-suggestion:focus-visible {
  background: #eef5ff;
  outline: none;
}

.smart-suggestion strong {
  font-size: .88rem;
  line-height: 1.15;
}

.smart-suggestion span {
  color: #64748b;
  font-size: .78rem;
  line-height: 1.1;
}

.business-blocked-list {
  display: grid;
  gap: .55rem;
}

.business-blocked-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .72rem .82rem;
  border: 1px solid #dce6f5;
  border-radius: 14px;
  background: #fff;
}

.business-blocked-item strong,
.business-blocked-item span,
.business-blocked-item small {
  display: block;
}

.business-blocked-item strong {
  color: #0f172a;
  font-weight: 800;
}

.business-blocked-item span,
.business-blocked-item small,
.business-blocked-empty {
  color: #64748b;
  font-size: .86rem;
  line-height: 1.25;
}

.business-blocked-empty {
  padding: .72rem .82rem;
  border: 1px dashed #d7e2f2;
  border-radius: 14px;
  background: #fff;
}

.business-blocked-list--modal {
  gap: .48rem;
}

.business-blocked-list--modal .business-blocked-item {
  padding: .65rem .72rem;
  border-radius: 12px;
}

.business-blocked-list--modal .business-blocked-empty {
  border-radius: 12px;
}

@media (max-width: 1024px) {
  .agenda-schedule-form .field,
  .agenda-schedule-form .form-grid,
  .agenda-schedule-form .agenda-services-field,
  .agenda-schedule-form .agenda-services-summary {
    width: 100%;
    min-width: 0;
  }

  .agenda-schedule-form .form-grid {
    grid-template-columns: 1fr !important;
    gap: .66rem !important;
  }

  .agenda-schedule-form .agenda-service-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
  }

  .agenda-schedule-form .agenda-observacoes {
    min-height: 44px !important;
    height: 44px;
  }

  .business-blocked-item {
    align-items: flex-start;
    padding: .68rem .72rem;
  }
}

@media (max-width: 1024px) {
  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-row {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    min-height: 66px !important;
    padding: .42rem 0 !important;
    column-gap: .26rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-row.has-events {
    min-height: 116px !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-hour {
    padding-top: .48rem !important;
    font-size: .78rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-slot {
    padding: .22rem 0 !important;
    gap: .34rem !important;
  }

  .main-panel-agenda .mobile-agenda-event-card {
    display: block !important;
    padding: .58rem .62rem !important;
    border-radius: 15px !important;
    border-left-width: 4px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .055) !important;
  }

  .main-panel-agenda .mobile-agenda-event-main {
    display: grid !important;
    gap: .2rem !important;
  }

  .main-panel-agenda .mobile-agenda-event-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: .42rem !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  .main-panel-agenda .mobile-agenda-event-top .badge {
    max-width: 94px;
    padding: .2rem .44rem;
    font-size: .68rem;
    line-height: 1;
    white-space: nowrap;
  }

  .main-panel-agenda .mobile-agenda-event-kicker {
    display: none !important;
  }

  .main-panel-agenda .mobile-agenda-event-title {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    font-size: .88rem !important;
    line-height: 1.12 !important;
    font-weight: 900 !important;
  }

  .main-panel-agenda .mobile-agenda-event-sub {
    min-width: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    font-size: .74rem !important;
    line-height: 1.12 !important;
    font-weight: 750 !important;
  }

  .main-panel-agenda .mobile-agenda-event-meta {
    gap: .28rem !important;
    margin-top: .16rem !important;
  }

  .main-panel-agenda .mobile-agenda-event-meta span {
    min-height: 20px !important;
    padding: .16rem .36rem !important;
    font-size: .65rem !important;
  }

  .main-panel-agenda .mobile-agenda-event-note {
    display: none !important;
  }

  .main-panel-agenda .mobile-agenda-event-actions {
    gap: .26rem !important;
    margin-top: .34rem !important;
    padding-top: .34rem !important;
  }

  .main-panel-agenda .mobile-agenda-event-actions .icon-btn {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    border-radius: 9px !important;
    font-size: .78rem !important;
  }
}

@media (max-width: 768px) {
  .modal-actions:has(> .btn:nth-child(2):last-child),
  .modal-foot:has(> .btn:nth-child(2):last-child),
  .agenda-public-link-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .62rem !important;
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .modal-actions:has(> .btn:nth-child(2):last-child) .btn,
  .modal-foot:has(> .btn:nth-child(2):last-child) .btn,
  .agenda-public-link-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;
    justify-content: center !important;
    border-radius: 14px !important;
    padding: .72rem .7rem !important;
    white-space: nowrap !important;
    font-size: .88rem !important;
    font-weight: 850 !important;
  }

  .modal-actions .btn-ghost,
  .modal-actions .btn-outline,
  .modal-foot .btn-ghost,
  .modal-foot .btn-outline,
  .agenda-public-link-actions .btn-ghost {
    border: 1px solid #d8e2f1 !important;
    background: #fff !important;
    color: #12203a !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .035) !important;
  }

  .agenda-public-link-modal-card {
    width: min(100%, 520px) !important;
    padding-bottom: max(.9rem, env(safe-area-inset-bottom)) !important;
  }
}

/* ---------- Definitive mobile KPI standard ---------- */
@media (max-width: 1024px) {
  .fin-kpi-grid .fin-kpi-label::after,
  .main-panel-produtos .catalog-kpis .fin-kpi-label::after {
    content: none !important;
    display: none !important;
  }

  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    display: grid !important;
    grid-template-rows: 28px minmax(34px, 1fr) auto !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    min-height: 108px !important;
    padding: .52rem .48rem .5rem !important;
    row-gap: .08rem !important;
    overflow: hidden !important;
  }

  .fin-kpi-grid .fin-kpi-head,
  .main-panel-produtos .catalog-kpis .fin-kpi-head {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    gap: .28rem !important;
    min-height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-icon,
  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    border-radius: 8px !important;
    font-size: .64rem !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .fin-kpi-grid .fin-kpi-label,
  .main-panel-produtos .catalog-kpis .fin-kpi-label {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: -webkit-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    color: #17233d !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(.64rem, 2.38vw, .76rem) !important;
    line-height: 1.04 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi-grid .fin-kpi-value,
  .main-panel-produtos .catalog-kpis .fin-kpi-value,
  .fin-kpi-grid .catalog-kpi-text,
  .main-panel-produtos .catalog-kpis .catalog-kpi-text {
    align-self: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: #071126 !important;
    text-align: center !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    font-size: clamp(1.18rem, 5vw, 1.45rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  .fin-kpi-grid .fin-kpi-foot,
  .main-panel-produtos .catalog-kpis .fin-kpi-foot {
    align-self: end !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-align: center !important;
    line-height: 1.05 !important;
  }

  .fin-kpi-grid .fin-kpi-foot .muted,
  .main-panel-produtos .catalog-kpis .fin-kpi-foot .muted {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: #72809d !important;
    text-align: center !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(.62rem, 2.34vw, .72rem) !important;
    line-height: 1.04 !important;
  }
}

@media (max-width: 370px) {
  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    padding-inline: .4rem !important;
  }

  .fin-kpi-grid .fin-kpi-head,
  .main-panel-produtos .catalog-kpis .fin-kpi-head {
    grid-template-columns: 20px minmax(0, 1fr) !important;
    gap: .22rem !important;
  }

  .fin-kpi-grid .fin-kpi-icon,
  .main-panel-produtos .catalog-kpis .fin-kpi-icon {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    font-size: .6rem !important;
  }

  .fin-kpi-grid .fin-kpi-label,
  .main-panel-produtos .catalog-kpis .fin-kpi-label {
    font-size: .63rem !important;
  }
}

/* ---------- Mobile KPI content visibility and alignment fix ---------- */
@media (max-width: 1024px) {
  .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-label::after,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .fin-kpi-label::after {
    content: none !important;
    display: none !important;
  }

  .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-label,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .fin-kpi-label {
    display: -webkit-box !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    color: #17233d !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(.62rem, 2.28vw, .72rem) !important;
    line-height: 1.03 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
  }

  .fin-kpi-grid .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label,
  .fin-kpi-grid .fin-kpi[data-kpi="hoje"] .fin-kpi-label,
  .fin-kpi-grid .fin-kpi[data-kpi="agendamentos_hoje"] .fin-kpi-label,
  .fin-kpi-grid .fin-kpi[data-kpi="horarios_vagos"] .fin-kpi-label,
  .fin-kpi-grid .fin-kpi[data-kpi="horarios_disponiveis"] .fin-kpi-label,
  .fin-kpi-grid .fin-kpi[data-kpi="livres_hoje"] .fin-kpi-label {
    font-size: clamp(.56rem, 2.08vw, .66rem) !important;
    line-height: 1.02 !important;
  }

  .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-value,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .fin-kpi-value,
  .fin-kpi-grid .fin-kpi[data-kpi] .catalog-kpi-text,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .catalog-kpi-text {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-self: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: #071126 !important;
    text-align: center !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    font-size: clamp(1.18rem, 5vw, 1.45rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-foot,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .fin-kpi-foot {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-self: end !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-align: center !important;
    line-height: 1.05 !important;
  }

  .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-foot .muted,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .fin-kpi-foot .muted {
    display: -webkit-box !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: hidden !important;
    color: #72809d !important;
    text-align: center !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(.62rem, 2.34vw, .72rem) !important;
    line-height: 1.04 !important;
  }
}

/* ---------- Final targeted KPI fixes requested ---------- */
@media (max-width: 1024px) {
  .main-panel-dashboard #dashKpiGrid .fin-kpi[data-kpi="ag_hoje"] .fin-kpi-label {
    font-size: clamp(.62rem, 2.3vw, .74rem) !important;
    line-height: 1.03 !important;
    letter-spacing: 0 !important;
    -webkit-line-clamp: 2 !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-action-link {
    display: grid !important;
    grid-template-rows: 28px minmax(34px, 1fr) auto !important;
    align-items: stretch !important;
    min-height: 100% !important;
    row-gap: .08rem !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-value {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-self: center !important;
    margin: 0 !important;
    color: #071126 !important;
    text-align: center !important;
    font-size: clamp(1.18rem, 5vw, 1.45rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-foot {
    align-self: end !important;
    margin: 0 !important;
    text-align: center !important;
  }
}

/* ---------- Mobile KPI width strategy: tighter spacing, same card height ---------- */
@media (max-width: 1024px) {
  .fin-kpi-grid,
  .main-panel-produtos .catalog-kpis {
    --mobile-kpi-edge: .875rem !important;
    --mobile-kpi-gap: .28rem !important;
    gap: var(--mobile-kpi-gap) !important;
    padding-left: var(--mobile-kpi-edge) !important;
    padding-right: var(--mobile-kpi-edge) !important;
    scroll-padding-left: var(--mobile-kpi-edge) !important;
    scroll-padding-right: var(--mobile-kpi-edge) !important;
  }

  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    flex-basis: calc((100vw - (2 * var(--mobile-kpi-edge)) - (2 * var(--mobile-kpi-gap))) / 3) !important;
  }

  .fin-kpi-grid::after,
  .main-panel-produtos .catalog-kpis::after {
    flex-basis: calc(var(--mobile-kpi-edge) - var(--mobile-kpi-gap)) !important;
    min-width: calc(var(--mobile-kpi-edge) - var(--mobile-kpi-gap)) !important;
  }

  .fin-kpi-grid .fin-kpi-head,
  .main-panel-produtos .catalog-kpis .fin-kpi-head {
    gap: .22rem !important;
  }
}

@media (max-width: 370px) {
  .fin-kpi-grid,
  .main-panel-produtos .catalog-kpis {
    --mobile-kpi-edge: .75rem !important;
    --mobile-kpi-gap: .24rem !important;
  }
}

/* ---------- Dashboard mobile financial summary: compact empty state ---------- */
@media (max-width: 768px) {
  .main-panel-dashboard .dashboard-finance-card {
    padding-bottom: 1rem !important;
  }

  .main-panel-dashboard .dashboard-finance-card .card-header {
    margin-bottom: .48rem !important;
  }

  .main-panel-dashboard .dashboard-finance-alerts {
    margin: .05rem 0 .56rem !important;
  }

  .main-panel-dashboard .dashboard-finance-health {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .36rem !important;
    min-height: 0 !important;
    padding: .28rem .45rem !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-align: center !important;
  }

  .main-panel-dashboard .dashboard-finance-health i {
    width: 1.18rem !important;
    height: 1.18rem !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: #9fb0c8 !important;
    font-size: .66rem !important;
    flex: 0 0 auto !important;
  }

  .main-panel-dashboard .dashboard-finance-health p {
    margin: 0 !important;
    color: #14203a !important;
    font-size: .92rem !important;
    line-height: 1.16 !important;
    font-weight: 750 !important;
  }

  .main-panel-dashboard .dashboard-finance-health-desktop {
    display: none !important;
  }

  .main-panel-dashboard .dashboard-finance-health-mobile {
    display: inline !important;
  }

  .main-panel-dashboard .dashboard-finance-action,
  .main-panel-dashboard .dashboard-receivables-section.is-empty {
    display: none !important;
  }

  .main-panel-dashboard .dashboard-receivables-section:not(.is-empty) {
    margin-top: .7rem !important;
  }

  .main-panel-dashboard .dashboard-receivables-title {
    margin-bottom: .34rem !important;
    font-size: .86rem !important;
  }
}

@media (min-width: 769px) {
  .dashboard-finance-health-mobile {
    display: none;
  }
}

/* ---------- Dashboard financial summary: executive compact style ---------- */
.main-panel-dashboard .dashboard-finance-card .card-header {
  margin-bottom: .6rem;
}

.main-panel-dashboard .dashboard-finance-alerts {
  margin: .05rem 0 .65rem !important;
}

.main-panel-dashboard .dashboard-finance-health {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .42rem !important;
  min-height: 0 !important;
  padding: .34rem .5rem !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

.main-panel-dashboard .dashboard-finance-health i {
  width: 1.22rem !important;
  height: 1.22rem !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  background: #9fb0c8 !important;
  font-size: .68rem !important;
  flex: 0 0 auto !important;
}

.main-panel-dashboard .dashboard-finance-health p {
  margin: 0 !important;
  color: #14203a !important;
  font-size: .95rem !important;
  line-height: 1.16 !important;
  font-weight: 750 !important;
}

.main-panel-dashboard .dashboard-finance-action,
.main-panel-dashboard .dashboard-receivables-section.is-empty {
  display: none !important;
}

.main-panel-dashboard .dashboard-receivables-section:not(.is-empty) {
  margin-top: .78rem !important;
}

@media (max-width: 768px) {
  .main-panel-dashboard .dashboard-finance-health {
    gap: .36rem !important;
    padding: .28rem .45rem !important;
  }

  .main-panel-dashboard .dashboard-finance-health i {
    width: 1.18rem !important;
    height: 1.18rem !important;
    font-size: .66rem !important;
  }

  .main-panel-dashboard .dashboard-finance-health p {
    font-size: .92rem !important;
  }
}

/* ---------- Clientes mobile: KPI rhythm + clean settings menu ---------- */
.clientes-import-label-mobile {
  display: none;
}

@media (max-width: 768px) {
  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-action-link {
    display: contents !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-head {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-value {
    align-self: center !important;
    margin: 0 !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-foot {
    align-self: end !important;
    margin: 0 !important;
    padding-top: 0 !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-foot .muted {
    line-height: 1.04 !important;
  }

  .main-panel-clientes .clientes-tool-menu .menu-pop {
    min-width: 13.8rem;
  }

  .main-panel-clientes .clientes-tool-menu .menu-pop a,
  .main-panel-clientes .clientes-tool-menu .menu-pop button {
    white-space: nowrap;
  }

  .main-panel-clientes .clientes-menu-filetype,
  .main-panel-clientes .clientes-copy-contacts-menu-item,
  .main-panel-clientes .clientes-import-label-desktop {
    display: none !important;
  }

  .main-panel-clientes .clientes-import-label-mobile {
    display: inline !important;
  }
}

@media (max-width: 370px) {
  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] {
    padding-inline: .38rem !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-head {
    grid-template-columns: 20px minmax(0, 1fr) !important;
    gap: .16rem !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi] .fin-kpi-icon {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
  }

  .main-panel-clientes .fin-kpi-grid .fin-kpi[data-kpi="aniversariantes_mes"] .fin-kpi-label::after {
    content: none !important;
    display: none !important;
  }
}

/* Guardrail: o X de aniversariantes nunca pode virar item de grade/largura cheia no mobile. */
.main-panel-dashboard .dashboard-birthday-alert > .dashboard-birthday-dismiss[data-birthday-dismiss],
.dashboard-birthday-alert > .dashboard-birthday-dismiss[data-birthday-dismiss] {
  all: unset !important;
  box-sizing: border-box !important;
  position: absolute !important;
  top: .72rem !important;
  right: .72rem !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 20 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .72) !important;
  color: #64748b !important;
  line-height: 1 !important;
  text-align: center !important;
  cursor: pointer !important;
}

.main-panel-dashboard .dashboard-birthday-alert > .dashboard-birthday-dismiss[data-birthday-dismiss] i,
.dashboard-birthday-alert > .dashboard-birthday-dismiss[data-birthday-dismiss] i {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  font-size: .84rem !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

/* ---------- Clientes mobile: import contacts modal ---------- */
@media (max-width: 768px) {
  #importClientesModal {
    align-items: center !important;
    justify-content: center !important;
  }

  #importClientesModal .clientes-import-modal-card {
    width: min(100%, 520px) !important;
    height: auto !important;
    max-height: calc(100dvh - max(1.4rem, env(safe-area-inset-top) + env(safe-area-inset-bottom))) !important;
  }

  #importClientesModal .modal-head {
    min-height: 54px !important;
    padding: .78rem .9rem !important;
  }

  #importClientesModal .modal-head h2 {
    font-size: 1rem !important;
    line-height: 1.1 !important;
  }

  #importClientesModal .clientes-import-form {
    flex: 0 1 auto !important;
    max-height: calc(100dvh - 6.8rem) !important;
    padding: .82rem .9rem .9rem !important;
    overflow-y: auto !important;
    gap: .64rem !important;
  }

  #importClientesModal .clientes-import-form .field {
    margin: 0 !important;
  }

  #importClientesModal .clientes-import-form label {
    margin-bottom: .34rem !important;
    font-size: .84rem !important;
    line-height: 1.1 !important;
    font-weight: 850 !important;
  }

  #clientesImportFile.input {
    width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: .42rem .52rem !important;
    border-radius: 13px !important;
    font-size: .86rem !important;
    line-height: 1.1 !important;
    color: #17233d !important;
  }

  #clientesImportFile::file-selector-button {
    min-height: 28px;
    margin-right: .46rem;
    padding: .28rem .62rem;
    border: 0;
    border-radius: 999px;
    background: #eef4ff;
    color: #2563eb;
    font: inherit;
    font-weight: 800;
  }

  #importClientesModal .client-action-summary {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .36rem !important;
    margin: .02rem 0 0 !important;
  }

  #importClientesModal .client-action-summary span {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 24px !important;
    padding: .22rem .5rem !important;
    border-radius: 999px !important;
    background: var(--app-bg) !important;
    color: #5f6f8c !important;
    font-size: .72rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
  }

  #importClientesModal .clientes-import-empty {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .62rem .68rem;
    border: 1px dashed #d9e4f4;
    border-radius: 14px;
    background: #f8fbff;
    color: #72809d;
    font-size: .82rem;
    line-height: 1.18;
    font-weight: 700;
  }

  #importClientesModal .clientes-import-empty[hidden] {
    display: none !important;
  }

  #importClientesModal .clientes-import-empty i {
    color: #2f6bea;
    font-size: .9rem;
    flex: 0 0 auto;
  }

  #importClientesModal .clientes-preview-wrap {
    display: none !important;
    max-height: 180px !important;
    margin: 0 !important;
    overflow: auto !important;
    border-radius: 14px !important;
  }

  #importClientesModal .clientes-import-form.has-preview .clientes-preview-wrap {
    display: block !important;
  }

  #importClientesModal .clientes-preview-wrap .table th,
  #importClientesModal .clientes-preview-wrap .table td {
    padding: .48rem .58rem !important;
    font-size: .74rem !important;
    line-height: 1.15 !important;
  }

  #importClientesModal .client-action-feedback:empty {
    display: none !important;
  }

  #importClientesModal .client-action-feedback {
    margin: 0 !important;
  }

  #importClientesModal .modal-actions {
    position: static !important;
    margin: .2rem 0 0 !important;
    padding: .62rem 0 0 !important;
    border-top: 1px solid #edf2f8 !important;
    box-shadow: none !important;
  }
}

/* ---------- Agenda mobile: normalize native date/time inputs ---------- */
@media (max-width: 768px) {
  #receberModal.module-help-modal {
    padding-inline: .85rem !important;
  }

  #receberModal .module-help-modal-card {
    width: min(430px, 100%) !important;
    max-width: calc(100vw - 1.7rem) !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  #receberModal #receberForm,
  #receberModal #receberForm .field,
  #receberModal #recVencWrap,
  #receberModal #recRestanteWrap,
  #receberModal .modal-actions {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #receberModal .input,
  #receberModal .select,
  #receberModal .textarea {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #receberModal input[type="date"].input {
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 .85rem !important;
    line-height: 44px !important;
    overflow: hidden !important;
    background-clip: padding-box !important;
    -webkit-appearance: none !important;
    appearance: none !important;
  }

  #receberModal input[type="date"].input::-webkit-date-and-time-value {
    display: block;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    text-align: left;
    line-height: 44px;
  }

  #receberModal input[type="date"].input::-webkit-calendar-picker-indicator {
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
  }

  #agendaModalNovo .agenda-schedule-form .form-grid,
  #agendaModalNovo .agenda-schedule-form .form-grid .field {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  #agendaModalNovo #agData.input,
  #agendaModalNovo #agHora.input {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 .74rem !important;
    border: 1px solid #dbe4f3 !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    color: #0f172a !important;
    background-color: #fff !important;
    background-clip: padding-box !important;
    box-shadow: none !important;
    font-size: 1rem !important;
    line-height: 44px !important;
    text-align: center !important;
    -webkit-appearance: none !important;
    appearance: none !important;
  }

  #agendaModalNovo #agData::-webkit-date-and-time-value,
  #agendaModalNovo #agHora::-webkit-date-and-time-value {
    display: block;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    text-align: center;
    line-height: 44px;
  }

  #agendaModalNovo #agData::-webkit-calendar-picker-indicator,
  #agendaModalNovo #agHora::-webkit-calendar-picker-indicator {
    margin: 0;
    padding: 0;
  }
}

/* ---------- Agenda mobile day timeline: full day with initial scroll ---------- */
@media (max-width: 1024px) {
  .main-panel-agenda .agenda-day-timeline-card {
    height: min(680px, calc(100dvh - 11rem)) !important;
    min-height: min(560px, calc(100dvh - 11rem)) !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline {
    height: 100% !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ---------- Clientes profile: compact edit modal on mobile ---------- */
@media (max-width: 768px) {
  .main-panel-agenda .mobile-dt-row.slot-closed .dt-hour,
  .main-panel-agenda .mobile-dt-row.slot-blocked .dt-hour,
  .main-panel-agenda .mobile-dt-row.slot-pause .dt-hour {
    color: #98a4b8 !important;
  }

  .main-panel-agenda .mobile-empty-slot.slot-closed {
    border-style: solid !important;
    border-color: #e2e8f0 !important;
    background: #f8fafc !important;
    color: #94a3b8 !important;
  }

  .main-panel-agenda .mobile-empty-slot.slot-blocked {
    border-style: solid !important;
    border-color: #fecaca !important;
    background: #fff1f2 !important;
    color: #b91c1c !important;
  }

  .main-panel-agenda .mobile-empty-slot.slot-pause {
    border-style: solid !important;
    border-color: #fde68a !important;
    background: #fffbeb !important;
    color: #92400e !important;
  }

  .agenda-public-link-success-icon {
    display: none !important;
  }

  .agenda-public-link-feedback {
    min-height: 1.15rem !important;
    margin-top: .55rem !important;
    color: #166534 !important;
    font-weight: 850 !important;
  }
}

@media (max-width: 768px) {
  #clienteModalEditar.module-help-modal {
    align-items: flex-end !important;
    justify-content: center !important;
    padding: max(.5rem, env(safe-area-inset-top)) .5rem max(.5rem, env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
  }

  #clienteModalEditar .cliente-edit-modal-card {
    display: flex !important;
    flex-direction: column !important;
    width: min(100%, 520px) !important;
    max-height: calc(100dvh - max(1rem, env(safe-area-inset-top) + env(safe-area-inset-bottom))) !important;
    min-height: 0 !important;
    padding: 0 !important;
    border-radius: 18px 18px 16px 16px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  #clienteModalEditar .modal-title {
    min-height: 48px !important;
    margin: 0 !important;
    padding: .68rem 3rem .62rem .86rem !important;
    font-size: 1rem !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
  }

  #clienteModalEditar .module-help-modal-close {
    top: .42rem !important;
    right: .46rem !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    border-radius: 11px !important;
  }

  #clienteModalEditar #clienteEditForm {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    gap: .48rem !important;
    padding: .64rem .82rem 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #clienteModalEditar #clienteEditForm > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  #clienteModalEditar .form-grid,
  #clienteModalEditar .field {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #clienteModalEditar .form-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .48rem !important;
    overflow: hidden !important;
  }

  #clienteModalEditar .field {
    display: grid !important;
    gap: .2rem !important;
    overflow: hidden !important;
  }

  #clienteModalEditar .field label {
    font-size: .78rem !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
    color: #1f2a44 !important;
  }

  #clienteModalEditar .input,
  #clienteModalEditar .select,
  #clienteModalEditar .textarea {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    box-sizing: border-box !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 .68rem !important;
    border: 1px solid #dbe4f3 !important;
    border-radius: 12px !important;
    background-color: #fff !important;
    background-clip: padding-box !important;
    color: #0f172a !important;
    box-shadow: none !important;
    font-size: 16px !important;
    line-height: 40px !important;
  }

  #clienteModalEditar input[type="date"].input {
    -webkit-appearance: none !important;
    appearance: none !important;
    overflow: hidden !important;
  }

  #clienteModalEditar input[type="date"].input::-webkit-date-and-time-value {
    display: block;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    text-align: left;
    line-height: 40px;
  }

  #clienteModalEditar input[type="date"].input::-webkit-calendar-picker-indicator {
    margin: 0;
    padding: 0;
  }

  #clienteModalEditar .select {
    appearance: auto !important;
    -webkit-appearance: menulist !important;
  }

  #clienteModalEditar .cliente-observacao-textarea {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 104px !important;
    padding-top: .62rem !important;
    padding-bottom: .62rem !important;
    line-height: 1.22 !important;
    resize: none !important;
    overflow-y: auto !important;
  }

  #clienteModalEditar .modal-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: .56rem !important;
    width: auto !important;
    margin: .58rem -.82rem 0 !important;
    padding: .58rem .82rem calc(.78rem + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid #edf2f8 !important;
    background: #fff !important;
    box-shadow: 0 -10px 24px rgba(15, 23, 42, .04) !important;
  }

  #clienteModalEditar .modal-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: .58rem .62rem !important;
    border-radius: 14px !important;
    justify-content: center !important;
    font-size: .88rem !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
  }

  #clienteModalEditar .modal-actions .btn-ghost {
    border: 1px solid #d8e2f1 !important;
    background: #fff !important;
    color: #12203a !important;
  }
}

/* ---------- Agenda mobile: timeline proporcional continua ---------- */
@media (max-width: 1024px) {
  .main-panel-agenda .agenda-mobile-day-timeline,
  .main-panel-agenda .agenda-mobile-week-timeline {
    --agenda-mobile-hour-height: 120px;
    --agenda-mobile-hour-col: 54px;
    --agenda-mobile-event-min-height: 112px;
    --agenda-mobile-event-compact-min-height: 90px;
    --agenda-mobile-event-short-min-height: 60px;
    position: relative !important;
    padding-top: 0 !important;
    padding-bottom: calc(8rem + env(safe-area-inset-bottom, 0px)) !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-row,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-row {
    grid-template-columns: var(--agenda-mobile-hour-col) minmax(0, 1fr) !important;
    min-height: var(--timeline-row-height-px, var(--agenda-mobile-hour-height)) !important;
    height: var(--timeline-row-height-px, var(--agenda-mobile-hour-height)) !important;
    padding: 0 !important;
    position: static !important;
    overflow: visible !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-row.has-events,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-row.has-events {
    min-height: var(--agenda-mobile-hour-height) !important;
    height: var(--timeline-row-height-px, var(--agenda-mobile-hour-height)) !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-hour,
  .main-panel-agenda .agenda-mobile-week-timeline .dt-hour {
    padding-top: .74rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .dt-slot,
  .main-panel-agenda .agenda-mobile-week-timeline .dt-slot {
    min-height: var(--agenda-mobile-hour-height) !important;
    padding: .36rem 0 !important;
    overflow: visible !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event {
    position: absolute !important;
    z-index: 4 !important;
    top: var(--timeline-event-top-px, 0px) !important;
    left: calc(var(--agenda-mobile-hour-col) + .28rem) !important;
    right: .18rem !important;
    width: auto !important;
    max-width: calc(100% - var(--agenda-mobile-hour-col) - .46rem) !important;
    height: var(--timeline-event-height-px, var(--agenda-mobile-hour-height)) !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    pointer-events: auto !important;
    box-sizing: border-box !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-card,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-card {
    min-height: var(--agenda-mobile-event-min-height) !important;
    height: max(
      var(--timeline-event-height-px, var(--agenda-mobile-hour-height)),
      var(--agenda-mobile-event-min-height)
    ) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .16rem !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: .46rem .54rem !important;
    border-radius: 15px !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-card,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-card {
    position: relative !important;
    gap: .04rem !important;
    padding: .26rem .4rem !important;
    min-height: var(--agenda-mobile-event-short-min-height) !important;
    height: max(
      var(--timeline-event-height-px, var(--agenda-mobile-hour-height)),
      var(--agenda-mobile-event-short-min-height)
    ) !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-card,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-card {
    gap: .08rem !important;
    padding: .36rem .48rem !important;
    min-height: var(--agenda-mobile-event-compact-min-height) !important;
    height: max(
      var(--timeline-event-height-px, var(--agenda-mobile-hour-height)),
      var(--agenda-mobile-event-compact-min-height)
    ) !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-long .mobile-agenda-event-card,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-long .mobile-agenda-event-card {
    padding: .48rem .54rem !important;
    min-height: var(--timeline-event-height-px, var(--agenda-mobile-hour-height)) !important;
    height: var(--timeline-event-height-px, var(--agenda-mobile-hour-height)) !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-blocked .mobile-agenda-event-card,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-blocked .mobile-agenda-event-card {
    justify-content: center !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-main,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-main {
    min-width: 0 !important;
    max-width: 100% !important;
    display: contents !important;
    box-sizing: border-box !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-top,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-top {
    min-width: 0 !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .36rem !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-title,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-title {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    max-width: 100% !important;
    font-size: .88rem !important;
    line-height: 1.08 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-top .badge,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-top .badge {
    flex: 0 0 auto !important;
    align-self: flex-start !important;
    max-width: 92px !important;
    padding: .2rem .46rem !important;
    border-radius: 999px !important;
    font-size: .68rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-sub,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-sub {
    min-width: 0 !important;
    max-width: 100% !important;
    color: #52627f !important;
    font-size: .76rem !important;
    line-height: 1.1 !important;
    font-weight: 750 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-meta,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .24rem !important;
    margin: .02rem 0 0 !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-meta span,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-meta span {
    min-height: 21px !important;
    padding: .13rem .36rem !important;
    font-size: .66rem !important;
    line-height: 1 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-note,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-note {
    display: none !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-actions,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-actions {
    min-width: 0 !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: .3rem !important;
    margin: auto 0 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-actions form,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-actions form {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-actions .icon-btn,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-actions .icon-btn {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 9px !important;
    font-size: .8rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-title,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-title {
    font-size: .72rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-title,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-title {
    font-size: .82rem !important;
    line-height: 1.04 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-sub,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-sub {
    font-size: .6rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-sub,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-sub {
    font-size: .7rem !important;
    line-height: 1.05 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-meta,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-meta {
    display: flex !important;
    gap: .14rem !important;
    max-width: calc(100% - 5.5rem) !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-meta,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-meta {
    gap: .18rem !important;
    margin-top: .02rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-meta span,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-meta span {
    min-height: 17px !important;
    padding: .08rem .24rem !important;
    font-size: .56rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-meta span,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-meta span {
    min-height: 19px !important;
    padding: .1rem .3rem !important;
    font-size: .62rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-top .badge,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-top .badge {
    max-width: 82px !important;
    padding: .14rem .36rem !important;
    font-size: .58rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-actions,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-actions {
    position: absolute !important;
    right: .54rem !important;
    bottom: .3rem !important;
    height: 22px !important;
    gap: .24rem !important;
    align-items: center !important;
    margin: 0 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-actions .icon-btn,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-actions .icon-btn {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    flex: 0 0 22px !important;
    padding: 0 !important;
    border-radius: 7px !important;
    font-size: .62rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-actions,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-actions {
    gap: .24rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-actions .icon-btn,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-compact:not(.is-duration-short) .mobile-agenda-event-actions .icon-btn {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    min-height: 26px !important;
    border-radius: 8px !important;
    font-size: .7rem !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-row.is-occupied .dt-slot,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-row.is-occupied .dt-slot {
    pointer-events: none !important;
  }

}

.main-panel-agenda .agenda-day-timeline-desktop {
  --agenda-desktop-hour-height: 120px;
  position: relative !important;
}

.main-panel-agenda .agenda-day-timeline-desktop > .dt-row {
  min-height: var(--agenda-desktop-hour-height) !important;
  height: var(--agenda-desktop-hour-height) !important;
  position: relative !important;
  overflow: visible !important;
}

.main-panel-agenda .agenda-day-timeline-desktop > .dt-row .dt-slot {
  overflow: visible !important;
}

.main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event {
  position: absolute !important;
  z-index: 2 !important;
  top: var(--timeline-event-top-px, 0px) !important;
  left: calc(var(--day-hour-col) + .35rem) !important;
  right: .15rem !important;
  height: var(--timeline-event-height-px, var(--agenda-desktop-hour-height)) !important;
  min-height: 0 !important;
  margin: 0 !important;
  pointer-events: auto !important;
}

.main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-short .dt-event-sub {
  display: none !important;
}

/* ---------- Agenda desktop: timeline unificada ---------- */
@media (min-width: 1025px) {
  .main-panel-agenda .topbar {
    z-index: 20 !important;
  }

  .main-panel-agenda .agenda-day-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    --agenda-day-panel-height: clamp(580px, calc(100vh - 250px), 760px);
  }

  .main-panel-agenda .agenda-day-timeline-card {
    width: 100% !important;
    height: var(--agenda-day-panel-height) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-day-list-card {
    display: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop {
    --day-hour-col: 76px;
    --agenda-desktop-hour-height: 120px;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: .35rem 1.1rem 1.1rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
  }

  .main-panel-agenda .agenda-day-timeline-desktop > .dt-row {
    display: grid !important;
    grid-template-columns: var(--day-hour-col) minmax(0, 1fr) !important;
    min-height: var(--agenda-desktop-hour-height) !important;
    height: var(--agenda-desktop-hour-height) !important;
    border-bottom: 1px dashed #e2e8f0 !important;
    overflow: visible !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop > .dt-row:last-child {
    border-bottom: 0 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .dt-hour {
    padding: .78rem .45rem 0 .1rem !important;
    color: #6b7da2 !important;
    font-size: .84rem !important;
    font-weight: 850 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .dt-slot {
    position: relative !important;
    min-width: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event {
    z-index: 2 !important;
    left: .5rem !important;
    right: .38rem !important;
    --agenda-desktop-event-min-height: 84px;
    height: max(
      var(--timeline-event-height-px, var(--agenda-desktop-hour-height)),
      var(--agenda-desktop-event-min-height)
    ) !important;
    min-height: var(--agenda-desktop-event-min-height) !important;
    padding: 0 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event:hover {
    z-index: 3 !important;
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .12) !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event .dt-event-title,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event .dt-event-sub {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-short .dt-event-sub {
    display: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short {
    --agenda-desktop-event-min-height: 84px;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-compact:not(.is-duration-short) {
    --agenda-desktop-event-min-height: 90px;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-long {
    --agenda-desktop-event-min-height: var(--timeline-event-height-px, var(--agenda-desktop-hour-height));
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-blocked {
    height: var(--timeline-event-height-px, var(--agenda-desktop-hour-height)) !important;
    min-height: 88px !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-card {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    column-gap: .58rem !important;
    row-gap: .08rem !important;
    padding: .48rem .62rem .44rem .74rem !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-card--block {
    grid-template-columns: minmax(0, 1fr) !important;
    justify-content: center !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-top {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .55rem !important;
    color: var(--tone) !important;
    font-variant-numeric: tabular-nums !important;
    line-height: 1.05 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-time {
    min-width: 0 !important;
    color: var(--tone) !important;
    font-size: .88rem !important;
    line-height: 1.05 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-top .badge {
    flex: 0 1 auto !important;
    max-width: 150px !important;
    padding: .16rem .48rem !important;
    font-size: .68rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-main {
    grid-column: 1 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .12rem !important;
    overflow: hidden !important;
    align-self: center !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-card--block .desktop-agenda-event-main {
    grid-column: 1 / -1 !important;
    justify-content: center !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-service-row {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: .36rem !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-service {
    min-width: 0 !important;
    color: #0f172a !important;
    font-size: .92rem !important;
    line-height: 1.12 !important;
    font-weight: 900 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-client {
    min-width: 0 !important;
    color: #52627f !important;
    font-size: .78rem !important;
    line-height: 1.1 !important;
    font-weight: 750 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-more,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-origin,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-services span,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta span {
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: .24rem !important;
    min-height: 21px !important;
    padding: .12rem .38rem !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .66) !important;
    color: #52627f !important;
    border: 1px solid rgba(148, 163, 184, .22) !important;
    font-size: .66rem !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-more {
    flex: 0 0 auto !important;
    color: var(--tone) !important;
    border-color: color-mix(in srgb, var(--tone) 24%, transparent) !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-origin,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-services,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta {
    display: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-origin {
    flex: 0 0 auto !important;
    background: #fff7ed !important;
    color: #9a3412 !important;
    border-color: #fed7aa !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-services,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta {
    min-width: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .22rem !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta {
    margin-top: auto !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta .payment-pago,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta .payment-concluido {
    background: #dcfce7 !important;
    color: #15803d !important;
    border-color: #bbf7d0 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta .payment-parcial,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta .payment-agendado {
    background: #fef3c7 !important;
    color: #b45309 !important;
    border-color: #fde68a !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions {
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: center !important;
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .28rem !important;
    min-width: max-content !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    opacity: .72 !important;
    transition: opacity .16s ease, transform .16s ease !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event:hover .desktop-agenda-event-actions,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event:focus-within .desktop-agenda-event-actions {
    opacity: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions form {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-btn {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    min-height: 26px !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, .54) !important;
    border-color: rgba(148, 163, 184, .2) !important;
    color: #64748b !important;
    font-size: .7rem !important;
    line-height: 1 !important;
    box-shadow: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-btn:hover {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(100, 116, 139, .28) !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .12) !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-btn:disabled {
    opacity: .42 !important;
    cursor: not-allowed !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-card {
    column-gap: .42rem !important;
    row-gap: .04rem !important;
    padding: .34rem .48rem .32rem .62rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-time {
    font-size: .82rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-top .badge {
    max-width: 108px !important;
    padding: .13rem .38rem !important;
    font-size: .6rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-main {
    gap: .1rem !important;
    padding-right: .08rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-service {
    font-size: .82rem !important;
    line-height: 1.04 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-client {
    font-size: .68rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-services,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-meta {
    display: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions {
    gap: .22rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions .icon-btn {
    width: 23px !important;
    height: 23px !important;
    min-width: 23px !important;
    min-height: 23px !important;
    border-radius: 8px !important;
    font-size: .64rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-compact:not(.is-duration-short) .desktop-agenda-event-services {
    display: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-compact:not(.is-duration-short) .desktop-agenda-event-card {
    padding-block: .44rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-standard .desktop-agenda-event-main,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-long .desktop-agenda-event-main {
    max-width: calc(100% - .2rem) !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-origin,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-services,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-meta {
    display: none !important;
  }

  /* Refinamento final dos cards desktop: resumo limpo, acoes discretas e cliente legivel. */
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event {
    --agenda-desktop-event-min-height: 88px;
    border-radius: 11px !important;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .065) !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event:hover {
    box-shadow: 0 10px 24px rgba(15, 23, 42, .105) !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short {
    --agenda-desktop-event-min-height: 88px;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-compact:not(.is-duration-short) {
    --agenda-desktop-event-min-height: 96px;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-long {
    --agenda-desktop-event-min-height: var(--timeline-event-height-px, var(--agenda-desktop-hour-height));
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-card {
    grid-template-columns: minmax(0, 1fr) max-content !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    column-gap: .72rem !important;
    row-gap: .16rem !important;
    padding: .58rem .7rem .58rem .82rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-top {
    align-items: flex-start !important;
    gap: .75rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-time {
    font-size: .94rem !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-top .badge {
    max-width: 132px !important;
    padding: .15rem .48rem !important;
    font-size: .66rem !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-main {
    align-self: center !important;
    justify-content: center !important;
    gap: .18rem !important;
    padding-right: .25rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-service-row {
    gap: .4rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-service {
    font-size: .98rem !important;
    line-height: 1.14 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-more {
    min-height: 19px !important;
    padding: .08rem .34rem !important;
    font-size: .64rem !important;
    font-weight: 900 !important;
    background: rgba(255, 255, 255, .46) !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-client {
    display: flex !important;
    align-items: center !important;
    gap: .3rem !important;
    min-width: 0 !important;
    color: #475569 !important;
    font-size: .84rem !important;
    line-height: 1.18 !important;
    font-weight: 800 !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-client-icon {
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #64748b !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-client-icon > i {
    display: block !important;
    font-size: .78rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-client-name {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions {
    align-self: end !important;
    gap: .3rem !important;
    opacity: .9 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-btn {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #64748b !important;
    box-shadow: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-btn > i {
    font-size: .92rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions [data-receber-ev],
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions [data-edit-pagamento-ev] {
    color: #15803d !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions [data-edit-ev] {
    color: #475569 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-danger {
    color: #dc2626 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-btn:hover {
    background: rgba(15, 23, 42, .065) !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions [data-receber-ev]:hover,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions [data-edit-pagamento-ev]:hover {
    background: rgba(22, 163, 74, .12) !important;
    color: #166534 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-agenda-event-actions .icon-danger:hover {
    background: rgba(220, 38, 38, .1) !important;
    color: #b91c1c !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-card {
    column-gap: .55rem !important;
    row-gap: .06rem !important;
    padding: .38rem .56rem .36rem .68rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-time {
    font-size: .86rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-service {
    font-size: .88rem !important;
    line-height: 1.06 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-client {
    font-size: .78rem !important;
    line-height: 1.06 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-client-icon {
    flex-basis: 14px !important;
    width: 14px !important;
    height: 14px !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-client-icon > i {
    font-size: .68rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions {
    gap: .2rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions .icon-btn {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions .icon-btn > i {
    font-size: .78rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-long .desktop-agenda-event-main {
    align-self: start !important;
    justify-content: flex-start !important;
    gap: .22rem !important;
    padding-top: .1rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-long .desktop-agenda-event-services {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .24rem !important;
    max-height: 2.1rem !important;
    overflow: hidden !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-long .desktop-agenda-event-services span {
    display: inline-flex !important;
    align-items: center !important;
    max-width: 220px !important;
    min-height: 20px !important;
    padding: .1rem .4rem !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .42) !important;
    color: #475569 !important;
    border: 1px solid rgba(148, 163, 184, .18) !important;
    font-size: .66rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* Desktop timeline: the absolute event box must always match the real grid duration. */
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-compact:not(.is-duration-short),
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-long,
  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-blocked {
    height: var(--timeline-event-height-px, var(--agenda-desktop-hour-height)) !important;
    min-height: 0 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-card {
    min-height: 0 !important;
    column-gap: .42rem !important;
    row-gap: .02rem !important;
    padding: .24rem .44rem .22rem .56rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-top {
    align-items: center !important;
    gap: .45rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-time {
    font-size: .8rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-top .badge {
    max-width: 112px !important;
    padding: .08rem .34rem !important;
    font-size: .56rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-main {
    align-self: center !important;
    justify-content: center !important;
    gap: .02rem !important;
    padding-right: .08rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-service {
    font-size: .78rem !important;
    line-height: 1.02 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-client {
    gap: .2rem !important;
    font-size: .66rem !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-client-icon {
    flex-basis: 12px !important;
    width: 12px !important;
    height: 12px !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-client-icon > i {
    font-size: .58rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions {
    align-self: center !important;
    gap: .12rem !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions .icon-btn {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    border-radius: 6px !important;
  }

  .main-panel-agenda .agenda-day-timeline-desktop .desktop-day-timeline-event.is-duration-short .desktop-agenda-event-actions .icon-btn > i {
    font-size: .68rem !important;
  }

  .main-panel-agenda .week-scroll {
    scroll-behavior: auto;
  }

  .main-panel-agenda .wg-day.is-today {
    background: #eef5ff;
    box-shadow: inset 0 -2px 0 var(--blue-600);
  }
}

/* =============================================================
   Action Icon System Audit
   Mantém botões de ação proporcionais, centralizados e com toque seguro.
   ============================================================= */
.icon-btn,
.fin-action-btn,
.catalog-action-btn,
.catalog-mini-btn,
.agenda-icon-btn,
.clientes-icon-btn,
.catalog-config-btn,
.finance-top-gear,
.mobile-menu-btn,
.fab,
.modal-close,
.module-help-modal-close,
.agenda-notifications-close,
.btn-whatsapp,
.dashboard-birthday-dismiss {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
  text-align: center;
}

.icon-btn,
.fin-action-btn,
.catalog-action-btn {
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  padding: 0;
}

.icon-btn > i,
.fin-action-btn > i,
.catalog-action-btn > i,
.catalog-mini-btn > i {
  display: block;
  margin: 0;
  line-height: 1;
  font-size: 19px;
}

.catalog-mini-btn {
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
}

.catalog-mini-btn > i {
  font-size: 20px;
}

.agenda-icon-btn > i,
.clientes-icon-btn > i,
.catalog-config-btn > i,
.finance-top-gear > i,
.mobile-menu-btn > i,
.modal-close > i,
.agenda-notifications-close > i,
.dashboard-birthday-dismiss > i {
  display: block;
  margin: 0;
  line-height: 1;
}

.agenda-icon-btn > i {
  font-size: 26px;
}

.clientes-icon-btn > i,
.catalog-config-btn > i,
.finance-top-gear > i,
.mobile-menu-btn > i {
  font-size: 24px;
}

.modal-close,
.module-help-modal-close,
.agenda-notifications-close {
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
}

.modal-close > i,
.module-help-modal-close > i,
.agenda-notifications-close > i {
  font-size: 24px;
}

.module-help-modal-close {
  float: none;
}

.module-help-modal-card > .module-help-modal-close:first-child {
  float: right;
}

.btn > i,
.btn-whatsapp > i {
  display: block;
  flex: 0 0 auto;
  margin: 0;
  line-height: 1;
}

.btn-whatsapp {
  align-items: center;
  justify-content: center;
}

.btn-whatsapp > i {
  font-size: 1.18em;
}

.agenda-notification-whatsapp {
  gap: .42rem;
}

.fab > i {
  display: block;
  margin: 0;
  line-height: 1;
  font-size: 35px;
}

.dashboard-birthday-row .icon-wa {
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  border-radius: 12px;
}

.dashboard-birthday-row .icon-wa > i {
  font-size: 23px;
}

.main-panel-agenda .mobile-agenda-event-actions .icon-btn > i {
  font-size: 18px !important;
}

.main-panel-agenda .mobile-dt-event.is-duration-short .mobile-agenda-event-actions .icon-btn > i {
  font-size: 14px !important;
}

@media (max-width: 768px) {
  .icon-btn,
  .fin-action-btn,
  .catalog-action-btn,
  .catalog-mini-btn,
  .agenda-icon-btn,
  .clientes-icon-btn,
  .catalog-config-btn,
  .finance-top-gear,
  .mobile-menu-btn,
  .modal-close,
  .module-help-modal-close,
  .agenda-notifications-close,
  .dashboard-birthday-dismiss,
  .agenda-notification-whatsapp {
    position: relative;
    overflow: visible;
  }

  .icon-btn::after,
  .fin-action-btn::after,
  .catalog-action-btn::after,
  .catalog-mini-btn::after,
  .agenda-icon-btn::after,
  .clientes-icon-btn::after,
  .catalog-config-btn::after,
  .finance-top-gear::after,
  .mobile-menu-btn::after,
  .modal-close::after,
  .module-help-modal-close::after,
  .agenda-notifications-close::after,
  .dashboard-birthday-dismiss::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: max(44px, 100%);
    height: max(44px, 100%);
    transform: translate(-50%, -50%);
  }

  .agenda-notification-whatsapp {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    border-radius: 15px !important;
    font-size: 0 !important;
    gap: 0 !important;
  }

  .agenda-notification-whatsapp > i {
    font-size: 30px !important;
    line-height: 1 !important;
    margin: 0 !important;
  }

  .agenda-notifications-close,
  .modal-close,
  .module-help-modal-close {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
  }

  .agenda-notifications-close > i,
  .modal-close > i,
  .module-help-modal-close > i {
    font-size: 26px;
  }

  .dashboard-birthday-row .icon-wa {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border-radius: 13px;
  }

  .dashboard-birthday-row .icon-wa > i {
    font-size: 27px;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-actions .icon-btn,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-actions .icon-btn {
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-agenda-event-actions .icon-btn > i,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-agenda-event-actions .icon-btn > i {
    font-size: 18px !important;
    margin: 0 !important;
    line-height: 1 !important;
  }

  .main-panel-agenda .agenda-mobile-day-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-actions .icon-btn > i,
  .main-panel-agenda .agenda-mobile-week-timeline .mobile-dt-event.is-duration-short .mobile-agenda-event-actions .icon-btn > i {
    font-size: 14px !important;
  }
}

/* =============================================================
   FINANCEIRO MOBILE PANEL AUDIT - FINAL OVERRIDE
   Corrige overflow dos cards/graficos e prepara cards modulares.
   ============================================================= */
.main-panel-financeiro,
.main-panel-financeiro .content,
.main-panel-financeiro .fin-kpi-grid,
.main-panel-financeiro .fin-panel-card-grid,
.main-panel-financeiro .fin-panel-card,
.main-panel-financeiro .fin-chart,
.main-panel-financeiro .fin-table-card,
.main-panel-financeiro .table-wrap {
  box-sizing: border-box;
  max-width: 100%;
}

.main-panel-financeiro {
  overflow-x: hidden;
  overflow-x: clip;
}

.main-panel-financeiro .content {
  min-width: 0;
  overflow-x: hidden;
}

.main-panel-financeiro .fin-panel-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  width: 100%;
  min-width: 0;
  margin: 0 0 1.3rem;
  overflow: hidden;
  overflow: clip;
}

.main-panel-financeiro .fin-panel-card-grid > .fin-panel-card {
  min-width: 0;
  width: 100%;
}

.main-panel-financeiro .fin-panel-card-grid[data-finance-chart-count="1"] > .fin-chart {
  grid-column: 1 / -1;
}

.main-panel-financeiro .fin-panel-card-grid > .fin-table-card {
  grid-column: 1 / -1;
}

.main-panel-financeiro .fin-chart {
  min-width: 0 !important;
  overflow: hidden;
}

.main-panel-financeiro .fin-chart-head,
.main-panel-financeiro .fin-panel-head {
  min-width: 0;
}

.main-panel-financeiro .fin-chart-head {
  flex-wrap: wrap;
  align-items: flex-start;
}

.main-panel-financeiro .fin-chart-head h4,
.main-panel-financeiro .fin-panel-head h3,
.main-panel-financeiro .fin-chart-head .muted,
.main-panel-financeiro .fin-panel-head .muted {
  min-width: 0;
  max-width: 100%;
}

.main-panel-financeiro .fin-chart-head .muted,
.main-panel-financeiro .fin-panel-head .muted {
  white-space: normal;
  overflow-wrap: anywhere;
}

.main-panel-financeiro .fin-chart-body {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 240px;
  overflow: hidden;
  contain: layout paint;
}

.main-panel-financeiro .fin-chart-body canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.main-panel-financeiro .table-wrap {
  width: 100%;
  min-width: 0;
}

.main-panel-financeiro #finCardsGrid .fin-pers-item {
  cursor: grab;
}

.main-panel-financeiro #finCardsGrid .fin-pers-item.dragging {
  opacity: .5;
  cursor: grabbing;
}

.main-panel-financeiro #finCardsGrid .fin-pers-item.drop-hover {
  border-color: var(--tone, #2563eb);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.main-panel-financeiro .fin-kpi {
  overflow: hidden;
  min-width: 0;
}

.main-panel-financeiro .fin-kpi-head,
.main-panel-financeiro .fin-kpi-label,
.main-panel-financeiro .fin-kpi-value,
.main-panel-financeiro .fin-kpi-foot {
  max-width: 100%;
  min-width: 0;
}

.main-panel-financeiro .fin-kpi-value {
  display: block;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
  font-size: clamp(1.08rem, 2.15vw, 1.45rem);
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}

.main-panel-financeiro .fin-kpi-value.is-fin-kpi-long {
  font-size: clamp(.96rem, 1.85vw, 1.28rem);
}

.main-panel-financeiro .fin-kpi-value.is-fin-kpi-xl {
  font-size: clamp(.82rem, 1.55vw, 1.08rem);
}

.main-panel-financeiro .fin-kpi[data-kpi="meta_mes"] {
  cursor: pointer;
}

.main-panel-financeiro .fin-kpi[data-kpi="meta_mes"] .fin-kpi-value {
  font-size: clamp(1rem, 1.85vw, 1.3rem);
  line-height: 1.12;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 1.8rem;
}

.main-panel-financeiro .fin-kpi[data-kpi="meta_mes"].is-meta-empty .fin-kpi-value {
  font-size: clamp(.95rem, 1.7vw, 1.18rem);
  white-space: normal;
  line-height: 1.08;
}

.main-panel-financeiro .fin-kpi[data-kpi="meta_mes"] .fin-kpi-foot {
  min-width: 0;
}

.main-panel-financeiro .fin-kpi[data-kpi="meta_mes"] .fin-kpi-foot .muted {
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main-panel-financeiro .is-finance-card-hidden {
  display: none !important;
}

@media (max-width: 900px) {
  .main-panel-financeiro .fin-panel-card-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .main-panel-financeiro {
    width: 100%;
    max-width: 100vw;
  }

  .main-panel-financeiro .content {
    width: 100%;
    max-width: 100vw;
  }

  .main-panel-financeiro .fin-panel-card-grid {
    gap: .85rem;
    margin-bottom: .95rem;
  }

  .main-panel-financeiro .fin-chart,
  .main-panel-financeiro .fin-table-card {
    border-radius: 16px;
  }

  .main-panel-financeiro .fin-chart {
    padding: .84rem .78rem !important;
  }

  .main-panel-financeiro .fin-chart-head {
    gap: .35rem .55rem;
    margin-bottom: .55rem;
  }

  .main-panel-financeiro .fin-chart-head h4 {
    flex: 1 1 100%;
    line-height: 1.18;
  }

  .main-panel-financeiro .fin-chart-head .muted {
    flex: 1 1 100%;
    font-size: .72rem !important;
    line-height: 1.2;
  }

  .main-panel-financeiro .fin-chart-body {
    height: 178px !important;
    min-height: 178px !important;
  }

  .main-panel-financeiro [data-finance-card="top_receitas"] .fin-chart-body {
    height: 206px !important;
    min-height: 206px !important;
  }

  .main-panel-financeiro .fin-chart-body canvas {
    max-height: none !important;
  }

  .main-panel-financeiro .fin-kpi[data-kpi="meta_mes"] .fin-kpi-value {
    font-size: clamp(.92rem, 4vw, 1.08rem) !important;
    padding-right: 1.55rem;
  }

  .main-panel-financeiro .fin-kpi[data-kpi="meta_mes"].is-meta-empty .fin-kpi-value {
    font-size: clamp(.84rem, 3.75vw, .98rem) !important;
    padding-right: 0;
    white-space: normal;
    line-height: 1.08;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  .main-panel-financeiro .fin-kpi[data-kpi="meta_mes"] .fin-kpi-edit {
    right: .45rem;
    top: .45rem;
    width: 24px;
    height: 24px;
    border-radius: 8px;
    background: #f5f3ff;
  }

  .main-panel-financeiro .fin-meta-modal.is-open {
    align-items: center !important;
    justify-content: center !important;
    padding:
      calc(1rem + env(safe-area-inset-top, 0px))
      .85rem
      calc(1rem + env(safe-area-inset-bottom, 0px)) !important;
  }

  .main-panel-financeiro .fin-meta-modal .modal-card {
    width: min(100%, 360px) !important;
    max-height: calc(100dvh - 2rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  }

  .main-panel-financeiro .fin-table-card {
    overflow: hidden;
  }

  .main-panel-financeiro .fin-table-card .tabs {
    display: flex;
    width: 100%;
    max-width: 100%;
    gap: .42rem;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .main-panel-financeiro .fin-table-card .tabs::-webkit-scrollbar {
    display: none;
  }

  .main-panel-financeiro .fin-table-card .tab {
    flex: 0 0 auto;
    min-width: max-content;
  }

  .main-panel-financeiro .fin-panel-head {
    display: grid;
    gap: .2rem;
    align-items: start;
  }

  .main-panel-financeiro .fin-panel-head h3 {
    line-height: 1.18;
  }

  .main-panel-financeiro .fin-panel-head .muted {
    font-size: .76rem;
    line-height: 1.2;
  }

  .main-panel-financeiro .fin-kpi-value {
    line-height: 1 !important;
  }

  .main-panel-financeiro .fin-kpi-value.is-fin-kpi-long {
    font-size: clamp(.72rem, 2.55vw, .9rem) !important;
  }

  .main-panel-financeiro .fin-kpi-value.is-fin-kpi-xl {
    font-size: clamp(.66rem, 2.2vw, .78rem) !important;
  }
}

@media (max-width: 420px) {
  .main-panel-financeiro .fin-chart {
    padding-inline: .68rem !important;
  }

  .main-panel-financeiro .fin-chart-body {
    height: 170px !important;
  }

  .main-panel-financeiro [data-finance-card="top_receitas"] .fin-chart-body {
    height: 214px !important;
  }

  .main-panel-financeiro .fin-kpi-value.is-fin-kpi-long {
    font-size: clamp(.66rem, 2.25vw, .82rem) !important;
  }

  .main-panel-financeiro .fin-kpi-value.is-fin-kpi-xl {
    font-size: clamp(.6rem, 2vw, .72rem) !important;
  }
}

/* =============================================================
   FINANCEIRO - LISTA COMPACTA E MODAIS MOBILE
   Escopo fechado para nao alterar Dashboard, Agenda, Clientes ou Produtos.
   ============================================================= */
.main-panel-financeiro .fin-movements-wrap {
  overflow-x: auto;
  overflow-y: visible;
}

.main-panel-financeiro .fin-table {
  table-layout: auto;
}

.main-panel-financeiro .fin-table th,
.main-panel-financeiro .fin-table td {
  vertical-align: middle;
}

.main-panel-financeiro .fin-table .fin-move-desc {
  min-width: 180px;
}

.main-panel-financeiro .fin-table .fin-move-sub {
  line-height: 1.18;
}

#finLancarModal,
#finPeriodoPersonalizadoModal {
  box-sizing: border-box;
}

#finLancarModal *,
#finPeriodoPersonalizadoModal * {
  box-sizing: border-box;
}

#finLancarModal .modal-card,
#finPeriodoPersonalizadoModal .modal-card {
  width: min(760px, calc(100vw - 1.25rem));
  max-width: calc(100vw - 1.25rem);
}

#finLancarModal .modal-body,
#finPeriodoPersonalizadoModal .modal-body,
#finLancarModal .form-grid,
#finPeriodoPersonalizadoModal .form-grid,
#finLancarModal .field,
#finPeriodoPersonalizadoModal .field {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#finLancarModal .form-grid,
#finPeriodoPersonalizadoModal .form-grid {
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

#finLancarModal .input,
#finLancarModal .select,
#finLancarModal .textarea,
#finPeriodoPersonalizadoModal .input,
#finPeriodoPersonalizadoModal .select,
#finPeriodoPersonalizadoModal .textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 42px;
  min-height: 42px;
  padding: 0 .78rem;
  border-radius: 12px;
  line-height: 1.2;
}

#finLancarModal .textarea {
  height: auto;
  min-height: 42px;
  padding-top: .62rem;
  padding-bottom: .62rem;
}

#finLancarModal input[type="date"].input,
#finPeriodoPersonalizadoModal input[type="date"].input {
  -webkit-appearance: none;
  appearance: none;
  overflow: hidden;
  padding-right: .66rem;
}

#finLancarModal .fin-manual-form input[type="date"].input[data-fin-due-date] {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  min-height: 42px;
  padding: 0 .66rem 0 .78rem;
  line-height: 42px;
  text-align: center;
  background-clip: padding-box;
}

#finLancarModal input[type="date"].input::-webkit-date-and-time-value,
#finPeriodoPersonalizadoModal input[type="date"].input::-webkit-date-and-time-value {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 0;
  text-align: center;
}

#finLancarModal .fin-manual-form input[type="date"].input[data-fin-due-date]::-webkit-date-and-time-value {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  height: 42px;
  margin: 0;
  padding: 0;
  line-height: 42px;
  text-align: center;
}

#finLancarModal .fin-manual-form input[type="date"].input[data-fin-due-date]::-webkit-datetime-edit,
#finLancarModal .fin-manual-form input[type="date"].input[data-fin-due-date]::-webkit-datetime-edit-fields-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0;
  line-height: 42px;
}

#finLancarModal .fin-manual-form input[type="date"].input[data-fin-due-date]::-webkit-datetime-edit-day-field,
#finLancarModal .fin-manual-form input[type="date"].input[data-fin-due-date]::-webkit-datetime-edit-month-field,
#finLancarModal .fin-manual-form input[type="date"].input[data-fin-due-date]::-webkit-datetime-edit-year-field {
  padding: 0;
  line-height: 42px;
}

#finLancarModal input[type="date"].input::-webkit-calendar-picker-indicator,
#finPeriodoPersonalizadoModal input[type="date"].input::-webkit-calendar-picker-indicator {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
}

#finLancarModal .fin-manual-form {
  gap: 0;
}

#finLancarModal .fin-manual-form .field {
  margin-bottom: .5rem;
}

#finLancarModal .fin-manual-form .field label,
#finPeriodoPersonalizadoModal .field label {
  font-size: .82rem;
  line-height: 1.15;
  font-weight: 800;
}

#finLancarModal .fin-advanced-options {
  padding: 0;
  overflow: hidden;
  border-color: #e4ebf6;
  background: #f8fbff;
}

#finLancarModal .fin-advanced-options > summary {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  padding: 0 .78rem;
}

#finLancarModal .fin-advanced-options > summary::after {
  content: "\f078";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #64748b;
  font-size: .72rem;
  transition: transform .16s ease;
}

#finLancarModal .fin-advanced-options[open] > summary::after {
  transform: rotate(180deg);
}

#finLancarModal .fin-advanced-options-body {
  padding: .62rem .78rem .72rem;
  border-top: 1px solid #e9eef7;
}

@media (max-width: 640px) {
  .main-panel-financeiro .fin-movements-wrap {
    overflow: visible !important;
  }

  .main-panel-financeiro .fin-table,
  .main-panel-financeiro .fin-table tbody {
    display: grid !important;
    width: 100%;
    min-width: 0 !important;
    gap: .5rem !important;
  }

  .main-panel-financeiro .fin-table thead {
    display: none !important;
  }

  .main-panel-financeiro .fin-table tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "desc value"
      "date status"
      "origin actions";
    align-items: center;
    gap: .22rem .62rem;
    width: 100%;
    min-width: 0;
    padding: .68rem .72rem;
    border: 1px solid #e5edf8 !important;
    border-radius: 14px !important;
    background: #fff;
    box-shadow: 0 5px 16px rgba(15, 23, 42, .045);
    overflow: visible;
  }

  .main-panel-financeiro .fin-table td {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
  }

  .main-panel-financeiro .fin-table td::before {
    content: none !important;
    display: none !important;
  }

  .main-panel-financeiro .fin-table td:nth-child(1) {
    grid-area: date;
  }

  .main-panel-financeiro .fin-table td:nth-child(2) {
    grid-area: desc;
  }

  .main-panel-financeiro .fin-table td:nth-child(3) {
    grid-area: origin;
  }

  .main-panel-financeiro .fin-table td:nth-child(4) {
    grid-area: value;
    justify-self: end;
    text-align: right !important;
  }

  .main-panel-financeiro .fin-table td:nth-child(5) {
    grid-area: status;
    justify-self: end;
  }

  .main-panel-financeiro .fin-table td:nth-child(6) {
    grid-area: actions;
    justify-self: end;
  }

  .main-panel-financeiro .fin-table .fin-move-desc {
    min-width: 0;
  }

  .main-panel-financeiro .fin-table .fin-move-desc strong {
    font-size: .92rem;
    line-height: 1.12;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .main-panel-financeiro .fin-table .fin-move-sub {
    gap: .28rem;
    margin-top: .12rem;
    font-size: .72rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .main-panel-financeiro .fin-table .fin-move-sub span:not(.fin-pay-badge) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .main-panel-financeiro .fin-table .fin-cell-date {
    color: #7483a3;
    font-size: .72rem;
    font-weight: 750;
  }

  .main-panel-financeiro .fin-table .fin-cell-value {
    font-size: .86rem;
    font-weight: 850;
  }

  .main-panel-financeiro .fin-origin {
    max-width: 148px;
    height: 25px;
    padding-inline: .5rem;
    font-size: .68rem;
    white-space: nowrap;
  }

  .main-panel-financeiro .fin-status {
    height: 25px;
    padding: 0 .55rem;
    display: inline-flex;
    align-items: center;
    font-size: .68rem;
  }

  .main-panel-financeiro .fin-actions-cell {
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-end !important;
    gap: .28rem !important;
    width: auto !important;
    min-height: 0 !important;
  }

  .main-panel-financeiro .fin-action-btn {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  .main-panel-financeiro .fin-action-btn i {
    font-size: .86rem;
  }

  #finLancarModal .modal-card,
  #finPeriodoPersonalizadoModal .modal-card {
    width: min(100%, calc(100vw - .9rem)) !important;
    max-width: calc(100vw - .9rem) !important;
  }

  #finLancarModal .modal-body,
  #finPeriodoPersonalizadoModal .modal-body {
    padding: .82rem !important;
    overflow-x: hidden !important;
  }

  #finLancarModal .form-grid,
  #finPeriodoPersonalizadoModal .form-grid,
  #finLancarModal .fin-recurring-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .48rem !important;
  }

  #finLancarModal .field,
  #finPeriodoPersonalizadoModal .field {
    margin-bottom: .48rem !important;
    overflow: hidden;
  }

  #finLancarModal .input,
  #finLancarModal .select,
  #finLancarModal .textarea,
  #finPeriodoPersonalizadoModal .input,
  #finPeriodoPersonalizadoModal .select,
  #finPeriodoPersonalizadoModal .textarea {
    height: 42px !important;
    min-height: 42px !important;
    font-size: .96rem !important;
  }

  #finLancarModal .fin-manual-observacoes {
    min-height: 42px !important;
    height: auto !important;
  }

  #finLancarModal .modal-foot,
  #finPeriodoPersonalizadoModal .modal-foot {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: .5rem !important;
  }

  #finLancarModal .modal-foot .btn,
  #finPeriodoPersonalizadoModal .modal-foot .btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding-inline: .55rem !important;
    white-space: nowrap;
  }
}

/* ---------- Periodo personalizado: inputs alinhados e responsivos ---------- */
#dashPeriodoPersonalizadoModal,
#finPeriodoPersonalizadoModal,
#dashPeriodoPersonalizadoModal *,
#finPeriodoPersonalizadoModal * {
  box-sizing: border-box;
}

#dashPeriodoPersonalizadoModal .modal-card,
#finPeriodoPersonalizadoModal .modal-card {
  overflow-x: hidden;
}

#dashPeriodoPersonalizadoModal .modal-body,
#finPeriodoPersonalizadoModal .modal-body,
#dashPeriodoPersonalizadoModal .form-grid,
#finPeriodoPersonalizadoModal .form-grid,
#dashPeriodoPersonalizadoModal .field,
#finPeriodoPersonalizadoModal .field {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

#dashPeriodoPersonalizadoModal .form-grid,
#finPeriodoPersonalizadoModal .form-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}

#dashPeriodoPersonalizadoModal .field,
#finPeriodoPersonalizadoModal .field {
  margin-bottom: 0;
}

#dashPeriodoPersonalizadoModal input[type="date"].input,
#finPeriodoPersonalizadoModal input[type="date"].input {
  display: block;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 54px !important;
  min-height: 54px !important;
  padding: 0 1rem !important;
  border-radius: 14px !important;
  line-height: 54px !important;
  text-align: center;
  overflow: hidden;
  background-clip: padding-box;
  -webkit-appearance: none;
  appearance: none;
}

#dashPeriodoPersonalizadoModal input[type="date"].input::-webkit-date-and-time-value,
#finPeriodoPersonalizadoModal input[type="date"].input::-webkit-date-and-time-value {
  display: block;
  width: 100%;
  min-width: 0;
  height: 54px;
  margin: 0;
  padding: 0;
  line-height: 54px;
  text-align: center;
}

#dashPeriodoPersonalizadoModal input[type="date"].input::-webkit-datetime-edit,
#finPeriodoPersonalizadoModal input[type="date"].input::-webkit-datetime-edit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0;
}

#dashPeriodoPersonalizadoModal input[type="date"].input::-webkit-datetime-edit-fields-wrapper,
#finPeriodoPersonalizadoModal input[type="date"].input::-webkit-datetime-edit-fields-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 100%;
}

#dashPeriodoPersonalizadoModal input[type="date"].input::-webkit-calendar-picker-indicator,
#finPeriodoPersonalizadoModal input[type="date"].input::-webkit-calendar-picker-indicator {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
}

@media (max-width: 640px) {
  #dashPeriodoPersonalizadoModal .modal-body,
  #finPeriodoPersonalizadoModal .modal-body {
    padding-inline: .92rem !important;
    overflow-x: hidden !important;
  }

  #dashPeriodoPersonalizadoModal .form-grid,
  #finPeriodoPersonalizadoModal .form-grid {
    gap: .72rem !important;
  }

  #dashPeriodoPersonalizadoModal input[type="date"].input,
  #finPeriodoPersonalizadoModal input[type="date"].input {
    height: 54px !important;
    min-height: 54px !important;
    font-size: 16px !important;
    line-height: 54px !important;
  }
}

/* Financeiro: KPIs no padrao global.
   Mantem o mesmo tamanho de Agenda, Dashboard, Clientes e Produtos; esta camada
   so preserva a sobra final do carrossel para o ultimo card nao cortar. */
@media (max-width: 1024px) {
  .main-panel-financeiro .fin-kpi-grid {
    width: auto !important;
    max-width: none !important;
    margin: 0 calc(var(--mobile-gutter, 1rem) * -1) .92rem !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-padding-left: var(--mobile-kpi-edge, .875rem) !important;
    scroll-padding-right: var(--mobile-kpi-edge, .875rem) !important;
  }

  .main-panel-financeiro .fin-kpi-grid::after {
    content: "" !important;
    display: block !important;
    flex: 0 0 calc(var(--mobile-kpi-edge, .875rem) - var(--mobile-kpi-gap, .28rem)) !important;
    min-width: calc(var(--mobile-kpi-edge, .875rem) - var(--mobile-kpi-gap, .28rem)) !important;
  }

  .main-panel-financeiro .fin-kpi-grid .fin-kpi-value {
    font-size: clamp(1.18rem, 5vw, 1.45rem) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }

  .main-panel-financeiro .fin-kpi-grid .fin-kpi-value.is-fin-kpi-long {
    font-size: clamp(1rem, 4.15vw, 1.2rem) !important;
  }

  .main-panel-financeiro .fin-kpi-grid .fin-kpi-value.is-fin-kpi-xl {
    font-size: clamp(.84rem, 3.2vw, 1rem) !important;
  }

  .main-panel-financeiro .fin-kpi-grid .fin-kpi[data-kpi="meta_mes"].is-meta-empty .fin-kpi-value {
    font-size: clamp(.84rem, 3.75vw, .98rem) !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    text-overflow: clip !important;
    padding-right: 0 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}

/* =============================================================
   PANEL CONFIG FOOTER - PADRAO UNICO
   Rodape oficial dos modais "Configurar painel": [Resetar] [Salvar].
   ============================================================= */
#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer {
  --panel-config-footer-x: .82rem;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  gap: .58rem !important;
  width: auto !important;
  max-width: none !important;
  margin: .72rem calc(-1 * var(--panel-config-footer-x)) 0 !important;
  padding: .58rem var(--panel-config-footer-x) calc(.58rem + env(safe-area-inset-bottom, 0px)) !important;
  background: rgba(255, 255, 255, .98) !important;
  border-top: 1px solid #e6edf7 !important;
  box-shadow: 0 -8px 18px rgba(15, 23, 42, .055) !important;
}

#dashPersonalizarModal .mobile-panel-config-sheet > .panel-config-footer {
  --panel-config-footer-x: 1rem;
  margin: 0 !important;
  padding: .72rem var(--panel-config-footer-x) calc(.72rem + env(safe-area-inset-bottom, 0px)) !important;
}

#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > form,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > form,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > form,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > form,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > form,
#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > div,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > div,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > div,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > div,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer > div,
#prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-reset-wrap,
#prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-actions {
  display: contents !important;
}

#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer [data-close-modal]:not(.modal-close),
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer [data-close-modal]:not(.modal-close),
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer [data-close-modal]:not(.modal-close),
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer [data-close-modal]:not(.modal-close),
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer [data-close-modal]:not(.modal-close) {
  display: none !important;
}

#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 .78rem !important;
  border-radius: 14px !important;
  gap: .42rem !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  font-size: .92rem !important;
  line-height: 1 !important;
  font-weight: 850 !important;
}

#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn::after,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn::after,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn::after,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn::after,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn::after,
#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn::after,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn::after,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn::after,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn::after,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn::after {
  content: none !important;
  display: none !important;
}

#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn i,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn i,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn i,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn i,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn i,
#dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn i,
#agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn i,
#finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn i,
#clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn i,
#prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn i {
  display: block !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  font-size: 1rem !important;
  line-height: 1 !important;
}

@media (max-width: 768px) {
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-item {
    min-height: 52px !important;
    padding-block: .46rem !important;
  }

  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn {
    height: 42px !important;
    min-height: 42px !important;
    padding-inline: .68rem !important;
  }
}

/* Configurar painel: labels e altura mobile definitivos.
   Mantem o rodape [Resetar] [Salvar] legivel e impede sheet colado no topo. */
@media (max-width: 768px) {
  #dashPersonalizarModal,
  #clientesPersonalizarModal,
  #finPersonalizarModal {
    align-items: flex-end !important;
    padding:
      max(1rem, env(safe-area-inset-top))
      .58rem
      max(.72rem, env(safe-area-inset-bottom)) !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet,
  #clientesPersonalizarModal .mobile-panel-config-sheet,
  #finPersonalizarModal .mobile-panel-config-sheet {
    top: auto !important;
    margin-top: max(1rem, env(safe-area-inset-top)) !important;
    max-height: min(calc(100dvh - 110px), 720px) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .modal-body,
  #clientesPersonalizarModal .mobile-panel-config-sheet .modal-body,
  #finPersonalizarModal .mobile-panel-config-sheet .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: .58rem !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn,
  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #dashPersSalvar,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #clientesPersSalvar,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #finPersSalvar {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .42rem !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 .72rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    font-size: .92rem !important;
    line-height: 1 !important;
    font-weight: 850 !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn::after,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn::after,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn::after,
  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #dashPersSalvar::after,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #clientesPersSalvar::after,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #finPersSalvar::after {
    content: none !important;
    display: none !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn i,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn i,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer form .panel-config-reset-btn i,
  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #dashPersSalvar i,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #clientesPersSalvar i,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer #finPersSalvar i {
    display: inline-block !important;
    flex: 0 0 auto !important;
    font-size: 1rem !important;
    line-height: 1 !important;
    margin: 0 !important;
  }
}

@media (max-width: 380px) {
  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
  #agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer,
  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer {
    --panel-config-footer-x: .68rem;
    gap: .42rem !important;
  }

  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
  #agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
  #dashPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
  #agendaPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
  #finPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
  #clientesPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn {
    height: 42px !important;
    min-height: 42px !important;
    padding-inline: .5rem !important;
    font-size: .84rem !important;
  }
}

@media (max-width: 768px) {
  #prodPersonalizarModal .mobile-panel-config-sheet .fin-pers-item {
    min-height: 52px !important;
    padding-block: .46rem !important;
  }

  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer {
    grid-template-columns: .78fr .74fr .82fr !important;
  }

  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer [data-close-modal]:not(.modal-close) {
    display: inline-flex !important;
  }

  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-reset-btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .panel-config-footer .panel-config-save-btn,
  #prodPersonalizarModal .mobile-panel-config-sheet .prod-pers-foot .btn,
  #prodPersonalizarModal .prod-pers-foot .btn {
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding-inline: .68rem !important;
  }
}

/* =============================================================
   MOBILE KPI CAROUSEL BASELINE
   Um unico comportamento para Dashboard, Agenda, Clientes,
   Financeiro, Produtos e qualquer trilho .fin-kpi-grid.
   ============================================================= */
@media (max-width: 1024px) {
  .fin-kpi-grid,
  .main-panel-produtos .catalog-kpis {
    --mobile-kpi-edge: clamp(.78rem, 3.5vw, 1rem) !important;
    --mobile-kpi-gap: clamp(.42rem, 1.85vw, .56rem) !important;
    --mobile-kpi-card-width: calc((100vw - (2 * var(--mobile-kpi-edge)) - (2 * var(--mobile-kpi-gap))) / 3) !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    grid-template-columns: none !important;
    align-items: stretch !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 calc(-1 * var(--mobile-gutter, 1rem)) .92rem !important;
    padding: .05rem var(--mobile-kpi-edge) .56rem !important;
    gap: var(--mobile-kpi-gap) !important;
    background: transparent !important;
    background-image: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: auto !important;
    scroll-padding-left: var(--mobile-kpi-edge) !important;
    scroll-padding-right: var(--mobile-kpi-edge) !important;
    scrollbar-width: none !important;
  }

  .fin-kpi-grid::-webkit-scrollbar,
  .main-panel-produtos .catalog-kpis::-webkit-scrollbar {
    display: none !important;
  }

  .fin-kpi-grid .fin-kpi,
  .main-panel-produtos .catalog-kpis .fin-kpi {
    box-sizing: border-box !important;
    flex: 0 0 var(--mobile-kpi-card-width) !important;
    width: var(--mobile-kpi-card-width) !important;
    min-width: var(--mobile-kpi-card-width) !important;
    max-width: var(--mobile-kpi-card-width) !important;
    scroll-snap-align: none !important;
    scroll-snap-stop: normal !important;
  }

  .fin-kpi-grid .fin-kpi[data-kpi-snap="group-start"],
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi-snap="group-start"] {
    scroll-snap-align: start !important;
  }

  .fin-kpi-grid .fin-kpi[data-kpi-group-end="true"],
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi-group-end="true"] {
    margin-right: var(--mobile-kpi-edge) !important;
  }

  .fin-kpi-grid::after,
  .main-panel-produtos .catalog-kpis::after {
    content: "" !important;
    display: block !important;
    flex: 0 0 0 !important;
    min-width: 0 !important;
  }

  .fin-kpi-grid[data-kpi-tail="1"]::after,
  .main-panel-produtos .catalog-kpis[data-kpi-tail="1"]::after {
    flex-basis: calc((2 * var(--mobile-kpi-card-width)) + var(--mobile-kpi-gap)) !important;
    min-width: calc((2 * var(--mobile-kpi-card-width)) + var(--mobile-kpi-gap)) !important;
  }

  .fin-kpi-grid[data-kpi-tail="2"]::after,
  .main-panel-produtos .catalog-kpis[data-kpi-tail="2"]::after {
    flex-basis: var(--mobile-kpi-card-width) !important;
    min-width: var(--mobile-kpi-card-width) !important;
  }

  .fin-kpi-grid[data-kpi-tail="0"]::after,
  .main-panel-produtos .catalog-kpis[data-kpi-tail="0"]::after,
  .fin-kpi-grid[data-kpi-scroll="locked"]::after,
  .main-panel-produtos .catalog-kpis[data-kpi-scroll="locked"]::after {
    content: none !important;
    display: none !important;
  }

  .fin-kpi-grid.is-kpi-scroll-locked,
  .main-panel-produtos .catalog-kpis.is-kpi-scroll-locked,
  .fin-kpi-grid[data-kpi-scroll="locked"],
  .main-panel-produtos .catalog-kpis[data-kpi-scroll="locked"] {
    overflow-x: hidden !important;
    scroll-snap-type: none !important;
    touch-action: pan-y !important;
  }

  .kpi-section,
  .kpi-carousel,
  .dashboard-metrics {
    background: transparent !important;
    background-image: none !important;
  }
}

/* =============================================================
   MOBILE PAGE END BASELINE
   Padroniza o encerramento visual dos modulos internos sem alterar
   cards, KPIs, componentes ou FAB.
   ============================================================= */
@media (max-width: 1024px) {
  html {
    background: #000 !important;
  }

  :root {
    --mobile-page-bg: var(--app-bg);
    --mobile-browser-safe-bg: var(--app-safe-area-bg);
    --mobile-browser-ui-bottom: 0px;
    --mobile-safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--mobile-browser-ui-bottom));
  }

  body:has(.app-shell) {
    background: var(--mobile-browser-safe-bg) !important;
  }

  body:has(.app-shell)::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--mobile-page-bg);
  }

  body:has(.app-shell)::after {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--mobile-safe-bottom);
    z-index: 0;
    pointer-events: none;
    background: var(--mobile-browser-safe-bg);
  }

  .app-shell,
  .main-panel {
    position: relative;
    z-index: 1;
    background: transparent !important;
    min-height: 100dvh !important;
  }

  .main-panel {
    display: flex;
    flex-direction: column;
  }

  .main-panel > .content {
    position: relative;
    z-index: 1;
    flex: 1 0 auto;
    background: transparent !important;
  }
}

/* =============================================================
   MOBILE FAB + BROWSER SAFE AREA BASELINE
   Mantem o botao + fixo acima da barra inferior do navegador e
   padroniza o preto externo da safe-area sem tocar nos cards.
   ============================================================= */
@media (max-width: 1024px) {
  :root {
    --mobile-fab-size: 56px;
    --mobile-fab-right: max(1rem, env(safe-area-inset-right, 0px));
    --mobile-fab-bottom-offset: 5.5rem;
    --mobile-fab-bottom-clearance: max(var(--mobile-fab-bottom-offset), var(--mobile-browser-ui-bottom, 0px));
    --mobile-fab-bottom: calc(env(safe-area-inset-bottom, 0px) + var(--mobile-fab-bottom-clearance));
  }

  .fab,
  body > .fab[data-fab-portaled],
  .main-panel-agenda .fab,
  .main-panel-financeiro .fab,
  .main-panel-produtos .fab,
  .main-panel-clientes .fab {
    position: fixed !important;
    right: var(--mobile-fab-right) !important;
    bottom: var(--mobile-fab-bottom) !important;
    left: auto !important;
    top: auto !important;
    width: var(--mobile-fab-size) !important;
    height: var(--mobile-fab-size) !important;
    min-width: var(--mobile-fab-size) !important;
    min-height: var(--mobile-fab-size) !important;
    max-width: var(--mobile-fab-size) !important;
    max-height: var(--mobile-fab-size) !important;
    margin: 0 !important;
    transform: translate3d(0, 0, 0) !important;
    z-index: 79 !important;
    will-change: transform;
    contain: layout paint;
  }

  body:has(.modal.is-open) .fab,
  body:has(.module-help-modal.is-open) .fab,
  body.sidebar-open .fab {
    display: none !important;
  }

  body:has(.app-shell)::before {
    bottom: var(--mobile-safe-bottom) !important;
  }
}

/* =============================================================
   MOBILE DRAGGABLE FAB + CREATION MODAL BASELINE
   Padrao global para FAB arrastavel e modais de criacao acima do app.
   ============================================================= */
@media (max-width: 1024px) {
  :root {
    --mobile-fab-z: 10050;
    --mobile-modal-z: 11000;
    --mobile-creation-modal-top: max(72px, calc(env(safe-area-inset-top, 0px) + 72px));
    --mobile-creation-modal-bottom: max(.75rem, calc(env(safe-area-inset-bottom, 0px) + var(--mobile-browser-ui-bottom, 0px) + .75rem));
    --mobile-creation-modal-max-height: min(
      calc(100dvh - 96px),
      calc(100dvh - var(--mobile-creation-modal-top) - var(--mobile-creation-modal-bottom))
    );
  }

  .fab,
  body > .fab[data-fab-portaled],
  .main-panel-agenda .fab,
  .main-panel-financeiro .fab,
  .main-panel-produtos .fab,
  .main-panel-clientes .fab {
    z-index: var(--mobile-fab-z) !important;
    touch-action: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    cursor: grab !important;
    transition:
      left .2s cubic-bezier(.2, .8, .2, 1),
      top .2s cubic-bezier(.2, .8, .2, 1),
      transform .16s ease,
      box-shadow .16s ease !important;
  }

  .fab.is-fab-dragging,
  body > .fab[data-fab-dragging="true"] {
    cursor: grabbing !important;
    transform: scale(1.06) !important;
    box-shadow:
      0 24px 46px rgba(37, 99, 235, .42),
      0 8px 18px rgba(15, 23, 42, .24) !important;
    transition: transform .12s ease, box-shadow .12s ease !important;
  }

  body.modal-open {
    overflow: hidden !important;
    overscroll-behavior: contain;
  }

  body.modal-open .fab,
  body:has(.modal.is-open) .fab,
  body:has(.module-help-modal.is-open) .fab,
  body.sidebar-open .fab {
    display: none !important;
  }

  #clienteModalNovo,
  #produtoModal,
  #finLancarModal,
  #agendaCreateChoiceModal,
  #agendaModalNovo {
    position: fixed !important;
    inset: 0 !important;
    z-index: var(--mobile-modal-z) !important;
    align-items: flex-end !important;
    justify-content: center !important;
    padding:
      var(--mobile-creation-modal-top)
      .75rem
      var(--mobile-creation-modal-bottom) !important;
    background: rgba(15, 23, 42, .58) !important;
    overflow: hidden !important;
  }

  #clienteModalNovo.is-open,
  #produtoModal.is-open,
  #finLancarModal.is-open,
  #agendaCreateChoiceModal.is-open,
  #agendaModalNovo.is-open {
    display: flex !important;
  }

  #clienteModalNovo > .modal-card,
  #produtoModal > .modal-card,
  #finLancarModal > .modal-card,
  #agendaCreateChoiceModal > .modal-card,
  #agendaModalNovo > .modal-card {
    width: min(100%, 720px) !important;
    height: auto !important;
    max-height: var(--mobile-creation-modal-max-height) !important;
    margin: 0 !important;
    border-radius: 22px 22px 18px 18px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    transform: none !important;
  }

  #agendaCreateChoiceModal > .agenda-create-choice-card {
    width: min(100%, 460px) !important;
  }

  #clienteModalNovo .modal-head,
  #produtoModal .modal-head,
  #finLancarModal .modal-head,
  #agendaCreateChoiceModal .modal-head,
  #agendaModalNovo .modal-head {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
    min-height: 58px !important;
    padding: .86rem 1rem !important;
    background: #fff !important;
  }

  #clienteModalNovo .modal-head h2,
  #produtoModal .modal-head h2,
  #finLancarModal .modal-head h2,
  #agendaCreateChoiceModal .modal-head h2,
  #agendaModalNovo .modal-head h2 {
    min-width: 0 !important;
    font-size: clamp(1rem, 4.4vw, 1.18rem) !important;
    line-height: 1.15 !important;
  }

  #clienteModalNovo .modal-body,
  #produtoModal .modal-body,
  #finLancarModal .modal-body,
  #agendaCreateChoiceModal .modal-body,
  #agendaModalNovo .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain;
  }

  #clienteModalNovo .modal-foot,
  #clienteModalNovo .modal-actions,
  #produtoModal .modal-foot,
  #produtoModal .modal-actions,
  #finLancarModal .modal-foot,
  #finLancarModal .modal-actions,
  #agendaModalNovo .modal-foot,
  #agendaModalNovo .modal-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    background: #fff !important;
    padding-bottom: calc(.78rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 640px) {
  #clienteModalNovo,
  #produtoModal,
  #finLancarModal,
  #agendaCreateChoiceModal,
  #agendaModalNovo {
    padding:
      var(--mobile-creation-modal-top)
      .62rem
      var(--mobile-creation-modal-bottom) !important;
  }

  #clienteModalNovo > .modal-card,
  #produtoModal > .modal-card,
  #finLancarModal > .modal-card,
  #agendaCreateChoiceModal > .modal-card,
  #agendaModalNovo > .modal-card {
    width: min(100%, 560px) !important;
    height: auto !important;
    max-height: var(--mobile-creation-modal-max-height) !important;
    border-radius: 22px 22px 18px 18px !important;
  }

  #clienteModalNovo .modal-head,
  #produtoModal .modal-head,
  #finLancarModal .modal-head,
  #agendaCreateChoiceModal .modal-head,
  #agendaModalNovo .modal-head {
    padding-top: .86rem !important;
  }

  #clienteModalNovo .modal-body,
  #produtoModal .modal-body,
  #finLancarModal .modal-body,
  #agendaCreateChoiceModal .modal-body,
  #agendaModalNovo .modal-body {
    padding-bottom: 0 !important;
  }
}

/* ---------- Agenda: escolha de novo agendamento alinhada ---------- */
@media (max-width: 1024px) {
  #agendaCreateChoiceModal .agenda-create-choice-body {
    padding-bottom: 24px !important;
  }

  #agendaCreateChoiceModal .agenda-create-choice-body form {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  #agendaCreateChoiceModal .agenda-create-option {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 80px !important;
    min-height: 80px !important;
    padding: .86rem !important;
    border: 1px solid #dbe5f4 !important;
    border-radius: 16px !important;
    gap: .78rem !important;
  }
}

/* ---------- Novo cliente mobile: formulario compacto e footer completo ---------- */
@media (max-width: 1024px) {
  #clienteModalNovo .cliente-modal-card {
    width: min(100%, 540px) !important;
    border-radius: 22px 22px 18px 18px !important;
  }

  #clienteModalNovo .cliente-mobile-form {
    display: flex !important;
    flex-direction: column !important;
    flex: 0 1 auto !important;
    gap: .42rem !important;
    padding: .66rem 0 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  #clienteModalNovo .cliente-mobile-form .field {
    display: grid !important;
    gap: .18rem !important;
    margin: 0 !important;
  }

  #clienteModalNovo .cliente-mobile-form .form-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .42rem !important;
    margin: 0 !important;
  }

  #clienteModalNovo .cliente-mobile-form > .field,
  #clienteModalNovo .cliente-mobile-form > .form-grid {
    margin-right: .82rem !important;
    margin-left: .82rem !important;
  }

  #clienteModalNovo .cliente-mobile-form .field label {
    font-size: .8rem !important;
    line-height: 1.08 !important;
    margin: 0 !important;
  }

  #clienteModalNovo .cliente-mobile-form .input,
  #clienteModalNovo .cliente-mobile-form .select,
  #clienteModalNovo .cliente-mobile-form .textarea {
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 .72rem !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    line-height: 40px !important;
  }

  #clienteModalNovo .cliente-observacao-textarea {
    min-height: 44px !important;
    height: 44px !important;
    max-height: 82px !important;
    padding-top: .54rem !important;
    padding-bottom: .54rem !important;
    line-height: 1.25 !important;
  }

  #clienteModalNovo .modal-actions {
    position: sticky !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 6 !important;
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    max-width: none !important;
    margin: .52rem 0 0 !important;
    padding: 14px 24px calc(14px + env(safe-area-inset-bottom, 0px)) !important;
    gap: .62rem !important;
    border-top: 1px solid #e6edf7 !important;
    border-radius: 0 0 18px 18px !important;
    background: #fff !important;
    box-shadow: 0 -10px 24px rgba(15, 23, 42, .06) !important;
  }

  #clienteModalNovo .modal-actions .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .42rem !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    height: 46px !important;
    padding: 0 .7rem !important;
    text-align: center !important;
  }
}

@media (max-width: 380px) {
  #clienteModalNovo .cliente-mobile-form {
    gap: .36rem !important;
  }

  #clienteModalNovo .cliente-mobile-form > .field,
  #clienteModalNovo .cliente-mobile-form > .form-grid {
    margin-right: .72rem !important;
    margin-left: .72rem !important;
  }

  #clienteModalNovo .cliente-mobile-form .form-grid {
    gap: .36rem !important;
  }

  #clienteModalNovo .cliente-mobile-form .input,
  #clienteModalNovo .cliente-mobile-form .select,
  #clienteModalNovo .cliente-mobile-form .textarea {
    min-height: 40px !important;
    height: 40px !important;
    line-height: 40px !important;
  }

  #clienteModalNovo .modal-actions {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 20px !important;
    padding-left: 20px !important;
  }
}

/* =============================================================
   APP BACKGROUND THEME BASELINE
   Uma unica cor para o fundo dos modulos e trilhos de KPIs.
   ============================================================= */
:root {
  --app-bg: #f3f6fb;
  --app-surface: #ffffff;
  --app-safe-area-bg: #000000;
}

html {
  background: var(--app-bg);
}

body,
.app-shell,
.main-panel,
.main-panel > .content,
.content,
.dashboard-page,
.main-panel-dashboard,
.main-panel-agenda,
.main-panel-clientes,
.main-panel-financeiro,
.main-panel-produtos {
  background-color: var(--app-bg) !important;
  background-image: none !important;
}

.fin-kpi-grid,
.main-panel-produtos .catalog-kpis,
.kpi-section,
.kpi-carousel,
.dashboard-metrics {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

.card,
.modal-card,
.fin-kpi,
.fin-chart,
.fin-panel-card,
.catalog-card,
.clientes-list-card,
.dashboard-card-item,
.dash-main-card,
.agenda-card,
.insights-panel,
.mobile-panel-config-sheet {
  background-color: var(--app-surface);
}

@media (max-width: 1024px) {
  html {
    background: var(--app-safe-area-bg) !important;
  }

  body:has(.app-shell) {
    background: var(--app-safe-area-bg) !important;
  }

  body:has(.app-shell)::before {
    background: var(--app-bg) !important;
  }

  body:has(.app-shell)::after {
    background: var(--app-safe-area-bg) !important;
    z-index: 4 !important;
  }

  .app-shell,
  .main-panel,
  .main-panel > .content,
  .content {
    background-color: transparent !important;
    background-image: none !important;
  }
}

/* =============================================================
   MOBILE BROWSER BAR BACKDROP
   Faixa preta unica atras da barra inferior do navegador em todos
   os modulos. Fica acima do conteudo rolavel e abaixo de topbar,
   modais e FAB.
   ============================================================= */
@media (max-width: 1024px) {
  :root {
    --app-safe-area-bg: #000000;
    --mobile-safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--mobile-browser-ui-bottom, 0px));
  }

  html,
  body,
  body:has(.app-shell) {
    background-color: var(--app-safe-area-bg) !important;
  }

  body:has(.app-shell)::after {
    content: "" !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: var(--mobile-safe-bottom) !important;
    min-height: env(safe-area-inset-bottom, 0px) !important;
    z-index: 4 !important;
    pointer-events: none !important;
    background: var(--app-safe-area-bg) !important;
    background-color: var(--app-safe-area-bg) !important;
    background-image: none !important;
  }
}

/* =============================================================
   CONFIGURACOES: AGENDA E BLOQUEIOS MOBILE POLISH
   Compacta cards, campos de horario, rodapes e formulario de bloqueio.
   ============================================================= */
.business-hours-modal-card {
  max-width: 660px;
}

.business-hours-modal {
  z-index: var(--mobile-modal-z, 11000) !important;
}

#businessBlockModal .business-hours-modal-card > form {
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: inherit;
}

.business-hours-modal-card .modal-body {
  flex: 1 1 auto;
  min-height: 0;
}

.business-hours-modal-card .modal-foot {
  flex: 0 0 auto;
  margin: 0;
  padding: .72rem .88rem calc(.72rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e6edf7;
  background: #fff;
  box-shadow: 0 -10px 24px rgba(15, 23, 42, .06);
}

.business-agenda-section {
  gap: .58rem;
  padding: .68rem;
  border-radius: 12px;
}

.business-agenda-section + .business-agenda-section {
  margin-top: .68rem;
}

.business-hours-quick-actions {
  gap: .36rem;
  padding: .52rem .58rem;
  border-radius: 12px;
}

.business-hours-presets {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .38rem;
}

.business-hours-presets .btn {
  min-height: 30px;
  width: 100%;
  justify-content: center;
  border-radius: 999px;
  padding: .24rem .5rem;
}

.business-hours-list {
  gap: .42rem;
}

.business-hours-row {
  gap: .34rem;
  padding: .42rem .5rem;
  border-radius: 12px;
}

.business-hours-row-head {
  min-height: 28px;
}

.business-hours-toggle {
  gap: .45rem;
  font-size: .95rem;
  line-height: 1.1;
}

.business-hours-toggle input {
  width: 18px;
  height: 18px;
  margin: 0;
  flex: 0 0 auto;
}

.business-hours-times {
  grid-template-columns: minmax(84px, 112px) 20px minmax(84px, 112px) !important;
  justify-content: center;
  gap: .5rem;
  padding-inline: 12px;
}

.business-hours-times .input {
  justify-self: center;
  width: 100%;
  min-width: 0;
  max-width: 112px;
  height: 34px;
  min-height: 34px;
  padding: 0 .4rem;
  line-height: 34px;
}

.business-hours-arrow {
  width: 20px;
  min-width: 20px;
  font-size: 1rem;
}

.business-blocked-item > div {
  display: grid;
  gap: .14rem;
  min-width: 0;
}

.business-blocked-item strong {
  line-height: 1.16;
}

.business-blocked-meta {
  display: inline-flex !important;
  align-items: center;
  gap: .36rem;
  min-width: 0;
}

.business-blocked-meta i {
  width: 14px;
  flex: 0 0 14px;
  color: var(--blue-600);
  text-align: center;
}

.business-block-form {
  display: grid;
  gap: .56rem;
}

.business-block-form .field {
  gap: .26rem;
  margin: 0;
}

.business-block-form .field label {
  font-size: .82rem;
  line-height: 1.1;
}

.business-block-form .input,
.business-block-form .select,
.business-block-form .textarea {
  min-height: 40px;
  border-radius: 12px;
  font-size: 16px;
}

.business-block-form .input,
.business-block-form .select {
  height: 40px;
  padding: 0 .72rem;
}

.business-input-shell {
  position: relative;
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.business-input-shell > .input {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.business-input-shell > i {
  display: none;
}

.business-custom-title-field[hidden] {
  display: none !important;
}

.business-inline-pair,
.business-time-range {
  display: grid;
  align-items: center;
  min-width: 0;
}

.business-inline-pair {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: .5rem;
}

.business-time-range {
  grid-template-columns: minmax(82px, 1fr) 20px minmax(82px, 1fr);
  gap: .42rem;
}

.business-time-range .input {
  text-align: center;
}

.business-block-note {
  min-height: 58px;
  height: 58px;
  max-height: 78px;
  padding-top: .5rem;
  padding-bottom: .5rem;
  line-height: 1.25;
  resize: none;
}

@media (max-width: 640px) {
  .business-hours-modal {
    align-items: flex-end !important;
    padding:
      calc(.74rem + env(safe-area-inset-top, 0px))
      .62rem
      calc(.52rem + max(env(safe-area-inset-bottom, 0px), var(--mobile-browser-ui-bottom, 0px))) !important;
  }

  body:has(.business-hours-modal.is-open) .topbar {
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .business-hours-modal-card {
    width: min(100%, 560px) !important;
    max-height: calc(
      100dvh - .74rem - .52rem - env(safe-area-inset-top, 0px) - max(env(safe-area-inset-bottom, 0px), var(--mobile-browser-ui-bottom, 0px))
    ) !important;
    border-radius: 22px 22px 18px 18px !important;
  }

  .business-hours-modal-card .modal-head {
    min-height: 0;
    padding: .84rem .95rem .72rem;
  }

  .business-hours-modal-card .modal-head h2 {
    font-size: 1.04rem;
    line-height: 1.12;
  }

  .business-hours-modal-card .modal-head .muted {
    margin-top: .18rem;
    font-size: .88rem;
    line-height: 1.24;
  }

  .business-hours-modal-card .modal-body {
    padding: .72rem .82rem;
    max-height: none;
    overflow-x: hidden;
  }

  .business-hours-modal-card .modal-foot {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: .58rem;
    padding: .62rem .82rem calc(.62rem + env(safe-area-inset-bottom, 0px));
    border-radius: 0 0 18px 18px;
  }

  .business-hours-modal-card .modal-foot .btn {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    height: 46px;
    justify-content: center;
    padding: 0 .7rem;
    text-align: center;
  }

  .business-agenda-section {
    gap: .5rem;
    padding: .6rem;
  }

  .business-agenda-section-head {
    gap: .5rem;
  }

  .business-agenda-section-head h3 {
    font-size: .92rem;
  }

  .business-agenda-section-head .muted {
    font-size: .78rem;
  }

  .business-agenda-section-head-action {
    gap: .55rem;
  }

  .business-hours-quick-title {
    font-size: .7rem;
  }

  .business-hours-row {
    padding: .4rem .46rem;
  }

  .business-hours-row-head {
    min-height: 26px;
  }

  .business-hours-toggle span {
    font-size: .96rem;
  }

  .business-hours-copy {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .business-hours-times {
    grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr) !important;
    gap: 8px;
    width: 100%;
    padding-inline: 0;
    align-items: center;
    justify-content: stretch;
    max-width: 100%;
    overflow: visible;
  }

  .business-hours-times .input {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    height: 48px;
    min-height: 48px;
    line-height: 48px;
    padding: 0 34px 0 12px;
    text-align: center;
  }

  .business-hours-arrow {
    width: 22px;
    min-width: 22px;
    justify-self: center;
    text-align: center;
    flex: none;
    line-height: 1;
  }

  .business-blocked-list--modal {
    gap: .42rem;
  }

  .business-blocked-list--modal .business-blocked-item {
    padding: .55rem .62rem;
  }

  .business-block-form {
    gap: .5rem;
  }

  .business-inline-pair {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    width: 100%;
    align-items: center;
    max-width: 100%;
    overflow: visible;
  }

  .business-time-range {
    grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr);
    gap: 8px;
    width: 100%;
    align-items: center;
    max-width: 100%;
    overflow: visible;
  }

  .business-inline-pair .input,
  .business-time-range .input {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .business-input-shell > i {
    display: block;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ink-500);
    font-size: .86rem;
    line-height: 1;
    pointer-events: none;
    z-index: 1;
  }

  .business-input-shell > .input {
    padding-right: 34px;
  }

  .business-input-shell--date > .input {
    padding-left: 8px;
    padding-right: 30px;
    font-size: 12px;
  }

  .business-input-shell--time > .input {
    padding-left: 12px;
    padding-right: 34px;
    font-size: 16px;
    text-align: center;
  }

  .business-input-shell > .input::-webkit-calendar-picker-indicator {
    position: absolute;
    right: 0;
    width: 34px;
    height: 100%;
    opacity: 0;
    cursor: pointer;
  }

  .time-range-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr) !important;
    gap: 8px;
    align-items: center;
    width: 100%;
    max-width: 100%;
  }

  .time-range-row .business-hours-arrow,
  .time-range-row .range-arrow {
    width: 22px;
    min-width: 22px;
    text-align: center;
    justify-self: center;
    flex: none;
  }

  .time-range-row .business-input-shell,
  .time-range-row .time-input-wrap,
  .date-range-row .business-input-shell,
  .date-range-row .date-input-wrap {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
  }

  .time-range-row input,
  .date-range-row input {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .time-range-row input {
    height: 48px;
    min-height: 48px;
    text-align: center;
    padding: 0 34px 0 12px;
  }

  .date-range-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 8px;
    align-items: center;
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 380px) {
  .business-hours-modal {
    padding-inline: .5rem !important;
  }

  .business-hours-modal-card .modal-foot {
    gap: .46rem;
    padding-inline: .64rem;
  }

  .business-hours-modal-card .modal-foot .btn {
    font-size: .86rem;
    padding-inline: .45rem;
  }

  .business-hours-times {
    grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr) !important;
    gap: 8px;
  }

  .business-hours-times .input {
    max-width: 100%;
    padding-right: 34px;
    padding-left: 10px;
  }

  .business-time-range {
    grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr);
    gap: 8px;
  }

  .business-input-shell--date > .input {
    font-size: 11px;
    padding-left: 6px;
    padding-right: 28px;
  }

  .business-input-shell > i {
    right: 8px;
    font-size: .8rem;
  }
}

@media (max-width: 640px) {
  #businessHoursModal .business-hours-times.time-range-row,
  #businessBlockModal .business-time-range.time-range-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-inline: 0 !important;
    overflow: visible !important;
  }

  #businessHoursModal .time-range-row .business-hours-arrow,
  #businessBlockModal .time-range-row .business-hours-arrow {
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    justify-self: center !important;
    text-align: center !important;
    flex: none !important;
  }

  #businessHoursModal .time-range-row .time-input-wrap,
  #businessBlockModal .time-range-row .time-input-wrap,
  #businessBlockModal .date-range-row .date-input-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  #businessHoursModal .time-range-row input.input,
  #businessBlockModal .time-range-row input.input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    padding: 0 34px 0 12px !important;
  }

  #businessBlockModal .date-range-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  #businessBlockModal .date-range-row input.input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
    font-size: 12px !important;
    text-align: center !important;
    padding: 0 24px 0 6px !important;
  }

  #businessBlockModal .date-range-row .business-input-shell > i {
    right: 7px !important;
    font-size: .74rem !important;
  }

  #businessHoursModal .time-range-row .business-input-shell > i,
  #businessBlockModal .time-range-row .business-input-shell > i {
    right: 10px !important;
    font-size: .84rem !important;
  }
}

@media (max-width: 640px) {
  #businessHoursModal .business-hours-row {
    overflow: hidden !important;
  }

  #businessHoursModal .business-hours-times.time-range-row {
    width: calc(100% - 28px) !important;
    margin: .36rem auto 0 !important;
    grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  #businessBlockModal .date-range-row,
  #businessBlockModal .business-time-range.time-range-row {
    width: calc(100% - 8px) !important;
    margin-inline: auto !important;
    overflow: visible !important;
  }

  #businessHoursModal .time-input-wrap,
  #businessBlockModal .time-input-wrap,
  #businessBlockModal .date-input-wrap {
    overflow: visible !important;
    min-width: 0 !important;
  }

  #businessHoursModal .time-range-row input.input,
  #businessBlockModal .time-range-row input.input,
  #businessBlockModal .date-range-row input.input {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: #fff !important;
    border: 1px solid #d7def1 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    outline: none !important;
  }

  #businessHoursModal .time-range-row input.input,
  #businessBlockModal .time-range-row input.input {
    height: 44px !important;
    min-height: 44px !important;
    line-height: 44px !important;
    padding: 0 30px 0 10px !important;
    font-size: 16px !important;
    text-align: center !important;
  }

  #businessBlockModal .date-range-row input.input {
    height: 44px !important;
    min-height: 44px !important;
    line-height: 44px !important;
    padding: 0 24px 0 9px !important;
    font-size: 12px !important;
    text-align: left !important;
  }

  #businessHoursModal .time-range-row .business-input-shell > i,
  #businessBlockModal .time-range-row .business-input-shell > i {
    right: 9px !important;
    font-size: .8rem !important;
    color: #63728d !important;
  }

  #businessBlockModal .date-range-row .business-input-shell > i {
    right: 8px !important;
    font-size: .68rem !important;
    color: #63728d !important;
  }

  #businessHoursModal .time-range-row .business-hours-arrow,
  #businessBlockModal .time-range-row .business-hours-arrow {
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    font-size: .96rem !important;
    color: #63728d !important;
  }

  #businessHoursModal .time-range-row input.input::-webkit-calendar-picker-indicator,
  #businessBlockModal .time-range-row input.input::-webkit-calendar-picker-indicator,
  #businessBlockModal .date-range-row input.input::-webkit-calendar-picker-indicator {
    opacity: 0 !important;
    width: 28px !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #businessBlockModal .date-range-row input.input::-webkit-date-and-time-value,
  #businessBlockModal .date-range-row input.input::-webkit-datetime-edit {
    text-align: left !important;
    padding: 0 !important;
  }

  #businessHoursModal .time-range-row input.input::-webkit-date-and-time-value,
  #businessBlockModal .time-range-row input.input::-webkit-date-and-time-value,
  #businessHoursModal .time-range-row input.input::-webkit-datetime-edit,
  #businessBlockModal .time-range-row input.input::-webkit-datetime-edit {
    text-align: center !important;
    padding: 0 !important;
  }
}

@media (max-width: 380px) {
  #businessHoursModal .business-hours-times.time-range-row {
    width: calc(100% - 34px) !important;
  }

  #businessBlockModal .date-range-row input.input {
    font-size: 11px !important;
    padding-left: 7px !important;
    padding-right: 22px !important;
  }

  #businessBlockModal .date-range-row .business-input-shell > i {
    right: 7px !important;
    font-size: .62rem !important;
  }
}

/* ============================================================
   MODULE HEADER ACTIONS - PADRAO GLOBAL
   Normaliza os controles do topo entre Dashboard, Clientes,
   Agenda, Financeiro, Produtos/Servicos e Configuracoes.
   ============================================================ */
:root {
  --module-header-control-size: 40px;
  --module-header-radius: 12px;
  --module-header-icon-size: 1rem;
  --module-header-gap: .5rem;
}

.module-header-actions,
.topbar-actions.module-header-actions {
  align-items: center;
  gap: var(--module-header-gap);
}

.module-icon-button,
.topbar-actions .module-icon-button,
.topbar-actions .menu > .module-icon-button,
.mobile-menu-btn.module-icon-button {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 var(--module-header-control-size);
  width: var(--module-header-control-size);
  min-width: var(--module-header-control-size);
  max-width: var(--module-header-control-size);
  height: var(--module-header-control-size);
  min-height: var(--module-header-control-size);
  max-height: var(--module-header-control-size);
  padding: 0 !important;
  border-radius: var(--module-header-radius) !important;
  line-height: 1;
  gap: 0;
}

.module-icon-button > i,
.module-icon-button > span,
.topbar-actions .module-icon-button > i,
.mobile-menu-btn.module-icon-button > span {
  display: block;
  margin: 0;
  font-size: var(--module-header-icon-size) !important;
  line-height: 1 !important;
}

.module-icon-button--settings,
.topbar-actions .module-icon-button--settings,
.topbar-actions .menu > .module-icon-button--settings,
.btn-ghost.config-panel-btn.module-icon-button--settings {
  color: var(--success) !important;
  background: var(--success-soft) !important;
  border: 1px solid #bbf7d0 !important;
  box-shadow: var(--shadow-sm) !important;
  opacity: 1 !important;
}

.module-icon-button--settings > i,
.topbar-actions .module-icon-button--settings > i,
.btn-ghost.config-panel-btn.module-icon-button--settings > i {
  color: var(--success) !important;
}

.module-icon-button--settings:hover,
.topbar-actions .module-icon-button--settings:hover,
.topbar-actions .menu > .module-icon-button--settings:hover,
.btn-ghost.config-panel-btn.module-icon-button--settings:hover {
  color: #15803d !important;
  background: #dcfce7 !important;
  border-color: #86efac !important;
}

.module-icon-button--settings:hover > i,
.topbar-actions .module-icon-button--settings:hover > i,
.btn-ghost.config-panel-btn.module-icon-button--settings:hover > i {
  color: #15803d !important;
}

.module-primary-button,
.topbar-actions .module-primary-button {
  min-height: var(--module-header-control-size) !important;
  height: var(--module-header-control-size) !important;
  border-radius: var(--module-header-radius) !important;
  padding: 0 .9rem !important;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  font-size: .88rem !important;
  line-height: 1;
  white-space: nowrap;
}

.module-primary-button > i,
.topbar-actions .module-primary-button > i {
  font-size: .92rem !important;
  line-height: 1 !important;
}

.module-period-select,
.topbar-actions .module-period-select,
.fin-period-date,
.topbar-actions .search,
.topbar-actions .clientes-search,
.topbar-actions .catalog-search {
  height: var(--module-header-control-size) !important;
  min-height: var(--module-header-control-size) !important;
  border-radius: var(--module-header-radius) !important;
}

.topbar-actions .search > i {
  font-size: var(--module-header-icon-size) !important;
  line-height: 1 !important;
}

.topbar-actions .search input {
  min-height: 0;
  line-height: 1.2;
}

.agenda-notification-btn.module-icon-button {
  position: relative !important;
  overflow: visible !important;
}

.agenda-notification-btn .agenda-notification-badge {
  top: -9px;
  right: -9px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  font-size: .66rem;
  line-height: 1;
  z-index: 4;
  pointer-events: none;
}

@media (max-width: 768px) {
  .agenda-notification-btn .agenda-notification-badge {
    top: -8px;
    right: -8px;
    min-width: 18px;
    height: 18px;
  }
}

@media (min-width: 769px) {
  .topbar-actions.module-header-actions {
    flex-wrap: nowrap;
  }

  .clientes-toolbar.module-header-actions,
  .agenda-top-actions.module-header-actions,
  .catalog-toolbar.module-header-actions {
    gap: var(--module-header-gap);
  }

  .clientes-primary-btn.module-primary-button,
  .agenda-primary-btn.module-primary-button,
  .catalog-primary-btn.module-primary-button,
  .finance-top-control.module-primary-button:not(.finance-top-gear) {
    min-height: var(--module-header-control-size) !important;
    height: var(--module-header-control-size) !important;
  }

  .clientes-search,
  .catalog-search {
    height: var(--module-header-control-size) !important;
  }
}

@media (max-width: 768px) {
  :root {
    --mobile-control: var(--module-header-control-size);
    --mobile-radius: 13px;
    --module-header-control-size: 40px;
    --module-header-radius: 13px;
    --module-header-icon-size: .98rem;
    --module-header-gap: .36rem;
  }

  .mobile-menu-btn.module-icon-button,
  .topbar-actions .module-icon-button,
  .topbar-actions .menu > .module-icon-button,
  .topbar-actions .config-panel-btn.module-icon-button,
  .topbar-actions .finance-top-gear.module-icon-button,
  .topbar-actions .catalog-config-btn.module-icon-button,
  .topbar-actions .agenda-icon-btn.module-icon-button,
  .topbar-actions .clientes-icon-btn.module-icon-button,
  .topbar-actions .mobile-search-toggle.module-icon-button {
    flex: 0 0 var(--module-header-control-size) !important;
    width: var(--module-header-control-size) !important;
    min-width: var(--module-header-control-size) !important;
    max-width: var(--module-header-control-size) !important;
    height: var(--module-header-control-size) !important;
    min-height: var(--module-header-control-size) !important;
    max-height: var(--module-header-control-size) !important;
    padding: 0 !important;
  }

  .topbar-actions .module-primary-button {
    min-height: var(--module-header-control-size) !important;
    height: var(--module-header-control-size) !important;
    padding: 0 .68rem !important;
    font-size: .8rem !important;
  }

  .topbar-actions .module-period-select {
    height: var(--module-header-control-size) !important;
    min-height: var(--module-header-control-size) !important;
  }

  .topbar-actions .search,
  .topbar-actions .clientes-search,
  .topbar-actions .catalog-search {
    height: var(--module-header-control-size) !important;
    min-height: var(--module-header-control-size) !important;
  }

  .module-icon-button::after,
  .topbar-actions .module-icon-button::after,
  .mobile-menu-btn.module-icon-button::after {
    width: max(44px, 100%);
    height: max(44px, 100%);
  }
}

.agenda-top-actions .agenda-kpi-config.config-panel-btn.module-icon-button {
  flex: 0 0 var(--module-header-control-size) !important;
  width: var(--module-header-control-size) !important;
  min-width: var(--module-header-control-size) !important;
  max-width: var(--module-header-control-size) !important;
  height: var(--module-header-control-size) !important;
  min-height: var(--module-header-control-size) !important;
  max-height: var(--module-header-control-size) !important;
  border-radius: var(--module-header-radius) !important;
  padding: 0 !important;
}

@media (max-width: 1024px) {
  .main-panel-dashboard #dashKpiGrid .fin-kpi[data-kpi] .kpi-money-value,
  .fin-kpi-grid .fin-kpi[data-kpi] .kpi-money-value,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .kpi-money-value {
    box-sizing: border-box !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-self: center !important;
    width: calc(100% + 18px) !important;
    min-width: 0 !important;
    max-width: calc(100% + 18px) !important;
    margin-inline: -9px !important;
    margin-block: 0 !important;
    padding-inline: .08rem !important;
    color: #071126 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    font-size: clamp(1.18rem, 5vw, 1.45rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    font-variant-numeric: tabular-nums !important;
  }
}

@media (max-width: 370px) {
  .main-panel-dashboard #dashKpiGrid .fin-kpi[data-kpi] .kpi-money-value,
  .fin-kpi-grid .fin-kpi[data-kpi] .kpi-money-value,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .kpi-money-value {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    overflow: hidden !important;
    font-size: clamp(.9rem, 4.1vw, 1rem) !important;
  }
}

@media (max-width: 1024px) {
  .main-panel-dashboard #dashKpiGrid .fin-kpi[data-kpi] .kpi-money-value.is-fin-kpi-long,
  .fin-kpi-grid .fin-kpi[data-kpi] .kpi-money-value.is-fin-kpi-long,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .kpi-money-value.is-fin-kpi-long {
    font-size: clamp(1rem, 4.15vw, 1.2rem) !important;
  }

  .main-panel-dashboard #dashKpiGrid .fin-kpi[data-kpi] .kpi-money-value.is-fin-kpi-xl,
  .fin-kpi-grid .fin-kpi[data-kpi] .kpi-money-value.is-fin-kpi-xl,
  .main-panel-produtos .catalog-kpis .fin-kpi[data-kpi] .kpi-money-value.is-fin-kpi-xl {
    font-size: clamp(.84rem, 3.2vw, 1rem) !important;
  }
}

@media (max-width: 1024px) {
.main-panel-produtos .catalog-kpis .fin-kpi[data-kpi="mais_lucrativo"] .kpi-name-value {
    box-sizing: border-box !important;
    display: block !important;
    align-self: center !important;
    width: calc(100% + 18px) !important;
    min-width: 0 !important;
    max-width: calc(100% + 18px) !important;
    margin-inline: -9px !important;
    margin-block: 0 !important;
    padding-inline: .08rem !important;
    color: #071126 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: clamp(1.08rem, 4.5vw, 1.22rem) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
  }
}

@media (min-width: 1025px) {
  .fab,
  body > .fab[data-fab-portaled],
  .main-panel-clientes .fab,
  .main-panel-agenda .fab,
  .main-panel-financeiro .fab,
  .main-panel-produtos .fab {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}