/* Zentic base shell (rebuilt): sidebar, topbar, cards, buttons, badges, forms, modals, toasts, login.
   theme.css / premium.css / salesiq.css load after this and refine the look. */
:root{--zc-primary:#5278ff;--zc-primary-dark:#3d63ea;--zc-surface:#fff;--zc-bg:#f5f6fa;--zc-border:#e3e8f0;
  --zc-text:#15171c;--zc-text-muted:#707783;--zc-radius:8px;--zc-sidebar-w:260px;--zc-topbar-h:60px}
:root[data-theme="dark"]{--zc-surface:#141a2d;--zc-bg:#0b1020;--zc-border:#25314a;--zc-text:#eef2ff;--zc-text-muted:#94a3b8}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--zc-bg);color:var(--zc-text);font-size:13px}
[hidden]{display:none!important}
.fw-600{font-weight:600}.fw-700{font-weight:700}.text-xs{font-size:11.5px}.text-sm{font-size:12.5px}.required{color:#dc2626}

/* ---- sidebar ---- */
.zentic-sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--zc-sidebar-w);background:var(--zc-surface);border-right:1px solid var(--zc-border);
  display:flex;flex-direction:column;z-index:1040;transition:transform .2s ease,width .2s ease}
.sidebar-brand{display:flex;align-items:center;justify-content:space-between;min-height:var(--zc-topbar-h)}
.brand-link{display:inline-flex;align-items:center;text-decoration:none}
.brand-logo-chip{display:inline-flex;align-items:center}
.brand-logo-chip img{display:block;max-width:170px}
.sidebar-close-btn,.sidebar-toggle-btn{border:0;background:transparent;color:inherit;width:36px;height:36px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:18px;cursor:pointer}
.sidebar-nav{flex:1;overflow-y:auto}
.nav-section-label{display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none}
.nav-section-arrow{font-size:12px;transition:transform .15s}
.nav-section.collapsed .nav-section-arrow{transform:rotate(-90deg)}
.nav-section.collapsed .nav-list{display:none}
.nav-list{list-style:none;margin:0;padding:0}
.nav-item{position:relative}
.nav-link{text-decoration:none;position:relative}
.nav-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-badge,.nav-count{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:10.5px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.zentic-sidebar.collapsed{width:76px}
.zentic-sidebar.collapsed .nav-text,.zentic-sidebar.collapsed .nav-section-label,.zentic-sidebar.collapsed .nav-badge,.zentic-sidebar.collapsed .nav-count{display:none}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(10,15,30,.45);z-index:1035}
.sidebar-overlay.show{display:block}

/* ---- main / topbar ---- */
.zentic-main{margin-left:var(--zc-sidebar-w);min-height:100vh;display:flex;flex-direction:column;transition:margin-left .2s ease}
.zentic-main.sidebar-collapsed{margin-left:76px}
.zentic-topbar{position:sticky;top:0;z-index:1030;min-height:var(--zc-topbar-h);display:flex;align-items:center;gap:12px;padding:0 20px}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:8px}
.topbar-center{flex:1;min-width:0}
.topbar-btn{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:17px}
.topbar-divider{width:1px;height:24px;margin:0 4px}
.topbar-user{cursor:pointer}
.topbar-user-avatar{border-radius:50%}
.user-dropdown-menu{display:none;position:absolute;right:0;top:calc(100% + 10px);width:260px;background:var(--zc-surface);border:1px solid var(--zc-border);
  border-radius:12px;box-shadow:0 18px 44px rgba(21,23,28,.14);z-index:3000;overflow:hidden;cursor:default}
