/* Produzione: layout adattato alla larghezza del workspace, non del viewport. */
@container app-workspace (max-width: 768px) {
body.page-produzione .prod-page-shell {
    gap: 10px !important;
}

body.page-produzione .ov-accordion,
body.page-produzione .prod-orders-panel .ordine-wrapper {
    border-radius: 20px !important;
}

body.page-produzione .prod-orders-section {
    gap: 8px !important;
}

body.page-produzione .prod-orders-head {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    padding: 0 2px !important;
}

body.page-produzione .prod-orders-title-group {
    order: 1 !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
}

body.page-produzione .prod-orders-kicker {
    display: none !important;
}

body.page-produzione .prod-orders-title {
    font-size: 0.98rem !important;
    line-height: 1.15 !important;
}

body.page-produzione .prod-orders-actions {
    order: 2 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
}

body.page-produzione .prod-orders-actions > * {
    flex: 0 0 auto !important;
}

body.page-produzione .prod-orders-count {
    min-height: 30px !important;
    padding: 0 10px !important;
    font-size: 0.68rem !important;
    box-shadow: none !important;
}

body.page-produzione .prod-orders-actions .scroll-btn {
    width: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    gap: 0 !important;
}

body.page-produzione .prod-orders-actions .scroll-btn span,
body.page-produzione .prod-orders-actions .scroll-btn .btn-label {
    display: none !important;
}

body.page-produzione .prod-orders-panel {
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.page-produzione .prod-orders-panel #prod-filter-bar {
    margin: 0 0 10px !important;
    padding: 0 !important;
}

body.page-produzione .prod-orders-panel .pf-trigger-btn {
    min-height: 38px !important;
    padding: 0 12px !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,0.78) !important;
    box-shadow: 0 1px 2px rgba(17,17,17,0.04) !important;
}

/* Production cards: override the legacy nth-child mobile grid so qty is always visible. */
body.page-produzione .prod-orders-panel .item-card {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-areas:
        "product product"
        "dates dates"
        "qty qty"
        "operators status" !important;
    gap: 7px !important;
    padding: 12px 14px !important;
    overflow: visible !important;
}

body.page-produzione .prod-orders-panel .item-card > .item-card-field-product,
body.page-produzione .prod-orders-panel .item-card > .item-card-field-dates,
body.page-produzione .prod-orders-panel .item-card > .item-card-field-qty,
body.page-produzione .prod-orders-panel .item-card > .item-card-field-status,
body.page-produzione .prod-orders-panel .item-card > .item-card-field-operator {
    display: flex !important;
    min-width: 0 !important;
    width: auto !important;
}

body.page-produzione .prod-orders-panel .item-card > .item-card-field-product { grid-area: product !important; }
body.page-produzione .prod-orders-panel .item-card > .item-card-field-dates { grid-area: dates !important; }
body.page-produzione .prod-orders-panel .item-card > .item-card-field-qty { grid-area: qty !important; }
body.page-produzione .prod-orders-panel .item-card > .item-card-field-status { grid-area: status !important; }
body.page-produzione .prod-orders-panel .item-card > .item-card-field-operator { grid-area: operators !important; }

body.page-produzione .prod-orders-panel .item-card-field-qty {
    min-height: 72px !important;
    justify-content: space-between !important;
    background: transparent !important;
    color: inherit !important;
    visibility: visible !important;
    opacity: 1 !important;
}

body.page-produzione .prod-orders-panel .qty-row {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    min-width: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
}

body.page-produzione .prod-orders-panel .qty-totale {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 28px !important;
    padding: 2px 6px !important;
    border-radius: 8px !important;
    background: #f1f5f9 !important;
    color: #111111 !important;
    font-size: 0.88rem !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    visibility: visible !important;
    opacity: 1 !important;
}

body.page-produzione .prod-orders-panel .qty-rim-inline,
body.page-produzione .prod-orders-panel .qty-rimanente-wrap {
    max-width: 100% !important;
    white-space: normal !important;
}

/* Standardizzazione touch targets per pulsanti e trigger operatori */
body.page-produzione .prod-orders-panel .btn-assegnami,
body.page-produzione .prod-orders-panel .btn-assegnami-ord {
    min-height: 48px !important;
    padding: 12px 18px !important;
    font-size: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.page-produzione .prod-orders-panel .item-card-field-status .stato-trigger,
body.page-produzione .prod-orders-panel .item-card-field-operator .op-trigger {
    width: 100% !important;
    min-height: 42px !important;
    padding: 0 12px !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    border: 1px solid rgba(17,17,17,0.08) !important;
    box-shadow: 0 1px 2px rgba(17,17,17,0.04) !important;
    font-size: 10px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    box-sizing: border-box !important;
}

body.page-produzione .prod-orders-panel .item-card-field-operator .op-trigger-label,
body.page-produzione .prod-orders-panel .item-card-field-status .stato-label-txt {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-align: left !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.page-produzione .prod-orders-panel .item-card-field-operator .op-chevron,
body.page-produzione .prod-orders-panel .item-card-field-status .stato-chevron {
    flex: 0 0 auto !important;
    margin-left: auto !important;
}

body.page-produzione .prod-orders-panel .op-popup,
body.page-produzione .prod-orders-panel .stato-popup {
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    border-radius: 14px !important;
}

body.page-produzione .prod-orders-panel .op-option,
body.page-produzione .prod-orders-panel .stato-option {
    min-height: 38px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}
}

@container app-workspace (max-width: 440px) {
    body.page-produzione .prod-orders-panel .item-card {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "product"
            "dates"
            "qty"
            "status"
            "operators" !important;
    }

    body.page-produzione .prod-orders-actions > * {
        flex: 0 0 auto !important;
    }
}