.representative-area { --rep-ink:#181c32; --rep-muted:#7e8299; --rep-line:#e4e6ef; --rep-primary:#009ef7; }
.representative-area #kt_content_container,.representative-area #kt_content,.representative-area #kt_post { min-width:0; max-width:100%; }
.representative-area #kt_content_container > .container-fluid { padding-inline:0; }
.representative-navigation { display:flex; align-items:center; gap:.45rem; overflow-x:auto; max-width:100%; padding:.65rem; margin-block:.5rem 1.5rem; border:1px solid #e2e8f0; border-radius:1rem; background:#fff; box-shadow:0 4px 14px rgba(24,38,60,.04); scrollbar-width:thin; }
.representative-navigation-link { display:inline-flex; flex:0 0 auto; align-items:center; gap:.6rem; padding:.75rem 1.1rem; border-radius:.75rem; color:#475569; font-weight:600; line-height:1.5; white-space:nowrap; text-decoration:none; transition:all .2s ease; }
.representative-navigation-link i { color:inherit; font-size:1.1rem; }
.representative-navigation-link:hover { color:#009ef7; background:#f8fafc; }
.representative-navigation-link.is-active { color:#075bc3; background:#eef5fc; box-shadow:0 2px 8px rgba(7,91,195,.08); font-weight:700; }
.rep-context-banner { box-shadow:0 2px 10px rgba(0,158,247,.08); transition:all .2s ease; }
.representative-navigation-link:focus-visible,.representative-area .btn:focus-visible { outline:3px solid #009ef7; outline-offset:3px; }
.representative-area .ticket-header-banner,.representative-public-area .ticket-header-banner { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; padding:1.5rem; margin-bottom:1.5rem; border:1px solid #e4e6ef; border-inline-start:4px solid #009ef7; border-radius:1rem; background:#fff; }
.representative-area .ticket-header-banner p,.representative-public-area .ticket-header-banner p { margin-bottom:0; line-height:1.9; }
.representative-area .ticket-header-banner .symbol { flex-shrink:0; }
.representative-area .rep-header-copy { flex:1 1 16rem; min-width:0; }
.representative-area .rep-header-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; }
.representative-area .card,.representative-area .ticket-card { min-width:0; border:1px solid #e4e6ef; border-radius:1rem; box-shadow:none; }
.representative-area .card-header,.representative-area .ticket-card-header { flex-wrap:wrap; gap:.75rem; min-height:4.5rem; border-bottom:1px solid #eff2f5; }
.representative-area .card-toolbar { flex-wrap:wrap; gap:.6rem; }
.representative-area .card-title { line-height:1.8; }
.representative-area .card-body,.representative-area .ticket-card-body { min-width:0; padding:1.5rem; }
.representative-area .ticket-actions-bar { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.75rem; margin-top:1.25rem; padding-top:1.25rem; border-top:1px solid #eff2f5; }
.representative-area .form-label { line-height:1.8; }
.representative-area textarea.form-control { min-height:7rem; resize:vertical; }
.representative-area .form-control,.representative-area .form-select { min-width:0; max-width:100%; }
.representative-area .notice { line-height:1.9; overflow-wrap:anywhere; }
.representative-area .table-responsive { width:100%; min-width:0; max-width:100%; overscroll-behavior-inline:contain; }
.representative-area .table th { white-space:nowrap; }
.representative-area .table td { vertical-align:middle; }
.representative-area .k-grid { max-width:100%; }
.representative-area .k-grid td { vertical-align:middle; line-height:1.8; }
.representative-area .rep-grid-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; }
.representative-area .rep-grid-actions .btn { margin:0; white-space:nowrap; }
.representative-area .rep-grid-detail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem 1.5rem; padding:1rem; }
.representative-area .rep-grid-detail div { min-width:0; overflow-wrap:anywhere; }
.representative-area .rep-grid-detail dt { color:#7e8299; font-weight:400; margin-bottom:.25rem; }
.representative-area .rep-grid-detail dd { margin:0; color:#181c32; }
.representative-area .rep-list-filter { display:flex; flex-wrap:wrap; gap:.75rem; align-items:end; }
.representative-area .rep-list-filter-field { flex:1 1 18rem; min-width:0; }
.representative-area .rep-empty-state { padding:3rem 1.5rem; text-align:center; line-height:2; }
.representative-area .rep-empty-state > i { display:block; font-size:2.5rem; color:#a1a5b7; margin-bottom:1rem; }
.representative-area .rep-empty-state p { max-width:38rem; margin-inline:auto; color:#7e8299; }
.representative-area .rep-record-id { direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums; }
.representative-public-area .buyer-form { background:#fff; border:1px solid #e4e6ef; border-radius:1rem; padding:1.5rem; }
.representative-public-area .buyer-form .form__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; }
.representative-public-area .buyer-form .form-group { min-width:0; margin:0 0 1rem; }
.representative-public-area .buyer-form .form-group__label { display:block; margin-bottom:.65rem; font-weight:600; line-height:1.8; }
.representative-public-area .buyer-form .form-group__input { width:100%; min-width:0; border:1px solid #e4e6ef; border-radius:.65rem; background:#f5f8fa; padding:.9rem 1rem; }
.representative-public-area .buyer-form .k-widget { max-width:100%; }
.representative-public-area .buyer-form .field-validation-error { display:block; color:#f1416c; margin-top:.5rem; }
@media(max-width:991px) {
 .representative-area .card-header,.representative-area .card-body { padding-inline:1.25rem; }
}
@media(max-width:575px) {
 .representative-navigation { margin-bottom:1rem; padding:.4rem; border-radius:.8rem; }
 .representative-navigation-link { padding:.75rem .85rem; }
 .representative-area .ticket-header-banner,.representative-public-area .ticket-header-banner { padding:1.15rem; }
 .representative-area .rep-header-actions { width:100%; }
 .representative-area .rep-header-actions .btn { flex:1 1 auto; }
 .representative-area .card-body,.representative-area .ticket-card-body { padding:1rem; }
 .representative-area .ticket-actions-bar { flex-direction:column; align-items:stretch; }
 .representative-area .ticket-actions-bar > .btn { width:100%; flex:0 0 auto; }
 /* The shared form enhancer forces a single row with !important; override only these mobile workspaces. */
 body#kt_body.admin-v8-readable.representative-area .jco-admin-form .ticket-actions-bar { flex-direction:column !important; align-items:stretch; }
 body#kt_body.admin-v8-readable.representative-area .jco-admin-form .ticket-actions-bar > .btn { width:100% !important; flex:0 0 auto !important; min-height:44px; }
 .representative-area .card-toolbar { width:100%; }
 .representative-area .rep-list-filter > .btn { flex:1 1 auto; }
 .representative-area .rep-grid-detail,.representative-public-area .buyer-form .form__grid { grid-template-columns:minmax(0,1fr); }
 .representative-public-area .buyer-form { padding:1rem; }
}

.representative-area .table-responsive:focus-visible { outline:3px solid #009ef7; outline-offset:3px; }
.representative-public-area .form-control,
.representative-public-area .form-select { max-width:100%; min-height:44px; border-color:#e4e6ef; border-radius:.65rem; background-color:#f5f8fa; }
.representative-public-area .buyer-form button[type=submit] { min-height:44px; padding:.85rem 1.5rem; border-radius:.65rem; background:#009ef7; color:#fff; }
.representative-public-area #uxFormProformaInvoice .form-group { margin-bottom:1.25rem; }
.representative-public-area #uxFormProformaInvoice label { display:block; margin-bottom:.5rem; }
.representative-public-area #uxFormProformaInvoice .k-widget { max-width:100%; }
@media(max-width:575px) {
 .representative-public-area .buyer-form button[type=submit] { width:100%; }
 .representative-public-area .ticket-actions-bar { display:flex; flex-direction:column; align-items:stretch; gap:.75rem; }
 .representative-public-area .ticket-actions-bar > .btn { width:100%; flex:0 0 auto; }
}
.representative-public-area .card,
.representative-public-area .ticket-card { min-width:0; border:1px solid #e4e6ef; border-radius:1rem; }
.representative-public-area .card-header { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; padding:1.25rem 1.5rem; border-bottom:1px solid #eff2f5; }
.representative-public-area .card-body { min-width:0; padding:1.5rem; }
.representative-public-area .table-responsive { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; }
.representative-public-area .table th { white-space:nowrap; }
.representative-public-area .table td { vertical-align:middle; }
@media(max-width:575px) {
 .representative-public-area .card-header,
 .representative-public-area .card-body { padding:1rem; }
}