/* Softkita Marketing UI v1.2 */
:root{
  --sk-ink:#1b2a41;
  --sk-muted:#5f7187;
  --sk-line:#d9e2ef;
  --sk-surface:#ffffff;
  --sk-soft:#f5f7fb;
}

/* Global header profile dropdown fix */
.user-menu{position:relative}
.user-menu summary{border-radius:16px;padding:8px 10px;transition:background .18s ease}
.user-menu summary:hover,.user-menu[open] summary{background:rgba(255,255,255,.08)}
.user-dropdown{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  width:210px;
  background:#fff !important;
  border:1px solid #dce5f0 !important;
  box-shadow:0 18px 40px rgba(15,23,42,.16);
  border-radius:16px;
  padding:8px;
  z-index:80;
}
.user-dropdown a{
  display:block;
  padding:12px 14px;
  border-radius:12px;
  color:#18212f !important;
  font-weight:700;
  font-size:14px;
  line-height:1.35;
  text-decoration:none;
}
.user-dropdown a:hover{background:#f4f7fb;color:#111827 !important}

/* Marketing page */
.marketing-title-row h1{font-size:clamp(32px,2.4vw,40px);line-height:1.08;color:var(--sk-ink);font-weight:800}
.marketing-title-row p{font-size:18px;line-height:1.55;color:var(--sk-muted)}
.marketing-summary{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:16px;
  margin-bottom:22px;
}
.marketing-summary--solid .m-kpi{
  border-radius:22px;
  padding:18px 18px 16px;
  color:#fff;
  box-shadow:0 10px 28px rgba(15,23,42,.12);
  min-height:124px;
  position:relative;
  overflow:hidden;
}
.marketing-summary--solid .m-kpi:before{
  content:'';
  position:absolute;
  right:-16px;
  bottom:-22px;
  width:96px;
  height:96px;
  border-radius:28px;
  background:rgba(255,255,255,.12);
  transform:rotate(18deg);
}
.marketing-summary--solid .m-kpi small,
.marketing-summary--solid .m-kpi strong,
.marketing-summary--solid .m-kpi span{position:relative;z-index:1;display:block;color:#fff !important}
.marketing-summary--solid .m-kpi small{font-size:14px;font-weight:700;opacity:.95;letter-spacing:.01em}
.marketing-summary--solid .m-kpi strong{font-size:46px;line-height:1.04;margin:12px 0 8px;font-weight:800}
.marketing-summary--solid .m-kpi span{font-size:13px;opacity:.92}
.m-kpi--blue{background:#1d4ed8}
.m-kpi--green{background:#15803d}
.m-kpi--purple{background:#6d28d9}
.m-kpi--teal{background:#0f766e}
.m-kpi--orange{background:#c2410c}
.m-kpi--red{background:#be123c}

.marketing-shell{
  display:grid;
  grid-template-columns:minmax(340px,420px) minmax(0,1fr);
  gap:18px;
  align-items:start;
}
.marketing-card{
  background:var(--sk-surface);
  border:1px solid var(--sk-line);
  border-radius:24px;
  padding:22px;
  box-shadow:0 6px 24px rgba(15,23,42,.06);
}
.marketing-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.marketing-card-head h3{margin:0 0 6px;font-size:28px;line-height:1.1;color:var(--sk-ink);font-weight:800}
.marketing-card-head p{margin:0;color:var(--sk-muted);font-size:15px;line-height:1.6}

.m-form{display:grid;gap:12px}
.m-form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.m-form label{font-size:14px;font-weight:800;color:var(--sk-ink);margin:0 0 8px}
.m-form input,.m-form textarea,.m-form select{
  border:1px solid #d4deea;
  border-radius:14px;
  padding:13px 14px;
  min-height:50px;
  color:#17212f;
  background:#fff;
  font-size:15px;
  box-shadow:none;
}
.m-form textarea{min-height:112px}
.m-form input::placeholder,.m-form textarea::placeholder{color:#8a98aa}
.m-form input:focus,.m-form textarea:focus,.m-form select:focus{border-color:#335eea;box-shadow:0 0 0 4px rgba(51,94,234,.10);outline:none}
.m-optional{font-weight:600;color:#7d8da0}
.marketing-form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:6px}
.marketing-form-actions .btn{min-width:160px}
.m-note{font-size:13px;color:#66788f;line-height:1.5}

.marketing-table-wrap{overflow:auto;border:1px solid #e4ebf4;border-radius:18px;background:#fbfcfe}
.marketing-table{width:100%;border-collapse:separate;border-spacing:0;min-width:860px;background:#fff}
.marketing-table thead th{
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.03em;
  color:#6a7d93;
  background:#f7f9fc;
  padding:16px;
  border-bottom:1px solid #e4ebf4;
}
.marketing-table tbody td{
  padding:16px;
  border-bottom:1px solid #edf2f7;
  color:#1d2b3d;
  vertical-align:top;
  font-size:15px;
  line-height:1.5;
}
.marketing-table tbody tr:last-child td{border-bottom:0}
.marketing-table b{display:block;color:#162335;font-size:16px;font-weight:800}
.marketing-table small{display:block;margin-top:4px;color:#6a7d93;font-size:13px;line-height:1.5}
.marketing-empty{text-align:center;color:#6a7d93;padding:28px 18px !important}
.m-score{display:inline-flex;align-items:center;justify-content:center;min-width:54px;padding:8px 12px;border-radius:14px;background:#111827;color:#fff;font-size:18px;font-weight:800}
.m-status{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.m-status--qualified{background:#dcfce7;color:#166534}
.m-status--scheduled{background:#ede9fe;color:#5b21b6}
.m-status--waiting_reply{background:#ccfbf1;color:#115e59}
.m-status--interested{background:#ffedd5;color:#9a3412}
.m-status--deal{background:#ffe4e6;color:#9f1239}
.m-status--new,.m-status--pending,.m-status--follow_up{background:#e5eefb;color:#1d4ed8}
.m-status--closed_lost{background:#fee2e2;color:#991b1b}

.marketing-policy-card{margin-top:18px}
.marketing-policy-grid{max-width:820px}

@media (max-width:1400px){
  .marketing-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1100px){
  .marketing-shell{grid-template-columns:1fr}
  .marketing-policy-grid{max-width:none}
}
@media (max-width:760px){
  .marketing-title-row h1{font-size:28px}
  .marketing-title-row p{font-size:15px}
  .marketing-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .marketing-card{padding:16px;border-radius:18px}
  .marketing-card-head h3{font-size:22px}
  .m-form .row{grid-template-columns:1fr}
  .marketing-summary--solid .m-kpi{min-height:112px;padding:16px}
  .marketing-summary--solid .m-kpi strong{font-size:36px}
  .marketing-table{min-width:720px}
}
@media (max-width:520px){
  .marketing-summary{grid-template-columns:1fr}
  .marketing-form-actions{align-items:stretch;flex-direction:column}
  .marketing-form-actions .btn{width:100%}
}