/* Shared operations UI. Keep dense data usable without changing public or print layouts. */
@media screen {
.app-shell .content { max-width: none; padding: 18px clamp(16px, 2.4vw, 36px) 40px; }
.content :is(.page-heading,.role-heading-layout,.employee-heading-layout) {
    flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px 20px;
    min-height: 44px; margin-block: 0 18px;
}
.content :is(.page-heading,.role-heading-layout,.employee-heading-layout)>div:first-child {
    flex: 1 1 280px; width: auto; min-width: 0; max-width: none;
}
.content :is(.page-heading,.role-heading-layout,.employee-heading-layout) .heading-actions {
    flex: 0 1 auto; width: auto; margin: 0; gap: 8px; flex-wrap: wrap; overflow: visible;
}
.content .page-heading>:is(button,a) { margin: 0; align-self: center; }
.content :is(.primary-button,.soft-button,.btn-soft,.secondary-button) { min-height: 40px; }
.content :is(button,a,input,select,textarea):focus-visible { outline: 2px solid #7c193f; outline-offset: 3px; }
.content h1:focus { outline: none; }
.content button:disabled { cursor: not-allowed; opacity: .6; }
.content .recruitment-heading { padding: 18px 22px; border-radius: 8px; }
.content .recruitment-heading .primary-button { color: #27231f !important; background: #eee5d8; margin: 0; }
.content .recruitment-heading .primary-button:hover { background: #fff7eb; }
.content .recruitment-tabs { margin-block: 12px 16px; padding: 4px; }
.content .recruitment-tabs button { min-height: 42px; padding: 8px 16px; }
.content .recruitment-toolbar { padding: 16px 20px; flex-wrap: wrap; gap: 12px; }
.content .recruitment-empty { min-height: 190px; padding: 24px 20px; }
.content .company-selector-ribbon { margin-block: 12px 16px; }
.content .company-ribbon-cards { grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 8px; }
.content .company-ribbon-card { font: inherit; text-align: start; min-width: 0; padding: 10px 12px; border-radius: 7px; }
.content .company-ribbon-card:hover { transform: none; }
.content .company-ribbon-card .ribbon-card-sub { white-space: normal; font-size: 11px; line-height: 1.5; }
.content .contracts-table-panel { padding: 0; }
.content :is(.contracts-table-tools,.employees-table-tools) { padding: 12px 16px; gap: 10px; }
.content .filter-controls { min-width: 0; flex-wrap: wrap; overflow: visible; }
.content .filter-controls select { max-width: 100%; }
.content :is(.table-panel,.recruitment-panel) { min-width: 0; }
.content .page-loading { display: flex; align-items: center; gap: 12px; padding: 24px; border: 1px solid #ded5c8; border-radius: 8px; background: #fff; color: #62584e; }
.content .page-loading-indicator { width: 18px; height: 18px; border: 2px solid #ded5c8; border-top-color: #7c193f; border-radius: 50%; animation: ui-loading .8s linear infinite; }
@keyframes ui-loading { to { transform: rotate(360deg); } }
@media(max-width:700px) {
    .app-shell .content { padding: 14px 14px 32px !important; }
    .content :is(.page-heading,.role-heading-layout,.employee-heading-layout) { gap: 12px; }
    .content :is(.page-heading,.role-heading-layout,.employee-heading-layout)>div:first-child { flex-basis: 100%; }
    .content :is(.page-heading,.role-heading-layout,.employee-heading-layout) .heading-actions { width: 100%; gap: 8px; }
    .content .heading-actions>:is(a,button) { white-space: normal; min-height: 44px; }
    .content .recruitment-heading { padding: 16px; }
    .content .recruitment-heading>.primary-button { width: auto; }
    .content :is(.metrics,.recruitment-stats) { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .content :is(.metrics,.recruitment-stats) article { min-width: 0; padding: 12px !important; }
    .content .company-ribbon-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .content .ribbon-card-name { white-space: normal; }
    .content .ribbon-title-row { flex-wrap: wrap; gap: 8px; }
    .content :is(.contracts-table-tools,.employees-table-tools) .search { min-width: 0; flex-basis: 100%; max-width: none; }
    .content .filter-controls { width: 100%; gap: 8px; }
    .content .filter-controls select { flex: 1 1 145px; width: auto; min-width: 0; }
    .content .recruitment-toolbar a { width: auto; }
}
@media(prefers-reduced-motion:reduce) { .content .page-loading-indicator { animation: none; } }
}

@media screen {
    /* Existing table-responsive wrappers were missing their scroll behavior. */
    .content .table-responsive { width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; }
    .content :is(.page-heading,.heading-actions,.recruitment-empty) .primary-button { font-size: 12px; letter-spacing: normal; }
    @media(max-width:700px) {
        .content .recruitment-tabs { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; width: 100%; }
        .content .recruitment-tabs button { padding: 10px 6px; font-size: 12px; white-space: normal; }
        .content .financial-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }
        .content .financial-kpi-card { padding: 12px !important; min-width: 0; overflow-wrap: anywhere; }
    }
}

@media screen {
    /* Allocation labels are selectors, not ordinary stacked form fields. */
    .content :is(.contract-editor-panel,.contract-modal) .company-allocation-box .card-toggle-wrap {
        display: flex; flex-direction: row; align-items: center; gap: 8px; min-height: 32px;
    }
    .content .company-allocation-box .card-toggle-wrap .card-comp-code {
        flex: none; width: auto; display: inline-flex; align-items: center; justify-content: center;
        min-width: 38px; padding: 3px 7px; font-size: 11px; line-height: 1.5; color: #5c5249;
    }
    .content .company-allocation-box .card-selected .card-toggle-wrap .card-comp-code { color: #fff; background: #7c193f; }
    .content .company-allocation-box .card-toggle-wrap .card-comp-name { min-width: 0; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
    .content .company-allocation-box input.custom-card-checkbox { flex: none; width: 18px !important; height: 18px !important; min-height: 18px; margin: 0; padding: 0; }
    .content .company-allocation-box .company-luxury-grid { align-items: start; grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr)); gap: 12px; }
    .content .company-allocation-box .company-luxury-card { min-width: 0; min-height: 92px; padding: 14px; }
    .content .company-allocation-box .card-sector-text { margin-block: 6px 0; margin-inline-start: 26px; font-size: 11px; line-height: 1.6; color: #716960; }
    .content .company-allocation-box .card-fields-expanded { grid-template-columns: minmax(80px,.8fr) minmax(0,1.2fr); gap: 10px; margin-top: 12px; padding-top: 12px; }
    .content .company-allocation-box .card-field-group { min-width: 0; }
    .content .company-allocation-box .input-suffix-wrap input { padding-inline: 10px 30px; }
    .content .company-allocation-box .mini-label { font-size: 11px; }
    .content .company-allocation-box .luxury-preset-btn { min-height: 38px; font-size: 11px; }
    @media(max-width:720px) {
        .content .company-allocation-box .company-luxury-grid { grid-template-columns: 1fr; }
        .content .company-allocation-box .allocation-title-wrap { min-width: 0; }
    }
}

/* Readable tables across finance, inventory, HR and operational registers. */
@media screen {
 .content :is(.data-table,.finance-table,.table-panel table) { border-collapse:collapse; font-variant-numeric:tabular-nums; }
 .content :is(.data-table,.finance-table,.table-panel table) th { font-size:12px; font-weight:700; color:#514a43; text-align:start; line-height:1.65; background:#f3f1ec; border-bottom:1px solid #cbc3b7; }
 .content :is(.data-table,.finance-table,.table-panel table) td { font-size:13px; line-height:1.75; border-bottom-color:#e5e0d8; }
 .content :is(.data-table,.finance-table,.table-panel table) tbody tr:nth-child(even) { background:#fcfbf8; }
 .content :is(.data-table,.finance-table,.table-panel table) tbody tr:hover { background:#f4f0e8; }
 .content :is(.data-table,.finance-table,.table-panel table) tr:focus-within { outline:2px solid #c5ab84; outline-offset:-2px; }
 .content :is(.data-table,.finance-table,.table-panel table) :is(.num-col,.text-end,.text-right.amount) { font-variant-numeric:tabular-nums; white-space:nowrap; text-align:end; }
 .content :is(.data-table,.finance-table) :is(.status-tag,.badge) { line-height:1.65; font-size:11px; }
 .content .finance-panel>h2 { padding:18px 20px; margin:0; font-size:18px; border-bottom:1px solid #e5e0d8; }
 .content .finance-panel>details { padding:12px 20px; border-bottom:1px solid #e5e0d8; }
 .content .finance-panel>details>summary { cursor:pointer; line-height:1.8; overflow-wrap:anywhere; font-size:13px; }
 @media(max-width:760px) {
  /* Keep one table formatting context: header and body must share column widths. */
  .content .finance-panel>.finance-table thead,
  .content .modal-body-content>.finance-table thead,
  .content .statement-card .statement-table-view thead { display:table-header-group; width:auto; }
  .content .finance-panel>.finance-table tbody,
  .content .modal-body-content>.finance-table tbody,
  .content .statement-card .statement-table-view tbody { display:table-row-group; width:auto; }
  .content :is(.table-responsive,.table-scroll,.table-wrapper) { overflow-x:auto; max-width:100%; overscroll-behavior-inline:contain; }
  .content :is(.data-table,.finance-table) :is(th,td) { padding:12px 14px; }
 }
}

@media screen {
 .content .date-cell, .content .document-number { white-space:nowrap; direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums; }
 .content .document-number { display:inline-block; }
}