/*
 * ComprasApp — Purchase Orders Index Component
 * CSS extraído desde resources/views/purchase-orders/index.blade.php
 * Mantener aquí la capa visual específica del listado de pedidos.
 */

/* PURCHASE_ORDERS_SQUARE_DENSITY_FINAL_START */
.purchase-orders-index{
    --sq-bg:#f7f7f5;
    --sq-card:#ffffff;
    --sq-line:rgba(0,0,0,.075);
    --sq-text:#161616;
    --sq-muted:#727272;
    --sq-soft:rgba(0,0,0,.035);
    --sq-radius:18px;
    --sq-shadow:0 8px 22px rgba(0,0,0,.045);
    padding-bottom:112px;
}

.purchase-orders-index .page-header{
    margin-bottom:14px!important;
}

.purchase-orders-index .page-header h1{
    font-size:32px!important;
    line-height:1!important;
    letter-spacing:-.07em!important;
    margin-bottom:8px!important;
}

.purchase-orders-index .page-header p{
    font-size:15px!important;
    line-height:1.25!important;
    color:var(--sq-muted)!important;
    font-weight:750!important;
    margin:0!important;
}

.purchase-orders-index .po-top-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    margin:16px 0 12px!important;
}

.purchase-orders-index .po-action-button{
    min-height:48px!important;
    border-radius:16px!important;
    background:var(--sq-card)!important;
    border:1px solid var(--sq-line)!important;
    box-shadow:var(--sq-shadow)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    color:var(--sq-text)!important;
    text-decoration:none!important;
    font-size:15px!important;
    font-weight:850!important;
    letter-spacing:-.02em!important;
}

