:root{--op-detail-pad: 14px;--op-detail-radius: 10px;--op-detail-label: #5c6b7a;--op-detail-value: #0b1a2e;--op-detail-card-bg: #ffffff;--op-detail-card-border: #d5dee9;--op-detail-fade: #e8edf3}body.petrosol-theme{--op-detail-label: #6b5a48;--op-detail-value: #2e1f13;--op-detail-card-border: #d4b896}.op-record-page .box,.op-detail-card{border:1px solid var(--op-detail-card-border);border-radius:var(--op-detail-radius);background:var(--op-detail-card-bg);box-shadow:0 1px 2px rgba(15,47,63,0.04);overflow:hidden}.op-record-page .box-body,.op-detail-card .box-body{padding:var(--op-detail-pad)}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips)),.op-dl-row{display:flex;align-items:baseline;gap:12px 16px;margin:0 0 2px;padding:8px 6px;border-radius:6px}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips)):hover,.op-dl-row:hover{background:#f3f7fb}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>label,.op-dl-row__label{flex:0 0 11rem;max-width:42%;margin:0;font-size:12px;font-weight:600;color:var(--op-detail-label);letter-spacing:0;text-transform:none}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>:not(label),.op-dl-row__value{flex:1 1 auto;min-width:0;color:var(--op-detail-value);font-size:14px;font-weight:500;word-break:break-word;overflow-wrap:anywhere}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>.op-status-badge,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.op-status-badge,.content .box-body .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.op-status-badge,.op-detail-card .box-body .form-group>.op-status-badge,.op-dl-row__value>.op-status-badge,.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>.label,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.label,.content .box-body .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.label,.op-detail-card .box-body .form-group>.label,.op-dl-row__value>.label,.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>.badge,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.badge,.content .box-body .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.badge,.op-detail-card .box-body .form-group>.badge,.op-dl-row__value>.badge{display:inline-flex;align-items:center;flex:0 0 auto;align-self:baseline;width:auto;max-width:100%;padding:0.3em 0.75em;border-radius:999px;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:0.02em;white-space:nowrap;overflow-wrap:normal;word-break:normal}.op-record-modal-panel .label.op-status-badge{padding:0.3em 0.75em;border-radius:999px}.op-record-tabs,.op-record-page .nav-tabs,.op-record-modal-panel .nav-tabs{position:relative;display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;gap:0;margin-bottom:12px;padding:0 2px 2px;border-bottom:1px solid #e2e8f0;-webkit-mask-image:linear-gradient(90deg, #000 0%, #000 calc(100% - 28px), transparent 100%);mask-image:linear-gradient(90deg, #000 0%, #000 calc(100% - 28px), transparent 100%)}.op-record-tabs>li,.op-record-page .nav-tabs>li,.op-record-modal-panel .nav-tabs>li{float:none;flex:0 0 auto;margin-bottom:0}.op-record-tabs>li>a,.op-record-page .nav-tabs>li>a,.op-record-modal-panel .nav-tabs>li>a{white-space:nowrap;padding:10px 14px;font-weight:600;border-radius:8px 8px 0 0}@media (min-width: 1024px){.op-record-page .nav-tabs{-webkit-mask-image:none;mask-image:none;flex-wrap:wrap}}.op-record-modal-header{flex-wrap:nowrap;gap:8px}.op-record-modal-heading-wrap{min-width:0;flex:1 1 auto}.op-record-modal-heading-wrap .modal-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px;line-height:1.3}.op-record-modal-header-actions{flex:0 0 auto;gap:6px}.op-record-modal-back .op-record-modal-back-label,#op-record-modal-full{white-space:nowrap}@media (max-width: 767px){.op-record-page,.op-record-modal-panel{--op-detail-pad: 12px}.op-record-page .content,.op-record-page.op-customer-show{padding-left:10px;padding-right:10px}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips)),.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips)),.op-dl-row{flex-direction:column;align-items:stretch;gap:2px;padding:10px 8px;margin:0;border-bottom:1px solid #eef1f5;border-radius:0}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips)):last-child,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips)):last-child,.op-dl-row:last-child{border-bottom:0}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>label,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>label,.op-dl-row__label{flex:none;max-width:none;width:100%;font-size:11px;font-weight:700;letter-spacing:0.02em;text-transform:uppercase;color:var(--op-detail-label)}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>:not(label),.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>:not(label),.op-dl-row__value{width:100%;font-size:15px;font-weight:500}.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>.op-status-badge,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.op-status-badge,.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>.label,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.label,.op-record-page .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>.badge,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.badge{align-self:flex-start;width:auto}.op-record-modal-dialog{width:calc(100vw - 8px) !important;margin:4px auto !important;max-width:none !important}.op-record-modal-content{max-height:calc(100vh - 8px);border-radius:12px}.op-record-modal-header{flex-wrap:wrap;padding:8px 10px;gap:6px 8px}.op-record-modal-heading-wrap{order:3;flex:1 1 100%;min-width:0}.op-record-modal-heading-wrap .modal-title{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:15px;font-weight:700}.op-record-modal-back{order:1}.op-record-modal-header-actions{order:2;margin-left:auto}#op-record-modal-full{padding-left:10px;padding-right:10px}.op-record-modal-body{padding:8px 8px 12px}.op-record-tabs,.op-record-page .nav-tabs,.op-record-modal-panel .nav-tabs{-webkit-mask-image:linear-gradient(90deg, #000 0%, #000 calc(100% - 36px), transparent 100%);mask-image:linear-gradient(90deg, #000 0%, #000 calc(100% - 36px), transparent 100%);margin-left:-4px;margin-right:-4px;padding-left:4px;padding-right:4px}body.has-mobile-bottom-nav .op-record-actions--sticky,body.has-mobile-bottom-nav .box-footer.op-record-actions.op-record-actions--sticky{bottom:56px}}@media (max-width: 1100px){.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips)){flex-direction:column;align-items:stretch;gap:2px}.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control,.op-choice-chips))>label{flex:none;max-width:none;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.02em}.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.op-status-badge,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.label,.op-record-modal-panel .form-group:not(:has(input,select,textarea,.form-control,.selectize-control))>.badge{align-self:flex-start}}.op-record-actions--sticky,.box-footer.op-record-actions.op-record-actions--sticky{position:sticky;bottom:0;z-index:5;background:rgba(255,255,255,0.96);backdrop-filter:blur(6px);border-top:1px solid #d5dee9;margin:0 -1px -1px;padding:12px 14px;box-shadow:0 -6px 18px rgba(11,26,46,0.06)}@media (max-width: 767px){body.has-mobile-bottom-nav .op-record-actions--sticky,body.has-mobile-bottom-nav .box-footer.op-record-actions.op-record-actions--sticky{bottom:56px}.op-record-actions--sticky .btn{min-height:44px}}@media (max-width: 767px){.op-record-modal-panel .row,.op-record-modal-panel .op-customer-show__body,.op-record-page .op-customer-show__body{display:flex !important;flex-direction:column !important;gap:12px}.op-record-modal-panel .row>[class*="col-"],.op-record-modal-panel .op-customer-show__body>[class*="col-"],.op-record-page .op-customer-show__body>[class*="col-"]{width:100% !important;max-width:100% !important;flex:1 1 100% !important;min-width:0 !important}}@media (max-width: 991px){.op-order-layout{grid-template-columns:minmax(0, 1fr)}.op-order-layout>*,.op-order-facts>*,.op-order-facts__section,.op-record-more{min-width:0;max-width:100%}}@media (max-width: 767px){.op-order-facts{grid-template-columns:minmax(0, 1fr)}.op-order-facts__row{min-width:0;max-width:100%}.op-order-facts__label{min-width:0}.op-order-facts__value,.op-order-facts__value a,.op-order-facts__title{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;word-break:break-word}.op-record-more>summary{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0;max-width:100%}.op-record-more>summary .op-record-more__label{flex:1 1 auto;min-width:0}.op-record-more>summary .op-record-more__chevron{flex:0 0 auto;margin-left:auto}.op-record-modal-panel,.op-record-modal-panel .op-record-hero,.op-record-modal-panel .box{min-width:0;max-width:100%}.op-record-modal-body{overflow-x:hidden}}@media (max-width: 767px){body .op-hscroll>.op-order-values-wrap,body .content .op-order-values-wrap,body .op-order-values-wrap{overflow-x:visible !important}body .op-order-values-wrap table.table.op-order-values{display:block !important;width:100% !important;max-width:100% !important}body .op-order-values-wrap table.table.op-order-values>thead{display:none !important}body .op-order-values-wrap table.table.op-order-values>tbody{display:block !important}body .op-order-values-wrap table.table.op-order-values>tbody>tr{display:flex !important;flex-wrap:wrap;width:100% !important;padding:8px 0 !important;border-bottom:1px solid #eef2f6 !important}body .op-order-values-wrap table.table.op-order-values>tbody>tr>td{display:flex !important;justify-content:space-between;gap:8px;flex:1 1 100%;width:auto !important;min-width:0;padding:2px 0 !important;border:0 !important;white-space:normal !important;text-align:right !important}body .op-order-values-wrap table.table.op-order-values>tbody>tr>td::before{content:attr(data-label) !important;display:block !important;color:#64748b;font-size:12px;font-weight:600;text-align:left}body .op-order-values-wrap table.table.op-order-values>tbody>tr>td.op-order-values__party,body .op-order-values-wrap table.table.op-order-values>tbody>tr>td.op-order-values__stage{flex:0 1 auto;font-weight:700;color:#0f172a;text-align:left !important}body .op-order-values-wrap table.table.op-order-values>tbody>tr>td.op-order-values__stage{margin-left:auto;font-weight:600;color:#475569}body .op-order-values-wrap table.table.op-order-values>tbody>tr>td.op-order-values__party::before,body .op-order-values-wrap table.table.op-order-values>tbody>tr>td.op-order-values__stage::before{content:none !important;display:none !important}}
