/* PrintManager Pro — App Styles */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root {
  --teal: #1D9E75; --teal-d: #085041; --teal-l: #E1F5EE;
  --purple: #7F77DD; --purple-d: #3C3489; --purple-l: #EEEDFE;
  --amber: #BA7517; --amber-l: #FAEEDA;
  --red: #A32D2D; --red-l: #FCEBEB;
  --blue: #185FA5; --blue-l: #E6F1FB;
  --green: #3B6D11; --green-l: #EAF3DE;
  --gray: #5F5E5A; --gray-l: #F1EFE8; --gray-d: #2C2C2A;
  --text: #1a1a18; --muted: #888780; --border: #D3D1C7; --white: #ffffff;
  --sidebar-w: 230px; --sidebar-w-mini: 58px; --topbar-h: 56px;
}

body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
       background: var(--gray-l); color: var(--text); font-size: 14px; line-height: 1.5; }

.sidebar { position: fixed; top: 0; left: 0; width: var(--sidebar-w); height: 100vh;
           background: var(--teal-d); display: flex; flex-direction: column;
           z-index: 100; transition: width .25s cubic-bezier(.4,0,.2,1); overflow: hidden; }
.sidebar.mini { width: var(--sidebar-w-mini); }

.sidebar-logo { height: 56px; border-bottom: 1px solid rgba(255,255,255,.1);
                display: flex; align-items: center; flex-shrink: 0; overflow: hidden; position: relative; }
.sidebar-logo-mini { position: absolute; left: 0; top: 0; width: var(--sidebar-w-mini); height: 100%;
                     display: flex; align-items: center; justify-content: center;
                     opacity: 0; transition: opacity .2s; pointer-events: none; flex-shrink: 0; }
.sidebar.mini .sidebar-logo-mini { opacity: 1; }
.sidebar-logo-full { display: flex; align-items: center; gap: 10px; padding: 0 14px;
                     width: 100%; opacity: 1; transition: opacity .2s; white-space: nowrap; overflow: hidden; }
.sidebar.mini .sidebar-logo-full { opacity: 0; pointer-events: none; }
.sidebar-logo-icon { width: 32px; height: 32px; background: var(--teal); border-radius: 8px;
                     display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sidebar-brand-text { color: white; font-size: 15px; font-weight: 600;
                      overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.sidebar-nav { flex: 1; padding: 8px 6px; display: flex; flex-direction: column; gap: 2px;
               overflow-y: auto; overflow-x: hidden; }
.nav-link { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px;
            color: rgba(255,255,255,.72); text-decoration: none; font-size: 13.5px;
            transition: background .15s, color .15s; white-space: nowrap; overflow: hidden;
            position: relative; flex-shrink: 0; }
.nav-link svg { flex-shrink: 0; }
.nav-link:hover { background: rgba(255,255,255,.1); color: white; }
.nav-link.active { background: var(--teal); color: white; }
.nav-text { transition: opacity .2s, max-width .25s; max-width: 200px; overflow: hidden; }
.sidebar.mini .nav-text { opacity: 0; max-width: 0; }
.sidebar.mini .nav-link:hover::after { content: attr(title); position: fixed;
  left: calc(var(--sidebar-w-mini) + 10px); background: #1e293b; color: white;
  padding: 5px 12px; border-radius: 7px; font-size: 12.5px; font-weight: 500;
  white-space: nowrap; z-index: 9999; pointer-events: none; box-shadow: 0 4px 12px rgba(0,0,0,.25); }
.nav-divider { height: 1px; background: rgba(255,255,255,.12); margin: 5px 4px; flex-shrink: 0; }
.nav-update { background: rgba(255,200,0,.08); color: #FFD966 !important; }
.nav-version { margin-left: auto; font-size: 10px; opacity: .55; font-family: monospace; flex-shrink: 0; }

.sidebar-footer { border-top: 1px solid rgba(255,255,255,.1); overflow: hidden;
                  flex-shrink: 0; position: relative; height: 52px; }
.sidebar-footer-mini { position: absolute; inset: 0; display: flex; align-items: center;
                       justify-content: center; opacity: 0; transition: opacity .2s;
                       pointer-events: none; text-decoration: none; }
.sidebar.mini .sidebar-footer-mini { opacity: 1; pointer-events: auto; }
.sidebar-footer-full { position: absolute; inset: 0; display: flex; align-items: center;
                       gap: 6px; padding: 0 6px; opacity: 1; transition: opacity .2s; }
.sidebar.mini .sidebar-footer-full { opacity: 0; pointer-events: none; }
.user-chip { display: flex; align-items: center; gap: 8px; flex: 1; padding: 6px 8px;
             border-radius: 8px; text-decoration: none; transition: background .15s; overflow: hidden; min-width: 0; }
.user-chip:hover { background: rgba(255,255,255,.08); }
.avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--teal);
          display: flex; align-items: center; justify-content: center;
          font-size: 13px; font-weight: 700; color: white; flex-shrink: 0; }
.sidebar-footer-mini .avatar { width: 32px; height: 32px; }
.sidebar-footer-mini:hover .avatar { background: var(--teal-l); }
.user-info { overflow: hidden; }
.user-name { font-size: 13px; font-weight: 500; color: white; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-role { font-size: 11px; color: rgba(255,255,255,.5); text-transform: capitalize; }
.logout-btn { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px;
              border-radius: 6px; color: rgba(255,255,255,.45); text-decoration: none;
              transition: all .15s; flex-shrink: 0; }
.logout-btn:hover { background: rgba(255,255,255,.1); color: white; }

.main-wrap { margin-left: var(--sidebar-w); min-height: 100vh; display: flex; flex-direction: column; transition: margin-left .2s ease; }
.main-wrap.mini { margin-left: var(--sidebar-w-mini); }
.topbar { height: var(--topbar-h); background: var(--white); border-bottom: 1px solid var(--border);
          display: flex; align-items: center; padding: 0 20px; gap: 12px; position: sticky; top: 0; z-index: 50; }
.page-title { font-size: 16px; font-weight: 600; flex: 1; }
.topbar-right { display: flex; align-items: center; gap: 8px; }
.content { padding: 24px; flex: 1; }
.sidebar-toggle-btn { background: none; border: none; cursor: pointer; color: var(--muted);
  padding: 6px; border-radius: 6px; display: flex; align-items: center; transition: background .15s, color .15s; flex-shrink: 0; }
.sidebar-toggle-btn:hover { background: var(--gray-l); color: var(--text); }
.shortcuts-btn { display: flex; align-items: center; gap: 6px; background: none;
  border: 1.5px solid var(--border); cursor: pointer; color: var(--text);
  padding: 5px 12px; border-radius: 8px; font-size: 13px; font-weight: 500; transition: all .15s; }
.shortcuts-btn:hover { border-color: var(--teal); color: var(--teal); }

.shortcuts-panel { display: none; position: fixed; top: calc(var(--topbar-h) + 8px); right: 16px;
  width: 320px; background: white; border: 1px solid var(--border); border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,.12); z-index: 999; }
.shortcuts-panel.open { display: block; animation: dropIn .15s ease; }
@keyframes dropIn { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)} }
.shortcuts-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.shortcuts-header h3 { font-size: 13px; font-weight: 700; margin: 0; }
.shortcuts-section-title { padding: 10px 16px 4px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.shortcuts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 6px 12px 10px; }
.shortcut-item { display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 8px;
  text-decoration: none; color: var(--text); border: 1.5px solid var(--border);
  font-size: 13px; font-weight: 500; transition: all .15s; }
.shortcut-item:hover { border-color: var(--teal); color: var(--teal); background: var(--teal-l); }
.shortcut-icon { width: 28px; height: 28px; border-radius: 7px; background: var(--gray-l);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s; }
.shortcut-item:hover .shortcut-icon { background: var(--teal); }
.shortcut-item:hover .shortcut-icon svg { stroke: white; }
.shortcuts-divider { height: 1px; background: var(--border); margin: 0 12px; }

.btn { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px;
  border-radius: 8px; font-size: 13.5px; font-weight: 500; cursor: pointer;
  border: 1.5px solid transparent; text-decoration: none; transition: all .15s; }