.purchase-orders-index .po-action-button.is-primary{
    background:linear-gradient(180deg,var(--app-accent,#e8ad7a),var(--app-accent-dark,#ad7040))!important;
    color:#fff!important;
    border:0!important;
    box-shadow:0 10px 24px color-mix(in srgb,var(--app-accent-dark,#ad7040) 24%,transparent)!important;
}

.purchase-orders-index .po-action-icon{
    font-size:18px!important;
}

.purchase-orders-index .po-filters{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    margin:0 0 18px!important;
}

.purchase-orders-index .po-filter-button{
    min-height:40px!important;
    border-radius:14px!important;
    background:var(--sq-card)!important;
    border:1px solid var(--sq-line)!important;
    box-shadow:0 5px 14px rgba(0,0,0,.035)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:var(--sq-text)!important;
    text-decoration:none!important;
    font-size:14px!important;
    font-weight:820!important;
    letter-spacing:-.02em!important;
}

.purchase-orders-index .po-filter-button.is-active{
    background:var(--app-accent-soft,#fff1e6)!important;
    color:var(--app-accent-text,#4d2f19)!important;
    border-color:color-mix(in srgb,var(--app-accent-dark,#ad7040) 20%,transparent)!important;
}

@media(max-width:820px){
    .purchase-orders-index .po-desktop-table,
    .purchase-orders-index table.mobile-cardified + .mobile-table-cards{
        display:none!important;
    }

    .purchase-orders-index .po-mobile-cards{
        display:grid!important;
        gap:12px!important;
    }

    .purchase-orders-index .po-card{
        border-radius:20px!important;
        background:var(--sq-card)!important;
        border:1px solid var(--sq-line)!important;
        box-shadow:var(--sq-shadow)!important;
        padding:14px!important;
        overflow:hidden!important;
    }

    .purchase-orders-index .po-card-head{
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto!important;
        gap:10px!important;
        align-items:start!important;
        margin-bottom:12px!important;
    }

    .purchase-orders-index .po-date{
        font-size:12px!important;
        line-height:1!important;
        font-weight:850!important;
        color:var(--sq-muted)!important;
        letter-spacing:.02em!important;
        margin-bottom:5px!important;
    }

    .purchase-orders-index .po-number{
        font-size:17px!important;
        line-height:1.12!important;
        font-weight:900!important;
        letter-spacing:-.035em!important;
        color:#43533d!important;
        text-decoration:none!important;
        overflow-wrap:anywhere!important;
    }

    .purchase-orders-index .po-total{
        font-size:20px!important;
        line-height:1!important;
        font-weight:950!important;
        color:#0d0d0d!important;
        background:transparent!important;
        box-shadow:none!important;
        border-radius:0!important;
        padding:0!important;
        white-space:nowrap!important;
    }

    .purchase-orders-index .po-meta{
        display:grid!important;
        gap:7px!important;
        margin-bottom:12px!important;
    }

    .purchase-orders-index .po-meta-row{
        display:grid!important;
        grid-template-columns:88px minmax(0,1fr)!important;
        gap:10px!important;
        align-items:center!important;
    }

    .purchase-orders-index .po-label{
        font-size:10px!important;
        line-height:1!important;
        font-weight:900!important;
        letter-spacing:.13em!important;
        color:#a1a1a1!important;
        text-transform:uppercase!important;
    }

    .purchase-orders-index .po-value{
        font-size:14px!important;
        line-height:1.18!important;
        font-weight:850!important;
        text-align:right!important;
        color:var(--sq-text)!important;
        overflow-wrap:anywhere!important;
    }

    .purchase-orders-index .po-status{
        min-height:26px!important;
        padding:4px 10px!important;
        border-radius:999px!important;
        font-size:12px!important;
        line-height:1!important;
        font-weight:850!important;
        background:var(--app-accent-soft,#fff1e6)!important;
        color:var(--app-accent-text,#4d2f19)!important;
        border:1px solid color-mix(in srgb,var(--app-accent-dark,#ad7040) 18%,transparent)!important;
        box-shadow:none!important;
    }

    .purchase-orders-index .po-card-actions{
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:7px!important;
        padding-top:11px!important;
        margin-top:2px!important;
        border-top:1px solid var(--sq-line)!important;
    }

    .purchase-orders-index .po-card-actions > *,
    .purchase-orders-index .po-card-actions form{
        margin:0!important;
        width:100%!important;
        min-width:0!important;
    }

    .purchase-orders-index .po-card-actions .button,
    .purchase-orders-index .po-card-actions button{
        width:100%!important;
        min-width:0!important;
        min-height:36px!important;
        border-radius:12px!important;
        padding:0 7px!important;
        font-size:12.5px!important;
        line-height:1!important;
        font-weight:850!important;
        white-space:nowrap!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        background:#fff!important;
        color:var(--sq-text)!important;
        border:1px solid var(--sq-line)!important;
        box-shadow:0 3px 9px rgba(0,0,0,.025)!important;
    }

    .purchase-orders-index .po-card-actions .button:not(.secondary),
    .purchase-orders-index .po-card-actions button:not(.secondary):not(.danger){
        background:var(--app-accent-soft,#fff1e6)!important;
        color:var(--app-accent-text,#4d2f19)!important;
        border-color:color-mix(in srgb,var(--app-accent-dark,#ad7040) 18%,transparent)!important;
    }

    .purchase-orders-index .po-card-actions .danger{
        color:#6f2d2d!important;
    }
}
/* PURCHASE_ORDERS_SQUARE_DENSITY_FINAL_END */

.square-po{
    padding-bottom:118px;
}
.square-po .po-head{
    margin:0 0 16px;
}
.square-po .po-head h1{
    margin:0;
    font-size:32px!important;
    line-height:1.02!important;
    letter-spacing:-.065em!important;
}
.square-po .po-head p{
    margin:8px 0 0;
    color:#777;
    font-size:15px;
    font-weight:750;
}
.square-po .po-top-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin:18px 0 14px;
}
.square-po .po-action-button,
.square-po .po-filter-button{
    min-height:50px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    text-decoration:none;
    font-size:15px;
    font-weight:850;
    background:#fff;
    color:#1d1d1f;
    border:1px solid rgba(0,0,0,.07);
    box-shadow:0 6px 18px rgba(0,0,0,.045);
}
.square-po .po-action-button.is-primary{
    background:linear-gradient(180deg,var(--app-accent,#e8ad7a),var(--app-accent-dark,#ad7040))!important;
    color:#fff!important;
    border:0!important;
    box-shadow:0 12px 28px color-mix(in srgb,var(--app-accent-dark,#ad7040) 28%,transparent)!important;
}
.square-po .po-action-icon{
    font-size:19px;
    line-height:1;
}
.square-po .po-filters{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:0 0 18px;
}
.square-po .po-filter-button{
    min-height:44px;
    border-radius:15px;
    font-size:14px;
}
.square-po .po-filter-button.is-active{
    background:var(--app-accent-soft,#fff1e6)!important;
    color:var(--app-accent-text,#4d2f19)!important;
    border-color:color-mix(in srgb,var(--app-accent-dark,#ad7040) 22%,transparent)!important;
}
.square-po .po-desktop-table{
    display:block;
}
.square-po .po-mobile-cards{
    display:none;
}
.square-po .po-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:5px 11px;
    border-radius:999px;
    background:var(--app-accent-soft,#fff1e6)!important;
    color:var(--app-accent-text,#4d2f19)!important;
    border:1px solid color-mix(in srgb,var(--app-accent-dark,#ad7040) 20%,transparent)!important;
    font-size:12px;
    font-weight:850;
    white-space:nowrap;
}

@media(max-width:820px){
    .square-po .po-desktop-table,
    .square-po table.mobile-cardified + .mobile-table-cards{
        display:none!important;
    }
    .square-po .po-mobile-cards{
        display:grid;
        gap:12px;
    }
    .square-po .po-card{
        border-radius:20px;
        background:#fff;
        border:1px solid rgba(0,0,0,.07);
        box-shadow:0 8px 24px rgba(0,0,0,.055);
        padding:14px;
    }
    .square-po .po-card-head{
        display:grid;
        grid-template-columns:minmax(0,1fr) auto;
        gap:12px;
        align-items:start;
        margin-bottom:12px;
    }
    .square-po .po-date{
        font-size:13px;
        font-weight:850;
        color:#8a8a8a;
        letter-spacing:.02em;
    }
    .square-po .po-number{
        display:inline-block;
        margin-top:2px;
        font-size:17px;
        line-height:1.14;
        font-weight:900;
        color:#4f5f45;
        text-decoration:underline;
        text-decoration-thickness:1px;
        text-underline-offset:3px;
        overflow-wrap:anywhere;
    }
    .square-po .po-total{
        font-size:21px;
        line-height:1;
        font-weight:950;
        color:#111;
        white-space:nowrap;
        padding:7px 9px;
        border-radius:14px;
        background:#fff;
        box-shadow:0 5px 15px rgba(0,0,0,.045);
    }
    .square-po .po-meta{
        display:grid;
        gap:7px;
        margin-bottom:12px;
    }
    .square-po .po-meta-row{
        display:grid;
        grid-template-columns:34% 66%;
        gap:10px;
        align-items:center;
    }
    .square-po .po-label{
        color:#999;
        font-size:10px;
        font-weight:900;
        letter-spacing:.16em;
        text-transform:uppercase;
    }
    .square-po .po-value{
        text-align:right;
        font-size:14px;
        font-weight:850;
        color:#171717;
        overflow-wrap:anywhere;
    }
    .square-po .po-card-actions{
        display:grid;
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:8px;
        padding-top:12px;
        border-top:1px solid rgba(0,0,0,.07);
    }
    .square-po .po-card-actions > *,
    .square-po .po-card-actions form{
        margin:0!important;
        width:100%!important;
        min-width:0!important;
    }
    .square-po .po-card-actions .button,
    .square-po .po-card-actions button{
        width:100%!important;
        min-width:0!important;
        min-height:38px!important;
        border-radius:13px!important;
        padding:0 8px!important;
        font-size:12px!important;
        font-weight:850!important;
        white-space:nowrap!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        background:#fff!important;
        color:#171717!important;
        border:1px solid rgba(0,0,0,.075)!important;
        box-shadow:0 5px 14px rgba(0,0,0,.045)!important;
    }
    .square-po .po-card-actions .button:not(.secondary),
    .square-po .po-card-actions button:not(.secondary):not(.danger){
        background:var(--app-accent-soft,#fff1e6)!important;
        color:var(--app-accent-text,#4d2f19)!important;
        border-color:color-mix(in srgb,var(--app-accent-dark,#ad7040) 18%,transparent)!important;
    }
    .square-po .po-card-actions .danger{
        background:#fff!important;
        color:#171717!important;
    }
}

/* PURCHASE_ORDERS_SQUARE_STYLE_FINAL_START */
@media(max-width:820px){
    .purchase-orders-index{
        --po-radius:18px;
        --po-line:rgba(0,0,0,.075);
        --po-card:#fff;
        --po-muted:#767676;
        --po-ink:#171717;
        --po-soft-shadow:0 2px 8px rgba(0,0,0,.035),0 10px 24px rgba(0,0,0,.045);
        padding-bottom:104px;
    }

    .purchase-orders-index .page-header{
        margin-bottom:14px!important;
    }

    .purchase-orders-index .page-header h1{
        font-size:32px!important;
        letter-spacing:-.065em!important;
        line-height:1!important;
        margin-bottom:7px!important;
    }

    .purchase-orders-index .page-header p{
        font-size:15px!important;
        line-height:1.25!important;
        color:#7b7b7b!important;
        font-weight:750!important;
    }

    .purchase-orders-index .po-top-actions{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:10px!important;
        margin:14px 0 12px!important;
    }

    .purchase-orders-index .po-action-button{
        min-height:48px!important;
        border-radius:16px!important;
        padding:0 14px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        gap:8px!important;
        background:#fff!important;
        color:#202020!important;
        border:1px solid var(--po-line)!important;
        box-shadow:0 2px 8px rgba(0,0,0,.035)!important;
        text-decoration:none!important;
        font-size:15px!important;
        font-weight:850!important;
        letter-spacing:-.02em!important;
    }

    .purchase-orders-index .po-action-button.is-primary{
        background:linear-gradient(180deg,var(--app-accent,#e8ad7a),var(--app-accent-dark,#ad7040))!important;
        color:#fff!important;
        border:0!important;
        box-shadow:0 8px 22px color-mix(in srgb,var(--app-accent-dark,#ad7040) 24%,transparent)!important;
    }

    .purchase-orders-index .po-action-icon{
        font-size:18px!important;
        opacity:.9!important;
    }

    .purchase-orders-index .po-filters{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:9px!important;
        margin:0 0 18px!important;
    }

    .purchase-orders-index .po-filter-button{
        min-height:42px!important;
        border-radius:15px!important;
        padding:0 12px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        background:#fff!important;
        color:#242424!important;
        border:1px solid var(--po-line)!important;
        box-shadow:0 2px 8px rgba(0,0,0,.028)!important;
        text-decoration:none!important;
        font-size:14px!important;
        font-weight:850!important;
        letter-spacing:-.015em!important;
    }

    .purchase-orders-index .po-filter-button.is-active{
        background:var(--app-accent-soft,#fff1e6)!important;
        color:var(--app-accent-text,#4d2f19)!important;
        border-color:color-mix(in srgb,var(--app-accent-dark,#ad7040) 18%,transparent)!important;
    }

    .purchase-orders-index .po-mobile-cards{
        display:grid!important;
        gap:12px!important;
    }

    .purchase-orders-index .po-card{
        border-radius:20px!important;
        background:#fff!important;
        border:1px solid var(--po-line)!important;
        box-shadow:var(--po-soft-shadow)!important;
        padding:14px!important;
        overflow:hidden!important;
    }

    .purchase-orders-index .po-card-head{
        display:grid!important;
        grid-template-columns:minmax(0,1fr) auto!important;
        gap:10px!important;
        align-items:start!important;
        margin-bottom:12px!important;
    }

    .purchase-orders-index .po-date{
        font-size:12px!important;
        line-height:1!important;
        color:#8b8b8b!important;
        font-weight:850!important;
        letter-spacing:.02em!important;
        margin-bottom:5px!important;
    }

    .purchase-orders-index .po-number{
        display:block!important;
        font-size:17px!important;
        line-height:1.14!important;
        font-weight:900!important;
        color:#465640!important;
        text-decoration:underline!important;
        text-decoration-thickness:1px!important;
        text-underline-offset:3px!important;
        overflow-wrap:anywhere!important;
        letter-spacing:-.025em!important;
    }

    .purchase-orders-index .po-total{
        font-size:20px!important;
        line-height:1!important;
        font-weight:950!important;
        color:#090909!important;
        background:#fff!important;
        border:1px solid rgba(0,0,0,.055)!important;
        border-radius:14px!important;
        padding:6px 9px!important;
        box-shadow:0 2px 8px rgba(0,0,0,.035)!important;
        white-space:nowrap!important;
    }

    .purchase-orders-index .po-meta{
        display:grid!important;
        gap:7px!important;
        margin:8px 0 12px!important;
    }

    .purchase-orders-index .po-meta-row{
        display:grid!important;
        grid-template-columns:34% minmax(0,66%)!important;
        gap:10px!important;
        align-items:center!important;
        min-height:24px!important;
    }

    .purchase-orders-index .po-label{
        color:#9a9a9a!important;
        font-size:10px!important;
        font-weight:900!important;
        letter-spacing:.17em!important;
        text-transform:uppercase!important;
    }

    .purchase-orders-index .po-value{
        text-align:right!important;
        font-size:14px!important;
        line-height:1.2!important;
        font-weight:850!important;
        color:#171717!important;
        overflow-wrap:anywhere!important;
    }

    .purchase-orders-index .po-status,
    .purchase-orders-index .badge,
    .purchase-orders-index [class*="status-"]{
        min-height:28px!important;
        padding:5px 11px!important;
        border-radius:999px!important;
        display:inline-flex!important;
        align-items:center!important;
        justify-content:center!important;
        background:var(--app-accent-soft,#fff1e6)!important;
        color:var(--app-accent-text,#4d2f19)!important;
        border:1px solid color-mix(in srgb,var(--app-accent-dark,#ad7040) 18%,transparent)!important;
        box-shadow:none!important;
        font-size:12px!important;
        font-weight:850!important;
        white-space:nowrap!important;
    }

    .purchase-orders-index .po-card-actions{
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:7px!important;
        padding-top:11px!important;
        border-top:1px solid rgba(0,0,0,.065)!important;
    }

    .purchase-orders-index .po-card-actions > *,
    .purchase-orders-index .po-card-actions form{
        width:100%!important;
        min-width:0!important;
        margin:0!important;
    }

    .purchase-orders-index .po-card-actions .button,
    .purchase-orders-index .po-card-actions button{
        width:100%!important;
        min-width:0!important;
        min-height:38px!important;
        height:38px!important;
        padding:0 8px!important;
        border-radius:13px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        background:#fff!important;
        color:#171717!important;
        border:1px solid rgba(0,0,0,.075)!important;
        box-shadow:0 1px 5px rgba(0,0,0,.025)!important;
        font-size:12px!important;
        font-weight:850!important;
        letter-spacing:-.01em!important;
        white-space:nowrap!important;
    }

    .purchase-orders-index .po-card-actions a:first-child{
        grid-column:span 1!important;
    }

    .purchase-orders-index .po-card-actions .button:not(.secondary),
    .purchase-orders-index .po-card-actions button:not(.secondary):not(.danger){
        background:var(--app-accent-soft,#fff1e6)!important;
        color:var(--app-accent-text,#4d2f19)!important;
        border-color:color-mix(in srgb,var(--app-accent-dark,#ad7040) 18%,transparent)!important;
        box-shadow:none!important;
    }

    .purchase-orders-index .po-card-actions .danger{
        color:#171717!important;
        background:#fff!important;
    }

    .purchase-orders-index .po-desktop-table,
    .purchase-orders-index table.mobile-cardified,
    .purchase-orders-index table.mobile-cardified + .mobile-table-cards{
        display:none!important;
    }
}

@media(min-width:821px){
    .purchase-orders-index .po-mobile-cards{
        display:none!important;
    }
}
/* PURCHASE_ORDERS_SQUARE_STYLE_FINAL_END */

/* PURCHASE_ORDERS_FORCE_SQUARE_VISIBLE_START */
@media(max-width:820px){
    .purchase-orders-index .page-header h1{
        font-size:30px!important;
        line-height:1!important;
        margin-bottom:6px!important;
    }

    .purchase-orders-index .page-header p{
        font-size:14px!important;
        line-height:1.25!important;
        color:#767676!important;
    }

    .purchase-orders-index .po-top-actions{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
        gap:10px!important;
        margin:14px 0 12px!important;
    }

    .purchase-orders-index .po-action-button{
        min-height:46px!important;
        border-radius:14px!important;
        font-size:14px!important;
        font-weight:850!important;
        box-shadow:0 4px 14px rgba(0,0,0,.045)!important;
    }

    .purchase-orders-index .po-action-button.is-primary{
        background:linear-gradient(180deg,var(--app-accent,#e8ad7a),var(--app-accent-dark,#ad7040))!important;
        color:#fff!important;
        box-shadow:0 10px 24px color-mix(in srgb,var(--app-accent-dark,#ad7040) 24%,transparent)!important;
    }

    .purchase-orders-index .po-filters{
        display:grid!important;
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:8px!important;
        margin:0 0 16px!important;
    }

    .purchase-orders-index .po-filter-button{
        min-height:38px!important;
        border-radius:13px!important;
        font-size:13px!important;
        font-weight:820!important;
        background:#fff!important;
        box-shadow:0 3px 10px rgba(0,0,0,.035)!important;
    }

    .purchase-orders-index .po-mobile-cards{
        display:grid!important;
        gap:12px!important;
    }

    .purchase-orders-index .po-card{
        border-radius:18px!important;
        padding:13px!important;
        background:#fff!important;
        border:1px solid rgba(0,0,0,.075)!important;
        box-shadow:0 7px 20px rgba(0,0,0,.045)!important;
    }

    .purchase-orders-index .po-card-head{
        margin-bottom:10px!important;
        gap:10px!important;
    }

    .purchase-orders-index .po-date{
        font-size:12px!important;
        color:#777!important;
        font-weight:850!important;
        margin-bottom:4px!important;
    }

    .purchase-orders-index .po-number{
        font-size:16px!important;
        line-height:1.14!important;
        font-weight:900!important;
        letter-spacing:-.03em!important;
        text-decoration:none!important;
    }

    .purchase-orders-index .po-total{
        font-size:19px!important;
        font-weight:950!important;
        background:transparent!important;
        box-shadow:none!important;
        padding:0!important;
    }

    .purchase-orders-index .po-meta{
        gap:6px!important;
        margin-bottom:11px!important;
    }

    .purchase-orders-index .po-meta-row{
        grid-template-columns:86px minmax(0,1fr)!important;
        gap:9px!important;
    }

    .purchase-orders-index .po-label{
        font-size:10px!important;
        letter-spacing:.12em!important;
        color:#9b9b9b!important;
        font-weight:900!important;
    }

    .purchase-orders-index .po-value{
        font-size:14px!important;
        line-height:1.16!important;
        font-weight:850!important;
        text-align:right!important;
    }

    .purchase-orders-index .po-status{
        min-height:25px!important;
        padding:4px 10px!important;
        font-size:12px!important;
        background:var(--app-accent-soft,#fff1e6)!important;
        color:var(--app-accent-text,#4d2f19)!important;
        border-color:color-mix(in srgb,var(--app-accent-dark,#ad7040) 18%,transparent)!important;
    }

    .purchase-orders-index .po-card-actions{
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:7px!important;
        padding-top:10px!important;
        margin-top:2px!important;
    }

    .purchase-orders-index .po-card-actions .button,
    .purchase-orders-index .po-card-actions button{
        min-height:36px!important;
        border-radius:12px!important;
        padding:0 6px!important;
        font-size:12px!important;
        font-weight:850!important;
        background:#fff!important;
        color:#161616!important;
        box-shadow:0 2px 8px rgba(0,0,0,.025)!important;
    }

    .purchase-orders-index .po-desktop-table,
    .purchase-orders-index table.mobile-cardified + .mobile-table-cards{
        display:none!important;
    }
}
/* PURCHASE_ORDERS_FORCE_SQUARE_VISIBLE_END */

/* PURCHASE_ORDERS_FINAL_CONTRAST_AND_DENSITY_START */

@media(max-width:820px){

    /* Fondo general algo más limpio */
    .purchase-orders-index{
        background:#f5f5f3!important;
    }

    /* Tarjetas más compactas y menos niebla */
    .purchase-orders-index .po-card{
        padding:12px!important;
        border-radius:18px!important;
        border:1px solid rgba(0,0,0,.065)!important;
        box-shadow:
            0 1px 2px rgba(0,0,0,.02),
            0 8px 20px rgba(0,0,0,.04)!important;
    }

    /* Fecha */
    .purchase-orders-index .po-date{
        color:#70757b!important;
        font-size:11px!important;
        font-weight:900!important;
        letter-spacing:.04em!important;
    }

    /* Número pedido */
    .purchase-orders-index .po-number{
        color:#43503e!important;
        font-size:18px!important;
        line-height:1.08!important;
        font-weight:950!important;
        letter-spacing:-.04em!important;
    }

    /* Importe */
    .purchase-orders-index .po-total{
        font-size:24px!important;
        font-weight:950!important;
        color:#0d0f12!important;
        letter-spacing:-.04em!important;
    }

    /* Filas meta */
    .purchase-orders-index .po-meta{
        gap:8px!important;
        margin-top:10px!important;
        margin-bottom:12px!important;
    }

    .purchase-orders-index .po-meta-row{
        min-height:22px!important;
        align-items:flex-start!important;
    }

    /* Labels MUCHO más visibles */
    .purchase-orders-index .po-label{
        color:#4b5157!important;
        opacity:1!important;
        font-size:10px!important;
        font-weight:950!important;
        letter-spacing:.16em!important;
        text-transform:uppercase!important;
    }

    /* Valores */
    .purchase-orders-index .po-value{
        color:#131518!important;
        opacity:1!important;
        font-size:14px!important;
        font-weight:900!important;
        line-height:1.18!important;
    }

    /* Badge estado */
    .purchase-orders-index .po-status{
        min-height:24px!important;
        padding:3px 10px!important;
        border-radius:999px!important;
        font-size:11px!important;
        font-weight:900!important;
        background:#f4eadf!important;
        color:#5a3720!important;
        border:1px solid rgba(173,112,64,.16)!important;
    }

    /* Separación botones */
    .purchase-orders-index .po-card-actions{
        gap:6px!important;
        padding-top:10px!important;
    }

    /* Botones menos inflados */
    .purchase-orders-index .po-card-actions .button,
    .purchase-orders-index .po-card-actions button{
        min-height:34px!important;
        height:34px!important;
        border-radius:11px!important;
        font-size:11.5px!important;
        font-weight:900!important;
        box-shadow:none!important;
    }

    /* CTA principal más visible */
    .purchase-orders-index .po-action-button.is-primary{
        box-shadow:
            0 10px 24px rgba(173,112,64,.18)!important;
    }

    /* Filtros superiores */
    .purchase-orders-index .po-filter-button{
        min-height:40px!important;
        font-size:13px!important;
        font-weight:850!important;
    }

    /* Quitar exceso blanco */
    .purchase-orders-index .po-card::before,
    .purchase-orders-index .po-card::after{
        display:none!important;
    }
}

/* PURCHASE_ORDERS_FINAL_CONTRAST_AND_DENSITY_END */


/* PURCHASE_ORDERS_OPERATIONAL_DENSITY_FINAL_START */

@media(max-width:820px){

    .purchase-orders-index{
        padding-bottom:96px!important;
    }

    .purchase-orders-index .po-mobile-cards{
        gap:9px!important;
    }

    .purchase-orders-index .po-card{
        padding:10px 11px 9px!important;
        border-radius:16px!important;
        border:1px solid rgba(0,0,0,.075)!important;
        box-shadow:
            0 1px 2px rgba(0,0,0,.025),
            0 5px 14px rgba(0,0,0,.035)!important;
    }

    .purchase-orders-index .po-card-head{
        margin-bottom:8px!important;
        gap:8px!important;
    }

    .purchase-orders-index .po-date{
        font-size:10.5px!important;
        color:#60666d!important;
        font-weight:950!important;
        margin-bottom:2px!important;
    }

    .purchase-orders-index .po-number{
        font-size:16px!important;
        line-height:1.08!important;
        font-weight:950!important;
        color:#40513d!important;
        letter-spacing:-.035em!important;
        text-decoration:none!important;
    }

    .purchase-orders-index .po-total{
        font-size:21px!important;
        line-height:1!important;
        font-weight:950!important;
        color:#08090b!important;
        padding:0!important;
        background:transparent!important;
        border:0!important;
        box-shadow:none!important;
    }

    .purchase-orders-index .po-meta{
        gap:5px!important;
        margin:7px 0 9px!important;
    }

    .purchase-orders-index .po-meta-row{
        grid-template-columns:82px minmax(0,1fr)!important;
        gap:8px!important;
        min-height:18px!important;
        align-items:center!important;
    }

    .purchase-orders-index .po-label{
        color:#252a30!important;
        opacity:1!important;
        font-size:9.5px!important;
        line-height:1!important;
        font-weight:950!important;
        letter-spacing:.15em!important;
        text-transform:uppercase!important;
    }

    .purchase-orders-index .po-value{
        color:#101216!important;
        opacity:1!important;
        font-size:13.25px!important;
        line-height:1.12!important;
        font-weight:900!important;
        text-align:right!important;
        overflow-wrap:anywhere!important;
    }

    .purchase-orders-index .po-status{
        min-height:22px!important;
        padding:3px 9px!important;
        font-size:10.75px!important;
        font-weight:950!important;
        color:#4f321e!important;
        background:#f5eadf!important;
        border:1px solid rgba(100,60,30,.14)!important;
        box-shadow:none!important;
    }

    .purchase-orders-index .po-card-actions{
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:5px!important;
        padding-top:8px!important;
        border-top:1px solid rgba(0,0,0,.06)!important;
    }

    .purchase-orders-index .po-card-actions > *,
    .purchase-orders-index .po-card-actions form{
        margin:0!important;
        min-width:0!important;
        width:100%!important;
    }

    .purchase-orders-index .po-card-actions .button,
    .purchase-orders-index .po-card-actions button{
        min-height:30px!important;
        height:30px!important;
        padding:0 5px!important;
        border-radius:10px!important;
        font-size:10.75px!important;
        line-height:1!important;
        font-weight:900!important;
        box-shadow:none!important;
        background:#fff!important;
        color:#1c1f23!important;
        border:1px solid rgba(0,0,0,.07)!important;
    }

    /* Acción principal: Ver */
    .purchase-orders-index .po-card-actions a.button:first-child{
        background:#111!important;
        color:#fff!important;
        border-color:#111!important;
    }

    /* Reutilizar / Recepcionar / Convertir: acción útil, pero secundaria */
    .purchase-orders-index .po-card-actions .button:not(:first-child):not(.danger),
    .purchase-orders-index .po-card-actions button:not(.danger){
        background:#f8f8f6!important;
        color:#202327!important;
    }

    /* Eliminar nunca debe competir visualmente */
    .purchase-orders-index .po-card-actions .danger,
    .purchase-orders-index .po-card-actions button.danger{
        background:#fff7f6!important;
        color:#8a2e2e!important;
        border-color:#ead7d4!important;
    }

    /* Favorito: icono mínimo */
    .purchase-orders-index .po-card-actions a[href*="favorite"],
    .purchase-orders-index .po-card-actions form[action*="favorite"] button,
    .purchase-orders-index .po-card-actions .favorite,
    .purchase-orders-index .po-card-actions [class*="favorite"]{
        font-size:0!important;
    }

    .purchase-orders-index .po-card-actions a[href*="favorite"]::after,
    .purchase-orders-index .po-card-actions form[action*="favorite"] button::after,
    .purchase-orders-index .po-card-actions .favorite::after,
    .purchase-orders-index .po-card-actions [class*="favorite"]::after{
        content:"♥"!important;
        font-size:13px!important;
        line-height:1!important;
    }

    /* Enviado: menos presencia, porque ya está marcado */
    .purchase-orders-index .po-status:has(+ *),
    .purchase-orders-index .po-status{
        white-space:nowrap!important;
    }

    /* Cabecera y filtros algo más compactos */
    .purchase-orders-index .po-head{
        margin-bottom:12px!important;
    }

    .purchase-orders-index .po-head h1,
    .purchase-orders-index .page-header h1{
        font-size:29px!important;
        line-height:1!important;
        margin-bottom:5px!important;
    }

    .purchase-orders-index .po-head p,
    .purchase-orders-index .page-header p{
        font-size:13.5px!important;
        line-height:1.22!important;
        font-weight:750!important;
        color:#62686f!important;
    }

    .purchase-orders-index .po-top-actions{
        gap:8px!important;
        margin:12px 0 10px!important;
    }

    .purchase-orders-index .po-action-button{
        min-height:42px!important;
        border-radius:13px!important;
        font-size:13.25px!important;
        font-weight:900!important;
    }

    .purchase-orders-index .po-filters{
        gap:7px!important;
        margin-bottom:13px!important;
    }

    .purchase-orders-index .po-filter-button{
        min-height:35px!important;
        border-radius:12px!important;
        font-size:12.25px!important;
        font-weight:900!important;
    }
}

/* PURCHASE_ORDERS_OPERATIONAL_DENSITY_FINAL_END */


/* PURCHASE_ORDERS_BREATHING_ROOM_FINAL_START */

@media(max-width:820px){

    /* Fondo general */
    .purchase-orders-index{
        padding-bottom:104px!important;
    }

    /* MÁS AIRE ENTRE TARJETAS */
    .purchase-orders-index .po-mobile-cards{
        gap:14px!important;
    }

    /* TARJETAS */
    .purchase-orders-index .po-card{
        padding:14px 14px 13px!important;
        border-radius:20px!important;
        border:1px solid rgba(0,0,0,.06)!important;
        box-shadow:
            0 1px 2px rgba(0,0,0,.02),
            0 10px 24px rgba(0,0,0,.045)!important;
        overflow:hidden!important;
    }

    /* CABECERA */
    .purchase-orders-index .po-card-head{
        gap:12px!important;
        margin-bottom:12px!important;
        align-items:flex-start!important;
    }

    /* FECHA */
    .purchase-orders-index .po-date{
        font-size:11px!important;
        line-height:1!important;
        margin-bottom:4px!important;
        color:#737980!important;
        font-weight:850!important;
        letter-spacing:.04em!important;
    }

    /* NÚMERO PEDIDO */
    .purchase-orders-index .po-number{
        font-size:18px!important;
        line-height:1.14!important;
        letter-spacing:-.03em!important;
        font-weight:900!important;
        color:#40503d!important;
        overflow-wrap:anywhere!important;
    }

    /* IMPORTE */
    .purchase-orders-index .po-total{
        font-size:22px!important;
        line-height:1!important;
        font-weight:900!important;
        color:#111317!important;
        letter-spacing:-.03em!important;
        flex-shrink:0!important;
        white-space:nowrap!important;
        margin-left:6px!important;
    }

    /* META */
    .purchase-orders-index .po-meta{
        gap:9px!important;
        margin:10px 0 14px!important;
    }

    .purchase-orders-index .po-meta-row{
        grid-template-columns:92px minmax(0,1fr)!important;
        gap:12px!important;
        align-items:flex-start!important;
    }

    /* LABELS */
    .purchase-orders-index .po-label{
        color:#51575e!important;
        opacity:1!important;
        font-size:10px!important;
        line-height:1.1!important;
        font-weight:900!important;
        letter-spacing:.14em!important;
        text-transform:uppercase!important;
    }

    /* VALUES */
    .purchase-orders-index .po-value{
        color:#15181c!important;
        opacity:1!important;
        font-size:14px!important;
        line-height:1.25!important;
        font-weight:850!important;
        text-align:right!important;
        overflow-wrap:anywhere!important;
    }

    /* PROVEEDORES LARGOS */
    .purchase-orders-index .po-value strong,
    .purchase-orders-index .po-value a{
        overflow-wrap:anywhere!important;
        word-break:break-word!important;
    }

    /* ESTADO */
    .purchase-orders-index .po-status{
        min-height:26px!important;
        padding:4px 10px!important;
        border-radius:999px!important;
        font-size:11px!important;
        line-height:1!important;
        font-weight:850!important;
        background:#f5ebdf!important;
        color:#5d3b24!important;
        border:1px solid rgba(173,112,64,.14)!important;
        box-shadow:none!important;
    }

    /* BOTONERA */
    .purchase-orders-index .po-card-actions{
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
        padding-top:12px!important;
        border-top:1px solid rgba(0,0,0,.06)!important;
    }

    .purchase-orders-index .po-card-actions > *,
    .purchase-orders-index .po-card-actions form{
        width:100%!important;
        min-width:0!important;
        margin:0!important;
    }

    /* BOTONES */
    .purchase-orders-index .po-card-actions .button,
    .purchase-orders-index .po-card-actions button{
        min-height:38px!important;
        height:38px!important;
        border-radius:12px!important;
        padding:0 10px!important;
        font-size:12px!important;
        line-height:1!important;
        font-weight:850!important;
        box-shadow:none!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }

    /* CTA VER */
    .purchase-orders-index .po-card-actions a.button:first-child{
        background:#111!important;
        color:#fff!important;
        border-color:#111!important;
    }

    /* FAVORITO */
    .purchase-orders-index .po-card-actions a[href*="favorite"],
    .purchase-orders-index .po-card-actions form[action*="favorite"] button{
        font-size:0!important;
    }

    .purchase-orders-index .po-card-actions a[href*="favorite"]::after,
    .purchase-orders-index .po-card-actions form[action*="favorite"] button::after{
        content:"♥"!important;
        font-size:14px!important;
        line-height:1!important;
    }

    /* FILTROS */
    .purchase-orders-index .po-filters{
        gap:9px!important;
        margin-bottom:16px!important;
    }

    .purchase-orders-index .po-filter-button{
        min-height:40px!important;
        border-radius:14px!important;
        font-size:13px!important;
        font-weight:850!important;
    }

    /* ACTIONS TOP */
    .purchase-orders-index .po-top-actions{
        gap:10px!important;
        margin:16px 0 14px!important;
    }

    .purchase-orders-index .po-action-button{
        min-height:48px!important;
        border-radius:16px!important;
        font-size:14px!important;
        font-weight:850!important;
    }

    /* TITULAR */
    .purchase-orders-index .po-head h1,
    .purchase-orders-index .page-header h1{
        font-size:31px!important;
        line-height:1!important;
        margin-bottom:6px!important;
    }

    .purchase-orders-index .po-head p,
    .purchase-orders-index .page-header p{
        font-size:14px!important;
        line-height:1.3!important;
        color:#686e75!important;
        font-weight:750!important;
    }
}

/* PURCHASE_ORDERS_BREATHING_ROOM_FINAL_END */


/* PURCHASE_ORDERS_ACTIONS_2ROWS_FIX_START */

@media(max-width:820px){

    /* Más aire general */
    .purchase-orders-index .po-card{
        padding:12px 12px 11px!important;
    }

    /* Grid 2 filas reales */
    .purchase-orders-index .po-card-actions{
        display:grid!important;
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:7px!important;
        padding-top:10px!important;
        align-items:stretch!important;
    }

    /* Botones MUCHO más compactos */
    .purchase-orders-index .po-card-actions .button,
    .purchase-orders-index .po-card-actions button,
    .purchase-orders-index .po-card-actions a{
        min-height:28px!important;
        height:28px!important;
        padding:0 6px!important;
        border-radius:10px!important;
        font-size:10px!important;
        line-height:1!important;
        font-weight:900!important;
        letter-spacing:-.01em!important;
        box-shadow:none!important;

        display:flex!important;
        align-items:center!important;
        justify-content:center!important;

        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }

    /* Primera fila */
    .purchase-orders-index .po-card-actions > *:nth-child(1){
        grid-column:1!important;
        grid-row:1!important;
    }

    .purchase-orders-index .po-card-actions > *:nth-child(2){
        grid-column:2!important;
        grid-row:1!important;
    }

    .purchase-orders-index .po-card-actions > *:nth-child(3){
        grid-column:3!important;
        grid-row:1!important;
    }

    .purchase-orders-index .po-card-actions > *:nth-child(4){
        grid-column:4!important;
        grid-row:1!important;
    }

    /* Segunda fila */
    .purchase-orders-index .po-card-actions > *:nth-child(5){
        grid-column:1 / span 2!important;
        grid-row:2!important;
    }

    .purchase-orders-index .po-card-actions > *:nth-child(6){
        grid-column:3 / span 2!important;
        grid-row:2!important;
    }

    /* Tercera fila SOLO si existe archivar */
    .purchase-orders-index .po-card-actions > *:nth-child(7){
        grid-column:1 / -1!important;
        grid-row:3!important;
    }

    /* Acción principal */
    .purchase-orders-index .po-card-actions a.button:first-child{
        background:#111!important;
        color:#fff!important;
        border-color:#111!important;
    }

    /* Favorito ultra compacto */
    .purchase-orders-index .po-card-actions a[href*="favorite"],
    .purchase-orders-index .po-card-actions form[action*="favorite"] button,
    .purchase-orders-index .po-card-actions .favorite,
    .purchase-orders-index .po-card-actions [class*="favorite"]{
        font-size:0!important;
        padding:0!important;
    }

    .purchase-orders-index .po-card-actions a[href*="favorite"]::after,
    .purchase-orders-index .po-card-actions form[action*="favorite"] button::after,
    .purchase-orders-index .po-card-actions .favorite::after,
    .purchase-orders-index .po-card-actions [class*="favorite"]::after{
        content:"♥"!important;
        font-size:12px!important;
        line-height:1!important;
    }

    /* Eliminar menos agresivo */
    .purchase-orders-index .po-card-actions .danger,
    .purchase-orders-index .po-card-actions button.danger{
        background:#faf7ea!important;
        color:#575126!important;
        border-color:#e5dfbc!important;
    }

    /* Badge estado menos gigante */
    .purchase-orders-index .po-status{
        min-height:20px!important;
        padding:2px 8px!important;
        font-size:10px!important;
    }

    /* Más aire vertical en info */
    .purchase-orders-index .po-meta{
        gap:7px!important;
        margin-bottom:10px!important;
    }

    /* Labels menos exagerados */
    .purchase-orders-index .po-label{
        font-size:9px!important;
        letter-spacing:.12em!important;
    }

    /* Valores */
    .purchase-orders-index .po-value{
        font-size:13px!important;
        line-height:1.18!important;
    }

    /* Número pedido */
    .purchase-orders-index .po-number{
        font-size:17px!important;
        line-height:1.12!important;
    }

    /* Total */
    .purchase-orders-index .po-total{
        font-size:22px!important;
    }
}

/* PURCHASE_ORDERS_ACTIONS_2ROWS_FIX_END */