.esa-icon { width:20px; height:20px; flex-shrink:0; vertical-align:middle; display:inline-block; }
/* ESA portal: native WHMCS layouts. Scoped separately from the static preview. */
body.esa-app {
  --esa-ui: 'Inter', Arial, sans-serif;
  --esa-display: 'Geist', Arial, sans-serif;
  --esa-mono: 'Geist Mono', monospace;
  --esa-rail-width: 248px;
  margin: 0; background: var(--esa-bg); color: var(--esa-ink);
  font: 16px/1.6 var(--esa-ui); -webkit-font-smoothing: antialiased;
}
body.esa-app *, body.esa-app *::before, body.esa-app *::after { box-sizing: border-box; }
body.esa-app a { text-decoration: none; }
body.esa-app :is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4) { font-family: var(--esa-display); font-weight: 560; letter-spacing: -.025em; color: var(--esa-ink); }
body.esa-app :is(input,select,textarea,button) { font-family: var(--esa-ui); }
body.esa-app .esa-skip { position: fixed; z-index: 2000; left: 16px; top: -100px; background: var(--esa-accent); color: #161b20; padding: 12px 18px; border-radius: 8px; }
body.esa-app .esa-skip:focus { top: 12px; }
body.esa-app .esa-rail { position: fixed; inset: 0 auto 0 0; z-index: 1030; width: var(--esa-rail-width); display: flex; flex-direction: column; padding: 30px 17px 108px; overflow-y: auto; overscroll-behavior: contain; background: #0c1014; color: #c4cdd5; border-right: 1px solid #252e37; scrollbar-width: thin; scrollbar-color: #34414d transparent; }
body.esa-app .esa-portal-brand { display: flex; align-items: center; gap: 8px; padding: 0 13px 25px; }
body.esa-app .esa-portal-brand img { width: 153px; height: auto; filter: grayscale(1) brightness(0) invert(1); }
body.esa-app .esa-portal-brand>span { font-size: 32px; line-height: 1; color: var(--esa-accent); }
body.esa-app .esa-rail-account { display: flex; align-items: center; gap: 10px; border: 1px solid #2b343d; border-radius: 9px; padding: 12px; margin: 0 4px 20px; }
body.esa-app .esa-account-mark { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 7px; background: #212b34; color: var(--esa-accent); }
body.esa-app .esa-rail-account>div { min-width: 0; }
body.esa-app .esa-rail-account strong { display: block; color: #edf2f5; font-size: 13px; font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.esa-app .esa-rail-account small { display: block; color: #96a5b1!important; font-size: 12px; }
body.esa-app :is(.esa-side-nav,.esa-side-nav ul,.esa-account-links,.esa-account-links ul) { list-style: none; padding: 0; margin: 0; }
body.esa-app .esa-nav-caption { color: #81939f; font-size: 12px; font-weight: 550; text-transform: uppercase; letter-spacing: .12em; padding: 23px 13px 9px; }
body.esa-app .esa-side-link { display: flex; align-items: center; gap: 11px; padding: 11px 13px; min-height: 43px; margin-bottom: 3px; border-radius: 7px; color: #c4cdd5; font-size: 14px; line-height: 1.4; transition: background .15s, color .15s; }
body.esa-app .esa-side-link>i { width: 19px; text-align: center; font-size: 17px; flex-shrink: 0; color: #94a5b3; }
body.esa-app .esa-side-link:hover { background: #1b242c; color: #fff; }
body.esa-app .esa-side-link.active { background: color-mix(in srgb,var(--esa-accent) 11%,#0c1014); color: var(--esa-accent); }
body.esa-app .esa-side-link.active>i { color: inherit; }
body.esa-app .esa-side-link.disabled { opacity: .45; pointer-events: none; }
body.esa-app .esa-nav-count { margin-left: auto; background: #26323d; color: #dbe3e8; border-radius: 5px; padding: 2px 6px; font: 12px var(--esa-mono); }
body.esa-app .esa-nav-divider { margin: 12px 0; border-top: 1px solid #2b343d; }
body.esa-app .esa-rail-bottom { margin-top: auto; padding-top: 25px; }
body.esa-app .esa-side-help { display: grid; grid-template-columns: 22px 1fr; gap: 12px; padding: 18px; border: 1px solid #2b3740; border-radius: 9px; margin: 0 4px 15px; }
body.esa-app .esa-side-help>i { color: var(--esa-accent); }
body.esa-app .esa-side-help strong { font-size: 14px; font-weight: 500; color: #f1f4f6; }
body.esa-app .esa-side-help a { grid-column: 1/-1; display: flex; align-items: center; justify-content: space-between; color: var(--esa-accent); font-size: 13px; }
body.esa-app .esa-workspace { margin-left: var(--esa-rail-width); min-height: 100vh; display: flex; flex-direction: column; min-width: 0; }
body.esa-app #header.esa-topbar { height: 88px; padding: 0 42px; display: flex; align-items: center; justify-content: space-between; gap: 20px; background: var(--esa-surface); border-bottom: 1px solid var(--esa-line); }
body.esa-app .esa-breadcrumb { display: flex; align-items: center; gap: 14px; font-size: 14px; min-width: 0; }
body.esa-app .esa-breadcrumb a,body.esa-app .esa-breadcrumb>span:first-of-type { color: var(--esa-muted); }
body.esa-app .esa-breadcrumb>span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.esa-app .esa-header-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
body.esa-app .esa-icon-button,body.esa-app .esa-avatar { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--esa-line); border-radius: 9px; background: var(--esa-surface); color: var(--esa-ink); font-size: 16px; cursor: pointer; }
body.esa-app .esa-icon-button:hover { background: var(--esa-raised); }
body.esa-app .esa-avatar { background: var(--esa-wash); color: var(--esa-accent-text); border-radius: 50%; font-size: 13px; font-weight: 650; }
body.esa-app .esa-cart-link { position: relative; }
body.esa-app #cartItemCount { position: absolute; top: -4px; right: -5px; padding: 1px 5px; background: var(--esa-accent); color: #172010; border-radius: 6px; font: 11px/1.5 var(--esa-ui); }
body.esa-app .esa-notifications .btn { min-height: 39px; font-size: 12px; border-color: var(--esa-line); background: var(--esa-surface); padding: 8px 12px; color: var(--esa-muted); }
body.esa-app .esa-account-menu .dropdown-menu { width: 272px; max-width: calc(100vw - 24px); padding: 8px; margin-top: 12px; border: 1px solid var(--esa-line); border-radius: 12px; box-shadow: 0 14px 50px #0002; background: var(--esa-surface); }
body.esa-app .esa-account-summary { padding: 12px; margin-bottom: 7px; border-bottom: 1px solid var(--esa-line); }
body.esa-app .esa-account-summary strong,body.esa-app .esa-account-summary small { display: block; overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
body.esa-app .esa-account-summary small { font-size: 12px; margin-top: 4px; }
body.esa-app .esa-account-menu .dropdown-item { display: flex; align-items: center; gap: 10px; border-radius: 6px; font-size: 14px; padding: 9px 11px; white-space: normal; color: var(--esa-ink); }
body.esa-app .esa-account-menu .dropdown-item:hover { background: var(--esa-wash); color: var(--esa-accent-text); }
body.esa-app .esa-account-menu .dropdown-item>i { width: 17px; color: var(--esa-muted); }
body.esa-app .esa-menu-toggle { display: none; }
body.esa-app .esa-rail-backdrop[hidden] { display: none; }
body.esa-app #main-body.esa-page { padding: 39px 42px 65px; width: 100%; max-width: 1450px; margin: 0 auto; flex: 1; min-height: 0; }
body.esa-app #main-body:focus { outline: none; }
body.esa-app .esa-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-bottom: 29px; }
body.esa-app .esa-page-heading h1 { font-size: 34px; line-height: 1.2; letter-spacing: -.045em; font-weight: 550; margin: 0; }
body.esa-app .esa-page-heading p { margin: 10px 0 0; color: var(--esa-muted); font-size: 14px; }
body.esa-app .esa-eyebrow { display: block; margin-bottom: 9px; color: var(--esa-accent-text); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; font-weight: 600; }
body.esa-app .esa-heading-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
body.esa-app .esa-page-grid { display: grid; grid-template-columns: minmax(0,1fr) 270px; align-items: start; gap: 25px; }
body.esa-app .esa-page-grid>.primary-content { grid-column: 1; grid-row: 1; min-width: 0; padding: 0; float: none; width: auto; }
body.esa-app .esa-context { grid-column: 2; grid-row: 1; min-width: 0; }
body.esa-app .esa-wide-page,body.esa-app .esa-list-page { grid-template-columns: minmax(0,1fr); }
body.esa-app .esa-wide-page>.esa-context { grid-column: 1; grid-row: 2; display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 20px; margin-top: 5px; }
body.esa-app .esa-list-page>.esa-context { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 14px; grid-column: 1; grid-row: 1; }
body.esa-app .esa-list-page>.primary-content { grid-row: 2; }
body.esa-app .esa-list-page { row-gap: 18px; }
body.esa-app .esa-context .card-sidebar { background: var(--esa-surface); border: 1px solid var(--esa-line); border-radius: 10px; box-shadow: 0 2px 4px #00000002; overflow: hidden; }
body.esa-app .esa-context .card-sidebar .card-header { padding: 17px 19px; background: transparent; }
body.esa-app .esa-context .card-sidebar .card-title { font-size: 14px; letter-spacing: 0; }
body.esa-app .esa-context .card-sidebar .list-group-item { padding: 13px 19px; font-size: 14px; }
body.esa-app .esa-list-page .esa-context .card-sidebar { flex: 1 1 360px; margin: 0!important; }
body.esa-app .esa-list-page .esa-context .card-sidebar .card-header { padding: 11px 17px 0; border: 0; }
body.esa-app .esa-list-page .esa-context .card-title { color: var(--esa-muted); font-size: 12px; font-family: var(--esa-ui); font-weight: 500; }
body.esa-app .esa-list-page .esa-context .card-minimise { display: none; }
body.esa-app .esa-list-page .esa-context .list-group { display: flex!important; flex-direction: row; flex-wrap: wrap; gap: 5px; padding: 10px; }
body.esa-app .esa-list-page .esa-context .list-group-item { width: auto; border: 0; border-radius: 6px; padding: 8px 10px; font-size: 13px; }
body.esa-app .esa-list-page .esa-context .sidebar-menu-item-wrapper { display: flex; align-items: center; gap: 7px; }
body.esa-app .esa-context .sidebar-menu-item-icon-wrapper { margin-right: 6px; }
body.esa-app .esa-context .badge { border-radius: 5px; padding: 3px 6px; font: 11px var(--esa-mono); background: var(--esa-raised); color: var(--esa-muted); }
body.esa-app .esa-context .list-group-item.active { background: var(--esa-wash); color: var(--esa-accent-text); border-color: var(--esa-line); }
body.esa-app .esa-context .list-group-item.active .badge { background: var(--esa-surface); color: var(--esa-accent-text); }
body.esa-app .esa-context .card-sidebar.d-none { display: block!important; }
body.esa-app .esa-context>.card.d-block.d-md-none { display: none!important; }
body.esa-app .esa-context .sidebar-menu-item-label { min-width: 0; }
body.esa-app .card,body.esa-app .table-container { border: 1px solid var(--esa-line); border-radius: 11px; background: var(--esa-surface); box-shadow: 0 2px 5px #00000003; }
body.esa-app .card { margin-bottom: 24px; }
body.esa-app .card-header { padding: 21px 24px; border-bottom: 1px solid var(--esa-line); background: transparent; }
body.esa-app .card-header .card-title { font-size: 18px; }
body.esa-app .card-body { padding: 24px; }
body.esa-app .card-footer { background: transparent; border-color: var(--esa-line); }
body.esa-app .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 17px; min-height: 43px; font-size: 14px; font-weight: 550; border-radius: 8px; line-height: 1.4; box-shadow: 0 1px 2px #00000005; }
body.esa-app .btn-primary { color: #20180f; background: var(--esa-accent); border-color: var(--esa-accent); }
body.esa-app .btn-primary:hover { color: #20180f; background: var(--esa-accent); border-color: var(--esa-accent); filter: brightness(1.04); }
body.esa-app .btn-default,body.esa-app .btn-outline-default { color: var(--esa-ink); background: var(--esa-surface); border: 1px solid var(--esa-line); }
body.esa-app .btn-xs,body.esa-app .btn-sm { min-height: 33px; padding: 7px 11px; font-size: 12px; }
body.esa-app .btn-block { display: flex; }
body.esa-app .form-group { margin-bottom: 23px; }
body.esa-app :is(.form-control,input[type=text],input[type=email],input[type=password],textarea) { background: var(--esa-surface); color: var(--esa-ink); border-color: var(--esa-line); font-size: 16px; min-height: 47px; border-radius: 8px; box-shadow: 0 1px 2px #00000004; }
body.esa-app :is(.form-control,input,textarea):focus { border-color: var(--esa-accent-text); box-shadow: 0 0 0 3px color-mix(in srgb,var(--esa-accent) 12%,transparent); }
body.esa-app :is(.form-control-label,.form-group>label,label.control-label) { font-size: 14px; font-weight: 550; color: var(--esa-ink); margin-bottom: 9px; }
body.esa-app .input-group-text { background: var(--esa-raised); border-color: var(--esa-line); color: var(--esa-muted); }
body.esa-app .form-control:disabled,body.esa-app .form-control[readonly] { background: var(--esa-raised); color: var(--esa-muted); }
body.esa-app .form-control::placeholder { color: var(--esa-muted); opacity: .8; }
body.esa-app input[type=checkbox],body.esa-app input[type=radio] { accent-color: var(--esa-accent-text); }
body.esa-app input[type=file]::file-selector-button { border: 1px solid var(--esa-line); border-radius: 5px; background: var(--esa-raised); color: var(--esa-ink); padding: 7px 12px; margin-right: 12px; }
body.esa-app fieldset { min-width: 0; }
body.esa-app .table-container { padding: 0; margin: 0 0 24px; overflow: hidden; }
body.esa-app .dataTables_wrapper { padding: 0; }
body.esa-app .esa-table-toolbar { padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--esa-line); }
body.esa-app .esa-table-toolbar .dataTables_info { padding: 0; float: none; font-size: 13px; color: var(--esa-muted); }
body.esa-app .esa-table-toolbar .dataTables_filter { margin: 0; float: none; }
body.esa-app .dataTables_filter label { margin: 0; }
body.esa-app .dataTables_filter input { min-width: 230px; margin: 0; height: 43px; min-height: 43px; padding: 10px 14px; background: var(--esa-bg); font-size: 14px; }
body.esa-app .esa-table-scroll { overflow-x: auto; width: 100%; }
body.esa-app .table { margin: 0!important; border-collapse: collapse!important; width: 100%!important; font-size: 14px; color: var(--esa-ink); }
body.esa-app .table th { padding: 14px 23px; font: 500 12px var(--esa-ui); letter-spacing: .04em; text-transform: uppercase; background: var(--esa-bg); color: var(--esa-muted); border-bottom: 1px solid var(--esa-line); border-top: 0; white-space: nowrap; }
body.esa-app .table td { padding: 21px 23px; border-color: var(--esa-line); background: var(--esa-surface); vertical-align: middle; }
body.esa-app .table tbody tr:hover td { background: color-mix(in srgb,var(--esa-wash) 45%,var(--esa-surface)); }
body.esa-app .table tbody tr:last-child td { border-bottom: 0; }
body.esa-app .table td a { color: var(--esa-ink); }
body.esa-app .table td a:hover { color: var(--esa-accent-text); }
body.esa-app .table td small { display: block; margin-top: 4px; font-size: 12px; }
body.esa-app .table td.dataTables_empty { padding: 72px 25px; font-size: 14px; color: var(--esa-muted); background: var(--esa-surface); }
body.esa-app .esa-table-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; border-top: 1px solid var(--esa-line); padding: 15px 22px; }
body.esa-app .esa-table-footer .dataTables_length,body.esa-app .esa-table-footer .dataTables_paginate { float: none; margin: 0; padding: 0; }
body.esa-app .esa-table-footer .dataTables_length label { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 12px; color: var(--esa-muted); }
body.esa-app .esa-table-footer .esa-select { width: 77px; }
body.esa-app .esa-table-footer .esa-select-trigger { min-height: 36px; font-size: 13px; padding: 7px 10px; }
body.esa-app .status { display: inline-flex; border: 0!important; border-radius: 6px; padding: 5px 9px; font: 500 12px/1.3 var(--esa-ui); background: var(--esa-raised); color: var(--esa-muted); }
body.esa-app :is(.status-active,.status-paid,.status-answered,.status-completed) { background: #e9f6ee; color: #23744b; }
body.esa-app :is(.status-pending,.status-unpaid,.status-customer-reply,.status-open) { background: #fff4d9; color: #946308; }
body.esa-app :is(.status-suspended,.status-overdue,.status-fraud) { background: #fdecee; color: #b73b42; }
[data-theme=dark] body.esa-app :is(.status-active,.status-paid,.status-answered,.status-completed) { background: #183426; color: #84d2a7; }
[data-theme=dark] body.esa-app :is(.status-pending,.status-unpaid,.status-customer-reply,.status-open) { background: #332c1b; color: #edc66a; }
[data-theme=dark] body.esa-app :is(.status-suspended,.status-overdue,.status-fraud) { background: #361f26; color: #f09b9f; }
body.esa-app .esa-service-name { display: flex; align-items: center; gap: 14px; text-align: left; min-width: 210px; }
body.esa-app .esa-service-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--esa-line); border-radius: 9px; background: var(--esa-raised); color: var(--esa-muted); flex-shrink: 0; }
body.esa-app .esa-service-name strong { display: block; font-size: 14px; font-weight: 600; }
body.esa-app .esa-service-name small { font: 12px var(--esa-mono); color: var(--esa-muted); margin-top: 5px; }
body.esa-app .esa-stat-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; margin-bottom: 27px; }
body.esa-app .esa-stat { display: block; border: 1px solid var(--esa-line); border-radius: 11px; padding: 23px; background: var(--esa-surface); color: var(--esa-ink); }
body.esa-app .esa-stat:hover { border-color: var(--esa-accent-text); color: var(--esa-ink); }
body.esa-app .esa-stat>div { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--esa-muted); font-size: 14px; }
body.esa-app .esa-stat i { color: var(--esa-accent-text); font-size: 19px; }
body.esa-app .esa-stat>strong { display: block; font: 500 38px/1.2 var(--esa-display); letter-spacing: -.035em; margin: 18px 0 9px; }
body.esa-app .esa-stat>small { display: block; font-size: 12px; color: var(--esa-muted); }
body.esa-app .client-home-cards>.row { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,1fr); gap: 24px; margin: 0; }
body.esa-app .client-home-cards>.row>div { max-width: none; width: auto; padding: 0; }
body.esa-app .client-home-cards>.row>.col-12 { grid-column: 1/-1; }
body.esa-app .client-home-cards>.row>.col-12:empty { display: none; }
body.esa-app .client-home-cards .card { border-top: 1px solid var(--esa-line); }
body.esa-app .client-home-cards .card-header .card-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
body.esa-app .client-home-cards .card-title>.float-right { order: 5; margin-left: auto; }
body.esa-app .client-home-cards .card-title>i { color: var(--esa-accent-text); font-size: 17px; }
body.esa-app .client-home-cards .list-group-item { padding: 19px 23px; font-size: 14px; color: var(--esa-ink); }
body.esa-app .client-home-cards .card-footer:empty { display: none; }
body.esa-app .esa-quick-links { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; margin: 3px 0 28px; }
body.esa-app .esa-quick-links a { display: flex; align-items: center; gap: 12px; border: 1px solid var(--esa-line); border-radius: 9px; padding: 17px 20px; background: var(--esa-surface); color: var(--esa-ink); font-size: 14px; }
body.esa-app .esa-quick-links i { color: var(--esa-accent-text); }
body.esa-app .nav-tabs { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 25px; border-color: var(--esa-line); }
body.esa-app .nav-tabs .nav-link { padding: 12px 17px; font-size: 14px; font-weight: 500; color: var(--esa-muted); border-radius: 0; border: 0; }
body.esa-app .nav-tabs .nav-link.active { background: transparent; color: var(--esa-accent-text); box-shadow: inset 0 -2px var(--esa-accent-text); }
body.esa-app .product-details .product-icon { padding: 27px; border: 1px solid var(--esa-line); border-radius: 10px 10px 0 0; background: var(--esa-raised); color: var(--esa-ink); }
body.esa-app .product-details .product-icon .fa-circle { color: var(--esa-accent-text); }
body.esa-app .product-details .product-status-text { border-radius: 0 0 10px 10px; font-size: 13px; padding: 9px 12px; }
body.esa-app .product-details .product-icon h3 { font-size: 23px; margin-top: 18px; }
body.esa-app .product-details .product-icon h4 { font: 14px var(--esa-ui); color: var(--esa-muted); }
body.esa-app .product-details .product-actions-wrapper { row-gap: 8px; margin-bottom: 20px; }
body.esa-app .product-details .row>div.text-center { text-align: left!important; }
body.esa-app .product-details .row>div.text-center h4 { font-size: 13px; color: var(--esa-muted); margin-top: 21px; }
body.esa-app .ticket-reply { overflow: hidden; }
body.esa-app .ticket-reply .user { border-bottom: 1px solid var(--esa-line); }
body.esa-app .ticket-reply .message { font-size: 16px; line-height: 1.8; }
body.esa-app .kbarticle,body.esa-app .announcement-single { max-width: 900px; background: var(--esa-surface); padding: 30px; border: 1px solid var(--esa-line); border-radius: 11px; }
body.esa-app .kb-search { border-radius: 11px; background: #10161c; padding: 30px; color: #fff; }
body.esa-app .esa-auth-layout { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--esa-line); border-radius: 13px; overflow: hidden; background: var(--esa-surface); }
body.esa-app .esa-auth-story { background: #0d141b; padding: 45px; display: flex; flex-direction: column; justify-content: center; color: #fff; }
body.esa-app .esa-auth-story h2 { font-size: 37px; line-height: 1.2; color: #fff; letter-spacing: -.045em; }
body.esa-app .esa-auth-story h2 span { color: var(--esa-accent); }
body.esa-app .esa-auth-story p { color: #aebac5; font-size: 16px; line-height: 1.7; margin-top: 20px; }
body.esa-app .esa-auth-story img { display: block; max-width: 100%; margin-top: 30px; border-radius: 9px; }
body.esa-app .esa-auth-form { padding: 28px 12px; min-width: 0; }
body.esa-app .esa-auth-form .login-form .card { border: 0; box-shadow: none; margin: 0; }
body.esa-app .esa-auth-form .login-form .card-body { padding: 25px 30px!important; }
body.esa-app .esa-auth-form .login-form .card-footer { padding: 20px 30px; }
body.esa-app .esa-app-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 42px; border-top: 1px solid var(--esa-line); font-size: 12px; color: var(--esa-muted); }
body.esa-app .esa-app-footer>div { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
body.esa-app .esa-app-footer a { color: var(--esa-muted); }
body.esa-app .esa-locale-button { border: 0; background: none; color: var(--esa-muted); padding: 0; cursor: pointer; font-size: 12px; }
body.esa-app .modal-content { border: 1px solid var(--esa-line); border-radius: 12px; box-shadow: 0 20px 70px #0003; }
body.esa-app .popover { background: var(--esa-surface); border-color: var(--esa-line); border-radius: 10px; box-shadow: 0 12px 35px #0002; }
body.esa-app .popover-header,body.esa-app .popover-body { background: transparent; color: var(--esa-ink); border-color: var(--esa-line); }
body.esa-app .esa-page-grid .main-content { padding: 0; }
body.esa-app .esa-form-surface { padding: 28px; background: var(--esa-surface); border: 1px solid var(--esa-line); border-radius: 11px; }
body.esa-app .esa-form-surface .sub-heading span { background: var(--esa-surface); color: var(--esa-ink); }
body.esa-app .esa-form-surface .form-horizontal .control-label { text-align: left; }
body.esa-app .esa-form-surface .form-horizontal .form-group { padding-bottom: 7px; }
body.esa-app.esa-menu-open { overflow: hidden; }
body.esa-app .esa-welcome-dot { color: var(--esa-accent-text); }
body.esa-app .esa-home-panels { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,1fr); gap: 24px; align-items: start; }
body.esa-app .esa-home-panels>.card { margin: 0; border-top: 1px solid var(--esa-line); }
body.esa-app .esa-home-panels>.esa-panel-wide { grid-column: 1/-1; }
body.esa-app .esa-home-panels .card-title { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
body.esa-app .esa-home-panels .card-title>.float-right { margin-left: auto; order: 5; }
body.esa-app .esa-home-panels .card-title>i { color: var(--esa-accent-text); font-size: 17px; }
body.esa-app .esa-home-panels .list-group-item { padding: 20px 23px; font-size: 14px; }
body.esa-app .esa-home-panels .card-footer:empty { display: none; }
body.esa-app .esa-table-scroll .table-list td:first-child:empty { width: 12px; padding: 0; }
body.esa-app.esa-document { padding: 45px 24px 100px; }
body.esa-app.esa-document .invoice-container { max-width: 1020px; padding: 40px; margin: 0 auto 25px; border: 1px solid var(--esa-line); border-radius: 13px; background: var(--esa-surface); box-shadow: 0 12px 45px #00000006; }
body.esa-app.esa-document .invoice-header { margin-bottom: 28px; }
body.esa-app.esa-document .invoice-header img { max-height: 50px; max-width: 180px; }
body.esa-app.esa-document .invoice-container .invoice-summary { border: 1px solid var(--esa-line); border-radius: 9px; padding: 23px; }
body.esa-app.esa-document .invoice-status { font-size: 18px; margin: 15px 0; }
body.esa-app.esa-document .invoice-container :is(.invoice-col,.small-text) { color: var(--esa-ink); font-size: 14px; }
body.esa-app.esa-document .invoice-container strong { font-weight: 600; }
[data-theme=dark] body.esa-app.esa-document .invoice-container .table-striped tr td { background: var(--esa-surface); }
@media(min-width:1600px) { body.esa-app #main-body.esa-page { padding-top: 48px; } }
@media(max-width:1200px) {
  body.esa-app { --esa-rail-width: 220px; }
  body.esa-app #header.esa-topbar { padding-inline: 27px; }
  body.esa-app #main-body.esa-page { padding: 30px 27px 50px; }
  body.esa-app .esa-page-grid { grid-template-columns: minmax(0,1fr) 230px; gap: 20px; }
  body.esa-app .esa-wide-page,body.esa-app .esa-list-page { grid-template-columns: minmax(0,1fr); }
  body.esa-app .esa-stat { padding: 19px; }
  body.esa-app .esa-notifications .d-sm-inline { display: none!important; }
  body.esa-app .client-home-cards>.row { grid-template-columns: 1fr 1fr; gap: 20px; }
}
@media(max-width:1000px) {
  body.esa-app .esa-page-grid { grid-template-columns: minmax(0,1fr); }
  body.esa-app .esa-page-grid>.esa-context { grid-column: 1; grid-row: 2; }
  body.esa-app .esa-list-page>.esa-context { grid-row: 1; }
  body.esa-app .esa-list-page>.primary-content { grid-row: 2; }
  body.esa-app .esa-stat-grid { grid-template-columns: repeat(2,1fr); }
  body.esa-app .client-home-cards>.row { grid-template-columns: minmax(0,1fr); }
  body.esa-app .esa-home-panels { grid-template-columns: minmax(0,1fr); }
  body.esa-app .esa-quick-links { grid-template-columns: 1fr; gap: 10px; }
  body.esa-app .esa-auth-layout { grid-template-columns: 1fr; }
  body.esa-app .esa-auth-story { padding: 32px; }
  body.esa-app .esa-auth-story img { display: none; }
  body.esa-app .esa-auth-story h2 { font-size: 30px; }
  body.esa-app .esa-app-footer { padding-inline: 27px; flex-wrap: wrap; }
}
@media(max-width:760px) {
  body.esa-app .esa-rail { width: 248px; transform: translateX(-100%); transition: transform .2s; top: 70px; }
  body.esa-app .esa-rail.open { transform: translateX(0); }
  body.esa-app .esa-workspace { margin-left: 0; }
  body.esa-app .esa-menu-toggle { display: inline-flex; }
  body.esa-app #header.esa-topbar { position: sticky; top: 0; z-index: 1035; height: 70px; padding-inline: 18px; gap: 12px; }
  body.esa-app .esa-breadcrumb { margin-right: auto; font-size: 13px; }
  body.esa-app .esa-breadcrumb>a,body.esa-app .esa-breadcrumb>span:first-of-type { display: none; }
  body.esa-app .esa-header-actions { gap: 8px; }
  body.esa-app .esa-icon-button,body.esa-app .esa-avatar { width: 35px; height: 35px; }
  body.esa-app .esa-notifications .btn { width: 35px; height: 35px; min-height: 35px; padding: 0; font-size: 0; }
  body.esa-app .esa-notifications .btn i { font-size: 15px; }
  body.esa-app .esa-notifications .btn span { display: none!important; }
  body.esa-app #main-body.esa-page { padding: 27px 20px 45px; }
  body.esa-app .esa-page-heading { align-items: flex-start; margin-bottom: 24px; }
  body.esa-app .esa-page-heading h1 { font-size: 28px; }
  body.esa-app .esa-page-heading p { font-size: 14px; }
  body.esa-app .esa-heading-actions .btn { font-size: 12px; padding: 9px 12px; }
  body.esa-app .esa-page-grid { gap: 18px; }
  body.esa-app .esa-table-toolbar,body.esa-app .esa-table-footer { padding: 15px; flex-wrap: wrap; }
  body.esa-app .dataTables_filter,body.esa-app .dataTables_filter label,body.esa-app .dataTables_filter input { width: 100%; }
  body.esa-app .esa-table-toolbar .dataTables_info { font-size: 12px; }
  body.esa-app .table th { padding: 12px 17px; }
  body.esa-app .table td { padding: 18px 17px; }
  body.esa-app .esa-rail-backdrop { position: fixed; inset: 70px 0 0; z-index: 1025; background: #0007; border: 0; }
  body.esa-app .esa-app-footer { padding: 23px 20px 85px; }
  body.esa-app .esa-auth-form { padding: 10px; }
  body.esa-app .esa-form-surface { padding: 21px; }
  body.esa-app.esa-document { padding: 22px 14px 85px; }
  body.esa-app.esa-document .invoice-container { padding: 23px; }
}
@media(max-width:480px) {
  body.esa-app .esa-page-heading { flex-direction: column; gap: 16px; }
  body.esa-app .esa-stat-grid { gap: 12px; }
  body.esa-app .esa-stat { padding: 17px; }
  body.esa-app .esa-stat>div { font-size: 12px; }
  body.esa-app .esa-stat>strong { font-size: 32px; }
  body.esa-app .esa-list-page .esa-context .list-group-item { font-size: 12px; padding: 8px; }
  body.esa-app .esa-app-footer>div { gap: 13px; }
}
@media(prefers-reduced-motion:reduce) { body.esa-app * { scroll-behavior: auto!important; transition: none!important; } }
@media print {
  body.esa-app .esa-workspace { margin: 0; }
  body.esa-app #main-body.esa-page { padding: 0; }
  body.esa-app .esa-page-grid { display: block; }
  body.esa-app.esa-document { padding: 0; background: #fff; color: #111; }
  body.esa-app.esa-document .invoice-container { border: 0; box-shadow: none; background: #fff; color: #111; padding: 0; }
  body.esa-app.esa-document .invoice-container :is(h1,h2,h3,p,td,th,.invoice-col,.small-text) { color: #111!important; background: #fff!important; }
}