.topbar-user.open .user-dropdown-menu{display:block}
.user-dropdown-header{display:flex;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--zc-border)}
.udm-avatar{width:40px;height:40px;border-radius:50%;font-size:15px;flex:0 0 auto}
.udm-info{min-width:0}
.user-dropdown-name{margin:0;font-weight:700}
.user-dropdown-email{margin:0;color:var(--zc-text-muted);font-size:12px;overflow:hidden;text-overflow:ellipsis}
.udm-body{padding:6px}
.user-dropdown-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--zc-text);text-decoration:none;cursor:pointer;font-size:13px}
.user-dropdown-item:hover{background:rgba(82,120,255,.08)}
.user-dropdown-item.danger{color:#dc2626}
.zentic-content{flex:1;padding:24px}
.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.page-title{margin:0}.page-subtitle{margin:4px 0 0}
.page-header-actions{display:flex;gap:8px;flex-wrap:wrap}
.zentic-footer{padding:14px 24px}
@media (max-width:991.98px){
  .zentic-sidebar{transform:translateX(-100%);width:var(--zc-sidebar-w)!important}
  .zentic-sidebar.mobile-open{transform:none}
  .zentic-main,.zentic-main.sidebar-collapsed{margin-left:0!important}
  .zentic-content{padding:16px}.zentic-topbar{padding:0 12px}
}

/* ---- cards / stats ---- */
.zentic-card{background:var(--zc-surface);border:1px solid var(--zc-border);border-radius:var(--zc-radius)}
.zentic-card-header{padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.zentic-card-body{padding:18px}
.stat-card{display:block;color:inherit}
.stat-card-header{display:flex;align-items:center;justify-content:space-between}
.zentic-bg-blue{background:#5278ff}.zentic-bg-green{background:#16a34a}.zentic-bg-red{background:#dc2626}
.zentic-bg-orange{background:#f59e0b}.zentic-bg-purple{background:#7c3aed}.zentic-bg-cyan{background:#06b6d4}

/* ---- buttons ---- */
.btn-zentic{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border:1px solid transparent;border-radius:8px;font-size:13px;font-weight:600;
  line-height:1.4;cursor:pointer;text-decoration:none;background:var(--zc-surface);color:var(--zc-text);white-space:nowrap}
.btn-zentic:disabled{opacity:.6;cursor:not-allowed}
.btn-zentic.btn-sm{padding:6px 11px;font-size:12.5px}
.btn-zentic.btn-xs{padding:4px 8px;font-size:12px}
.btn-zentic.btn-icon{padding:6px;width:30px;height:30px;justify-content:center}
.btn-zentic.btn-ghost{background:transparent;border-color:transparent;color:var(--zc-text-muted)}
.btn-zentic.btn-ghost:hover{background:rgba(82,120,255,.08);color:var(--zc-primary)}
.btn-zentic.btn-white,.btn-zentic.btn-light{background:var(--zc-surface);border-color:var(--zc-border)}
.btn-zentic.btn-success{background:#16a34a;color:#fff}
.btn-zentic.btn-danger{background:#dc2626;color:#fff}

/* ---- badges ---- */
.badge-zentic{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;font-size:11px;font-weight:700;border-radius:999px;background:#eef0f4;color:#4b5563;text-transform:capitalize;white-space:nowrap}
.badge-zentic.badge-dot::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.badge-red{background:#fee2e2;color:#b91c1c}.badge-green{background:#dcfce7;color:#15803d}.badge-blue{background:#dbeafe;color:#1d4ed8}
.badge-orange{background:#ffedd5;color:#c2410c}.badge-cyan{background:#cffafe;color:#0e7490}.badge-purple{background:#ede9fe;color:#6d28d9}
.badge-gray{background:#eef0f4;color:#4b5563}.badge-yellow{background:#fef9c3;color:#a16207}

/* ---- alerts ---- */
.alert-zentic{display:flex;align-items:flex-start;gap:10px;padding:11px 14px;border-radius:8px;border:1px solid;margin-bottom:14px;font-size:13px}
.alert-zentic .alert-icon{margin-top:2px}
.alert-zentic .alert-content{flex:1}
.alert-zentic.alert-danger{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.alert-zentic.alert-success{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.alert-zentic.alert-warning{background:#fffbeb;border-color:#fde68a;color:#92400e}
.alert-zentic.alert-info{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}

/* ---- forms ---- */
.form-group{margin-bottom:16px}
.form-label{display:block;margin-bottom:6px}
.form-control-zentic,.form-select-zentic{display:block;width:100%;padding:9px 12px;font:inherit;font-size:13px;outline:0;border:1px solid var(--zc-border);border-radius:8px;background:var(--zc-surface);color:var(--zc-text)}
textarea.form-control-zentic{min-height:90px;resize:vertical}
.input-group-zentic{display:flex;align-items:stretch;position:relative}
.input-group-zentic .form-control-zentic{flex:1;padding-left:38px}
.input-group-zentic .input-group-addon{position:absolute;left:0;top:0;bottom:0;width:38px;display:flex;align-items:center;justify-content:center;color:var(--zc-text-muted);z-index:2;font-size:15px}
.input-group-zentic .input-group-addon.input-right{left:auto;right:0;cursor:pointer}
.input-group-zentic:has(.input-right) .form-control-zentic{padding-right:38px}

/* ---- tables ---- */
.zentic-table-wrapper{overflow-x:auto}
.zentic-table{width:100%;border-collapse:collapse}
.zentic-table th{font-size:12px;font-weight:700;color:var(--zc-text-muted);text-align:left;padding:10px 12px;border-bottom:1px solid var(--zc-border);white-space:nowrap}
.zentic-table td{padding:11px 12px;border-bottom:1px solid var(--zc-border);vertical-align:middle}

/* ---- modals ---- */
.zentic-modal-backdrop{display:none;position:fixed;inset:0;background:rgba(10,15,30,.5);z-index:2000;padding:24px 12px;overflow-y:auto}
.zentic-modal-backdrop.show{display:flex;align-items:flex-start;justify-content:center}
.zentic-modal{background:var(--zc-surface);border-radius:12px;width:100%;max-width:560px;margin:auto;box-shadow:0 26px 60px rgba(0,0,0,.3)}
.zentic-modal.modal-lg{max-width:820px}
.zentic-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--zc-border)}
.zentic-modal-title{font-size:16px;font-weight:700;margin:0}
.zentic-modal-close{border:0;background:transparent;font-size:18px;cursor:pointer;color:var(--zc-text-muted)}
.zentic-modal-body{padding:20px}
.zentic-modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--zc-border)}

/* ---- toasts ---- */
.zentic-toasts{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px;z-index:4000;max-width:92vw}
.zentic-toast{display:flex;align-items:center;gap:10px;min-width:240px;max-width:380px;padding:11px 14px;border-radius:10px;background:#1f2937;color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.25);font-size:13px}
.zentic-toast.success i{color:#4ade80}.zentic-toast.error i{color:#f87171}.zentic-toast.warning i{color:#fbbf24}.zentic-toast.info i{color:#60a5fa}

/* ---- chat (base; salesiq.css refines) ---- */
.chat-layout{display:flex;min-height:0;background:var(--zc-surface);border:1px solid var(--zc-border);border-radius:var(--zc-radius);overflow:hidden}
.chat-main{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0}
.chat-messages{display:flex;flex-direction:column;gap:14px;flex:1;min-height:0;overflow-y:auto;padding:16px 20px}
.chat-message{display:flex;flex-direction:row;align-items:flex-start;gap:8px;max-width:78%;align-self:flex-start}
.chat-message.user-message{align-self:flex-end;flex-direction:row-reverse}
.chat-bubble-group{display:flex;flex-direction:column;min-width:0;max-width:100%}
.user-message .chat-bubble-group{align-items:flex-end}
.chat-avatar{flex:none;width:32px;height:32px;min-width:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#fff;background:#94a3b8;overflow:hidden}
.chat-avatar i{display:inline-block}
.chat-bubble{padding:8px 12px;border-radius:12px;background:#f1f5f9;color:var(--zc-text);font-size:13px;line-height:1.55;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}
.user-message .chat-bubble{background:var(--zc-primary);color:#fff}
.chat-time{font-size:11px;color:var(--zc-text-muted);margin-top:3px}
.chat-day{display:flex;align-items:center;gap:12px;color:var(--zc-text-muted);font-size:12px}
.chat-day::before,.chat-day::after{content:'';flex:1;height:1px;background:var(--zc-border)}
.chat-input-area{flex:none;padding:12px 16px;border-top:1px solid var(--zc-border);background:var(--zc-surface)}
.chat-input-wrapper{display:flex;align-items:flex-end;gap:8px;width:100%;border:1px solid var(--zc-border);border-radius:8px;background:var(--zc-surface);padding:6px 8px 6px 12px}
.chat-input-wrapper.has-attach{align-items:center;padding-left:6px}
.chat-input{flex:1 1 auto;min-width:0;width:100%;border:0 !important;outline:0 !important;box-shadow:none !important;background:transparent;resize:none;font:inherit;font-size:13px;line-height:20px;padding:6px 0;min-height:32px;max-height:140px;overflow-y:auto;color:inherit}
.chat-send-btn{flex:none;width:32px;height:32px;border:0;border-radius:6px;background:var(--zc-primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.chat-send-btn:disabled{opacity:.6;cursor:not-allowed}
.chat-att-img{display:block;max-width:240px}.chat-att-img img{display:block;max-width:100%;border-radius:8px}
.chat-att-img.has-text,.chat-att-file.has-text{margin-top:6px}
.chat-att-file{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--zc-border);border-radius:8px;background:#fff;color:inherit;text-decoration:none;white-space:normal}
.chat-att-file span{display:flex;flex-direction:column;min-width:0}.chat-att-file b{font-weight:600;overflow:hidden;text-overflow:ellipsis}
:root[data-theme="dark"] .chat-bubble{background:#20242d;color:#e5e7eb}
:root[data-theme="dark"] .chat-att-file{background:#1c2028}

/* ---- login ---- */
.auth-page{display:flex;min-height:100vh}
.auth-left{position:relative;overflow:hidden;flex:1 1 50%;color:#fff;padding:56px;display:flex;flex-direction:column;justify-content:center}
.auth-left-orb{position:absolute;border-radius:50%;background:rgba(255,255,255,.12);pointer-events:none}
.auth-left-orb-1{width:380px;height:380px;top:-120px;right:-120px}
.auth-left-orb-2{width:240px;height:240px;bottom:-80px;left:-60px}
.auth-left-orb-3{width:120px;height:120px;bottom:30%;right:12%}
.auth-left-logo{position:relative;margin-bottom:40px}
.auth-left .brand-logo-chip{background:#fff;padding:8px 14px;border-radius:10px}
.auth-tagline{position:relative;font-size:38px;line-height:1.15;margin:0 0 14px;color:#fff}
.auth-description{position:relative;font-size:15px;opacity:.9;max-width:440px;margin:0 0 30px}
.auth-feature{position:relative;display:flex;align-items:center;gap:12px;margin-bottom:14px;font-size:14px;font-weight:500}
.auth-feature-icon{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:17px}
.auth-right{flex:1 1 50%;display:flex;align-items:center;justify-content:center;padding:40px 24px}
.auth-form-container{width:100%;max-width:400px}
.auth-form-header{margin-bottom:26px}
.auth-form-title{font-size:26px;font-weight:800;margin:0 0 6px}
.auth-form-subtitle{color:var(--zc-text-muted);margin:0}
.auth-form-container .btn-zentic.w-100{padding:11px 16px;font-size:14px}
@media (max-width:991.98px){.auth-left{display:none}.auth-right{padding:32px 18px}}
