/* ONE Send — emerald, teal and jewel-tone accents. */
/* WhatsApp glyph: Bootstrap Icons (MIT), see bootstrap-icons-LICENSE.txt. */
.icon.icon-wa { fill:currentColor;stroke:none; }
.tint .icon.icon-wa { width:24px;height:24px; }
.connection-title .tint .icon.icon-wa { width:25px;height:25px; }
.badge .icon.icon-wa { width:14px;height:14px; }
:root {
  --green:#087454;
  --green-deep:#064c3c;
  --green-soft:#e2f5ec;
  --lime:#d6ffa7;
  --ink:#173b34;
  --muted:#607b72;
  --line:#dfeae4;
  --bg:#edf5f1;
  --shadow:0 12px 36px #164d3210;
  --radius:22px;
}
body {
  background:radial-gradient(ellipse at 90% 0,#d7efec 0,transparent 45%),
    radial-gradient(ellipse at 30% 30%,#e4ecd9 0,transparent 45%),#f1f6f3;
}
.sidebar {
  background:radial-gradient(ellipse at 0 0,#17654f 0,transparent 52%),linear-gradient(165deg,#103f35,#092c28);
  color:#f0fff7;border-right:0;box-shadow:8px 0 32px #143c2510;
}
.sidebar .brand img { box-shadow:0 5px 18px #0002;border-radius:12px; }
.sidebar .brand strong { color:#fff;letter-spacing:-.7px; }
.sidebar .brand small { color:#b0d6c5;font-size:8px;letter-spacing:1.4px; }
.sidebar .workspace {
  background:linear-gradient(120deg,#ffffff12,#ffffff07);border-color:#ffffff20;
  box-shadow:inset 0 1px #ffffff0a;
}
.sidebar .workspace-avatar { background:linear-gradient(135deg,#dbfda5,#95e4c5);color:#184e36; }
.sidebar .workspace small,.sidebar .user-box small { color:#accbbc; }
.sidebar .nav-label { color:#94bca9;font-size:9px;letter-spacing:1.6px; }
.sidebar .nav-link { color:#d0e7dc;border:1px solid transparent;border-radius:12px; }
.sidebar .nav-link>.icon { color:#94d9bc; }
.sidebar .nav-link[href="#inbox"]>.icon,.sidebar .nav-link[href="#campaigns"]>.icon { color:#93d8e8; }
.sidebar .nav-link[href="#templates"]>.icon { color:#ccb8ee; }
.sidebar .nav-link[href="#reports"]>.icon { color:#eed59d; }
.sidebar .nav-link:hover { color:#fff;background:#ffffff0c;border-color:#ffffff0c; }
.sidebar .nav-link.active {
  color:#fff;background:linear-gradient(110deg,#178356,#096c63);border-color:#91edb938;
  box-shadow:0 6px 18px #001f241f,inset 0 1px #ffffff14;
}
.sidebar .nav-link.active>.icon { color:#dcffb3; }
.sidebar .nav-link.active::after { background:#d6ffa7;box-shadow:0 0 9px #d6ffa755; }
.sidebar .side-callout { background:linear-gradient(125deg,#c8eea0,#98dbc2);color:#123f32;box-shadow:0 6px 20px #001e231a; }
.sidebar .side-callout p { color:#365e4b; }
.sidebar .side-callout .link,.sidebar .side-callout>.icon { color:#075c40; }
.sidebar .user-box { border-color:#ffffff20; }
.sidebar .user-box button { color:#c4e3d4; }
.sidebar-scroll { scrollbar-color:#618e7855 transparent; }
.topbar {
  background:linear-gradient(100deg,#ffffffee,#e9f6f1dd);border-bottom-color:#cfe3d9;
}
.breadcrumb { color:#6b877c; }.breadcrumb strong { color:#235746;font-weight:600; }
.top-status { background:#e2f3e8;border:1px solid #c8e8d4;padding:8px 11px;border-radius:30px;color:#367254; }
.top-status .dot { background:#12865b;box-shadow:0 0 0 4px #12865b10; }
.topbar .date { color:#607e6d; }
.page-heading h1 { color:#164638;font-weight:750;letter-spacing:-1.1px; }
.page-heading p { color:#607b70; }
.hero {
  background:radial-gradient(ellipse at 76% 18%,#50bd9b40,transparent 52%),
    linear-gradient(115deg,#063f34 0%,#086754 58%,#176d80 100%);
  border:1px solid #72c7a344;box-shadow:0 14px 34px #07594222,inset 0 1px #ffffff18;
  min-height:226px;padding:34px 36px;
}
.hero::before { border-color:#b6ecd42b;box-shadow:0 0 0 35px #b6ecd405,0 0 0 70px #b6ecd405; }
.hero::after { border-color:#b6ecd41c; }
.hero h2 { font-size:31px;font-weight:650;letter-spacing:-1px; }
.hero .eyebrow { color:#d7f9ba;letter-spacing:1.5px; }
.hero p { color:#e6f7ed; }
.orbit { border-color:#bcffe057;background:#b1f2df0a; }
.orbit::before { border-color:#b4edd757; }
.orbit .main-icon { background:linear-gradient(145deg,#e8ffb9,#a4ebbf);box-shadow:0 14px 36px #001e3033,inset 0 1px #fff8; }
.floating-pill { background:linear-gradient(130deg,#fff,#e8f9f2);border:1px solid #fff8;color:#185840;box-shadow:0 9px 22px #00272126; }
.card { background:linear-gradient(145deg,#fff,#fcfefc);border-color:#dce9e1;box-shadow:0 6px 24px #1d51350a; }
.card-title h2 { color:#234d3d; }
.stats-grid>.stat { overflow:hidden;border:1px solid #dce7df;color:var(--ink);box-shadow:0 5px 17px #204d4209;padding:22px; }
.stats-grid>.stat:nth-child(4n+1) { --stat-accent:#286d54;background:linear-gradient(125deg,#f4faf5,#e2f1e8); }
.stats-grid>.stat:nth-child(4n+2) { --stat-accent:#376780;background:linear-gradient(125deg,#f4f9fc,#e3eff3); }
.stats-grid>.stat:nth-child(4n+3) { --stat-accent:#71578d;background:linear-gradient(125deg,#faf7fc,#eee7f5); }
.stats-grid>.stat:nth-child(4n+4) { --stat-accent:#826633;background:linear-gradient(125deg,#fcfaf4,#f4ecd9); }
.stats-grid>.stat::after {
  content:"";position:absolute;width:130px;height:130px;border-radius:50%;
  right:-55px;bottom:-70px;border:20px solid var(--stat-accent);opacity:.045;pointer-events:none;
}
.stat .stat-label { color:#4f655b;font-size:11px;font-weight:550; }
.stat .stat-number { color:var(--stat-accent);font-size:33px;letter-spacing:-1px; }
.stat .stat-foot,.stat .stat-foot b { color:#56665c;line-height:1.6; }
.stats-grid .stat .tint { background:#ffffffa6;color:var(--stat-accent);box-shadow:0 3px 9px #36564606;border:1px solid #ffffffc9; }
.tint { background:linear-gradient(135deg,#08805d,#086b59);color:#fff;box-shadow:0 5px 12px #06704b20; }
.tint.blue { background:linear-gradient(135deg,#3364a5,#08758a);color:#fff; }
.tint.purple { background:linear-gradient(135deg,#7554a6,#64449b);color:#fff; }
.tint.orange { background:linear-gradient(135deg,#af571d,#966211);color:#fff; }
.tint.red { background:linear-gradient(135deg,#b94e63,#b0443e);color:#fff; }
.btn { border-radius:12px; }
.btn.primary,.btn.primary:hover {
  background:linear-gradient(110deg,#087444,#087b70);border-color:#0a785b;color:#fff;
  box-shadow:0 6px 16px #07684d26,inset 0 1px #ffffff25;
}
.btn.primary:hover { box-shadow:0 8px 21px #07684d35; }
.btn.lime,.btn.lime:hover { background:linear-gradient(115deg,#e4ffb4,#b6efb5);color:#16472e;border-color:#d4f7b4;box-shadow:0 6px 18px #001b2826; }
.btn.soft { background:linear-gradient(115deg,#e1f4df,#dff4ee);color:#196748;border-color:#c6e4d4; }
.icon-btn { color:#31755a;background:linear-gradient(130deg,#fff,#eef7f1);border-color:#d6e8dc; }
.avatar { background:linear-gradient(135deg,#d7efad,#b7e7cf);color:#375c31;box-shadow:inset 0 0 0 1px #88ba7833; }
.avatar.blue { background:linear-gradient(135deg,#d9e5ff,#bfe7eb);color:#32627e; }
.avatar.purple { background:linear-gradient(135deg,#e7ddfa,#eeddf1);color:#75528c; }
.badge.green { color:#146143;background:linear-gradient(110deg,#dcf2d8,#d9f3e8); }
.badge.blue { color:#315f91;background:linear-gradient(110deg,#dfe9fc,#d6f1f3); }
.badge.purple { color:#724e97;background:linear-gradient(110deg,#ece1fa,#f4e3f3); }
.badge.orange { color:#8e5716;background:linear-gradient(110deg,#fff0d3,#f9e5ce); }
.badge.red { color:#a13d45;background:linear-gradient(110deg,#fce4eb,#ffe6dc); }
.tag { background:#eaf3e2;color:#526d37; }
.table-card>.toolbar { background:linear-gradient(105deg,#f1f8eb,#edf8f6);padding-bottom:18px;margin-bottom:0;border-bottom:1px solid var(--line); }
th { background:#edf5f0;color:#557363; }
td .sub,.list-row small,.activity small { color:#71877a; }
.chart-bar { background:linear-gradient(0deg,#08795a,#42b28b); }
.chart-bar.sms { background:linear-gradient(0deg,#3a7fa3,#8ec9db); }
.legend .dot { background:#16865f; }.legend .sms { background:#629fbd; }
.chart-day span,.chart-summary small,.channel-card small { color:#718777; }
.setup-note { background:linear-gradient(120deg,#eff6dc,#e3f5ed);border:1px solid #d9e9cf; }
.setup-note p { color:#526f4f; }.setup-note .icon { color:#46733e; }
.tabs { background:#e0ece4;border:1px solid #d5e4da; }
.tab { color:#536e60; }
.tab.active { background:linear-gradient(115deg,#14724f,#146b65);color:#fff;box-shadow:0 4px 10px #124d3320; }
.template-card .template-body { background:linear-gradient(140deg,#f0f6e9,#eaf7f2);color:#526d5e; }
.group-card { border-top:3px solid #56a57d; }
.group-card:nth-child(3n+2) { border-top-color:#548cbb; }.group-card:nth-child(3n+3) { border-top-color:#9775b1; }
.step-number,.help-step::before { background:linear-gradient(135deg,#177b53,#087568);color:#fff;box-shadow:0 4px 10px #126c4320; }
.channel-option:has(input:checked) { background:linear-gradient(120deg,#e8f6e2,#dff5ec);border-color:#4d9d76;box-shadow:0 3px 12px #1983470c; }
.transfer-drop { background:radial-gradient(ellipse at top,#dfefcf,transparent),linear-gradient(120deg,#eff9ed,#e3f5f0);border-color:#8ebba0; }
.transfer-drop>span,.field-note,label small { color:#667f70; }
.transfer-counts>div { background:linear-gradient(140deg,#f1f8e9,#e6f4ee); }
.transfer-counts>div:nth-child(2) { background:linear-gradient(140deg,#edf3fe,#e2f3f5); }
.transfer-counts>div:nth-child(3) { background:linear-gradient(140deg,#fff5df,#f7e9d8); }
.transfer-counts>div:nth-child(4) { background:linear-gradient(140deg,#fff0f1,#fae8df); }
.stat-strip .mini-stat { border:1px solid #dfeadd;background:linear-gradient(135deg,#f0f7e7,#e3f3eb); }
.stat-strip .mini-stat:nth-child(2n) { background:linear-gradient(135deg,#edf3fd,#e4f3f1); }
.modal { border:1px solid #d1e8da;box-shadow:0 28px 90px #052e3555; }
.modal-header { background:linear-gradient(115deg,#e5f2d8,#dff3ed);border-radius:22px 22px 0 0;border-bottom-color:#c8e0d1; }
.modal-header h2 { color:#20553d; }
.toast { background:linear-gradient(110deg,#14583e,#115f5b);border:1px solid #68ae854a; }
.toast.error { background:linear-gradient(110deg,#8f3449,#9c4434); }
.conversation.active { background:linear-gradient(110deg,#e7f4de,#dff4eb); }
.chat-messages { background:radial-gradient(ellipse at top right,#e5f0de,transparent),#f2f8f4; }
.chat-bubble.out { background:linear-gradient(130deg,#e5f5cf,#d7f0e0);border-color:#c5dfc0; }
.bulk-bar { background:linear-gradient(110deg,#124e38,#126764);box-shadow:0 8px 24px #123e3126; }
.login-story { background:radial-gradient(ellipse at 0 0,#3a9f7455,transparent 60%),linear-gradient(145deg,#064637,#0c6d63); }
.login-form-area { background:radial-gradient(ellipse at 100% 0,#e4f3e2,transparent 60%),#fcfefc; }
.login-story p,.login-story-foot { color:#c0dfd0; }
.demo-banner { background:linear-gradient(100deg,#fdf0cf,#f9edda);color:#7c612c;border-bottom:1px solid #ecdcb6; }
.app-footer,.creative-credit { color:#657f70; }
.creative-credit { gap:7px;font-weight:300;letter-spacing:1.3px; }
.creative-name { font-weight:300; }
.creative-mark { width:18px;height:18px;display:inline-grid;place-items:center;flex-shrink:0;perspective:120px; }
.creative-mark img { display:block;width:18px;height:18px;transform-origin:center; }
.creative-credit:hover,.creative-credit:focus-visible { color:#806e34; }
@media(prefers-reduced-motion:no-preference) {
  .creative-mark img { transition:filter 200ms ease,transform 200ms ease; }
  .creative-credit:focus-visible .creative-mark img { animation:creative-turn 800ms cubic-bezier(.22,.7,.3,1); }
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .creative-credit:hover .creative-mark img { animation:creative-turn 800ms cubic-bezier(.22,.7,.3,1);filter:drop-shadow(1px 2px 2px #78673430); }
}
@keyframes creative-turn {
  0% { transform:rotateX(0) rotateY(0) translateZ(0); }
  40% { transform:rotateX(16deg) rotateY(150deg) translateZ(3px); }
  75% { transform:rotateX(-8deg) rotateY(300deg) translateZ(2px); }
  100% { transform:rotateX(0) rotateY(360deg) translateZ(0); }
}
@media(hover:hover) and (pointer:fine) {
  tbody tr:hover,.contact-card:hover { background:#f0f8f2; }
  .stats-grid>.stat:hover { border-color:#c6d8cd;box-shadow:0 8px 21px #183f3810; }
}
@media(max-width:1000px) {
  .stats-grid>.stat { padding:17px; }.stat .stat-number { font-size:29px; }
  .hero h2 { font-size:27px; }.hero { padding:28px; }
}
@media(max-width:760px) {
  body { background:radial-gradient(ellipse at top right,#d9efdf,transparent 65%),#f0f6f3; }
  .topbar { background:linear-gradient(110deg,#104c39,#095c56);border-bottom-color:#27755c;color:#fff;box-shadow:0 5px 18px #194d3612; }
  .topbar-mobile strong { color:#fff; }.topbar .icon-btn { color:#d4f4df;background:#ffffff0b; }
  .topbar-mobile img { border-radius:10px;box-shadow:0 4px 12px #00271b24; }
  .hero { padding:25px;min-height:236px;border-radius:24px; }
  .hero h2 { font-size:27px;max-width:245px; }
  .hero p { max-width:220px;font-size:11px; }.hero .eyebrow { font-size:8px;letter-spacing:1px; }
  .hero-visual { right:-40px;bottom:-3px;transform:scale(.57); }
  .stats-grid { gap:12px; }.stats-grid>.stat { padding:17px 15px;border-radius:19px; }
  .stat .stat-label { font-size:10px; }.stat .stat-number { font-size:29px; }
  .stat .stat-foot { font-size:9px; }.stat .tint { width:29px;height:29px; }
  .bottom-nav {
    left:12px;right:12px;bottom:calc(9px + env(safe-area-inset-bottom));
    border:1px solid #4d8e6f66;border-radius:23px;padding:9px 5px;
    background:linear-gradient(110deg,#123f32f7,#104943f7);box-shadow:0 10px 28px #062a3638;
  }
  .bottom-nav a,.bottom-nav button { color:#c4dcd0;border-radius:14px;min-width:48px;padding:4px 6px; }
  .bottom-nav .active { color:#fff;background:linear-gradient(125deg,#26754e,#156a5d);box-shadow:inset 0 1px #b3f6c329; }
  .bottom-nav .compose-nav .nav-plus { background:linear-gradient(135deg,#dcffa8,#a8e7b7);border-color:#174f3d;color:#144631;box-shadow:0 4px 13px #001d2638; }
  .menu-grid a { background:linear-gradient(130deg,#f4f9e9,#e6f5ed);border-color:#d1e7d5;color:#305e45; }
  .menu-grid a:nth-child(3n+2) { background:linear-gradient(130deg,#edf1ff,#e2f4f1);color:#3c6480; }
  .menu-grid a:nth-child(3n) { background:linear-gradient(130deg,#f3ecfb,#f7f0e6);color:#76558e; }
  .menu-grid .icon { color:inherit; }
  .contact-card { margin:10px 0;padding:15px;border:1px solid #deebe0;border-radius:16px;background:linear-gradient(125deg,#fff,#f3f9f0); }
  .contact-card:last-child { border-bottom:1px solid #deebe0; }
  .contact-card .meta { margin-left:0; }.contact-card .phone { color:#67816f; }
  .contact-grid { padding:0 12px; }
  .modal-header { border-radius:23px 23px 0 0; }.modal-header::before { background:#99bda5; }
  .login-page { background:#eff6ef; }.login-form-area { background:radial-gradient(ellipse at top,#d9efd0,transparent 70%); }
  .login-mobile-brand { margin-bottom:35px; }
}
@media(max-width:370px) {
  .hero { padding:22px; }.hero h2 { font-size:24px; }.hero p { max-width:195px; }
  .stat .stat-label { font-size:9px; }.stats-grid>.stat { padding:15px 12px; }
  .bottom-nav { left:8px;right:8px; }.bottom-nav a,.bottom-nav button { min-width:44px;font-size:8px; }
}
/* A working dashboard needs its figures close to the top. */
.card-title .overview-period { width:auto;max-width:145px;flex-shrink:0;min-height:44px;padding:9px 10px;font-size:12px;color:#356b52;background:#edf6ef;border-color:#d6e6da;cursor:pointer; }
.overview-chart { gap:5px;padding-right:14px; }
.overview-chart .chart-day { min-width:0;gap:2px; }
.overview-chart .chart-day span { white-space:nowrap;font-size:9px; }
.chart-period-note { margin-top:15px;font-size:10px; }
@media(max-width:760px) { .card-title:has(.overview-period) { flex-wrap:wrap;gap:12px; }.card-title .overview-period { font-size:16px;max-width:155px; }.overview-chart .chart-day span { font-size:8px; } }
.hero.dashboard-welcome { min-height:0;padding:22px 25px;gap:17px;margin-bottom:20px;border-radius:20px; }
.dashboard-welcome::before,.dashboard-welcome::after { display:none; }
.welcome-icon { display:grid;place-items:center;flex-shrink:0;width:46px;height:46px;border-radius:15px;background:#d8f5bd18;border:1px solid #c3f1d334;color:#daf5c3; }
.welcome-icon .icon { width:25px;height:25px; }
.welcome-copy { flex:1;min-width:0; }
.welcome-copy h1 { color:#fff;font-size:24px;line-height:1.3;font-weight:650;letter-spacing:-.7px;overflow-wrap:anywhere; }
.welcome-sun { font-size:18px;color:#d4edb3;vertical-align:middle;margin-left:4px; }
.dashboard-welcome .welcome-copy p { margin:5px 0 0;max-width:none;font-size:12px;line-height:1.5;color:#deeee5; }
.dashboard-welcome .welcome-action { flex-shrink:0;min-height:42px;font-size:12px;padding:10px 15px; }
@media(max-width:760px) {
  .hero.dashboard-welcome { padding:19px 18px;gap:12px;margin-bottom:17px;border-radius:19px;align-items:center; }
  .welcome-icon { display:none; }
  .welcome-copy h1 { font-size:22px; }
  .dashboard-welcome .welcome-copy p { font-size:11px; }
  .dashboard-welcome .welcome-action { width:44px;height:44px;min-height:44px;padding:10px; }
  .welcome-action span { display:none; }
}

.report-actions{display:flex;gap:8px;flex-wrap:wrap}.report-card-top>.spacer{min-width:0}.report-card-top h2{overflow-wrap:anywhere}@media(max-width:600px){.report-card-top{flex-wrap:wrap}.report-card-top .report-actions{width:100%}.report-actions .btn{flex:1;min-height:44px}}

.template-card>.row{flex-wrap:wrap}.template-actions{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}@media(max-width:600px){.template-actions .btn{min-height:44px}}
