@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";
:root{--color-navy:#0f2b5c;--color-navy-dark:#0a1f42;--color-navy-light:#1a3d6e;--color-teal:#00c9b7;--color-slate:#64748b;--color-surface:#f8fafc;--color-white:#fff;--color-border:#e8edf2;--background:var(--color-white);--foreground:var(--color-navy);--text-muted:var(--color-slate);--accent:var(--color-navy);--accent-hover:var(--color-navy-dark);--accent-muted:#0f2b5c14;--accent-border:#0f2b5c33;--accent-text:var(--color-white);--surface:var(--color-white);--surface-elevated:var(--color-white);--surface-subtle:var(--color-surface);--surface-input:var(--color-white);--border:var(--color-border);--border-strong:#cbd5e1;--hover-bg:#0f2b5c0d;--color-success:#10b981;--color-error:#ef4444;--color-whatsapp:#25d366;--color-amber:#f59e0b;--color-teal-muted:#00c9b71a;--color-green-muted:#10b9811a;--color-amber-muted:#f59e0b1a;--transition-fast:.15s ease;--transition-normal:.3s ease;--shadow-sm:0 1px 2px #0f2b5c0a;--shadow-md:0 2px 8px #0f2b5c0f;--shadow-lg:0 4px 20px #0f2b5c14}html,body{max-width:100vw;height:100%;overflow-x:hidden}body{min-height:100%;color:var(--foreground);background:var(--background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;flex-direction:column;font-family:Outfit,system-ui,sans-serif;display:flex}*{box-sizing:border-box;margin:0;padding:0}a{color:inherit;text-decoration:none}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none;outline:none}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.btn{transition:background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:9999px;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.875rem;font-weight:600;display:inline-flex}.btn-primary{background:var(--accent);color:var(--accent-text);border:1px solid var(--accent);box-shadow:var(--shadow-sm)}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);box-shadow:var(--shadow-md)}.btn-secondary{background:var(--color-white);color:var(--accent);border:1px solid var(--accent-border)}.btn-secondary:hover{background:var(--accent-muted);border-color:var(--accent)}.btn-ghost{color:var(--text-muted);background:0 0;border:1px solid #0000}.btn-ghost:hover{background:var(--hover-bg);color:var(--foreground)}
.dashboard-container{background-color:var(--background);width:100vw;height:100vh;color:var(--foreground);display:flex;overflow:hidden}.dashboard-main{background:var(--color-surface);flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.dashboard-content{background:var(--color-surface);flex:1;padding:2rem;overflow-y:auto}.sidebar{background:var(--surface);border-right:1px solid var(--border);width:280px;transition:transform var(--transition-normal);z-index:40;flex-direction:column;display:flex}@media (max-width:1024px){.sidebar{height:100%;box-shadow:var(--shadow-lg);position:absolute;transform:translate(-100%)}.sidebar.open{transform:translate(0)}}.sidebar-header{border-bottom:1px solid var(--border);align-items:center;gap:.75rem;height:72px;padding:0 1.25rem;display:flex}.sidebar-brand{color:var(--foreground);font-size:1.125rem;font-weight:700;line-height:1.2;display:block}.sidebar-tagline{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-top:.125rem;font-size:.6875rem;font-weight:500;display:block}.sidebar-header-icon{color:var(--accent);flex-shrink:0}.sidebar-nav{flex-direction:column;flex:1;gap:1.25rem;padding:1rem .75rem 1.5rem;display:flex;overflow-y:auto}.nav-group{flex-direction:column;gap:.125rem;display:flex}.nav-group-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:.25rem;padding:0 1rem;font-size:.6875rem;font-weight:600}.nav-item{color:var(--text-muted);transition:background var(--transition-fast), color var(--transition-fast);cursor:pointer;border:none;border-radius:.625rem;align-items:center;padding:.75rem 1rem;font-weight:500;text-decoration:none;display:flex;position:relative}.nav-item:before{content:"";background:var(--accent);width:3px;height:0;transition:height var(--transition-fast);border-radius:0 2px 2px 0;position:absolute;top:50%;left:0;transform:translateY(-50%)}.nav-item:hover{background:var(--hover-bg);color:var(--foreground)}.nav-item.active{background:var(--accent-muted);color:var(--accent);font-weight:600}.nav-item.active:before{height:60%}.nav-item svg{opacity:.6;flex-shrink:0;margin-right:.875rem}.nav-item:hover svg,.nav-item.active svg{opacity:1;color:var(--accent)}.top-header{background:var(--surface);border-bottom:1px solid var(--border);z-index:30;justify-content:space-between;align-items:center;height:72px;padding:0 2rem;display:flex}.header-left{align-items:center;gap:1rem;display:flex}.mobile-menu-btn{color:var(--text-muted);transition:background var(--transition-fast), color var(--transition-fast);border-radius:.5rem;padding:.5rem;display:none}.mobile-menu-btn:hover{background:var(--hover-bg);color:var(--foreground)}@media (max-width:1024px){.mobile-menu-btn{justify-content:center;align-items:center;display:flex}}.search-bar{background:var(--surface-input);border:1px solid var(--border);width:300px;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:.75rem;align-items:center;padding:.5rem 1rem;display:flex}.search-bar:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-muted)}.search-bar input{width:100%;color:var(--foreground);margin-left:.5rem}.search-bar input::placeholder{color:var(--text-muted)}.header-right{align-items:center;gap:.625rem;display:flex}.quick-create{position:relative}.quick-create-btn{padding:.5rem 1rem;font-size:.8125rem}.quick-create-menu{min-width:180px;left:auto;right:0}.dropdown{position:relative}.dropdown-trigger{border:1px solid var(--border);transition:background var(--transition-fast), border-color var(--transition-fast);background:0 0;border-radius:9999px;align-items:center;gap:.75rem;padding:.375rem .75rem .375rem .375rem;display:flex}.dropdown-trigger:hover{background:var(--hover-bg);border-color:var(--border-strong)}.icon-btn{color:var(--text-muted);transition:background var(--transition-fast), color var(--transition-fast);border-radius:.5rem;padding:.5rem;position:relative}.icon-btn:hover{background:var(--hover-bg);color:var(--foreground)}.badge{background:var(--color-error);border:2px solid var(--surface);border-radius:50%;width:8px;height:8px;position:absolute;top:4px;right:4px}.user-menu-btn{border:1px solid var(--border);transition:background var(--transition-fast), border-color var(--transition-fast);border-radius:9999px;align-items:center;gap:.75rem;padding:.375rem .75rem .375rem .375rem;display:flex}.user-menu-btn:hover{background:var(--hover-bg);border-color:var(--border-strong)}.user-name{color:var(--foreground);font-size:.875rem;font-weight:500}.avatar{background:var(--accent);width:34px;height:34px;color:var(--accent-text);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.875rem;font-weight:700;display:flex}.dropdown-menu{background:var(--surface);border:1px solid var(--border);width:210px;box-shadow:var(--shadow-lg);z-index:50;transform-origin:100% 0;border-radius:.75rem;padding:.375rem;position:absolute;top:calc(100% + .5rem);right:0}.dropdown-item{width:100%;color:var(--text-muted);text-align:left;transition:background var(--transition-fast), color var(--transition-fast);border-radius:.5rem;align-items:center;gap:.75rem;padding:.625rem .75rem;display:flex}.dropdown-item:hover,.dropdown-item[data-active=true]{background:var(--hover-bg);color:var(--foreground)}.dropdown-item.danger{color:var(--color-error)}.dropdown-item.danger:hover,.dropdown-item.danger[data-active=true]{color:var(--color-error);background:#ef444414}.dropdown-divider{background:var(--border);height:1px;margin:.25rem .5rem}.page-header{justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.5rem;display:flex}.page-header-text{flex:1}.page-title{color:var(--foreground);font-size:1.75rem;font-weight:700;line-height:1.2}.page-description{color:var(--text-muted);margin-top:.375rem;font-size:.9375rem}.page-header-action{flex-shrink:0}.panel{background:var(--surface);border:1px solid var(--border);border-radius:.875rem}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:4rem 2rem;display:flex}.empty-state-icon{background:var(--accent-muted);width:56px;height:56px;color:var(--accent);border-radius:.875rem;justify-content:center;align-items:center;margin-bottom:1.25rem;display:flex}.empty-state-title{color:var(--foreground);margin-bottom:.5rem;font-size:1.125rem;font-weight:600}.empty-state-description{color:var(--text-muted);max-width:360px;font-size:.875rem;line-height:1.5}.empty-state-action{margin-top:1.5rem}.stats-grid{grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:1.5rem;display:grid}.stat-card{background:var(--surface);border:1px solid var(--border);transition:border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);border-radius:1rem;align-items:flex-start;gap:1rem;padding:1.25rem;display:flex}.stat-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-1px)}.stat-icon{border-radius:.75rem;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.stat-card--navy .stat-icon{background:var(--accent-muted);color:var(--accent)}.stat-card--teal .stat-icon{background:var(--color-teal-muted);color:var(--color-teal)}.stat-card--green .stat-icon{background:var(--color-green-muted);color:var(--color-success)}.stat-card--amber .stat-icon{background:var(--color-amber-muted);color:var(--color-amber)}.stat-body{flex:1;min-width:0}.stat-title{color:var(--text-muted);margin-bottom:.25rem;font-size:.8125rem;font-weight:500;display:block}.stat-value{color:var(--foreground);margin-bottom:.375rem;font-size:1.625rem;font-weight:700;line-height:1.2}.stat-change{align-items:center;gap:.2rem;font-size:.8125rem;font-weight:500;display:flex}.stat-change-label{color:var(--text-muted);margin-left:.125rem;font-weight:400}.stat-change.positive{color:var(--color-success)}.stat-change.negative{color:var(--color-error)}.dashboard-page{flex-direction:column;gap:0;display:flex}.welcome-banner{background:linear-gradient(135deg, var(--color-navy) 0%, var(--color-navy-light) 100%);color:var(--color-white);border-radius:1rem;justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:1.5rem;padding:1.5rem 2rem;display:flex}.welcome-greeting{opacity:.75;margin-bottom:.25rem;font-size:.8125rem;font-weight:500}.welcome-title{margin-bottom:.375rem;font-size:1.25rem;font-weight:700;line-height:1.3}.welcome-subtitle{opacity:.7;font-size:.8125rem}.welcome-banner-badge{white-space:nowrap;background:#ffffff1f;border:1px solid #ffffff26;border-radius:9999px;flex-shrink:0;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.8125rem;font-weight:500;display:flex}.status-dot{background:var(--color-success);border-radius:50%;width:8px;height:8px;animation:2s infinite pulse-dot;box-shadow:0 0 0 3px #10b9814d}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.6}}.quick-actions{grid-template-columns:repeat(4,1fr);gap:.875rem;margin-bottom:1.5rem;display:grid}.quick-action-card{background:var(--surface);border:1px solid var(--border);transition:border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);border-radius:.875rem;align-items:center;gap:.875rem;padding:1rem 1.125rem;display:flex}.quick-action-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.quick-action-icon{border-radius:.625rem;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.quick-action-card--navy .quick-action-icon{background:var(--accent-muted);color:var(--accent)}.quick-action-card--teal .quick-action-icon{background:var(--color-teal-muted);color:var(--color-teal)}.quick-action-label{color:var(--foreground);font-size:.875rem;font-weight:600;line-height:1.2}.quick-action-desc{color:var(--text-muted);margin-top:.125rem;font-size:.75rem}.dash-panel{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:1rem;padding:1.5rem}.dash-panel-header{justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.25rem;display:flex}.dash-panel-title{color:var(--foreground);font-size:1rem;font-weight:600}.dash-panel-subtitle{color:var(--text-muted);margin-top:.125rem;font-size:.8125rem}.dash-panel-stat{color:var(--color-success);background:var(--color-green-muted);border-radius:9999px;align-items:center;gap:.375rem;padding:.375rem .75rem;font-size:.8125rem;font-weight:600;display:flex}.chart-tabs{background:var(--color-surface);border-radius:.5rem;gap:.25rem;width:fit-content;margin-bottom:1.5rem;padding:.25rem;display:flex}.chart-tab{color:var(--text-muted);transition:background var(--transition-fast), color var(--transition-fast);border-radius:.375rem;padding:.375rem .875rem;font-size:.8125rem;font-weight:500}.chart-tab:hover{color:var(--foreground)}.chart-tab--active{background:var(--surface);color:var(--foreground);box-shadow:var(--shadow-sm)}.chart-panel{outline:none}.chart-bars{align-items:flex-end;gap:.625rem;height:180px;padding-top:.5rem;display:flex}.chart-bar-col{flex-direction:column;flex:1;align-items:center;gap:.5rem;height:100%;display:flex}.chart-bar{background:linear-gradient(180deg, var(--color-teal) 0%, var(--accent) 100%);opacity:.85;width:100%;max-width:40px;transition:opacity var(--transition-fast), transform var(--transition-fast);border-radius:.375rem .375rem .125rem .125rem;min-height:8px;margin-top:auto}.chart-bar-col:hover .chart-bar{opacity:1;transform-origin:bottom;transform:scaleY(1.02)}.chart-bar-label{color:var(--text-muted);font-size:.6875rem;font-weight:500}.dash-panel--compact{flex-direction:column;display:flex}.activity-list{flex-direction:column;list-style:none;display:flex}.activity-item{border-bottom:1px solid var(--border);align-items:flex-start;gap:.875rem;padding:.875rem 0;display:flex}.activity-item:last-child{border-bottom:none;padding-bottom:0}.activity-item:first-child{padding-top:0}.activity-icon{border-radius:.5rem;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.activity-icon--navy{background:var(--accent-muted);color:var(--accent)}.activity-icon--teal{background:var(--color-teal-muted);color:var(--color-teal)}.activity-icon--green{background:var(--color-green-muted);color:var(--color-success)}.activity-icon--amber{background:var(--color-amber-muted);color:var(--color-amber)}.activity-content{flex:1;min-width:0}.activity-title{color:var(--foreground);font-size:.8125rem;font-weight:600;line-height:1.3}.activity-detail{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;margin-top:.125rem;font-size:.75rem;overflow:hidden}.activity-time{color:var(--text-muted);white-space:nowrap;flex-shrink:0;padding-top:.125rem;font-size:.6875rem}.mobile-overlay{z-index:35;background:#0f2b5c4d;display:none;position:absolute;inset:0}@media (max-width:1024px){.mobile-overlay{display:block}}.content-grid{grid-template-columns:1.6fr 1fr;align-items:start;gap:1rem;display:grid}.placeholder-panel{justify-content:center;align-items:center;min-height:280px;display:flex}.placeholder-text{color:var(--text-muted);font-size:.875rem}@media (max-width:1100px){.stats-grid,.quick-actions{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.content-grid,.stats-grid,.quick-actions{grid-template-columns:1fr}.dashboard-content{padding:1.25rem}.welcome-banner{flex-direction:column;align-items:flex-start;padding:1.25rem}.search-bar,.user-name,.quick-create{display:none}.page-header{flex-direction:column}}@media (min-width:769px){.search-bar{display:flex}.user-name{display:block}}.form-field{flex-direction:column;gap:.375rem;display:flex}.form-label{color:var(--foreground);font-size:.8125rem;font-weight:600}.form-required{color:var(--color-error);margin-left:.125rem}.form-input,.form-select,.form-textarea{background:var(--surface-input);border:1px solid var(--border);width:100%;color:var(--foreground);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:.625rem;padding:.625rem .875rem;font-size:.875rem}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-muted)}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-muted)}.form-textarea{resize:vertical;min-height:96px;line-height:1.5}.form-hint{color:var(--text-muted);font-size:.75rem;line-height:1.4}.form-error{color:var(--color-error);font-size:.75rem}.form-checkbox{width:16px;height:16px;accent-color:var(--accent);flex-shrink:0}.form-grid{flex-direction:column;gap:1rem;display:flex}.form-grid--2{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}.form-actions{border-top:1px solid var(--border);align-items:center;gap:.75rem;margin-top:1.5rem;padding-top:1.25rem;display:flex}.form-actions--end{justify-content:flex-end}.btn-sm{padding:.375rem .75rem;font-size:.8125rem}.tabs{background:var(--color-surface);border:1px solid var(--border);border-radius:.75rem;gap:.25rem;width:fit-content;padding:.25rem;display:flex}.tab{color:var(--text-muted);transition:background var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast);border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.8125rem;font-weight:500;display:inline-flex}.tab:hover{color:var(--foreground)}.tab--active{background:var(--surface);color:var(--foreground);box-shadow:var(--shadow-sm);font-weight:600}.tab-count{background:var(--accent-muted);color:var(--accent);border-radius:9999px;padding:.125rem .5rem;font-size:.6875rem;font-weight:600}.status-badge{text-transform:uppercase;letter-spacing:.04em;border-radius:9999px;align-items:center;padding:.25rem .625rem;font-size:.6875rem;font-weight:600;display:inline-flex}.badge--success{background:var(--color-green-muted);color:var(--color-success)}.badge--warning{background:var(--color-amber-muted);color:var(--color-amber)}.badge--error{color:var(--color-error);background:#ef44441a}.category-pill{background:var(--accent-muted);color:var(--accent);border-radius:.375rem;padding:.2rem .5rem;font-size:.75rem;font-weight:500;display:inline-block}.text-muted{color:var(--text-muted)}.alert{border-radius:.75rem;align-items:flex-start;gap:.75rem;margin-top:1rem;padding:.875rem 1rem;display:flex}.alert-title{margin-bottom:.25rem;font-size:.875rem;font-weight:600}.alert-text{font-size:.8125rem;line-height:1.5}.alert--success{background:var(--color-green-muted);color:var(--color-success)}.alert--warning{background:var(--color-amber-muted);color:#b45309}.alert--info{background:var(--accent-muted);color:var(--accent)}.alert--error{color:var(--color-error);background:#ef444414}.info-banner{background:var(--accent-muted);border:1px solid var(--accent-border);color:var(--foreground);border-radius:.875rem;align-items:flex-start;gap:.75rem;margin-bottom:1.25rem;padding:1rem 1.25rem;font-size:.875rem;line-height:1.5;display:flex}.info-banner svg{color:var(--accent);flex-shrink:0;margin-top:.125rem}.modal-overlay{z-index:100;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0f2b5c66;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--border);width:100%;box-shadow:var(--shadow-lg);border-radius:1rem;flex-direction:column;max-height:calc(100vh - 3rem);display:flex}.modal--md{max-width:520px}.modal--lg{max-width:640px}.modal--xl{max-width:800px}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.25rem 1.5rem;display:flex}.modal-title{color:var(--foreground);font-size:1.125rem;font-weight:700}.modal-description{color:var(--text-muted);margin-top:.25rem;font-size:.8125rem}.modal-close{color:var(--text-muted);transition:background var(--transition-fast), color var(--transition-fast);border-radius:.5rem;flex-shrink:0;padding:.375rem}.modal-close:hover{background:var(--hover-bg);color:var(--foreground)}.modal-body{padding:1.5rem;overflow-y:auto}.messaging-layout{grid-template-columns:1fr 320px;align-items:start;gap:1.25rem;display:grid}.messaging-form-panel{padding:1.5rem}.panel-section-header{margin-bottom:1.25rem}.panel-section-title{color:var(--foreground);font-size:1rem;font-weight:600}.panel-section-desc{color:var(--text-muted);margin-top:.25rem;font-size:.8125rem}.messages-tabs-wrap{margin-bottom:1.25rem}.messages-footer-hint{color:var(--text-muted);align-items:center;gap:.5rem;margin-top:1.25rem;font-size:.8125rem;display:flex}.message-preview{position:sticky;top:0}.message-preview-header{color:var(--text-muted);align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.8125rem;font-weight:600;display:flex}.message-preview-icon{color:var(--color-whatsapp)}.message-preview-phone{border:1px solid var(--border);box-shadow:var(--shadow-md);background:#e5ddd5;border-radius:1.25rem;overflow:hidden}.message-preview-statusbar{color:#fff;background:#075e54;justify-content:space-between;align-items:center;padding:.5rem 1rem;font-size:.6875rem;font-weight:600;display:flex}.message-preview-signal{letter-spacing:.1em;font-size:.5rem}.message-preview-chat{background:#e5ddd5 url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23d4cdc4' fill-opacity='0.4'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");min-height:360px}.message-preview-chat-header{color:#fff;background:#075e54;align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}.message-preview-avatar{background:#fff3;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:.875rem;font-weight:700;display:flex}.message-preview-contact{font-size:.875rem;font-weight:600}.message-preview-recipient{opacity:.75;margin-top:.125rem;font-size:.6875rem}.message-preview-bubble-wrap{min-height:260px;padding:1rem}.message-preview-bubble{background:#fff;border-radius:.5rem .5rem .5rem .125rem;max-width:85%;padding:.625rem .75rem;position:relative;box-shadow:0 1px 2px #00000014}.message-preview-bubble-header{color:var(--foreground);margin-bottom:.375rem;font-size:.875rem;font-weight:700}.message-preview-bubble-body{color:#303030;white-space:pre-wrap;font-size:.8125rem;line-height:1.5}.message-preview-bubble-footer{color:var(--text-muted);margin-top:.5rem;font-size:.6875rem}.message-preview-time{text-align:right;color:var(--text-muted);margin-top:.25rem;font-size:.625rem;display:block}.message-preview-placeholder{color:var(--text-muted);text-align:center;padding:2rem 1rem;font-size:.8125rem}.recipient-section{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1.25rem}.recipient-section-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.875rem;display:flex}.recipient-section-title{color:var(--foreground);align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;display:flex}.recipient-count{color:var(--text-muted);background:var(--color-surface);border-radius:9999px;padding:.125rem .5rem;font-size:.75rem;font-weight:500}.recipient-actions{gap:.25rem;display:flex}.recipient-list{border:1px solid var(--border);border-radius:.625rem;flex-direction:column;gap:.25rem;max-height:200px;margin-bottom:1rem;padding:.375rem;display:flex;overflow-y:auto}.recipient-item{cursor:pointer;transition:background var(--transition-fast);border-radius:.5rem;align-items:center;gap:.75rem;padding:.5rem .625rem;display:flex}.recipient-item:hover{background:var(--hover-bg)}.recipient-info{flex-direction:column;gap:.125rem;min-width:0;display:flex}.recipient-name,.recipient-phone{color:var(--foreground);font-size:.8125rem;font-weight:500}.template-layout{grid-template-columns:1.2fr 1fr;align-items:start;gap:1.25rem;display:grid}.template-list-panel{overflow:hidden}.template-list-toolbar{border-bottom:1px solid var(--border);flex-direction:column;gap:1rem;padding:1rem 1.25rem;display:flex}.search-bar--compact{width:100%}.template-table-wrap{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;font-size:.8125rem}.data-table th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);background:var(--color-surface);border-bottom:1px solid var(--border);padding:.75rem 1.25rem;font-size:.6875rem;font-weight:600}.data-table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:.875rem 1.25rem}.data-table tbody tr{cursor:pointer;transition:background var(--transition-fast)}.data-table tbody tr:hover{background:var(--hover-bg)}.data-table-row--active{background:var(--accent-muted)!important}.data-table-empty{text-align:center;color:var(--text-muted);padding:2rem!important}.template-name{color:var(--foreground);font-family:ui-monospace,monospace;font-size:.8125rem;font-weight:600}.template-detail-panel{padding:1.5rem;position:sticky;top:0}.template-detail-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.25rem;padding-bottom:1rem;display:flex}.template-detail-name{font-family:ui-monospace,monospace;font-size:1.125rem;font-weight:700}.template-detail-meta{color:var(--text-muted);margin-top:.25rem;font-size:.8125rem}.template-detail-body{flex-direction:column;gap:1rem;display:flex}.detail-block{flex-direction:column;gap:.375rem;display:flex}.detail-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);font-size:.6875rem;font-weight:600}.detail-body-text{color:var(--foreground);background:var(--color-surface);border:1px solid var(--border);border-radius:.625rem;padding:.875rem;font-size:.875rem;line-height:1.6}.variable-list{flex-direction:column;gap:.5rem;display:flex}.variable-list-item{background:var(--color-surface);border-radius:.5rem;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem;padding:.5rem .75rem;font-size:.8125rem;display:grid}.variable-list-item code{background:var(--accent-muted);color:var(--accent);border-radius:.25rem;padding:.125rem .375rem;font-size:.75rem}.variable-example{color:var(--text-muted);font-size:.75rem}.variable-preview{background:var(--color-surface);border:1px solid var(--border);border-radius:.625rem;padding:.875rem}.variable-preview-title{color:var(--text-muted);margin-bottom:.5rem;font-size:.75rem;font-weight:600}.variable-tags{flex-wrap:wrap;gap:.375rem;display:flex}.variable-tag{background:var(--accent-muted);color:var(--accent);border-radius:.375rem;padding:.25rem .5rem;font-family:ui-monospace,monospace;font-size:.75rem}.template-form{flex-direction:column;gap:1rem;display:flex}.page-loading{color:var(--text-muted);padding:2rem;font-size:.875rem}.contact-upload{margin-bottom:1rem}.contact-upload-zone{text-align:center;border:2px dashed var(--border-strong);background:var(--color-surface);cursor:pointer;transition:border-color var(--transition-fast), background var(--transition-fast);border-radius:.75rem;flex-direction:column;justify-content:center;align-items:center;padding:1.5rem;display:flex}.contact-upload-zone:hover,.contact-upload-zone--active{border-color:var(--accent);background:var(--accent-muted)}.contact-upload-input{display:none}.contact-upload-icon{background:var(--accent-muted);width:48px;height:48px;color:var(--accent);border-radius:.75rem;justify-content:center;align-items:center;margin-bottom:.75rem;display:flex}.contact-upload-title{color:var(--foreground);margin-bottom:.25rem;font-size:.875rem;font-weight:600}.contact-upload-hint{color:var(--text-muted);font-size:.8125rem}.contact-upload-format{color:var(--text-muted);margin-top:.5rem;font-size:.75rem}.contact-upload-format code{background:var(--accent-muted);color:var(--accent);border-radius:.25rem;padding:.1rem .35rem;font-size:.6875rem}.contact-upload-result{background:var(--color-green-muted);color:var(--color-success);border-radius:.5rem;align-items:center;gap:.5rem;margin-top:.625rem;padding:.5rem .75rem;font-size:.8125rem;font-weight:500;display:flex}.contact-upload-clear{color:inherit;opacity:.7;border-radius:.25rem;margin-left:auto;padding:.25rem}.contact-upload-clear:hover{opacity:1;background:#10b98126}.header-image-picker{align-items:flex-start;gap:1rem;display:flex}.header-image-preview{border:1px solid var(--border);border-radius:.5rem;flex-shrink:0;width:120px;height:68px;overflow:hidden}.header-image-preview img{object-fit:cover;width:100%;height:100%}.header-image-actions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.message-preview-media{border-radius:.5rem .5rem 0 0;margin:-.625rem -.75rem .5rem;overflow:hidden}.message-preview-media img{object-fit:cover;width:100%;max-height:120px;display:block}.message-preview-media--video,.message-preview-media--doc{background:var(--color-surface);color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:.375rem;min-height:80px;padding:1.25rem;font-size:.75rem;display:flex}.message-preview-buttons{border-top:1px solid var(--border);flex-direction:column;gap:.375rem;margin-top:.625rem;padding-top:.5rem;display:flex}.message-preview-button{text-align:center;color:#00a5f4;border-top:1px solid var(--border);padding:.375rem;font-size:.75rem;font-weight:600;display:block}.message-preview-button:first-child{border-top:none}.form-section{border-bottom:1px solid var(--border);padding-bottom:1.25rem}.form-section:last-of-type{border-bottom:none;padding-bottom:0}.form-section-title{color:var(--foreground);margin-bottom:.875rem;font-size:.9375rem;font-weight:600}.form-section-header-row{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.25rem;display:flex}.form-section-hint{color:var(--text-muted);margin-bottom:.875rem;font-size:.75rem}.style-description{color:var(--text-muted);background:var(--color-surface);border-left:3px solid var(--accent);border-radius:.5rem;margin-top:.5rem;padding:.625rem .875rem;font-size:.8125rem}.style-pill{background:var(--color-teal-muted);color:var(--color-teal);border-radius:.375rem;padding:.2rem .5rem;font-size:.75rem;font-weight:500;display:inline-block}.header-type-grid{flex-wrap:wrap;gap:.375rem;margin-bottom:1rem;display:flex}.header-type-option{color:var(--text-muted);border:1px solid var(--border);background:var(--surface);transition:all var(--transition-fast);border-radius:.5rem;padding:.5rem .875rem;font-size:.8125rem;font-weight:500}.header-type-option:hover{border-color:var(--border-strong);color:var(--foreground)}.header-type-option--active{background:var(--accent-muted);border-color:var(--accent);color:var(--accent);font-weight:600}.file-upload-btn{border:1px dashed var(--border-strong);color:var(--text-muted);cursor:pointer;transition:border-color var(--transition-fast), background var(--transition-fast);border-radius:.625rem;align-items:center;gap:.5rem;padding:.625rem 1rem;font-size:.8125rem;font-weight:500;display:inline-flex}.file-upload-btn:hover{border-color:var(--accent);background:var(--accent-muted);color:var(--accent)}.buttons-empty{color:var(--text-muted);text-align:center;background:var(--color-surface);border:1px dashed var(--border);border-radius:.625rem;padding:1rem;font-size:.8125rem}.button-builder-list{flex-direction:column;gap:.75rem;display:flex}.button-builder-item{background:var(--color-surface);border:1px solid var(--border);border-radius:.75rem;padding:1rem 2.5rem 1rem 1rem;position:relative}.button-builder-remove{color:var(--text-muted);transition:background var(--transition-fast), color var(--transition-fast);border-radius:.375rem;padding:.375rem;position:absolute;top:.75rem;right:.75rem}.button-builder-remove:hover{color:var(--color-error);background:#ef44441a}.detail-header-image{object-fit:cover;border:1px solid var(--border);border-radius:.5rem;width:100%;max-height:140px}.detail-file-name{background:var(--color-surface);border:1px solid var(--border);border-radius:.5rem;padding:.625rem .875rem;font-size:.875rem}.detail-buttons{flex-direction:column;gap:.5rem;display:flex}.detail-button-item{background:var(--color-surface);border:1px solid var(--border);border-radius:.5rem;grid-template-columns:1fr auto;gap:.25rem .75rem;padding:.625rem .875rem;font-size:.8125rem;display:grid}.detail-button-label{color:var(--foreground);font-weight:600}.detail-button-type{color:var(--color-teal);font-size:.75rem;font-weight:500}.detail-button-value{color:var(--text-muted);grid-column:1/-1;font-family:ui-monospace,monospace;font-size:.75rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:1s linear infinite spin}.template-fields-block{background:var(--color-surface);border:1px solid var(--border);border-radius:.75rem;flex-direction:column;gap:1rem;padding:1rem;display:flex}.template-fields-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);font-size:.75rem;font-weight:600}.template-fields-heading{align-items:flex-start;gap:.625rem;margin-bottom:.25rem;display:flex}.template-fields-heading svg{color:var(--accent);flex-shrink:0;margin-top:.125rem}.template-fields-sublabel{color:var(--text-muted);margin-top:.125rem;font-size:.75rem}.template-fields-block--personal{border-color:var(--accent-border);background:linear-gradient(180deg, var(--accent-muted) 0%, var(--color-surface) 100%)}.single-message-fields{flex-direction:column;gap:1rem;display:flex}.template-fields-empty{color:var(--text-muted);font-size:.8125rem}.schedule-section{background:var(--color-surface);border:1px solid var(--border);border-radius:.75rem;padding:1rem}.schedule-section-title{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:.75rem;font-size:.75rem;font-weight:600}.send-mode-grid{grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:.75rem;display:grid}.send-mode-grid--2{grid-template-columns:repeat(2,1fr)}.send-mode-option{border:1px solid var(--border);color:var(--text-muted);background:var(--surface);transition:all var(--transition-fast);border-radius:.625rem;flex-direction:column;align-items:center;gap:.375rem;padding:.75rem .5rem;font-size:.75rem;font-weight:500;display:flex}.send-mode-option:hover{border-color:var(--border-strong);color:var(--foreground)}.send-mode-option--active{background:var(--accent-muted);border-color:var(--accent);color:var(--accent);font-weight:600}.schedule-fields{border-top:1px solid var(--border);margin-top:.75rem;padding-top:.75rem}.schedule-summary{background:var(--accent-muted);color:var(--accent);border-radius:.625rem;align-items:center;gap:.5rem;margin-top:1rem;padding:.75rem 1rem;font-size:.8125rem;font-weight:500;display:flex}.message-preview-empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:200px;padding:2.5rem 1.5rem;display:flex}.message-preview-empty-icon{width:56px;height:56px;color:var(--color-whatsapp);background:#fffc;border-radius:50%;justify-content:center;align-items:center;margin-bottom:.875rem;display:flex}.message-preview-empty-title{color:#303030;margin-bottom:.375rem;font-size:.875rem;font-weight:600}.message-preview-empty-text{color:var(--text-muted);max-width:220px;font-size:.75rem;line-height:1.5}.template-body-editor{flex-direction:column;gap:.875rem;display:flex}.variable-guide{background:var(--color-surface);border:1px solid var(--border);border-radius:.625rem;padding:.875rem}.variable-guide-title{color:var(--text-muted);margin-bottom:.625rem;font-size:.75rem;font-weight:600}.variable-guide-list{flex-direction:column;gap:.375rem;display:flex}.variable-guide-item{background:var(--surface);border:1px solid var(--border);border-radius:.5rem;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem;padding:.5rem .625rem;font-size:.8125rem;display:grid}.variable-guide-item--ok{background:var(--color-green-muted);border-color:#10b9814d}.variable-guide-item--missing{background:var(--color-amber-muted);border-color:#f59e0b4d}.variable-guide-item code{background:var(--accent-muted);color:var(--accent);border-radius:.25rem;padding:.125rem .375rem;font-size:.75rem}.variable-guide-label{color:var(--foreground);font-weight:600;display:block}.variable-guide-example{color:var(--text-muted);font-size:.75rem}.variable-guide-status{color:var(--text-muted);font-size:.6875rem;font-weight:600}.variable-guide-item--ok .variable-guide-status{color:var(--color-success)}.variable-guide-item--missing .variable-guide-status{color:var(--color-amber)}.form-textarea--readonly{background:var(--color-surface);color:var(--text-muted);cursor:not-allowed}.body-locked-note{color:var(--text-muted);margin-top:-.5rem;font-size:.75rem;font-style:italic}.bulk-info-banner{margin-bottom:1rem}.bulk-generic-note{color:var(--text-muted);background:var(--color-amber-muted);border-radius:.5rem;padding:.625rem .875rem;font-size:.8125rem;line-height:1.5}.header-file-picker{flex-direction:column;gap:.75rem;display:flex}.header-file-preview{background:var(--color-surface);border:1px solid var(--border);color:var(--foreground);border-radius:.625rem;align-items:center;gap:.625rem;padding:.75rem 1rem;font-size:.8125rem;font-weight:500;display:flex}.schedule-optional-hint{color:var(--text-muted);margin-bottom:.5rem;font-size:.75rem}.recipient-count-inline{color:var(--color-success);margin-top:.5rem;font-size:.8125rem;font-weight:600}@media (max-width:1100px){.messaging-layout,.template-layout{grid-template-columns:1fr}.message-preview,.template-detail-panel{position:static}}@media (max-width:768px){.form-grid--2{grid-template-columns:1fr}.recipient-section-header{flex-direction:column;align-items:flex-start}.send-mode-grid{grid-template-columns:1fr}}