.btn-primary { background: var(--teal); color: white; border-color: var(--teal); }
.btn-primary:hover { background: var(--teal-d); border-color: var(--teal-d); }
.btn-secondary { background: white; color: var(--text); border-color: var(--border); }
.btn-secondary:hover { border-color: var(--gray); }
.btn-danger { background: var(--red-l); color: var(--red); border-color: #F7C1C1; }
.btn-danger:hover { background: #F7C1C1; }
.btn-sm { padding: 5px 11px; font-size: 12.5px; }

.card { background: var(--white); border-radius: 10px; border: 1px solid var(--border); overflow: hidden; }
.card-header { padding: 14px 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
.card-header h2 { font-size: 15px; font-weight: 600; }
.card-body { padding: 20px; }

.stats-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-bottom: 24px; }
.stat-card { background: var(--white); border-radius: 10px; border: 1px solid var(--border); padding: 16px 18px; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 10px 14px; text-align: left; font-size: 12px; font-weight: 600; color: var(--muted);
     text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--border); white-space: nowrap; background: #FAFAF8; }
td { padding: 12px 14px; border-bottom: 1px solid #F1EFE8; vertical-align: middle; }
tr:last-child td { border-bottom: none; }
tr:hover td { background: #FAFAF8; }
.td-actions { display: flex; gap: 6px; }

.badge { display: inline-flex; align-items: center; padding: 3px 9px; border-radius: 20px; font-size: 11.5px; font-weight: 500; white-space: nowrap; }
.badge-teal { background: var(--teal-l); color: var(--teal-d); }
.badge-amber { background: var(--amber-l); color: var(--amber); }
.badge-blue { background: var(--blue-l); color: var(--blue); }
.badge-purple { background: var(--purple-l); color: var(--purple-d); }
.badge-green { background: var(--green-l); color: var(--green); }
.badge-red { background: var(--red-l); color: var(--red); }
.badge-gray { background: var(--gray-l); color: var(--gray); }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-grid.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
.form-full { grid-column: 1 / -1; }
.field { display: flex; flex-direction: column; gap: 5px; }
.field label { font-size: 13px; font-weight: 500; color: var(--text); }
.field label span { font-weight: 400; color: var(--muted); }
.field input, .field select, .field textarea { padding: 9px 12px; border: 1.5px solid var(--border);
  border-radius: 7px; font-size: 14px; color: var(--text); background: var(--white);
  outline: none; transition: border-color .15s; font-family: inherit; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--teal); }
.field textarea { resize: vertical; min-height: 80px; }
.field .hint { font-size: 11.5px; color: var(--muted); }
.field-error input, .field-error select { border-color: var(--red); }
.field-error .error-msg { font-size: 11.5px; color: var(--red); }
.form-actions { display: flex; gap: 10px; align-items: center; margin-top: 24px; }

.alert { padding: 12px 16px; border-radius: 8px; font-size: 13.5px; margin-bottom: 16px; display: flex; align-items: flex-start; gap: 10px; }
.alert button { margin-left: auto; background: none; border: none; font-size: 18px; cursor: pointer; color: inherit; opacity: .6; padding: 0 4px; }
.alert-success { background: var(--teal-l); color: var(--teal-d); border: 1px solid #9FE1CB; }
.alert-error { background: var(--red-l); color: var(--red); border: 1px solid #F7C1C1; }
.alert-warning { background: var(--amber-l); color: var(--amber); border: 1px solid #FAC775; }
.alert-info { background: var(--blue-l); color: var(--blue); border: 1px solid #B5D4F4; }

.kanban { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; align-items: start; }
.kanban-col { background: var(--gray-l); border-radius: 10px; padding: 12px; min-height: 200px; }
.kanban-col-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.kanban-col-title { font-size: 13px; font-weight: 600; }
.kanban-count { background: var(--white); border: 1px solid var(--border); border-radius: 20px; padding: 1px 8px; font-size: 11px; color: var(--muted); }
.kanban-card { background: var(--white); border: 1px solid var(--border); border-radius: 8px; padding: 12px; margin-bottom: 8px; cursor: pointer; transition: box-shadow .15s; }
.kanban-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.kanban-card-order { font-size: 11px; color: var(--muted); margin-bottom: 3px; }
.kanban-card-name { font-size: 13.5px; font-weight: 500; margin-bottom: 6px; }
.kanban-card-meta { font-size: 12px; color: var(--muted); display: flex; gap: 8px; flex-wrap: wrap; }

.pagination { display: flex; align-items: center; gap: 4px; padding: 16px 20px; border-top: 1px solid var(--border); }
.page-link { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 6px; border: 1px solid var(--border); font-size: 13px; text-decoration: none; color: var(--text); transition: all .15s; }
.page-link:hover { background: var(--gray-l); }
.page-link.active { background: var(--teal); color: white; border-color: var(--teal); }
.page-info { font-size: 12px; color: var(--muted); margin-left: auto; }

.empty-state { text-align: center; padding: 48px 20px; }
.empty-state p { font-size: 14px; color: var(--muted); margin-bottom: 16px; }

.filter-bar { display: flex; gap: 10px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.filter-bar input, .filter-bar select { padding: 7px 11px; border: 1.5px solid var(--border); border-radius: 7px; font-size: 13.5px; outline: none; background: var(--white); color: var(--text); }
.filter-bar input:focus, .filter-bar select:focus { border-color: var(--teal); }
.filter-bar input[type="search"] { min-width: 200px; }

.dash-bottom-grid { display: grid; grid-template-columns: 1fr 340px; gap: 16px; }

#save-bar { position: fixed; bottom: 0; left: var(--sidebar-w); right: 0; background: #1e293b;
  color: white; padding: 12px 24px; display: flex; align-items: center; gap: 12px;
  z-index: 200; transition: left .2s ease; }
#save-bar.mini { left: var(--sidebar-w-mini); }

@media (max-width: 768px) {
  .sidebar { transform: translateX(-100%); transition: transform .25s ease; width: var(--sidebar-w) !important; z-index: 200; }
  .sidebar.open { transform: translateX(0); box-shadow: 4px 0 24px rgba(0,0,0,.25); }
  .sidebar.mini { transform: translateX(-100%); }
  .main-wrap, .main-wrap.mini { margin-left: 0 !important; width: 100% !important; }
  .topbar { padding: 0 12px; }
  .topbar-right .btn span { display: none; }
  .shortcuts-btn span { display: none; }
  .content { padding: 12px; }
  .form-grid { grid-template-columns: 1fr; }
  .kanban { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pagination { flex-wrap: wrap; justify-content: center; }
  #shortcutsPanel { right: 8px; left: 8px; width: auto; }
  .nav-version { display: none; }
  .dash-bottom-grid { grid-template-columns: 1fr !important; }
  #save-bar { left: 0 !important; }
}
@media (max-width: 400px) {
  .stats-grid { grid-template-columns: 1fr !important; }
  .content { padding: 8px; }
}
undefined





/* ==============================================================
   SLAP YOUR BRAND — ELEGANCE PRO v4.0 COMPLETE
   #c08dbf (purple-rose) | #474f9d (indigo sidebar)
   Covers: Dashboard, Orders, Production, Clients, Invoices,
           Inventory, Settings, New Order form, all tables
   ============================================================== */

/* ── BODY ─────────────────────────────────────────────────────── */
body {
  font-family: 'Segoe UI',-apple-system,BlinkMacSystemFont,'Inter',Arial,sans-serif !important;
  background: #f0eef8 !important;
  color: #1c1b2e !important;
  -webkit-font-smoothing: antialiased !important;
}

/* ── SIDEBAR ──────────────────────────────────────────────────── */
.sidebar {
  background: linear-gradient(175deg, #474f9d 0%, #363c7a 55%, #252a58 100%) !important;
  box-shadow: 4px 0 24px rgba(35,41,85,0.28) !important;
  border-right: none !important;
}
.sidebar-logo {
  background: rgba(0,0,0,0.15) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
.nav-link {
  color: rgba(255,255,255,0.78) !important;
  border-radius: 8px !important;
  margin: 1px 8px !important;
  padding: 8px 11px !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  transition: all 0.2s ease !important;
}
.nav-link:hover {
  background: rgba(255,255,255,0.12) !important;
  color: #fff !important;
  transform: translateX(2px) !important;
}
.nav-link.active {
  background: rgba(255,255,255,0.17) !important;
  color: #fff !important;
  font-weight: 600 !important;
  box-shadow: inset 3px 0 0 rgba(255,255,255,0.75) !important;
}
.nav-link svg, .nav-link i { opacity: 0.75 !important; }
.nav-link.active svg, .nav-link.active i,
.nav-link:hover svg, .nav-link:hover i { opacity: 1 !important; }
.nav-divider { background: rgba(255,255,255,0.09) !important; margin: 5px 12px !important; }
.nav-update { background: rgba(255,210,0,0.09) !important; color: #ffe066 !important; }
.sidebar-footer { background: rgba(0,0,0,0.18) !important; border-top: 1px solid rgba(255,255,255,0.08) !important; }
.sidebar-footer-full { color: rgba(255,255,255,0.88) !important; }
.sidebar-footer-full span { color: rgba(255,255,255,0.88) !important; font-weight: 600 !important; }
.sidebar-footer-full small { color: rgba(255,255,255,0.48) !important; font-size: 11.5px !important; }

/* ── TOPBAR ───────────────────────────────────────────────────── */
.topbar {
  background: #fff !important;
  border-bottom: 1px solid rgba(71,79,157,0.09) !important;
  box-shadow: 0 1px 8px rgba(71,79,157,0.06) !important;
}
.topbar h1 {
  font-size: 18px !important; font-weight: 700 !important;
  color: #1c1b2e !important; letter-spacing: -0.4px !important;
}
.sidebar-toggle-btn { border-radius: 8px !important; transition: all 0.2s ease !important; }
.sidebar-toggle-btn:hover { background: #faf5fa !important; color: #9e6d9d !important; }

/* ── CARDS ────────────────────────────────────────────────────── */
.card {
  background: #ffffff !important;
  border: 1px solid rgba(192,141,191,0.18) !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 4px rgba(71,79,157,0.07) !important;
  transition: box-shadow 0.25s ease, transform 0.25s ease !important;
  overflow: hidden !important;
}
.card:hover {
  box-shadow: 0 4px 16px rgba(71,79,157,0.11), 0 1px 4px rgba(0,0,0,0.04) !important;
  transform: translateY(-2px) !important;
}
.card-header {
  background: linear-gradient(135deg, #f9f7fd 0%, #f3f1fa 100%) !important;
  border-bottom: 1px solid rgba(192,141,191,0.15) !important;
  padding: 15px 22px !important;
}
.card-header h2 {
  font-size: 14.5px !important; font-weight: 700 !important;
  color: #1c1b2e !important; letter-spacing: -0.2px !important;
}
.card-body { padding: 22px !important; }

/* ── STATS GRID (Dashboard) ───────────────────────────────────── */
.stats-grid { gap: 16px !important; }
.stats-grid .card {
  border-radius: 16px !important;
  border: 1px solid rgba(192,141,191,0.16) !important;
  box-shadow: 0 2px 8px rgba(71,79,157,0.07) !important;
  transition: all 0.25s ease !important;
  overflow: hidden !important;
  position: relative !important;
}
.stats-grid .card::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important; height: 3px !important;
  background: linear-gradient(90deg, #c08dbf 0%, #474f9d 100%) !important;
  opacity: 0.45 !important;
}
.stats-grid .card:hover {
  box-shadow: 0 6px 20px rgba(71,79,157,0.14) !important;
  transform: translateY(-3px) !important;
}

/* ── BUTTONS ──────────────────────────────────────────────────── */
.btn {
  font-weight: 600 !important; font-size: 13.5px !important;
  border-radius: 8px !important; transition: all 0.2s ease !important; cursor: pointer !important;
}
.btn-primary {
  background: linear-gradient(135deg, #c08dbf 0%, #9e6d9d 100%) !important;
  border: none !important; color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(192,141,191,0.4) !important; padding: 8px 18px !important;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #9e6d9d 0%, #7d4e7c 100%) !important;
  box-shadow: 0 4px 16px rgba(192,141,191,0.5) !important;
  transform: translateY(-1px) !important; color: #ffffff !important;
}
.btn-primary:active { transform: translateY(0) !important; }
.btn-secondary {
  background: #ffffff !important;
  border: 1.5px solid rgba(192,141,191,0.4) !important;
  color: #4a4869 !important; padding: 8px 18px !important;
}
.btn-secondary:hover { border-color: #c08dbf !important; color: #9e6d9d !important; background: #faf5fa !important; }
.btn-sm { padding: 5px 12px !important; font-size: 12.5px !important; border-radius: 7px !important; }

/* ── FORM INPUTS ──────────────────────────────────────────────── */
input[type=text], input[type=email], input[type=password],
input[type=number], input[type=tel], input[type=url], input[type=search],
input[type=date], input[type=datetime-local], input[type=time],
textarea, select {
  font-size: 13.5px !important;
  border: 1.5px solid #dbd7ec !important;
  border-radius: 8px !important;
  background: #fafafe !important;
  color: #1c1b2e !important;
  transition: all 0.2s ease !important;
  padding: 8px 12px !important;
  outline: none !important;
}
input[type=text]:focus, input[type=email]:focus, input[type=password]:focus,
input[type=number]:focus, input[type=tel]:focus, input[type=url]:focus,
input[type=search]:focus, input[type=date]:focus, input[type=datetime-local]:focus,
input[type=time]:focus, textarea:focus, select:focus {
  border-color: #c08dbf !important;
  box-shadow: 0 0 0 3px rgba(192,141,191,0.2) !important;
  background: #ffffff !important;
}
input::placeholder, textarea::placeholder { color: #8b89a8 !important; }
input[type=checkbox], input[type=radio] { accent-color: #c08dbf !important; }

/* ── ORDERS PAGE — Filter Tabs ────────────────────────────────── */
/* The filter bar has inline styles, we target its children using nth-child patterns */
.content > div:first-child {
  background: #ffffff !important;
  border: 1px solid rgba(192,141,191,0.2) !important;
  border-radius: 12px !important;
  padding: 5px !important;
  gap: 2px !important;
  box-shadow: 0 1px 4px rgba(71,79,157,0.06) !important;
}
/* Active tab pill */
.content > div:first-child a[style*="background:#f3f4f6"],
.content > div:first-child a[style*="background: rgb(243"] {
  background: linear-gradient(135deg, #c08dbf 0%, #9e6d9d 100%) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(192,141,191,0.35) !important;
}
/* Inactive tabs */
.content > div:first-child a {
  border-radius: 8px !important;
  transition: all 0.18s ease !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 7px 14px !important;
  color: #5a5a7a !important;
}
.content > div:first-child a:hover {
  background: rgba(192,141,191,0.12) !important;
  color: #9e6d9d !important;
}

/* ── TABLES ───────────────────────────────────────────────────── */
.table-wrap {
  border-radius: 12px !important;
  overflow: hidden !important;
}
table { border-collapse: collapse !important; width: 100% !important; }
thead { background: linear-gradient(135deg, #f6f4fc 0%, #f0edf9 100%) !important; }
th {
  padding: 11px 14px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: #8b89a8 !important;
  border-bottom: 1.5px solid rgba(192,141,191,0.2) !important;
  white-space: nowrap !important;
  background: transparent !important;
}
td {
  padding: 12px 14px !important;
  font-size: 13.5px !important;
  color: #1c1b2e !important;
  border-bottom: 1px solid rgba(192,141,191,0.08) !important;
  transition: background 0.15s !important;
}
tbody tr:hover td { background: #faf5fa !important; }
tbody tr:last-child td { border-bottom: none !important; }

/* ── STATUS BADGES ────────────────────────────────────────────── */
.badge, .status-badge,
[class*=badge], [class*=status-pill], [class*=status-tag] {
  font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: 0.04em !important; border-radius: 20px !important;
  padding: 3px 10px !important;
}

/* ── ALERTS ───────────────────────────────────────────────────── */
.alert { border-radius: 8px !important; font-size: 13.5px !important; font-weight: 500 !important; padding: 12px 18px !important; }
.alert-success { background: #edfaf5 !important; color: #0a5e42 !important; border-color: #a3e6cc !important; }
.alert-error   { background: #fdf0f0 !important; color: #8b2020 !important; border-color: #f5b8b8 !important; }
.alert-warning { background: #fdf6e3 !important; color: #7a4d10 !important; border-color: #f5d78e !important; }
.alert-info    { background: #eef0fb !important; color: #363c7a !important; border-color: #b8c4f0 !important; }

/* ── PRODUCTION KANBAN ────────────────────────────────────────── */
.kanban { gap: 16px !important; }
.kanban-col {
  border-radius: 14px !important;
  border: 1px solid rgba(192,141,191,0.15) !important;
  box-shadow: 0 1px 4px rgba(71,79,157,0.06) !important;
  overflow: hidden !important;
}
/* Override inline background colors with more elegant versions */
.kanban-col:nth-child(1) .kanban-col-header { background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%) !important; }
.kanban-col:nth-child(2) .kanban-col-header { background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%) !important; }
.kanban-col:nth-child(3) .kanban-col-header { background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%) !important; }
.kanban-col:nth-child(4) .kanban-col-header { background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%) !important; }
.kanban-col-header {
  padding: 13px 16px !important;
  border-bottom: 1.5px solid rgba(192,141,191,0.12) !important;
}
.kanban-col-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
}
.kanban-count {
  font-size: 11px !important; font-weight: 700 !important;
  padding: 2px 9px !important; border-radius: 20px !important;
  background: rgba(255,255,255,0.7) !important;
  border: 1px solid rgba(192,141,191,0.2) !important;
}
.kanban-body { padding: 10px !important; gap: 8px !important; min-height: 80px !important; background: #faf9fd !important; }
.kanban-card {
  background: #ffffff !important;
  border: 1px solid rgba(192,141,191,0.18) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 3px rgba(71,79,157,0.06) !important;
}
.kanban-card:hover {
  box-shadow: 0 4px 16px rgba(71,79,157,0.12) !important;
  transform: translateY(-2px) !important;
  border-color: rgba(192,141,191,0.4) !important;
}
.kanban-empty {
  color: #b0aec8 !important;
  font-size: 13px !important;
  font-style: italic !important;
  text-align: center !important;
  padding: 20px !important;
}

/* ── ORDER FORM (ocard) ───────────────────────────────────────── */
.ocard {
  background: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid rgba(192,141,191,0.18) !important;
  box-shadow: 0 1px 4px rgba(71,79,157,0.07) !important;
  margin-bottom: 16px !important;
  transition: box-shadow 0.2s ease !important;
  overflow: hidden !important;
}
.ocard:hover { box-shadow: 0 4px 14px rgba(71,79,157,0.10) !important; }
.ocard-head {
  background: linear-gradient(135deg, #f9f7fd 0%, #f3f1fa 100%) !important;
  border-bottom: 1px solid rgba(192,141,191,0.15) !important;
  padding: 13px 18px !important;
}
.ocard-head h3 {
  font-size: 14px !important; font-weight: 700 !important;
  color: #1c1b2e !important; margin: 0 !important;
}
.ocard-body { padding: 18px !important; }

/* Order form items table */
.items-tbl th {
  background: linear-gradient(135deg, #f6f4fc 0%, #f0edf9 100%) !important;
  color: #8b89a8 !important;
  font-size: 10.5px !important; font-weight: 700 !important;
  letter-spacing: 0.07em !important; text-transform: uppercase !important;
  border-bottom: 2px solid rgba(192,141,191,0.2) !important;
  padding: 9px 8px !important;
}
.items-tbl td {
  padding: 6px 4px !important;
  border-bottom: 1px solid rgba(192,141,191,0.08) !important;
}
.items-tbl tbody tr:hover td { background: #faf5fa !important; }

/* Inline form inputs inside order table */
.ci {
  border: 1.5px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  transition: all 0.15s ease !important;
  font-size: 13px !important;
}
.ci:hover { border-color: rgba(192,141,191,0.35) !important; background: #fafafe !important; }
.ci:focus { border-color: #c08dbf !important; background: #fff !important; box-shadow: 0 0 0 3px rgba(192,141,191,0.15) !important; outline: none !important; }

/* Tech pills */
.tech-pill {
  border-radius: 10px !important;
  border: 2px solid rgba(192,141,191,0.3) !important;
  background: #fafafe !important;
  color: #4a4869 !important;
  font-size: 12.5px !important; font-weight: 500 !important;
  transition: all 0.18s ease !important;
  padding: 7px 13px !important;
}
.tech-pill:hover { border-color: #c08dbf !important; background: #f5edf5 !important; color: #9e6d9d !important; }
.tech-pill.on { border-color: #c08dbf !important; background: #f5edf5 !important; color: #9e6d9d !important; font-weight: 600 !important; }

/* Gen invoice box */
.gen-inv-box {
  border: 2px dashed rgba(192,141,191,0.4) !important;
  border-radius: 12px !important;
  transition: all 0.2s ease !important;
  background: #fafafe !important;
}
.gen-inv-box:hover { border-color: #c08dbf !important; background: #f5edf5 !important; }
.gen-inv-box.on { border-color: #c08dbf !important; background: #f5edf5 !important; border-style: solid !important; }

/* Add line button */
.add-line {
  background: transparent !important;
  border: 1.5px dashed rgba(192,141,191,0.4) !important;
  color: #9e6d9d !important;
  border-radius: 8px !important;
  font-size: 13px !important; font-weight: 600 !important;
  transition: all 0.18s ease !important;
  padding: 7px 14px !important;
}
.add-line:hover { background: #f5edf5 !important; border-color: #c08dbf !important; border-style: solid !important; }

/* ── MODALS ───────────────────────────────────────────────────── */
.modal-overlay { backdrop-filter: blur(4px) !important; background: rgba(28,27,46,0.52) !important; }
.modal-box, .modal-content {
  border-radius: 16px !important;
  box-shadow: 0 16px 48px rgba(71,79,157,0.18) !important;
  border: 1px solid rgba(192,141,191,0.18) !important;
}
.modal-header {
  border-bottom: 1px solid rgba(192,141,191,0.15) !important;
  background: linear-gradient(135deg, #f9f7fd 0%, #f3f1fa 100%) !important;
  border-radius: 16px 16px 0 0 !important;
}

/* ── AVATAR ───────────────────────────────────────────────────── */
.avatar {
  background: linear-gradient(135deg, #c08dbf 0%, #9e6d9d 100%) !important;
  color: #ffffff !important; font-weight: 700 !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 8px rgba(192,141,191,0.35) !important;
}

/* ── SHORTCUTS ────────────────────────────────────────────────── */
.shortcuts-btn {
  border-radius: 8px !important;
  border-color: rgba(192,141,191,0.35) !important;
  font-size: 13px !important; transition: all 0.2s ease !important;
}
.shortcuts-btn:hover { border-color: #c08dbf !important; color: #9e6d9d !important; background: #faf5fa !important; }
.shortcuts-panel {
  border-radius: 14px !important;
  box-shadow: 0 8px 32px rgba(71,79,157,0.15) !important;
  border: 1px solid rgba(192,141,191,0.18) !important;
}

/* ── SCROLLBAR ────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(192,141,191,0.3); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(192,141,191,0.55); }
::-webkit-scrollbar-corner { background: transparent; }

/* ── SELECTION & FOCUS ────────────────────────────────────────── */
::selection { background: rgba(192,141,191,0.28); color: #1c1b2e; }
*:focus-visible { outline: 2px solid #c08dbf !important; outline-offset: 2px !important; }

/* ── LINKS ────────────────────────────────────────────────────── */
a { transition: color 0.15s ease !important; }

/* ── INVENTORY STAT CARDS ─────────────────────────────────────── */
/* Inventory page uses inline-styled stat cards */
.content > .stats-grid + div .card,
.content > div > .card[style*="padding"] {
  border-radius: 14px !important;
  border: 1px solid rgba(192,141,191,0.16) !important;
  box-shadow: 0 2px 8px rgba(71,79,157,0.07) !important;
}

/* ── FILE INPUT & DROP ZONES ──────────────────────────────────── */
input[type=file] {
  border: 1.5px dashed rgba(192,141,191,0.45) !important;
  background: #faf5fa !important;
  border-radius: 8px !important; padding: 8px 12px !important;
}

/* ── PRINT SAFE ───────────────────────────────────────────────── */
@media print {
  .sidebar { box-shadow: none !important; background: #474f9d !important; }
  .card { box-shadow: none !important; border: 1px solid #ddd !important; }
}

/* ══════════════════ END ELEGANCE PRO v4.0 ══════════════════════ */


/* ================================================================
   SALES SYSTEM — CRM, Pipeline & Reports Styles v5.0
================================================================ */

.crm-hero{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:20px;background:linear-gradient(135deg,#474f9d 0%,#363c7a 50%,#c08dbf 100%);border-radius:16px;padding:28px 32px;margin-bottom:24px;color:#fff;box-shadow:0 8px 32px rgba(71,79,157,.25)}
.crm-hero-left{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.crm-avatar-xl{width:72px;height:72px;border-radius:50%;background:rgba(255,255,255,.25);color:#fff;font-size:26px;font-weight:700;display:flex;align-items:center;justify-content:center;letter-spacing:-1px;flex-shrink:0;border:3px solid rgba(255,255,255,.35)}
.crm-hero .page-title{color:#fff!important;margin:0 0 4px}
.crm-company-sub{font-size:15px;opacity:.85;margin-bottom:10px}
.crm-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.crm-chip{background:rgba(255,255,255,.18);color:#fff;font-size:12px;padding:4px 12px;border-radius:20px;text-decoration:none;transition:background .2s;white-space:nowrap}
.crm-chip:hover{background:rgba(255,255,255,.28)}
.crm-chip-wa{background:rgba(37,211,102,.3)}
.crm-hero-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-start}
.crm-hero .btn{border-color:rgba(255,255,255,.4)}
.crm-hero .btn-primary{background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.5);color:#fff}
.crm-hero .btn-primary:hover{background:rgba(255,255,255,.35)}
.crm-hero .btn-outline{background:transparent;border:1.5px solid rgba(255,255,255,.4);color:#fff}
.crm-hero .btn-ghost{background:transparent;color:rgba(255,255,255,.8);border:none}

.crm-kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;margin-bottom:0}
.crm-kpi-card{background:#fff;border-radius:14px;padding:18px 20px;display:flex;align-items:center;gap:14px;box-shadow:0 2px 12px rgba(71,79,157,.08);border:1px solid rgba(71,79,157,.08)}
.crm-kpi-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.crm-kpi-label{font-size:12px;color:#888;font-weight:500;margin-bottom:4px}
.crm-kpi-val{font-size:20px;font-weight:700;color:#1a1a2e;line-height:1}
.crm-kpi-sm{font-size:15px}

.crm-tabs-bar{display:flex;gap:0;border-bottom:none;margin-top:24px;background:#fff;border-radius:14px 14px 0 0;padding:8px 8px 0;box-shadow:0 2px 12px rgba(71,79,157,.08);border:1px solid rgba(71,79,157,.1);border-bottom:none;overflow-x:auto}
.crm-tab{background:none;border:none;outline:none;padding:12px 20px;cursor:pointer;font-size:14px;font-weight:500;color:#777;border-radius:10px 10px 0 0;transition:color .2s,background .2s;white-space:nowrap}
.crm-tab:hover{color:#474f9d;background:#f0eef8}
.crm-tab.active{color:#474f9d;background:#f0eef8;font-weight:600}
.tab-count{display:inline-flex;align-items:center;justify-content:center;background:#474f9d;color:#fff;border-radius:12px;font-size:11px;font-weight:700;min-width:20px;height:20px;padding:0 6px;margin-left:6px}
.crm-tab-pane{display:none}
.crm-tab-pane.active{display:block}

.crm-note-form-wrap{background:#f8f7ff;border:1.5px solid rgba(71,79,157,.15);border-radius:12px;padding:20px;margin:16px 20px}
.crm-hidden{display:none!important}
.crm-note-row1{display:flex;gap:10px;flex-wrap:wrap}
.crm-timeline{padding:8px 0}
.crm-timeline-empty{text-align:center;padding:50px 20px;color:#888}
.crm-timeline-empty h3{font-size:16px;color:#555;margin-bottom:8px}
.crm-tl-item{display:flex;align-items:flex-start;gap:14px;padding:16px 20px;border-bottom:1px solid rgba(0,0,0,.05);transition:background .15s}
.crm-tl-item:hover{background:#fafafe}
.crm-tl-item:last-child{border-bottom:none}
.crm-tl-dot{width:12px;height:12px;border-radius:50%;background:#474f9d;flex-shrink:0;margin-top:5px}
.crm-tl-dot-call{background:#42a5f5}
.crm-tl-dot-email{background:#66bb6a}
.crm-tl-dot-meeting{background:#ffa726}
.crm-tl-dot-followup{background:#f06292}
.crm-tl-dot-quote{background:#c08dbf}
.crm-tl-dot-sale{background:#66bb6a}
.crm-tl-body{flex:1;min-width:0}
.crm-tl-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.crm-tl-type{font-weight:600;color:#474f9d;font-size:13px}
.crm-tl-subject{font-weight:600;color:#1a1a2e}
.crm-tl-time{font-size:12px;color:#999;margin-left:auto}
.crm-tl-content{font-size:14px;color:#555;line-height:1.6;background:#f8f7ff;border-radius:8px;padding:10px 14px}

.crm-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:0}
@media(max-width:768px){.crm-info-grid{grid-template-columns:1fr}}
.crm-info-row{display:flex;align-items:flex-start;padding:12px 20px;border-bottom:1px solid rgba(0,0,0,.05);gap:16px}
.crm-info-row:last-child{border-bottom:none}
.crm-info-lbl{font-size:13px;color:#888;font-weight:500;min-width:130px;flex-shrink:0}
.crm-info-val{font-size:14px;color:#333;flex:1}
.crm-info-val a{color:#474f9d;text-decoration:none}
.crm-info-val a:hover{text-decoration:underline}

.pipeline-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:28px}
.pip-kpi{background:#fff;border-radius:14px;padding:20px 22px;text-align:center;box-shadow:0 2px 12px rgba(71,79,157,.08);border:1px solid rgba(71,79,157,.08)}
.pip-kpi-won{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border-color:#86efac}
.pip-kpi-val{font-size:24px;font-weight:800;color:#1a1a2e;margin-bottom:4px}
.pip-kpi-lbl{font-size:12px;color:#888;font-weight:500}
.pip-board{display:flex;gap:16px;overflow-x:auto;padding-bottom:16px;min-height:500px;align-items:flex-start}
.pip-col{flex:0 0 260px;background:#f5f5f8;border-radius:14px;display:flex;flex-direction:column;min-height:400px}
.pip-col-header{border-radius:14px 14px 0 0;padding:14px 16px;display:flex;align-items:center;gap:8px}
.pip-col-title{font-weight:700;color:#fff;font-size:14px;flex:1}
.pip-col-count{background:rgba(255,255,255,.3);color:#fff;font-size:12px;font-weight:700;border-radius:12px;padding:2px 8px;min-width:24px;text-align:center}
.pip-col-val{font-size:11px;color:rgba(255,255,255,.85)}
.pip-col-body{flex:1;padding:12px;display:flex;flex-direction:column;gap:10px;min-height:100px}
.pip-col-empty{text-align:center;color:#bbb;font-size:13px;padding:20px}
.pip-col-add{background:none;border:none;color:#888;font-size:13px;padding:10px;cursor:pointer;text-align:center;border-top:1px solid rgba(0,0,0,.06);border-radius:0 0 14px 14px;transition:color .2s,background .2s}
.pip-col-add:hover{color:#474f9d;background:rgba(71,79,157,.05)}
.pip-card{background:#fff;border-radius:10px;padding:14px 16px;box-shadow:0 2px 8px rgba(0,0,0,.06);border:1px solid rgba(0,0,0,.06);cursor:pointer;transition:transform .15s,box-shadow .15s}
.pip-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(71,79,157,.15)}
.pip-card-title{font-weight:600;font-size:14px;color:#1a1a2e;margin-bottom:8px}
.pip-card-client{display:flex;align-items:center;gap:6px;font-size:13px;color:#666;margin-bottom:6px}
.pip-card-avatar{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#474f9d,#c08dbf);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pip-card-value{font-size:15px;font-weight:700;color:#474f9d;margin-bottom:6px}
.pip-card-notes{font-size:12px;color:#888;line-height:1.4;margin-bottom:8px}
.pip-card-footer{display:flex;justify-content:flex-end}
.pip-card-time{font-size:11px;color:#bbb}

.reports-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:28px}
.rep-kpi-card{background:#fff;border-radius:16px;padding:22px 24px;box-shadow:0 2px 16px rgba(71,79,157,.08);border:1px solid rgba(71,79,157,.08)}
.rep-kpi-revenue{border-left:4px solid #474f9d}
.rep-kpi-orders{border-left:4px solid #42a5f5}
.rep-kpi-avg{border-left:4px solid #c08dbf}
.rep-kpi-clients{border-left:4px solid #66bb6a}
.rep-kpi-pending{border-left:4px solid #ffa726}
.rep-kpi-header{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.rep-kpi-icon{font-size:20px}
.rep-kpi-label{font-size:12px;color:#888;font-weight:500}
.rep-kpi-val{font-size:26px;font-weight:800;color:#1a1a2e;line-height:1;margin-bottom:6px}
.rep-kpi-delta{font-size:12px;font-weight:600}
.delta-pos{color:#4caf50}
.delta-neg{color:#f44336}
.rep-kpi-sub{font-size:12px;color:#888;margin-top:4px}
.rep-kpi-overdue{color:#f44336!important;font-weight:600}
.reports-charts-row{display:grid;grid-template-columns:2fr 1fr;gap:20px;margin-bottom:20px}
@media(max-width:900px){.reports-charts-row{grid-template-columns:1fr}}
.rep-bar-chart{display:flex;align-items:flex-end;gap:3px;height:140px;padding:0 8px 20px;position:relative}
.rep-bar-wrap{display:flex;flex-direction:column;align-items:center;flex:1;height:100%;justify-content:flex-end}
.rep-bar{width:100%;min-height:3px;background:linear-gradient(180deg,#c08dbf,#474f9d);border-radius:4px 4px 0 0;transition:height .3s}
.rep-bar-lbl{font-size:10px;color:#bbb;margin-top:4px}
.rep-status-list{padding:8px 20px}
.rep-status-row{display:flex;align-items:center;gap:10px;padding:8px 0}
.rep-status-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.rep-status-lbl{font-size:13px;color:#555;min-width:90px}
.rep-status-bar-wrap{flex:1;height:8px;background:#f0eef8;border-radius:4px;overflow:hidden}
.rep-status-bar{height:100%;border-radius:4px;transition:width .5s ease}
.rep-status-cnt{font-size:13px;font-weight:600;color:#333;min-width:28px;text-align:right}
.reports-bottom-row{display:grid;grid-template-columns:3fr 2fr;gap:20px;margin-bottom:20px}
@media(max-width:900px){.reports-bottom-row{grid-template-columns:1fr}}
.rep-rank{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;font-size:12px;font-weight:700;background:#f0eef8;color:#474f9d}
.rep-rank-1{background:linear-gradient(135deg,#ffd700,#ff8c00);color:#fff}
.rep-rank-2{background:linear-gradient(135deg,#c0c0c0,#808080);color:#fff}
.rep-rank-3{background:linear-gradient(135deg,#cd7f32,#8b4513);color:#fff}
.rep-followup-list{padding:8px 0}
.rep-followup-item{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid rgba(0,0,0,.05)}
.rep-followup-item:last-child{border-bottom:none}
.rep-fu-dot{width:10px;height:10px;border-radius:50%;background:#c08dbf;flex-shrink:0}
.rep-fu-date{font-size:13px;color:#888;white-space:nowrap}
.rep-fu-today{color:#f44336!important;font-weight:700}

.page-header-row{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:24px}
.page-subtitle{font-size:14px;color:#888;margin:4px 0 0}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.modal-overlay{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:20px}
.modal-box{background:#fff;border-radius:16px;width:100%;max-width:560px;box-shadow:0 24px 80px rgba(0,0,0,.2);max-height:90vh;overflow-y:auto}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 16px;border-bottom:1px solid rgba(0,0,0,.08)}
.modal-head h3{font-size:18px;font-weight:700;margin:0}
.modal-close{background:none;border:none;font-size:22px;cursor:pointer;color:#888;line-height:1;padding:4px 8px;border-radius:6px}
.modal-close:hover{background:#f0eef8;color:#474f9d}
.modal-body{padding:20px 24px}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;padding-top:20px;border-top:1px solid rgba(0,0,0,.08)}
.btn-danger{background:#ef5350;color:#fff;border:none}
.btn-danger:hover{background:#c62828}
.font-mono{font-family:'Courier New',monospace;font-size:13px}
.font-bold{font-weight:700}
.text-muted{color:#888}
.text-center{text-align:center}
.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.btn-xs{padding:4px 10px;font-size:12px}
.btn-block{width:100%}
.tbl-link{color:#474f9d;text-decoration:none;font-weight:600}
.tbl-link:hover{text-decoration:underline}
.tbl-client-name a{color:#333;font-weight:600;text-decoration:none}
.tbl-client-name a:hover{color:#474f9d}
.tbl-empty{text-align:center;color:#888;padding:32px;font-size:14px}
.tbl-empty a{color:#474f9d}

/* ===== SALES SYSTEM v6.0 - BUG FIXES + SPANISH UI ===== */
/* Filter row */
.filter-row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }

/* Pipeline KPIs */
.pipeline-kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px; margin-bottom:24px; }
.pip-kpi { background:#fff; border-radius:12px; padding:18px 20px; box-shadow:0 1px 4px rgba(0,0,0,.07); text-align:center; border-top:3px solid #c08dbf; }
.pip-kpi-green { border-top-color:#10b981; }
.pip-kpi-red { border-top-color:#ef4444; }
.pip-kpi-val { font-size:1.7rem; font-weight:700; color:#474f9d; }
.pip-kpi-lbl { font-size:.75rem; color:#6b7280; margin-top:4px; text-transform:uppercase; letter-spacing:.04em; }

/* Pipeline board */
.pip-board { display:flex; gap:16px; overflow-x:auto; padding-bottom:16px; min-height:500px; }
.pip-col { min-width:240px; flex:1; background:#f3f4f6; border-radius:12px; display:flex; flex-direction:column; }
.pip-col-header { padding:12px 14px; border-radius:12px 12px 0 0; display:flex; justify-content:space-between; align-items:center; color:#fff; }
.pip-col-title { font-weight:600; font-size:.9rem; }
.pip-col-count { background:rgba(255,255,255,.3); border-radius:99px; padding:2px 10px; font-size:.8rem; font-weight:700; }
.pip-col-body { flex:1; padding:10px; display:flex; flex-direction:column; gap:10px; min-height:200px; }
.pip-card { background:#fff; border-radius:10px; padding:14px; box-shadow:0 1px 4px rgba(0,0,0,.08); cursor:grab; border-left:3px solid #c08dbf; transition:transform .15s,box-shadow .15s; }
.pip-card:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,.12); }
.pip-card-title { font-weight:600; font-size:.9rem; color:#1e293b; margin-bottom:4px; }
.pip-card-client { font-size:.8rem; color:#6b7280; margin-bottom:4px; }
.pip-card-value { font-size:.85rem; font-weight:700; color:#10b981; margin-bottom:4px; }
.pip-card-date { font-size:.75rem; color:#9ca3af; }

/* Reports */
.reports-kpi-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px; margin-bottom:24px; }
.rep-kpi-card { background:#fff; border-radius:12px; padding:16px; box-shadow:0 1px 4px rgba(0,0,0,.07); display:flex; align-items:center; gap:14px; border-left:4px solid #c08dbf; }
.rep-purple { border-left-color:#c08dbf; }
.rep-green { border-left-color:#10b981; }
.rep-blue { border-left-color:#3b82f6; }
.rep-amber { border-left-color:#f59e0b; }
.rep-teal { border-left-color:#06b6d4; }
.rep-red { border-left-color:#ef4444; }
.rep-kpi-icon { font-size:1.6rem; }
.rep-kpi-val { font-size:1.4rem; font-weight:700; color:#474f9d; }
.rep-kpi-lbl { font-size:.75rem; color:#6b7280; text-transform:uppercase; letter-spacing:.04em; }

.reports-charts-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.reports-bottom-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media(max-width:768px){ .reports-charts-row,.reports-bottom-row{ grid-template-columns:1fr; } }

.rep-bar-chart { padding:10px 0; }
.rep-bar-row { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.rep-bar-label { width:110px; font-size:.8rem; color:#374151; flex-shrink:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rep-bar-wrap { flex:1; background:#e5e7eb; border-radius:4px; height:14px; overflow:hidden; }
.rep-bar { height:100%; background:#c08dbf; border-radius:4px; transition:width .4s; min-width:4px; }
.rep-bar-green { background:#10b981; }
.rep-bar-num { width:60px; font-size:.8rem; color:#6b7280; text-align:right; flex-shrink:0; }

.rep-rank { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:#e5e7eb; font-size:.75rem; font-weight:700; }
.rep-rank-1 { background:#f59e0b; color:#fff; }
.rep-rank-2 { background:#9ca3af; color:#fff; }
.rep-rank-3 { background:#b45309; color:#fff; }

/* CRM */
.crm-hero { background:#fff; border-radius:16px; padding:24px; box-shadow:0 1px 4px rgba(0,0,0,.08); margin-bottom:20px; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:20px; }
.crm-hero-left { display:flex; align-items:flex-start; gap:20px; }
.crm-avatar-xl { width:72px; height:72px; border-radius:50%; background:linear-gradient(135deg,#c08dbf,#474f9d); color:#fff; font-size:1.6rem; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.crm-name { font-size:1.5rem; font-weight:700; color:#1e293b; margin:0 0 4px; }
.crm-company-sub { font-size:.95rem; color:#6b7280; margin-bottom:10px; }
.crm-chips { display:flex; flex-wrap:wrap; gap:8px; }
.crm-chip { padding:4px 12px; border-radius:99px; background:#f3f4f6; font-size:.8rem; color:#374151; text-decoration:none; border:1px solid #e5e7eb; }
.crm-chip:hover { background:#ede9fe; border-color:#c08dbf; }
.crm-kpi-strip { display:flex; gap:20px; flex-wrap:wrap; }
.crm-kpi-card { display:flex; align-items:center; gap:12px; background:#f9fafb; border-radius:10px; padding:12px 18px; border:1px solid #e5e7eb; }
.crm-kpi-icon { font-size:1.4rem; }
.crm-kpi-val { font-size:1.3rem; font-weight:700; color:#474f9d; }
.crm-kpi-lbl { font-size:.75rem; color:#6b7280; }

.crm-tabs-bar { display:flex; gap:4px; border-bottom:2px solid #e5e7eb; margin-bottom:20px; overflow-x:auto; }
.crm-tab { padding:10px 18px; border:none; background:none; cursor:pointer; font-size:.9rem; color:#6b7280; border-bottom:2px solid transparent; margin-bottom:-2px; white-space:nowrap; display:flex; align-items:center; gap:6px; transition:color .2s; }
.crm-tab.active,.crm-tab:hover { color:#474f9d; border-bottom-color:#474f9d; }
.tab-count { background:#e5e7eb; color:#374151; border-radius:99px; padding:1px 8px; font-size:.75rem; font-weight:600; }
.crm-tab.active .tab-count { background:#474f9d; color:#fff; }

.crm-tab-pane { display:none; }
.crm-tab-pane.active { display:block; }

.crm-note-form-wrap { background:#fff; border-radius:12px; padding:20px; box-shadow:0 1px 4px rgba(0,0,0,.07); margin-bottom:20px; }
.crm-timeline { display:flex; flex-direction:column; gap:0; }
.crm-tl-item { display:flex; gap:16px; padding:0 0 20px; }
.crm-tl-dot { width:14px; height:14px; border-radius:50%; background:#c08dbf; flex-shrink:0; margin-top:4px; position:relative; }
.crm-tl-dot::after { content:''; position:absolute; left:50%; top:14px; width:2px; bottom:-20px; background:#e5e7eb; transform:translateX(-50%); }
.crm-tl-item:last-child .crm-tl-dot::after { display:none; }
.crm-tl-dot-call { background:#3b82f6; }
.crm-tl-dot-email { background:#8b5cf6; }
.crm-tl-dot-meeting { background:#10b981; }
.crm-tl-dot-followup { background:#f59e0b; }
.crm-tl-dot-quote { background:#06b6d4; }
.crm-tl-dot-sale { background:#10b981; }
.crm-tl-body { flex:1; background:#fff; border-radius:10px; padding:14px; box-shadow:0 1px 4px rgba(0,0,0,.06); border:1px solid #e5e7eb; }
.crm-tl-header { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.crm-tl-type { font-weight:600; font-size:.85rem; color:#474f9d; }
.crm-tl-subject { font-size:.85rem; color:#374151; }
.crm-tl-time { font-size:.75rem; color:#9ca3af; margin-left:auto; }
.crm-tl-content { font-size:.875rem; color:#374151; line-height:1.6; white-space:pre-wrap; }

/* Info rows */
.info-row { display:flex; gap:16px; padding:10px 0; border-bottom:1px solid #f3f4f6; align-items:center; }
.info-row:last-child { border-bottom:none; }
.info-label { width:120px; font-size:.8rem; color:#6b7280; text-transform:uppercase; letter-spacing:.04em; flex-shrink:0; }
.info-val { font-size:.9rem; color:#1e293b; }

/* Modal */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1000; display:flex; align-items:center; justify-content:center; }
.modal-box { background:#fff; border-radius:16px; padding:28px; max-width:560px; width:90%; box-shadow:0 8px 32px rgba(0,0,0,.2); }
.modal-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.modal-head span { font-size:1.1rem; font-weight:700; color:#1e293b; }
.modal-close { background:none; border:none; font-size:1.4rem; cursor:pointer; color:#9ca3af; }
.modal-close:hover { color:#374151; }
.modal-form { display:flex; flex-direction:column; gap:16px; }
.modal-footer { display:flex; gap:10px; justify-content:flex-end; padding-top:4px; }

/* Misc fixes */
.badge-amber { background:#fef3c7; color:#b45309; border-radius:99px; padding:2px 10px; font-size:.75rem; }
.page-header-row { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:24px; flex-wrap:wrap; gap:12px; }
.page-title { font-size:1.6rem; font-weight:700; color:#1e293b; margin:0 0 4px; }
.page-sub { font-size:.9rem; color:#6b7280; margin:0; }
.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:600px){ .form-row-2{ grid-template-columns:1fr; } }
.btn-xs { padding:4px 10px; font-size:.78rem; }
.btn-block { width:100%; }
.tbl-link { font-weight:600; color:#474f9d; text-decoration:none; }
.tbl-link:hover { text-decoration:underline; }
.tbl-empty { text-align:center; padding:20px; color:#9ca3af; font-style:italic; }
.font-bold { font-weight:700; }
.text-muted { color:#6b7280; }
.table-wrap { overflow-x:auto; }

/* ===== CRM PRO v7.0 ===== */
/* Page Header */
.crm-page-header{margin-bottom:0}
.crm-back{margin-bottom:12px}
.btn-back{display:inline-flex;align-items:center;gap:6px;color:#474f9d;font-size:.85rem;text-decoration:none;font-weight:500}
.btn-back:hover{text-decoration:underline}

/* Hero Card */
.crm-hero-card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 2px 8px rgba(0,0,0,.08);margin-bottom:20px;border-left:4px solid #c08dbf}
.crm-hero-main{display:flex;align-items:flex-start;gap:20px;margin-bottom:18px;flex-wrap:wrap}
.crm-avatar-wrap{position:relative;flex-shrink:0}
.crm-avatar-xl{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#c08dbf,#474f9d);color:#fff;font-size:1.6rem;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(71,79,157,.3)}
.crm-status-dot{position:absolute;bottom:2px;right:2px;padding:2px 8px;border-radius:99px;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.crm-status-active{background:#d1fae5;color:#065f46;border:2px solid #fff}
.crm-hero-info{flex:1;min-width:0}
.crm-client-name{font-size:1.6rem;font-weight:800;color:#1e293b;margin:0 0 4px;line-height:1.2}
.crm-client-company{font-size:.95rem;color:#6b7280;margin-bottom:12px;font-weight:500}
.crm-contact-chips{display:flex;flex-wrap:wrap;gap:8px}
.crm-chip{padding:5px 12px;border-radius:8px;font-size:.8rem;font-weight:500;text-decoration:none;border:1.5px solid #e5e7eb;background:#f9fafb;color:#374151;display:inline-flex;align-items:center;gap:5px;transition:all .15s}
.crm-chip:hover{background:#ede9fe;border-color:#c08dbf;color:#474f9d}
.crm-chip-email{border-color:#dbeafe;background:#eff6ff;color:#1d4ed8}
.crm-chip-phone{border-color:#d1fae5;background:#f0fdf4;color:#065f46}
.crm-chip-wa{border-color:#d1fae5;background:#f0fdf4;color:#065f46}

/* KPI Strip */
.crm-kpi-strip{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.crm-kpi-pill{display:flex;align-items:center;gap:8px;background:#f9fafb;border-radius:10px;padding:10px 16px;border-left:3px solid #c08dbf;flex:1;min-width:100px}
.crm-kpi-ico{font-size:1.2rem;flex-shrink:0}
.crm-kpi-num{font-size:1.1rem;font-weight:800;color:#1e293b}
.crm-kpi-lbl{font-size:.72rem;color:#6b7280;text-transform:uppercase;letter-spacing:.04em;flex:1}

/* Quick Actions */
.crm-quick-actions{display:flex;gap:10px;flex-wrap:wrap}

/* Main Layout */
.crm-main-layout{display:grid;grid-template-columns:1fr 1.4fr;gap:20px;align-items:start}
@media(max-width:900px){.crm-main-layout{grid-template-columns:1fr}}
.crm-col-left,.crm-col-right{display:flex;flex-direction:column;gap:16px}

/* Section */
.crm-section{background:#fff;border-radius:14px;padding:20px;box-shadow:0 1px 4px rgba(0,0,0,.07)}
.crm-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:10px}
.crm-section-head span{font-weight:700;font-size:1rem;color:#1e293b}
.crm-empty{text-align:center;padding:20px 10px;color:#9ca3af;font-size:.875rem;line-height:1.8}
.badge-danger{background:#fef2f2;color:#dc2626;border-radius:99px;padding:2px 10px;font-size:.75rem;font-weight:700}

/* Followup list */
.crm-followup-item{display:flex;gap:10px;padding:12px;border-radius:10px;border:1.5px solid #e5e7eb;margin-bottom:8px;align-items:flex-start;transition:border-color .15s}
.crm-followup-item:hover{border-color:#c08dbf}
.fu-done{opacity:.5;background:#f9fafb}
.fu-overdue{border-color:#fca5a5!important;background:#fff8f8}
.fu-icon{font-size:1.3rem;flex-shrink:0;margin-top:1px}
.fu-body{flex:1;min-width:0}
.fu-title{font-weight:600;font-size:.9rem;color:#1e293b;margin-bottom:4px}
.fu-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:.78rem;color:#6b7280;margin-bottom:4px}
.fu-overdue-badge{color:#dc2626;font-weight:700;background:#fef2f2;padding:1px 8px;border-radius:99px}
.fu-recurrence{color:#8b5cf6;font-size:.75rem;font-weight:600}
.fu-notes{font-size:.8rem;color:#6b7280;background:#f9fafb;padding:6px 10px;border-radius:6px;margin-top:4px}
.fu-actions{display:flex;flex-direction:column;gap:4px;flex-shrink:0}

/* Needs */
.crm-need-item{border-radius:10px;border:1.5px solid #e5e7eb;padding:14px;margin-bottom:8px;position:relative;transition:border-color .15s}
.crm-need-item:hover{border-color:#c08dbf}
.need-high{border-left:3px solid #ef4444}
.need-medium{border-left:3px solid #f59e0b}
.need-low{border-left:3px solid #10b981}
.need-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;gap:8px}
.need-name{font-weight:700;font-size:.95rem;color:#1e293b;flex:1}
.need-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.need-cat{background:#ede9fe;color:#5b21b6;border-radius:6px;padding:2px 8px;font-size:.73rem;font-weight:600}
.need-status{border-radius:6px;padding:2px 8px;font-size:.73rem;font-weight:600}
.need-status-active{background:#d1fae5;color:#065f46}
.need-status-quoted{background:#fef3c7;color:#92400e}
.need-status-ordered{background:#dbeafe;color:#1e40af}
.need-status-inactive{background:#f3f4f6;color:#6b7280}
.need-prio{font-size:.9rem}
.need-details p{font-size:.85rem;color:#374151;margin:0 0 6px}
.need-meta{display:flex;gap:12px;font-size:.78rem;color:#6b7280;margin-bottom:4px}
.need-notes{font-size:.78rem;color:#6b7280;font-style:italic;margin:4px 0 0}
.need-actions{position:absolute;top:10px;right:10px;display:flex;gap:4px;opacity:0;transition:opacity .15s}
.crm-need-item:hover .need-actions{opacity:1}

/* Info grid */
.crm-info-grid{display:flex;flex-direction:column;gap:0}
.crm-info-row{display:flex;gap:12px;padding:8px 0;border-bottom:1px solid #f3f4f6;align-items:baseline}
.crm-info-row:last-child{border-bottom:none}
.crm-info-label{width:110px;font-size:.75rem;color:#9ca3af;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0}
.crm-info-val{font-size:.875rem;color:#374151;font-weight:500}

/* Quick Note Form */
.crm-quick-note-form{background:#f9fafb;border-radius:12px;padding:16px;border:1.5px solid #e5e7eb;margin-bottom:16px}
.qn-type-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.qn-type-btn{display:flex;align-items:center;gap:4px;cursor:pointer;padding:5px 10px;border-radius:8px;background:#fff;border:1.5px solid #e5e7eb;font-size:.78rem;font-weight:500;color:#374151;transition:all .15s;white-space:nowrap}
.qn-type-btn:has(input:checked){background:#ede9fe;border-color:#c08dbf;color:#474f9d}
.qn-type-btn input{display:none}
.qn-subject{margin-bottom:8px;font-size:.85rem}
.qn-content{margin-bottom:10px;font-size:.875rem;resize:vertical}
.qn-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.qn-followup{display:flex;align-items:center;gap:8px;font-size:.8rem;color:#6b7280}
.qn-followup label{font-weight:500;white-space:nowrap}

/* Timeline */
.crm-tl-item{display:flex;gap:14px;padding:0 0 16px;position:relative}
.crm-tl-dot{width:12px;height:12px;border-radius:50%;background:#c08dbf;flex-shrink:0;margin-top:5px;position:relative;z-index:1}
.crm-tl-dot::after{content:'';position:absolute;left:5px;top:12px;width:2px;bottom:-16px;background:#e5e7eb;transform:translateX(-50%)}
.crm-tl-item:last-child .crm-tl-dot::after{display:none}
.crm-tl-dot-call{background:#3b82f6}
.crm-tl-dot-email{background:#8b5cf6}
.crm-tl-dot-meeting{background:#10b981}
.crm-tl-dot-followup{background:#f59e0b}
.crm-tl-dot-quote{background:#06b6d4}
.crm-tl-dot-sale{background:#22c55e}
.crm-tl-card{flex:1;background:#fff;border-radius:10px;border:1.5px solid #e5e7eb;padding:12px 14px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.crm-tl-card-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.crm-tl-type-badge{font-size:.78rem;font-weight:700;padding:2px 8px;border-radius:6px;background:#f3f4f6;color:#374151;white-space:nowrap}
.crm-tl-type-call .crm-tl-type-badge,.crm-tl-type-call{background:#dbeafe!important;color:#1d4ed8!important}
.crm-tl-type-sale .crm-tl-type-badge{background:#dcfce7!important;color:#15803d!important}
.crm-tl-type-quote .crm-tl-type-badge{background:#cffafe!important;color:#0e7490!important}
.crm-tl-subj{font-size:.85rem;font-weight:600;color:#374151;flex:1}
.crm-tl-time{font-size:.72rem;color:#9ca3af;margin-left:auto;white-space:nowrap}
.crm-tl-content{font-size:.875rem;color:#374151;line-height:1.6;white-space:pre-wrap;margin-bottom:6px}
.crm-tl-followup{font-size:.78rem;color:#f59e0b;background:#fef3c7;padding:3px 10px;border-radius:6px;display:inline-block;margin-top:4px}
.crm-tl-user{font-size:.73rem;color:#9ca3af;margin-top:4px}

/* CRM Modals */
.crm-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px}
.crm-modal{background:#fff;border-radius:16px;padding:0;max-width:560px;width:100%;box-shadow:0 12px 40px rgba(0,0,0,.2);max-height:90vh;overflow-y:auto}
.crm-modal-head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 16px;border-bottom:1px solid #f3f4f6;position:sticky;top:0;background:#fff;z-index:1}
.crm-modal-head span{font-size:1.05rem;font-weight:700;color:#1e293b}
.crm-modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#9ca3af;line-height:1;padding:0 4px}
.crm-modal-close:hover{color:#374151}
.crm-modal-body{padding:20px 24px}
.crm-modal-foot{padding:16px 24px 20px;border-top:1px solid #f3f4f6;display:flex;gap:10px;justify-content:flex-end;position:sticky;bottom:0;background:#fff}

/* Dashboard reminder widget */
.dash-reminders-widget{background:#fff;border-radius:14px;padding:20px;box-shadow:0 1px 4px rgba(0,0,0,.07);border-top:3px solid #f59e0b}
.dash-reminders-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #f9fafb}
.dash-reminders-item:last-child{border-bottom:none}
.dash-ri-icon{font-size:1.1rem;flex-shrink:0}
.dash-ri-body{flex:1;min-width:0}
.dash-ri-title{font-size:.85rem;font-weight:600;color:#1e293b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-ri-client{font-size:.75rem;color:#6b7280}
.dash-ri-date{font-size:.73rem;font-weight:700;color:#f59e0b;flex-shrink:0}
.dash-ri-overdue .dash-ri-date{color:#dc2626}

/* Misc */
.btn-success{background:#10b981;color:#fff;border:none}
.btn-success:hover{background:#059669}
.btn-ghost{background:transparent;border:1.5px solid #e5e7eb;color:#374151}
.btn-ghost:hover{background:#f3f4f6}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.form-row-2{grid-template-columns:1fr}}