/* ReplyOne Global UI Redesign Stage 1 v8.2.0
   Foundation design system for public site, admin panel and client cabinet.
   This file intentionally overrides older page-specific CSS without changing business logic.
*/

:root{
  --ro-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --ro-bg:#f4f8ff;
  --ro-bg-2:#eef5ff;
  --ro-surface:#ffffff;
  --ro-surface-soft:#f8fbff;
  --ro-surface-strong:#eef4ff;
  --ro-line:#dce8f7;
  --ro-line-strong:#c6d8f1;
  --ro-text:#0f172a;
  --ro-muted:#64748b;
  --ro-muted-2:#8090a8;
  --ro-primary:#2563eb;
  --ro-primary-2:#7c3aed;
  --ro-primary-soft:#e8f1ff;
  --ro-success:#16a34a;
  --ro-success-soft:#dcfce7;
  --ro-warning:#d97706;
  --ro-warning-soft:#fef3c7;
  --ro-danger:#dc2626;
  --ro-danger-soft:#fee2e2;
  --ro-info:#0284c7;
  --ro-info-soft:#e0f2fe;
  --ro-radius-xs:10px;
  --ro-radius-sm:14px;
  --ro-radius:18px;
  --ro-radius-lg:24px;
  --ro-radius-xl:30px;
  --ro-shadow-sm:0 8px 22px rgba(15,23,42,.045);
  --ro-shadow:0 16px 42px rgba(15,23,42,.07);
  --ro-shadow-lg:0 28px 80px rgba(15,23,42,.13);
  --ro-sidebar:248px;
  --ro-content:1240px;
  --ro-gap:18px;
}

*{box-sizing:border-box}
html{font-family:var(--ro-font);background:var(--ro-bg)}
body{font-family:var(--ro-font)!important;color:var(--ro-text)!important;background:linear-gradient(135deg,#eef6ff 0%,#f8fbff 48%,#f4f0ff 100%)!important}
body.admin-bg{min-height:100vh!important;overflow-x:hidden!important}

/* Global shell */
.app-layout{
  width:100%!important;
  min-height:100vh!important;
  display:grid!important;
  grid-template-columns:var(--ro-sidebar) minmax(0,1fr)!important;
  align-items:stretch!important;
  background:transparent!important;
}

.sidebar{
  width:var(--ro-sidebar)!important;
  min-width:var(--ro-sidebar)!important;
  min-height:100vh!important;
  height:auto!important;
  position:sticky!important;
  top:0!important;
  align-self:start!important;
  padding:22px 16px!important;
  background:rgba(255,255,255,.78)!important;
  border-inline-end:1px solid rgba(220,232,247,.78)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:none!important;
  overflow:visible!important;
}

.main{
  width:100%!important;
  max-width:var(--ro-content)!important;
  min-width:0!important;
  margin:0 auto!important;
  padding:30px 34px 34px!important;
  overflow:visible!important;
}

/* Brand + sidebar */
.brand,
.brand-logo{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:84px!important;
  margin:0 0 20px!important;
}
.brand img,
.brand-logo img{
  max-width:132px!important;
  max-height:84px!important;
  object-fit:contain!important;
}

.nav{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  width:100%!important;
  overflow:visible!important;
  max-height:none!important;
}
.nav a{
  width:100%!important;
  min-height:42px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:10px 12px!important;
  border:1px solid transparent!important;
  border-radius:15px!important;
  color:#172033!important;
  text-decoration:none!important;
  font-weight:800!important;
  font-size:14px!important;
  transition:.18s ease!important;
  background:transparent!important;
}
.nav a:hover{
  background:#f2f7ff!important;
  border-color:#dbe8fa!important;
}
.nav a.active{
  color:#fff!important;
  background:linear-gradient(135deg,var(--ro-primary),var(--ro-primary-2))!important;
  border-color:transparent!important;
  box-shadow:0 14px 30px rgba(37,99,235,.22)!important;
}
.nav-icon{
  width:28px!important;
  min-width:28px!important;
  height:28px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:11px!important;
  background:rgba(239,246,255,.95)!important;
  color:var(--ro-primary)!important;
  font-size:14px!important;
}
.nav a.active .nav-icon{
  background:rgba(255,255,255,.2)!important;
  color:#fff!important;
}
.nav-text{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

/* Topbar */
.topbar{
  min-height:70px!important;
  margin:0 0 24px!important;
  padding:0!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:18px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.topbar h1{
  margin:0!important;
  font-size:28px!important;
  line-height:1.15!important;
  font-weight:950!important;
  letter-spacing:-.03em!important;
  color:var(--ro-text)!important;
}
.topbar p{
  margin:8px 0 0!important;
  color:var(--ro-muted)!important;
  font-size:15px!important;
  line-height:1.55!important;
}
.top-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:wrap!important;
  gap:10px!important;
}
.avatar{
  width:38px!important;
  height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  background:var(--ro-primary-soft)!important;
  color:var(--ro-primary)!important;
  font-weight:950!important;
}

/* Language switch */
.lang-switch,
.client-lang-switch{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  flex-wrap:wrap!important;
}
.lang-switch a,
.client-lang-switch a{
  min-width:36px!important;
  height:36px!important;
  padding:0 10px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  border:1px solid #d9e7ff!important;
  background:#fff!important;
  color:var(--ro-primary)!important;
  font-size:12px!important;
  font-weight:950!important;
  text-decoration:none!important;
}
.lang-switch a.active,
.client-lang-switch a.active{
  background:linear-gradient(135deg,var(--ro-primary),var(--ro-primary-2))!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 10px 22px rgba(37,99,235,.2)!important;
}

/* Cards / sections */
.card{
  width:100%!important;
  min-width:0!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid var(--ro-line)!important;
  border-radius:var(--ro-radius-lg)!important;
  box-shadow:var(--ro-shadow-sm)!important;
  padding:22px!important;
}
.card h2,
.card h3,
.card h4{
  color:var(--ro-text)!important;
  letter-spacing:-.02em!important;
}
.card h3{
  margin:0 0 10px!important;
  font-size:21px!important;
  line-height:1.25!important;
  font-weight:950!important;
}
.card h4{
  margin:0 0 8px!important;
  font-size:16px!important;
  line-height:1.35!important;
  font-weight:950!important;
}
.small,
.hint,
.card p.small{
  color:var(--ro-muted)!important;
  line-height:1.55!important;
}
.section-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:16px!important;
  margin-bottom:18px!important;
}
.soft-card{
  background:var(--ro-surface-soft)!important;
}

/* Grids */
.grid{display:grid!important;gap:var(--ro-gap)!important;min-width:0!important}
.content-grid,
.client-page-dashboard .content-grid,
.client-page-advertising .content-grid,
.client-page-payments .content-grid,
.client-page-settings .content-grid,
.client-settings-grid,
.client-pro-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:start!important;
}
.kpi-grid,
.client-kpi-grid,
.bot-overview-grid,
.stats-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-items:stretch!important;
}
.kpi{
  min-height:118px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
}
.kpi .label{
  color:var(--ro-muted)!important;
  font-size:13px!important;
  font-weight:850!important;
}
.kpi .value{
  color:var(--ro-text)!important;
  font-size:34px!important;
  line-height:1!important;
  font-weight:950!important;
}
.kpi .hint{
  color:var(--ro-muted)!important;
  font-size:13px!important;
}

/* Forms */
.form-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
}
.form-group{min-width:0!important;margin-bottom:16px!important}
.form-group.full,.full{grid-column:1 / -1!important}
label{
  display:block!important;
  margin:0 0 7px!important;
  color:var(--ro-text)!important;
  font-weight:900!important;
  font-size:13px!important;
}
.input,.select,.textarea,
input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="url"],select,textarea{
  width:100%!important;
  min-width:0!important;
  border:1px solid var(--ro-line-strong)!important;
  border-radius:var(--ro-radius-sm)!important;
  background:#fff!important;
  color:var(--ro-text)!important;
  padding:12px 14px!important;
  font-size:15px!important;
  outline:none!important;
  transition:.16s ease!important;
}
.select,select{height:46px!important}
.textarea,textarea{min-height:120px!important;resize:vertical!important}
.input:focus,.select:focus,.textarea:focus,
input:focus,select:focus,textarea:focus{
  border-color:#93c5fd!important;
  box-shadow:0 0 0 4px rgba(37,99,235,.12)!important;
}

/* Buttons */
.btn,
button.btn,
.btn-primary,
.btn-outline{
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  border-radius:var(--ro-radius-sm)!important;
  padding:10px 15px!important;
  border:1px solid transparent!important;
  font-weight:950!important;
  font-size:14px!important;
  line-height:1.2!important;
  text-decoration:none!important;
  cursor:pointer!important;
  white-space:normal!important;
  transition:.16s ease!important;
}
.btn-primary{
  color:#fff!important;
  background:linear-gradient(135deg,var(--ro-primary),var(--ro-primary-2))!important;
  box-shadow:0 12px 28px rgba(37,99,235,.22)!important;
}
.btn-primary:hover{transform:translateY(-1px)!important;box-shadow:0 16px 34px rgba(37,99,235,.27)!important}
.btn-outline{
  color:var(--ro-text)!important;
  background:#fff!important;
  border-color:var(--ro-line)!important;
  box-shadow:none!important;
}
.btn-outline:hover{background:var(--ro-surface-soft)!important;border-color:#bdd3f2!important}
.btn-small{min-height:34px!important;padding:7px 11px!important;font-size:13px!important}
.btn.disabled,.btn[disabled],button[disabled]{
  opacity:.45!important;
  pointer-events:none!important;
}

/* Badges / statuses */
.pill,.badge,.status-chip{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:24px!important;
  padding:4px 10px!important;
  border-radius:999px!important;
  font-size:12px!important;
  font-weight:950!important;
  line-height:1!important;
  border:1px solid transparent!important;
  font-style:normal!important;
}
.pill-ok,.status-active,.status-answered{background:var(--ro-success-soft)!important;color:#166534!important}
.pill-blue,.status-new{background:var(--ro-info-soft)!important;color:#0369a1!important}
.pill-warn,.status-in_work,.status-pending{background:var(--ro-warning-soft)!important;color:#92400e!important}
.status-closed,.status-disabled{background:#f1f5f9!important;color:#475569!important}
.status-error,.status-blocked{background:var(--ro-danger-soft)!important;color:#991b1b!important}

/* Tables */
.table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  border:1px solid var(--ro-line)!important;
  border-radius:var(--ro-radius)!important;
  background:#fff!important;
}
.table{
  width:100%!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
.table th{
  padding:13px 14px!important;
  color:#475569!important;
  background:#f8fbff!important;
  font-size:12px!important;
  font-weight:950!important;
  text-align:start!important;
  text-transform:uppercase!important;
  letter-spacing:.04em!important;
  border-bottom:1px solid var(--ro-line)!important;
}
.table td{
  padding:14px!important;
  color:var(--ro-text)!important;
  border-bottom:1px solid #edf3fb!important;
  vertical-align:top!important;
}
.table tr:last-child td{border-bottom:0!important}

/* Alerts / empty states */
.alert{
  border-radius:var(--ro-radius)!important;
  padding:14px 16px!important;
  margin:0 0 18px!important;
  border:1px solid var(--ro-line)!important;
  background:#fff!important;
}
.alert-ok{background:#ecfdf5!important;border-color:#86efac!important;color:#166534!important}
.alert-danger{background:#fef2f2!important;border-color:#fecaca!important;color:#991b1b!important}
.alert-warn{background:#fffbeb!important;border-color:#fde68a!important;color:#92400e!important}

/* Modals */
.modal-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:9999!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:22px!important;
  background:rgba(15,23,42,.44)!important;
  backdrop-filter:blur(7px)!important;
}
.modal-backdrop[hidden]{display:none!important}
.modal-card{
  width:min(860px,calc(100vw - 32px))!important;
  max-height:calc(100vh - 44px)!important;
  overflow:auto!important;
  background:#fff!important;
  border:1px solid var(--ro-line)!important;
  border-radius:var(--ro-radius-lg)!important;
  box-shadow:var(--ro-shadow-lg)!important;
  padding:24px!important;
}
.modal-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin-bottom:10px!important;
}
.modal-head h3{margin:0!important}
.modal-close{
  width:38px!important;height:38px!important;border-radius:12px!important;
  border:1px solid var(--ro-line)!important;background:#f8fbff!important;color:var(--ro-text)!important;
  font-size:24px!important;font-weight:950!important;cursor:pointer!important;
}
body.modal-open{overflow:hidden!important}

/* Pagination */
.admin-pagination,.client-pagination{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  flex-wrap:wrap!important;
  margin-top:16px!important;
  padding:12px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:var(--ro-radius)!important;
  background:var(--ro-surface-soft)!important;
}
.pagination-info{color:var(--ro-muted)!important;font-size:13px!important;font-weight:800!important}
.pagination-buttons{display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important}
.pagination-buttons .active{background:var(--ro-primary)!important;color:#fff!important;border-color:var(--ro-primary)!important}

/* Rich editor */
.rich-editor{
  border:1px solid var(--ro-line-strong)!important;
  border-radius:var(--ro-radius)!important;
  background:#fff!important;
  overflow:hidden!important;
}
.rich-toolbar{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  padding:8px!important;
  background:#f8fbff!important;
  border-bottom:1px solid var(--ro-line)!important;
}
.rich-toolbar button{
  min-height:32px!important;
  border:1px solid #d8e3f5!important;
  border-radius:10px!important;
  background:#fff!important;
  padding:6px 10px!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.rich-area{min-height:150px!important;padding:14px!important;outline:none!important;line-height:1.6!important}
.compact-rich-editor .rich-area{min-height:108px!important}

/* Helpdesk standard */
.helpdesk-toolbar-card{margin-bottom:18px!important}
.helpdesk-toolbar-head{
  display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:18px!important;margin-bottom:16px!important
}
.helpdesk-standard-grid{grid-template-columns:390px minmax(0,1fr)!important;gap:18px!important;align-items:start!important}
.helpdesk-list-card,.helpdesk-thread-card{min-height:520px!important}
.helpdesk-column-title{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:14px!important}
.helpdesk-column-title h3{margin:0!important}
.helpdesk-column-title span{
  min-width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;
  background:var(--ro-primary-soft);color:var(--ro-primary);font-weight:950
}
.helpdesk-filter-bar{display:flex!important;flex-direction:column!important;gap:14px!important;margin:16px 0 18px!important}
.helpdesk-status-tabs{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
.helpdesk-tab{
  display:inline-flex!important;align-items:center!important;gap:7px!important;padding:9px 12px!important;border-radius:999px!important;
  border:1px solid #d9e7ff!important;background:#f8fbff!important;color:var(--ro-primary)!important;font-size:13px!important;font-weight:950!important;text-decoration:none!important
}
.helpdesk-tab span{
  min-width:22px;height:22px;padding:0 7px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#e8f1ff;color:#1d4ed8;font-size:12px
}
.helpdesk-tab.active{background:linear-gradient(135deg,var(--ro-primary),var(--ro-primary-2))!important;border-color:transparent!important;color:#fff!important}
.helpdesk-tab.active span{background:rgba(255,255,255,.2)!important;color:#fff!important}
.helpdesk-search{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto!important;gap:8px!important;align-items:center!important}
.support-ticket-list{display:flex!important;flex-direction:column!important;gap:10px!important}
.support-ticket-item{
  display:flex!important;flex-direction:column!important;gap:5px!important;padding:14px 15px!important;
  border:1px solid var(--ro-line)!important;border-radius:var(--ro-radius)!important;background:#fff!important;text-decoration:none!important
}
.support-ticket-item:hover,.support-ticket-item.active{background:#f5f9ff!important;border-color:#bcd3ff!important;box-shadow:0 10px 24px rgba(37,99,235,.08)!important}
.helpdesk-thread-header{
  display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important;
  padding-bottom:16px!important;margin-bottom:16px!important;border-bottom:1px solid var(--ro-line)!important
}
.helpdesk-thread-body{max-height:620px!important;overflow-y:auto!important;padding:4px 6px 4px 2px!important}
.support-thread{display:flex!important;flex-direction:column!important;gap:12px!important;margin:18px 0!important}
.support-message{
  max-width:86%!important;border:1px solid var(--ro-line)!important;border-radius:20px!important;padding:14px 16px!important;background:#fff!important
}
.support-message.admin{margin-inline-start:auto!important;background:#eff6ff!important;border-color:#bfdbfe!important}
.support-message.client{margin-inline-end:auto!important;background:#f8fafc!important}
.support-message-meta{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;color:var(--ro-muted)!important;font-size:12px!important;margin-bottom:8px!important}
.support-message-body{line-height:1.62!important;color:var(--ro-text)!important}

/* Footer */
.footer-note{
  display:block!important;
  width:auto!important;
  margin:24px 0 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:center!important;
  color:var(--ro-muted)!important;
  font-size:13px!important;
}

/* Public landing compatibility */
.site-shell,.landing-shell,.public-shell{font-family:var(--ro-font)!important}
.hero,.public-hero,.landing-hero{
  border-radius:var(--ro-radius-xl)!important;
  background:linear-gradient(135deg,#ffffff 0%,#f3f7ff 100%)!important;
  border:1px solid var(--ro-line)!important;
  box-shadow:var(--ro-shadow)!important;
}

/* RTL */
html.rtl body,
body.rtl{
  direction:rtl!important;
}
.rtl .sidebar{border-inline-end:0!important;border-inline-start:1px solid rgba(220,232,247,.78)!important}
.rtl .table th,.rtl .table td{text-align:right!important}
.rtl .support-message.admin{margin-inline-start:0!important;margin-inline-end:auto!important}
.rtl .support-message.client{margin-inline-end:0!important;margin-inline-start:auto!important}

/* Responsive */
@media(max-width:1280px){
  :root{--ro-content:100%}
  .kpi-grid,.client-kpi-grid,.bot-overview-grid,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .client-plan-cards{grid-template-columns:1fr!important}
}
@media(max-width:1050px){
  .app-layout{grid-template-columns:1fr!important}
  .sidebar{
    position:relative!important;width:100%!important;min-width:0!important;min-height:auto!important;border-inline-end:0!important;border-bottom:1px solid var(--ro-line)!important
  }
  .brand,.brand-logo{min-height:54px!important;margin-bottom:12px!important}
  .brand img,.brand-logo img{max-height:54px!important}
  .main{padding:22px!important}
  .content-grid,
  .client-page-dashboard .content-grid,
  .client-page-advertising .content-grid,
  .client-page-payments .content-grid,
  .client-page-settings .content-grid,
  .client-settings-grid,
  .client-pro-grid,
  .admin-support-grid,
  .client-support-grid,
  .helpdesk-standard-grid,
  .client-bot-cards,
  .language-cards{
    grid-template-columns:1fr!important;
  }
  .helpdesk-list-card,.helpdesk-thread-card{min-height:0!important}
  .helpdesk-thread-body{max-height:none!important}
}
@media(max-width:720px){
  .main{padding:18px!important}
  .topbar,.section-head,.helpdesk-toolbar-head,.helpdesk-thread-header{flex-direction:column!important}
  .top-actions{width:100%!important;justify-content:flex-start!important}
  .kpi-grid,.client-kpi-grid,.bot-overview-grid,.stats-grid,.form-grid,.helpdesk-search{grid-template-columns:1fr!important}
  .card{padding:18px!important;border-radius:18px!important}
  .modal-card{padding:18px!important;border-radius:18px!important}
  .support-message{max-width:100%!important}
  .nav-text{white-space:normal!important}
}


/* ReplyOne Admin Layout Standard Stage 2 v8.2.1 */
.replyone-admin-shell .ro-admin-layout{
  grid-template-columns:260px minmax(0,1fr)!important;
}
.replyone-admin-shell .ro-sidebar{
  width:260px!important;
  min-width:260px!important;
  padding:18px 14px!important;
  background:rgba(255,255,255,.86)!important;
}
.ro-sidebar-inner{
  display:flex!important;
  flex-direction:column!important;
  min-height:calc(100vh - 36px)!important;
}
.ro-sidebar-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:14px!important;
}
.ro-sidebar-head .brand{
  flex:1!important;
  min-height:64px!important;
  margin:0!important;
  justify-content:flex-start!important;
}
.ro-sidebar-head .brand img{
  max-width:145px!important;
  max-height:62px!important;
}
.ro-sidebar-close{
  display:none!important;
  width:36px!important;
  height:36px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:12px!important;
  background:#f8fbff!important;
  color:var(--ro-text)!important;
  font-size:23px!important;
  line-height:1!important;
  font-weight:950!important;
  cursor:pointer!important;
}
.ro-nav{
  gap:18px!important;
}
.ro-nav-group{
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
}
.ro-nav-group-label{
  padding:0 12px 2px!important;
  color:var(--ro-muted-2)!important;
  font-size:11px!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  letter-spacing:.07em!important;
}
.ro-nav a{
  min-height:40px!important;
  padding:9px 11px!important;
  border-radius:14px!important;
  font-size:13px!important;
}
.ro-nav .nav-icon{
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
}
.ro-main{
  max-width:1280px!important;
  padding:26px 32px 34px!important;
}
.ro-page{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}
.ro-topbar{
  align-items:center!important;
  padding:14px 16px!important;
  margin-bottom:20px!important;
  border:1px solid rgba(220,232,247,.78)!important;
  border-radius:26px!important;
  background:rgba(255,255,255,.82)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:0 10px 30px rgba(15,23,42,.045)!important;
}
.ro-topbar-left{
  display:flex!important;
  align-items:flex-start!important;
  gap:13px!important;
  min-width:0!important;
}
.ro-page-title{
  min-width:0!important;
}
.ro-page-title h1{
  font-size:26px!important;
}
.ro-page-title p{
  max-width:700px!important;
}
.ro-menu-toggle{
  display:none!important;
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:14px!important;
  background:#fff!important;
  color:var(--ro-text)!important;
  font-size:21px!important;
  font-weight:950!important;
  cursor:pointer!important;
}
.ro-top-actions{
  flex-wrap:nowrap!important;
}
.ro-admin-user{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-width:0!important;
  padding:5px 9px 5px 5px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:999px!important;
  background:#fff!important;
}
.ro-admin-user-text{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  line-height:1.15!important;
}
.ro-admin-user-text strong{
  color:var(--ro-text)!important;
  font-size:13px!important;
  font-weight:950!important;
  max-width:130px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.ro-admin-user-text span{
  color:var(--ro-muted)!important;
  font-size:11px!important;
  max-width:130px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.admin-mobile-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:8998!important;
  background:rgba(15,23,42,.45)!important;
  backdrop-filter:blur(4px)!important;
}
.admin-mobile-backdrop[hidden]{
  display:none!important;
}

/* Layout consistency helpers for admin pages */
.replyone-admin-shell .card{
  margin:0!important;
}
.replyone-admin-shell .grid + .card,
.replyone-admin-shell .card + .grid,
.replyone-admin-shell .card + .card{
  margin-top:0!important;
}
.replyone-admin-shell .footer-note{
  margin-top:28px!important;
}

/* RTL admin shell */
.rtl.replyone-admin-shell .ro-sidebar{
  border-inline-start:1px solid rgba(220,232,247,.78)!important;
  border-inline-end:0!important;
}
.rtl.replyone-admin-shell .ro-admin-user{
  padding:5px 5px 5px 9px!important;
}

/* Mobile admin shell */
@media(max-width:1050px){
  .replyone-admin-shell .ro-admin-layout{
    grid-template-columns:1fr!important;
  }
  .replyone-admin-shell .ro-sidebar{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    inset-inline-start:0!important;
    z-index:8999!important;
    width:min(320px,88vw)!important;
    min-width:0!important;
    height:100vh!important;
    min-height:100vh!important;
    overflow-y:auto!important;
    transform:translateX(-110%)!important;
    transition:transform .22s ease!important;
    border-bottom:0!important;
    box-shadow:0 30px 90px rgba(15,23,42,.25)!important;
  }
  .rtl.replyone-admin-shell .ro-sidebar{
    transform:translateX(110%)!important;
  }
  body.admin-sidebar-open .ro-sidebar{
    transform:translateX(0)!important;
  }
  .ro-sidebar-close,
  .ro-menu-toggle{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .ro-sidebar-inner{
    min-height:100%!important;
  }
  .replyone-admin-shell .ro-main{
    padding:18px!important;
  }
  .ro-topbar{
    padding:13px!important;
    border-radius:20px!important;
  }
  .ro-topbar-left{
    align-items:center!important;
  }
  .ro-top-actions{
    flex-wrap:wrap!important;
  }
}
@media(max-width:760px){
  .ro-topbar{
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .ro-topbar-left{
    width:100%!important;
  }
  .ro-top-actions{
    width:100%!important;
    justify-content:flex-start!important;
  }
  .ro-admin-user{
    max-width:100%!important;
  }
  .ro-admin-user-text strong,
  .ro-admin-user-text span{
    max-width:180px!important;
  }
}


/* ReplyOne Admin Pages Standard Stage 3 v8.2.2 */

/* Dashboard */
.ro-kpi{
  position:relative!important;
  overflow:hidden!important;
}
.ro-kpi::after{
  content:""!important;
  position:absolute!important;
  width:96px!important;
  height:96px!important;
  inset-inline-end:-30px!important;
  top:-30px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,rgba(37,99,235,.11),rgba(124,58,237,.09))!important;
}
.ro-kpi-icon{
  width:42px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:16px!important;
  background:var(--ro-primary-soft)!important;
  color:var(--ro-primary)!important;
  font-size:20px!important;
  margin-bottom:12px!important;
}
.dashboard-standard-grid{
  align-items:start!important;
}
.dashboard-action-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}
.dashboard-action-card{
  min-height:116px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  padding:16px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:18px!important;
  background:var(--ro-surface-soft)!important;
  text-decoration:none!important;
  color:var(--ro-text)!important;
  transition:.18s ease!important;
}
.dashboard-action-card:hover{
  transform:translateY(-1px)!important;
  border-color:#bcd3ff!important;
  box-shadow:0 12px 26px rgba(37,99,235,.08)!important;
}
.dashboard-action-card > span{
  width:38px!important;
  height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:14px!important;
  background:#fff!important;
  color:var(--ro-primary)!important;
  font-size:19px!important;
}
.dashboard-action-card strong{
  font-size:15px!important;
  font-weight:950!important;
}
.dashboard-action-card small{
  color:var(--ro-muted)!important;
  line-height:1.45!important;
}

/* Filters */
.ro-filter-bar{
  margin-top:12px!important;
}
.ro-filter-grid{
  display:grid!important;
  grid-template-columns:minmax(240px,1.4fr) repeat(3,minmax(150px,.75fr)) auto!important;
  gap:12px!important;
  align-items:end!important;
}
.ro-filter-grid .form-group{
  margin-bottom:0!important;
}
.ro-filter-actions{
  min-width:160px!important;
}
.ro-filter-buttons{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.ro-filter-search{
  min-width:240px!important;
}

/* Client table standard */
.clients-toolbar-card{
  margin-top:0!important;
}
.clients-table-card{
  margin-top:0!important;
}
.ro-table-wrap{
  box-shadow:none!important;
}
.ro-admin-table td{
  vertical-align:middle!important;
}
.ro-user-cell{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-width:220px!important;
}
.ro-user-avatar,
.client-avatar{
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  border-radius:16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:linear-gradient(135deg,#eff6ff,#f3e8ff)!important;
  color:var(--ro-primary)!important;
  font-weight:950!important;
}
.ro-inline-status-form{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  min-width:230px!important;
}
.select-small{
  min-height:36px!important;
  height:38px!important;
  padding:7px 11px!important;
  border-radius:12px!important;
}
.clients-create-modal-card{
  width:min(720px,calc(100vw - 32px))!important;
}

/* Compact tables */
.ro-compact-table td,
.ro-compact-table th{
  padding:12px!important;
}
.ro-compact-table .small{
  font-size:12px!important;
}

/* Page spacing normalization */
.admin-page-dashboard .ro-page,
.admin-page-clients .ro-page{
  gap:18px!important;
}

/* Responsive tables to card-like rows */
@media(max-width:1180px){
  .ro-filter-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .ro-filter-actions{
    min-width:0!important;
  }
}
@media(max-width:760px){
  .dashboard-action-grid,
  .ro-filter-grid{
    grid-template-columns:1fr!important;
  }
  .ro-filter-buttons,
  .ro-inline-status-form{
    width:100%!important;
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .ro-inline-status-form{
    min-width:0!important;
  }
  .ro-user-cell{
    min-width:0!important;
  }
}


/* ReplyOne Admin Pages Standard Stages 4+5 v8.2.4 */

/* Bots page */
.bots-kpi-grid,
.helpdesk-kpi-grid{
  margin-bottom:0!important;
}
.bots-toolbar-card,
.bots-table-card{
  margin-top:0!important;
}
.ro-toolbar-summary{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
.bots-filter-grid{
  grid-template-columns:minmax(240px,1.35fr) repeat(3,minmax(150px,.75fr)) auto!important;
}
.bots-table .ro-bot-cell{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-width:220px!important;
}
.ro-bot-avatar{
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#eff6ff,#f3e8ff)!important;
  color:var(--ro-primary)!important;
  font-size:19px!important;
}
.row-has-issue td{
  background:#fff7ed!important;
}
.bot-error{
  color:var(--ro-danger)!important;
  font-weight:800!important;
}
.ro-row-actions{
  min-width:170px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  align-items:stretch!important;
}
.ro-row-actions .inline-form{
  margin:0!important;
}
.ro-row-actions .btn{
  width:100%!important;
}

/* Helpdesk page standard */
.helpdesk-toolbar-standard{
  margin-top:0!important;
}
.helpdesk-admin-standard{
  grid-template-columns:390px minmax(0,1fr)!important;
}
.helpdesk-kpi-grid .ro-kpi-icon{
  margin-bottom:10px!important;
}
.helpdesk-toolbar-standard .helpdesk-search{
  grid-template-columns:minmax(260px,1fr) auto auto!important;
}
.helpdesk-admin-standard .helpdesk-list-card,
.helpdesk-admin-standard .helpdesk-thread-card{
  min-height:560px!important;
}
.helpdesk-admin-standard .support-ticket-item strong{
  font-size:15px!important;
  line-height:1.35!important;
}
.helpdesk-admin-standard .support-ticket-item small{
  color:var(--ro-muted)!important;
  line-height:1.45!important;
}
.helpdesk-admin-standard .support-message{
  box-shadow:none!important;
}
.helpdesk-admin-standard .support-thread-card{
  overflow:hidden!important;
}
.helpdesk-admin-standard .helpdesk-thread-body{
  max-height:640px!important;
}

/* Unified responsive rules for bots/helpdesk */
@media(max-width:1180px){
  .bots-filter-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .helpdesk-admin-standard{
    grid-template-columns:1fr!important;
  }
  .helpdesk-admin-standard .helpdesk-thread-body{
    max-height:none!important;
  }
}
@media(max-width:760px){
  .bots-filter-grid,
  .helpdesk-toolbar-standard .helpdesk-search{
    grid-template-columns:1fr!important;
  }
  .ro-toolbar-summary{
    justify-content:flex-start!important;
  }
  .bots-table .ro-bot-cell{
    min-width:0!important;
  }
  .ro-row-actions{
    min-width:0!important;
  }
}


/* ReplyOne Fluid Layout Fix v8.2.5
   Makes the platform use the available browser width instead of staying as a narrow centered block.
   Applies to admin panel, client cabinet and public landing/auth pages.
*/
:root{
  --ro-sidebar:260px;
  --ro-page-max:1840px;
  --ro-page-pad-x:34px;
  --ro-page-pad-y:26px;
}

/* Full browser workspace for admin/client shells */
.replyone-admin-shell .app-layout,
.client-cabinet-page .app-layout,
body.admin-bg .app-layout{
  width:100vw!important;
  max-width:none!important;
  min-height:100vh!important;
  grid-template-columns:var(--ro-sidebar) minmax(0,1fr)!important;
  margin:0!important;
}

/* Main area should fill the workspace after the sidebar */
.replyone-admin-shell .main,
.replyone-admin-shell .ro-main,
.client-cabinet-page .main,
.client-cabinet-page .ro-main,
body.admin-bg .main{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:var(--ro-page-pad-y) var(--ro-page-pad-x) 34px!important;
}

/* Inner page can be slightly capped only on ultra-wide monitors */
.replyone-admin-shell .ro-page,
.client-cabinet-page .ro-page{
  width:100%!important;
  max-width:var(--ro-page-max)!important;
  margin:0!important;
}

/* Topbar and footer follow page width */
.replyone-admin-shell .ro-topbar,
.client-cabinet-page .topbar,
.client-cabinet-page .ro-topbar,
body.admin-bg .topbar{
  width:100%!important;
  max-width:var(--ro-page-max)!important;
  margin-inline:0!important;
}
.replyone-admin-shell .footer-note,
.client-cabinet-page .footer-note{
  width:100%!important;
  max-width:var(--ro-page-max)!important;
}

/* If old pages use centered wide wrappers, force them to be real workspace width */
.admin-page-wide,
.wide-card,
.bots-page-grid,
.clients-page-cards,
.client-page-dashboard,
.client-page-bots,
.client-page-conversations,
.client-page-advertising,
.client-page-payments,
.client-page-settings,
.client-page-pro,
.client-page-blocked,
.ro-page > section,
.ro-page > div{
  width:100%!important;
  max-width:var(--ro-page-max)!important;
  margin-inline:0!important;
}

/* More useful desktop grids */
.kpi-grid,
.ro-kpi-grid,
.bot-overview-grid,
.stats-grid,
.client-kpi-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

.content-grid,
.dashboard-standard-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

.clients-grid,
.clients-page-cards,
.client-settings-grid,
.client-pro-grid{
  grid-template-columns:minmax(0,1.35fr) minmax(360px,.65fr)!important;
}

/* Helpdesk should use the browser width: list on the left, thread wider on the right */
.helpdesk-standard-grid,
.helpdesk-admin-standard,
.admin-support-grid,
.client-support-grid{
  grid-template-columns:minmax(360px,34%) minmax(0,66%)!important;
  width:100%!important;
  max-width:var(--ro-page-max)!important;
}

.helpdesk-list-card,
.helpdesk-thread-card,
.support-thread-card{
  min-width:0!important;
}
.helpdesk-thread-card,
.support-thread-card{
  width:100%!important;
}
.helpdesk-thread-body{
  max-height:calc(100vh - 430px)!important;
  min-height:260px!important;
}

/* Tables should use available width and not feel squeezed */
.table-wrap,
.ro-table-wrap{
  width:100%!important;
  max-width:100%!important;
}
.ro-admin-table,
.clients-table,
.bots-table,
.table{
  min-width:960px!important;
}
.bots-table{
  min-width:1180px!important;
}
.clients-table{
  min-width:1080px!important;
}

/* Cards and controls occupy the row, not a centered island */
.card,
.bots-toolbar-card,
.bots-table-card,
.clients-toolbar-card,
.clients-table-card,
.helpdesk-toolbar-card{
  width:100%!important;
  max-width:100%!important;
}

/* Public landing/auth pages */
body:not(.admin-bg) .landing,
body:not(.admin-bg) .site-shell,
body:not(.admin-bg) .landing-shell,
body:not(.admin-bg) .public-shell,
body:not(.admin-bg) main,
body:not(.admin-bg) .container,
body:not(.admin-bg) .wrap{
  width:100%!important;
  max-width:1840px!important;
  margin-inline:auto!important;
}
body:not(.admin-bg){
  overflow-x:hidden!important;
}
body:not(.admin-bg) .hero,
body:not(.admin-bg) .public-hero,
body:not(.admin-bg) .landing-hero{
  width:100%!important;
  max-width:none!important;
}

/* Large screens: keep the product wide but readable */
@media(min-width:1900px){
  :root{
    --ro-page-max:1880px;
    --ro-page-pad-x:42px;
  }
}
@media(min-width:2300px){
  :root{
    --ro-page-max:2040px;
  }
}

/* Medium desktops and laptops */
@media(max-width:1500px){
  :root{
    --ro-page-pad-x:28px;
  }
  .replyone-admin-shell .ro-page,
  .client-cabinet-page .ro-page,
  .replyone-admin-shell .ro-topbar,
  .client-cabinet-page .topbar,
  body.admin-bg .topbar{
    max-width:none!important;
  }
}

/* Tablet */
@media(max-width:1180px){
  .kpi-grid,
  .ro-kpi-grid,
  .bot-overview-grid,
  .stats-grid,
  .client-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .content-grid,
  .dashboard-standard-grid,
  .clients-grid,
  .clients-page-cards,
  .client-settings-grid,
  .client-pro-grid,
  .helpdesk-standard-grid,
  .helpdesk-admin-standard,
  .admin-support-grid,
  .client-support-grid{
    grid-template-columns:1fr!important;
  }
  .helpdesk-thread-body{
    max-height:none!important;
  }
}

/* Mobile: sidebar becomes drawer and content uses full width */
@media(max-width:1050px){
  :root{
    --ro-page-pad-x:18px;
    --ro-page-pad-y:18px;
  }
  .replyone-admin-shell .app-layout,
  .client-cabinet-page .app-layout,
  body.admin-bg .app-layout{
    grid-template-columns:1fr!important;
    width:100%!important;
  }
  .replyone-admin-shell .main,
  .replyone-admin-shell .ro-main,
  .client-cabinet-page .main,
  body.admin-bg .main{
    width:100%!important;
    max-width:none!important;
    padding:var(--ro-page-pad-y) var(--ro-page-pad-x) 28px!important;
  }
  .ro-admin-table,
  .clients-table,
  .bots-table,
  .table{
    min-width:820px!important;
  }
}

/* Small mobile */
@media(max-width:720px){
  :root{
    --ro-page-pad-x:14px;
    --ro-page-pad-y:14px;
  }
  .kpi-grid,
  .ro-kpi-grid,
  .bot-overview-grid,
  .stats-grid,
  .client-kpi-grid{
    grid-template-columns:1fr!important;
  }
  .card{
    padding:16px!important;
  }
  .ro-admin-table,
  .clients-table,
  .bots-table,
  .table{
    min-width:720px!important;
  }
}


/* ReplyOne UI Hotfix v8.2.6 — action buttons and landing inputs */

/* 1) Client table actions: prevent "Сохранить" from breaking into unreadable vertical text */
.clients-table th:last-child,
.clients-table td:last-child{
  width:320px!important;
  min-width:320px!important;
}
.ro-inline-status-form{
  display:grid!important;
  grid-template-columns:minmax(150px,1fr) minmax(104px,auto)!important;
  align-items:center!important;
  gap:10px!important;
  min-width:280px!important;
  width:100%!important;
}
.ro-inline-status-form .select,
.ro-inline-status-form .select-small{
  width:100%!important;
  min-width:150px!important;
}
.ro-inline-status-form .btn{
  min-width:104px!important;
  width:auto!important;
  white-space:nowrap!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  color:#fff!important;
  border-color:transparent!important;
  background:linear-gradient(135deg,var(--ro-primary),var(--ro-primary-2))!important;
  box-shadow:0 10px 22px rgba(37,99,235,.18)!important;
  padding-inline:14px!important;
}

/* 2) Bot table actions: make buttons look like real buttons */
.bots-table th:last-child,
.bots-table td:last-child{
  width:190px!important;
  min-width:190px!important;
}
.ro-row-actions{
  min-width:150px!important;
  width:100%!important;
}
.ro-row-actions .btn,
.bots-table .btn,
.clients-table .btn{
  white-space:nowrap!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  border:1px solid #93c5fd!important;
  background:#eff6ff!important;
  color:#1d4ed8!important;
  font-weight:950!important;
  box-shadow:0 8px 18px rgba(37,99,235,.08)!important;
}
.ro-row-actions .btn:hover,
.bots-table .btn:hover,
.clients-table .btn:hover{
  background:#dbeafe!important;
  border-color:#60a5fa!important;
  transform:translateY(-1px)!important;
}
.ro-row-actions form:first-child .btn{
  color:#fff!important;
  border-color:transparent!important;
  background:linear-gradient(135deg,var(--ro-primary),var(--ro-primary-2))!important;
}

/* 3) Landing login inputs: icons must not overlap user text */
.landing-auth-card .input-with-icon{
  position:relative!important;
}
.landing-auth-card .input-with-icon .field-icon{
  position:absolute!important;
  top:43px!important;
  inset-inline-start:14px!important;
  width:24px!important;
  height:24px!important;
  z-index:2!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:none!important;
  font-size:16px!important;
  opacity:.72!important;
}
.landing-auth-card .input-with-icon .input{
  padding-inline-start:48px!important;
  padding-inline-end:44px!important;
  min-height:48px!important;
}
.rtl .landing-auth-card .input-with-icon .field-icon{
  inset-inline-start:auto!important;
  inset-inline-end:14px!important;
}
.rtl .landing-auth-card .input-with-icon .input{
  padding-inline-start:44px!important;
  padding-inline-end:48px!important;
}

/* 4) Fluid fix correction for client cabinet: prevent content from overflowing to the right */
.client-cabinet-page .ro-page,
.client-cabinet-page .topbar,
.client-cabinet-page .footer-note{
  max-width:1840px!important;
  width:100%!important;
}
.client-cabinet-page .main{
  overflow-x:hidden!important;
}
.client-cabinet-page .table-wrap{
  max-width:100%!important;
  overflow-x:auto!important;
}

/* 5) General table action readability */
.table td:last-child .btn{
  line-height:1.15!important;
  text-align:center!important;
}
.table td:last-child form{
  margin:0!important;
}

/* Mobile correction */
@media(max-width:760px){
  .clients-table th:last-child,
  .clients-table td:last-child,
  .bots-table th:last-child,
  .bots-table td:last-child{
    width:auto!important;
    min-width:180px!important;
  }
  .ro-inline-status-form{
    grid-template-columns:1fr!important;
    min-width:0!important;
  }
  .ro-inline-status-form .btn{
    width:100%!important;
  }
}


/* ReplyOne Client Cabinet + Mobile Fix v8.2.7 */

/* Client shell: same clean behavior as admin, without skew */
.replyone-client-shell .ro-client-layout{
  width:100vw!important;
  max-width:none!important;
  grid-template-columns:260px minmax(0,1fr)!important;
  margin:0!important;
}
.replyone-client-shell .client-sidebar{
  width:260px!important;
  min-width:260px!important;
  padding:18px 14px!important;
  background:rgba(255,255,255,.86)!important;
}
.replyone-client-shell .ro-main{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:24px 30px 34px!important;
  overflow-x:hidden!important;
}
.replyone-client-shell .ro-page,
.replyone-client-shell .topbar,
.replyone-client-shell .footer-note{
  width:100%!important;
  max-width:1840px!important;
  margin-inline:0!important;
}

/* Client topbar */
.client-topbar{
  align-items:center!important;
  margin-bottom:18px!important;
}
.client-topbar .ro-topbar-left{
  min-width:0!important;
  flex:1!important;
}
.client-topbar .ro-page-title{
  min-width:0!important;
}
.client-topbar .ro-page-title h1{
  overflow-wrap:normal!important;
}
.client-top-actions{
  flex-shrink:0!important;
}
.client-user-chip{
  max-width:230px!important;
}

/* Client sidebar */
.replyone-client-shell .ro-sidebar-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:14px!important;
}
.replyone-client-shell .ro-sidebar-head .brand{
  flex:1!important;
  justify-content:flex-start!important;
  min-height:64px!important;
  margin:0!important;
}
.replyone-client-shell .ro-sidebar-head .brand img{
  max-width:145px!important;
  max-height:62px!important;
}
.replyone-client-shell .client-nav{
  gap:7px!important;
}

/* Client dashboard should not use horizontal tables */
.client-dashboard-kpis{
  margin-bottom:0!important;
}
.client-dashboard-grid{
  grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr)!important;
  align-items:start!important;
}
.client-request-list{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
}
.client-request-card{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:12px!important;
  align-items:center!important;
  padding:14px 15px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  color:var(--ro-text)!important;
  text-decoration:none!important;
}
.client-request-card:hover{
  background:#f5f9ff!important;
  border-color:#bcd3ff!important;
}
.client-request-card strong{
  display:block!important;
  margin-bottom:5px!important;
  font-weight:950!important;
}
.client-request-card span{
  display:block!important;
  color:var(--ro-muted)!important;
  line-height:1.45!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.client-request-meta{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  gap:7px!important;
  min-width:120px!important;
}
.client-mini-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.mini-action-card{
  padding:16px!important;
  border-radius:18px!important;
  border:1px solid var(--ro-line)!important;
}
.mini-action-card strong{
  display:block!important;
  margin-bottom:7px!important;
}
.mini-action-card span{
  color:var(--ro-muted)!important;
  line-height:1.5!important;
}

/* Prevent old min-width table rules from breaking client pages */
.replyone-client-shell .table{
  min-width:0!important;
}
.replyone-client-shell .table-wrap{
  max-width:100%!important;
  overflow-x:auto!important;
}
.client-page-dashboard .table,
.client-page-dashboard .table-wrap{
  min-width:0!important;
  overflow-x:visible!important;
}

/* Client mobile backdrop */
.client-mobile-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:8998!important;
  background:rgba(15,23,42,.45)!important;
  backdrop-filter:blur(4px)!important;
}
.client-mobile-backdrop[hidden]{
  display:none!important;
}

/* RTL client shell */
.rtl.replyone-client-shell .client-sidebar{
  border-inline-start:1px solid rgba(220,232,247,.78)!important;
  border-inline-end:0!important;
}

/* Tablet */
@media(max-width:1180px){
  .client-dashboard-grid{
    grid-template-columns:1fr!important;
  }
  .client-mini-grid{
    grid-template-columns:1fr!important;
  }
}

/* Mobile: no giant top blank space, sidebar becomes drawer */
@media(max-width:1050px){
  .replyone-client-shell .ro-client-layout{
    grid-template-columns:1fr!important;
    width:100%!important;
  }
  .replyone-client-shell .client-sidebar{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    inset-inline-start:0!important;
    z-index:8999!important;
    width:min(320px,88vw)!important;
    min-width:0!important;
    height:100vh!important;
    min-height:100vh!important;
    overflow-y:auto!important;
    transform:translateX(-110%)!important;
    transition:transform .22s ease!important;
    border-bottom:0!important;
    box-shadow:0 30px 90px rgba(15,23,42,.25)!important;
  }
  .rtl.replyone-client-shell .client-sidebar{
    transform:translateX(110%)!important;
  }
  body.client-sidebar-open .client-sidebar{
    transform:translateX(0)!important;
  }
  .replyone-client-shell .ro-sidebar-close,
  .replyone-client-shell .ro-menu-toggle{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .replyone-client-shell .ro-main{
    width:100%!important;
    max-width:none!important;
    padding:14px 14px 24px!important;
  }
  .client-topbar{
    padding:12px!important;
    margin-bottom:14px!important;
    border-radius:18px!important;
  }
}

/* Phone */
@media(max-width:760px){
  .client-topbar{
    flex-direction:column!important;
    align-items:stretch!important;
    gap:12px!important;
  }
  .client-topbar .ro-topbar-left{
    width:100%!important;
    align-items:center!important;
  }
  .client-topbar .ro-page-title h1{
    font-size:22px!important;
  }
  .client-topbar .ro-page-title p{
    font-size:13px!important;
    margin-top:4px!important;
  }
  .client-top-actions{
    width:100%!important;
    justify-content:flex-start!important;
    gap:8px!important;
  }
  .client-user-chip{
    max-width:100%!important;
  }
  .client-dashboard-grid,
  .client-dashboard-kpis{
    gap:12px!important;
  }
  .client-request-card{
    grid-template-columns:1fr!important;
  }
  .client-request-meta{
    align-items:flex-start!important;
    min-width:0!important;
  }
  .replyone-client-shell .card{
    padding:15px!important;
    border-radius:18px!important;
  }
  .replyone-client-shell .footer-note{
    margin-top:18px!important;
  }
}


/* ReplyOne Client Cabinet Full Redesign v8.3.0
   Full client cabinet alignment with admin design + mobile top-spacing fix.
*/

/* Hard reset for admin/client mobile gap regressions */
.replyone-admin-shell,
.replyone-client-shell{
  min-height:100dvh!important;
}
.replyone-admin-shell .app-layout,
.replyone-client-shell .app-layout{
  align-items:start!important;
  align-content:start!important;
}
.replyone-admin-shell .ro-main,
.replyone-client-shell .ro-main{
  align-self:start!important;
}

/* Client shell follows admin shell */
.replyone-client-shell .ro-client-layout{
  width:100vw!important;
  max-width:none!important;
  min-height:100dvh!important;
  display:grid!important;
  grid-template-columns:260px minmax(0,1fr)!important;
  margin:0!important;
  background:transparent!important;
}
.replyone-client-shell .client-sidebar{
  width:260px!important;
  min-width:260px!important;
  height:100dvh!important;
  min-height:100dvh!important;
  position:sticky!important;
  top:0!important;
  padding:18px 14px!important;
  background:rgba(255,255,255,.86)!important;
  border-inline-end:1px solid rgba(220,232,247,.78)!important;
  backdrop-filter:blur(18px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.replyone-client-shell .ro-sidebar-inner{
  min-height:calc(100dvh - 36px)!important;
}
.replyone-client-shell .ro-main{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding:26px 32px 34px!important;
  overflow-x:hidden!important;
}
.replyone-client-shell .client-ro-page,
.replyone-client-shell .ro-page,
.replyone-client-shell .topbar,
.replyone-client-shell .footer-note{
  width:100%!important;
  max-width:1840px!important;
  margin-inline:0!important;
}
.replyone-client-shell .client-ro-page{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}

/* Sidebar groups equal to admin */
.replyone-client-shell .ro-nav{
  gap:18px!important;
}
.replyone-client-shell .ro-nav-group{
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
}
.replyone-client-shell .ro-nav-group-label{
  padding:0 12px 2px!important;
  color:var(--ro-muted-2)!important;
  font-size:11px!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  letter-spacing:.07em!important;
}
.replyone-client-shell .ro-nav a{
  min-height:40px!important;
  padding:9px 11px!important;
  border-radius:14px!important;
  font-size:13px!important;
}
.replyone-client-shell .ro-sidebar-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:14px!important;
}
.replyone-client-shell .ro-sidebar-head .brand{
  flex:1!important;
  min-height:64px!important;
  margin:0!important;
  justify-content:flex-start!important;
}
.replyone-client-shell .ro-sidebar-head .brand img{
  max-width:145px!important;
  max-height:62px!important;
}

/* Topbar equal to admin */
.replyone-client-shell .client-topbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:14px 16px!important;
  margin:0 0 18px!important;
  border:1px solid rgba(220,232,247,.78)!important;
  border-radius:26px!important;
  background:rgba(255,255,255,.82)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:0 10px 30px rgba(15,23,42,.045)!important;
}
.replyone-client-shell .client-topbar .ro-topbar-left{
  display:flex!important;
  align-items:flex-start!important;
  gap:13px!important;
  min-width:0!important;
  flex:1!important;
}
.replyone-client-shell .client-topbar .ro-page-title{
  min-width:0!important;
}
.replyone-client-shell .client-topbar .ro-page-title h1{
  font-size:26px!important;
  overflow-wrap:normal!important;
}
.replyone-client-shell .client-topbar .ro-page-title p{
  max-width:760px!important;
}
.replyone-client-shell .client-top-actions{
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
}

/* Admin-like client cards/grids */
.replyone-client-shell .card{
  margin:0!important;
}
.client-standard-grid,
.client-dashboard-grid{
  grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr)!important;
  align-items:start!important;
}
.client-bots-list-grid{
  grid-template-columns:1fr!important;
  gap:18px!important;
}
.client-bot-standard-card{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}
.client-bot-standard-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:16px!important;
}
.ro-bot-cell{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-width:0!important;
}
.ro-bot-avatar{
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#eff6ff,#f3e8ff)!important;
  color:var(--ro-primary)!important;
  font-size:19px!important;
}
.client-bot-standard-head h3{
  margin:0 0 4px!important;
}
.client-bot-standard-meta{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}
.client-bot-standard-meta div{
  padding:12px 14px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:16px!important;
  background:var(--ro-surface-soft)!important;
}
.client-bot-standard-meta span{
  display:block!important;
  color:var(--ro-muted)!important;
  font-size:12px!important;
  font-weight:850!important;
  margin-bottom:4px!important;
}
.client-bot-standard-meta strong{
  color:var(--ro-text)!important;
  overflow-wrap:anywhere!important;
}
.compact-section-head{
  margin-bottom:8px!important;
}
.client-card-actions-row,
.client-bot-actions-row{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
.client-bot-actions-row .inline-form{
  margin:0!important;
}

/* Dashboard */
.client-action-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}
.client-request-list{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
}
.client-request-card{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:12px!important;
  align-items:center!important;
  padding:14px 15px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  color:var(--ro-text)!important;
  text-decoration:none!important;
}
.client-request-card:hover{
  background:#f5f9ff!important;
  border-color:#bcd3ff!important;
}
.client-request-card strong{
  display:block!important;
  margin-bottom:5px!important;
  font-weight:950!important;
}
.client-request-card span{
  display:block!important;
  color:var(--ro-muted)!important;
  line-height:1.45!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.client-request-meta{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  gap:7px!important;
  min-width:120px!important;
}

/* Plan cards */
.client-plan-grid,
.client-plan-cards{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
}
.client-plan-card{
  padding:18px!important;
  border:1px solid var(--ro-line)!important;
  border-radius:20px!important;
  background:#fff!important;
}
.client-plan-price{
  font-size:26px!important;
  font-weight:950!important;
  color:var(--ro-primary)!important;
  margin:8px 0!important;
}

/* Security stack */
.client-security-stack{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}

/* Tables inside client cabinet */
.replyone-client-shell .table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  border-radius:18px!important;
}
.replyone-client-shell .table{
  min-width:720px!important;
}
.client-page-dashboard .table,
.client-page-dashboard .table-wrap{
  min-width:0!important;
  overflow-x:visible!important;
}

/* Helpdesk in client cabinet */
.replyone-client-shell .client-support-grid{
  grid-template-columns:minmax(330px,34%) minmax(0,66%)!important;
  align-items:start!important;
}
.replyone-client-shell .helpdesk-thread-body{
  max-height:calc(100dvh - 430px)!important;
  min-height:260px!important;
}

/* Mobile drawer: force no top spacer */
@media(max-width:1050px){
  html, body{
    min-height:auto!important;
  }
  .replyone-admin-shell .app-layout,
  .replyone-client-shell .app-layout,
  .replyone-client-shell .ro-client-layout{
    display:block!important;
    width:100%!important;
    min-height:auto!important;
    margin:0!important;
  }
  .replyone-admin-shell .ro-main,
  .replyone-client-shell .ro-main{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    margin:0!important;
    padding:12px 12px 24px!important;
    transform:none!important;
  }
  .replyone-admin-shell .ro-topbar,
  .replyone-client-shell .client-topbar{
    margin-top:0!important;
    margin-bottom:12px!important;
    padding:12px!important;
    border-radius:18px!important;
  }
  .replyone-admin-shell .ro-page,
  .replyone-client-shell .client-ro-page,
  .replyone-client-shell .ro-page{
    margin-top:0!important;
    padding-top:0!important;
    gap:12px!important;
  }
  .replyone-admin-shell .ro-sidebar,
  .replyone-client-shell .client-sidebar{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    inset-inline-start:0!important;
    z-index:8999!important;
    width:min(320px,88vw)!important;
    min-width:0!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    overflow-y:auto!important;
    transform:translateX(-110%)!important;
    transition:transform .22s ease!important;
    border-bottom:0!important;
    box-shadow:0 30px 90px rgba(15,23,42,.25)!important;
  }
  .rtl.replyone-admin-shell .ro-sidebar,
  .rtl.replyone-client-shell .client-sidebar{
    transform:translateX(110%)!important;
  }
  body.admin-sidebar-open .ro-sidebar,
  body.client-sidebar-open .client-sidebar{
    transform:translateX(0)!important;
  }
  .replyone-admin-shell .ro-sidebar-close,
  .replyone-client-shell .ro-sidebar-close,
  .replyone-admin-shell .ro-menu-toggle,
  .replyone-client-shell .ro-menu-toggle{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .replyone-client-shell .client-dashboard-grid,
  .replyone-client-shell .client-standard-grid,
  .replyone-client-shell .client-support-grid,
  .replyone-client-shell .client-settings-grid,
  .replyone-client-shell .client-pro-grid{
    grid-template-columns:1fr!important;
  }
  .client-bot-standard-meta{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .client-plan-grid,
  .client-plan-cards{
    grid-template-columns:1fr!important;
  }
  .replyone-client-shell .helpdesk-thread-body{
    max-height:none!important;
    min-height:0!important;
  }
}

/* Phone */
@media(max-width:760px){
  .replyone-admin-shell .ro-main,
  .replyone-client-shell .ro-main{
    padding:10px 10px 20px!important;
  }
  .replyone-admin-shell .ro-topbar,
  .replyone-client-shell .client-topbar{
    flex-direction:column!important;
    align-items:stretch!important;
    gap:10px!important;
  }
  .replyone-client-shell .client-topbar .ro-topbar-left,
  .replyone-admin-shell .ro-topbar-left{
    width:100%!important;
    align-items:center!important;
  }
  .replyone-client-shell .client-topbar .ro-page-title h1,
  .replyone-admin-shell .ro-page-title h1{
    font-size:21px!important;
  }
  .replyone-client-shell .client-topbar .ro-page-title p,
  .replyone-admin-shell .ro-page-title p{
    font-size:12px!important;
    margin-top:3px!important;
    line-height:1.35!important;
  }
  .replyone-client-shell .client-top-actions,
  .replyone-admin-shell .ro-top-actions{
    width:100%!important;
    justify-content:flex-start!important;
    gap:8px!important;
  }
  .replyone-client-shell .card{
    padding:14px!important;
    border-radius:18px!important;
  }
  .client-action-grid,
  .client-request-card,
  .client-bot-standard-meta{
    grid-template-columns:1fr!important;
  }
  .client-request-meta{
    align-items:flex-start!important;
    min-width:0!important;
  }
  .client-bot-standard-head{
    flex-direction:column!important;
  }
  .client-card-actions-row,
  .client-bot-actions-row{
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .client-card-actions-row .btn,
  .client-bot-actions-row .btn{
    width:100%!important;
  }
  .replyone-client-shell .table{
    min-width:640px!important;
  }
}