/* COMPRASAPP_SQUARE_GLOBAL_LAYER_START
   Final design layer: mobile-first, dense operational UI, 8px radius.
   Loaded last from layouts/app.blade.php.
*/

:root {
    --sq-bg: #f5f5f3;
    --sq-surface: #ffffff;
    --sq-surface-muted: #f8f8f6;
    --sq-ink: #111111;
    --sq-muted: #686866;
    --sq-faint: #8b8b87;
    --sq-border: #e2e2dd;
    --sq-border-strong: #d2d2ca;
    --sq-accent: var(--app-accent, #111111);
    --sq-accent-dark: var(--app-accent-dark, #000000);
    --sq-accent-soft: var(--app-accent-soft, #eeeeea);
    --sq-danger: #9f1d1d;
    --sq-ok: #1f7a3d;
    --sq-warning: #8a5b00;
    --sq-radius: 8px;
    --sq-gap: 10px;
    --sq-topbar-h: 58px;
    --sq-bottom-nav-h: 70px;
    --sq-content-max: 1420px;
}

* {
    box-sizing: border-box;
}

html {
    background: var(--sq-bg);
    color: var(--sq-ink);
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
}

body.square-mobile-first,
body {
    min-height: 100vh;
    margin: 0;
    background: var(--sq-bg) !important;
    color: var(--sq-ink);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.35;
    letter-spacing: 0;
}

body.square-mobile-first {
    padding-bottom: calc(var(--sq-bottom-nav-h) + env(safe-area-inset-bottom, 0px));
}

a {
    color: inherit;
}

.app-shell {
    min-height: auto !important;
}

main,
.square-app-main {
    width: 100% !important;
    max-width: var(--sq-content-max) !important;
    margin: 0 auto !important;
    padding: 12px 10px 18px !important;
}

body:has(.purchase-invoice-review-page) {
    padding-bottom: 0 !important;
}

body:has(.purchase-invoice-review-page) .store-shell-topbar,
body:has(.purchase-invoice-review-page) .mobile-bottom-nav {
    display: none !important;
}

body:has(.purchase-invoice-review-page) main {
    max-width: var(--sq-content-max) !important;
    padding-bottom: 18px !important;
}

body:has(.purchase-order-print-page) .store-shell-topbar,
body:has(.purchase-order-print-page) .mobile-bottom-nav {
    display: none !important;
}

body:has(.purchase-order-print-page) main {
    max-width: none !important;
    padding: 0 !important;
}

/* Shell */
.store-shell-topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 3000 !important;
    min-height: var(--sq-topbar-h) !important;
    padding: calc(8px + env(safe-area-inset-top, 0px)) 10px 8px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    align-items: center !important;
    background: #050505 !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.store-shell-brand {
    min-width: 0 !important;
    display: grid !important;
    gap: 1px !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

.store-shell-brand-title {
    display: block !important;
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

.store-shell-brand-subtitle {
    display: block !important;
    color: rgba(255,255,255,.54) !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.store-shell-actions {
    min-width: 0 !important;
    display: inline-flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 6px !important;
    overflow: visible !important;
}

/* Page rhythm */
.page-header,
.section-header,
.po-head,
.v35-hero,
.v35-section-title {
    margin: 0 0 10px !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: start !important;
}

.page-header h1,
.po-head h1,
.v35-hero h1,
.v35-section-title h1 {
    margin: 0 !important;
    color: var(--sq-ink) !important;
    font-size: clamp(22px, 5.5vw, 30px) !important;
    font-weight: 950 !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
}

.section-header h2,
.page-header h2,
.v35-section-title h2,
.card h2,
.card h3 {
    margin: 0 !important;
    color: var(--sq-ink) !important;
    font-size: 17px !important;
    font-weight: 920 !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
}

.page-header p,
.section-header p,
.po-head p,
.v35-hero p,
.v35-section-title p {
    margin: 2px 0 0 !important;
    color: var(--sq-muted) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

.actions,
.form-actions,
.po-top-actions,
.v35-hero-actions,
.v35-card-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    align-items: stretch !important;
    width: 100% !important;
}

.actions form,
.form-actions form,
.v35-card-actions form {
    margin: 0 !important;
    display: grid !important;
    width: 100% !important;
}

/* Surfaces */
.card,
form.card,
.line-card,
.v35-card-item,
.v35-row,
.v35-action,
.po-card,
.po-agenda-card,
.purchase-item-card,
.purchase-invoice-card,
.more-row,
.attachment-file-item,
.attachment-preview-item,
.modal-content {
    border: 1px solid var(--sq-border) !important;
    border-radius: var(--sq-radius) !important;
    background: var(--sq-surface) !important;
    box-shadow: none !important;
}

.card,
form.card,
.line-card,
.v35-card-item,
.po-card,
.po-agenda-card,
.purchase-item-card,
.purchase-invoice-card {
    padding: 10px !important;
}

.card + .card,
.v35-section + .v35-section,
.po-card + .po-card {
    margin-top: 10px !important;
}

/* Forms */
label {
    color: var(--sq-ink) !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
}

input,
select,
textarea {
    min-height: 40px !important;
    border: 1px solid var(--sq-border-strong) !important;
    border-radius: var(--sq-radius) !important;
    background: #ffffff !important;
    color: var(--sq-ink) !important;
    padding: 9px 10px !important;
    font: inherit !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    box-shadow: none !important;
}

textarea {
    min-height: 70px !important;
    resize: vertical !important;
}

input:focus,
select:focus,
textarea:focus {
    outline: 2px solid rgba(17,17,17,.14) !important;
    outline-offset: 1px !important;
    border-color: #111111 !important;
}

.grid,
.grid.two,
.grid.three,
.grid.four,
.meta-grid,
.v35-metrics,
.v35-action-grid,
.v35-input-grid,
.v35-quantity-stack {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    margin-bottom: 8px !important;
}

/* Buttons */
.button,
a.button,
button.button,
.po-action-button,
.po-filter-button {
    min-height: 40px !important;
    border-radius: var(--sq-radius) !important;
    padding: 9px 11px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.button,
a.button:not(.secondary):not(.danger),
button.button:not(.secondary):not(.danger) {
    background: var(--sq-accent) !important;
    color: var(--app-accent-text, #ffffff) !important;
}

.button.secondary,
button.secondary,
a.button.secondary {
    background: var(--sq-accent-soft) !important;
    color: var(--sq-ink) !important;
    border: 1px solid var(--sq-border) !important;
}

.button.danger,
button.danger {
    background: var(--sq-danger) !important;
    color: #ffffff !important;
}

/* Tables and details */
.table-wrapper,
.table-wrap {
    width: 100% !important;
    overflow-x: auto !important;
    border-radius: var(--sq-radius) !important;
}

table {
    width: 100% !important;
    border: 1px solid var(--sq-border) !important;
    border-radius: var(--sq-radius) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: var(--sq-surface) !important;
    overflow: hidden !important;
}

th,
td {
    padding: 8px 9px !important;
    border-bottom: 1px solid var(--sq-border) !important;
    color: var(--sq-ink) !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    vertical-align: top !important;
}

th {
    background: var(--sq-surface-muted) !important;
    color: var(--sq-muted) !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.details,
.v35-key-values,
.purchase-order-detail-page .details,
.supplier-compact-page .details,
.purchase-items-page .detail-list {
    display: grid !important;
    grid-template-columns: minmax(96px, 34%) minmax(0, 1fr) !important;
    gap: 7px 9px !important;
}

.details dt,
.details dd,
.v35-key-values dt,
.v35-key-values dd {
    margin: 0 !important;
    padding: 0 0 7px !important;
    border-bottom: 1px solid var(--sq-border) !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
}

.details dt,
.v35-key-values dt {
    color: var(--sq-muted) !important;
    font-weight: 850 !important;
}

.details dd,
.v35-key-values dd {
    color: var(--sq-ink) !important;
    font-weight: 750 !important;
}

.badge,
.chip,
.status-chip,
.filter-chip {
    border-radius: 999px !important;
    padding: 4px 8px !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    border: 1px solid var(--sq-border) !important;
    background: var(--sq-surface-muted) !important;
    color: var(--sq-ink) !important;
}

/* Bottom nav */
nav.mobile-bottom-nav,
.mobile-bottom-nav.role-aware-bottom-nav {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 3200 !important;
    min-height: 58px !important;
    padding: 6px !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 4px !important;
    border: 1px solid rgba(0,0,0,.12) !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
    backdrop-filter: blur(14px) !important;
}

nav.mobile-bottom-nav a,
.mobile-bottom-nav.role-aware-bottom-nav a {
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 5px 3px !important;
    border-radius: var(--sq-radius) !important;
    display: grid !important;
    place-items: center !important;
    gap: 2px !important;
    text-decoration: none !important;
    color: var(--sq-muted) !important;
    background: transparent !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
}

nav.mobile-bottom-nav a > span:first-child,
.mobile-bottom-nav.role-aware-bottom-nav a > span:first-child {
    color: inherit !important;
    font-size: 18px !important;
    line-height: 1 !important;
}

nav.mobile-bottom-nav a > span:last-child,
.mobile-bottom-nav.role-aware-bottom-nav a > span:last-child {
    color: inherit !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

nav.mobile-bottom-nav a.is-active,
nav.mobile-bottom-nav a.mobile-main-action,
.mobile-bottom-nav.role-aware-bottom-nav a.is-active,
.mobile-bottom-nav.role-aware-bottom-nav a.mobile-main-action {
    background: #111111 !important;
    color: #ffffff !important;
}

/* Operational compact targets */
.purchase-orders-index,
.purchase-invoices-index,
.purchase-order-detail-page,
.purchase-invoice-document,
.purchase-invoice-review-page,
.supplier-compact-page,
.purchase-items-page,
.v35-home,
.v35-receive,
.v35-receiving {
    display: grid !important;
    gap: 10px !important;
}

.purchase-order-detail-page .card,
.purchase-invoice-review-page .card,
.supplier-compact-page .card,
.purchase-items-page .card {
    padding: 10px !important;
}

@media (min-width: 760px) {
    :root {
        --sq-topbar-h: 62px;
    }

    main,
    .square-app-main {
        padding: 14px 18px 28px !important;
    }

    .page-header,
    .section-header,
    .po-head,
    .v35-hero,
    .v35-section-title {
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: end !important;
    }

    .actions,
    .form-actions,
    .po-top-actions,
    .v35-hero-actions,
    .v35-card-actions {
        width: auto !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-end !important;
    }

    .grid.two,
    .v35-input-grid,
    .v35-quantity-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .grid.three,
    .meta-grid,
    .v35-metrics,
    .v35-action-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .grid.four {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    nav.mobile-bottom-nav,
    .mobile-bottom-nav.role-aware-bottom-nav {
        left: 50% !important;
        right: auto !important;
        width: min(620px, calc(100% - 32px)) !important;
        transform: translateX(-50%) !important;
    }
}

@media (min-width: 1180px) {
    main,
    .square-app-main {
        padding-inline: 22px !important;
    }
}

@media print {
    .store-shell-topbar,
    .mobile-bottom-nav {
        display: none !important;
    }

    body,
    main,
    .square-app-main {
        background: #ffffff !important;
        padding: 0 !important;
        margin: 0 !important;
        max-width: none !important;
    }
}

/* COMPRASAPP_SQUARE_GLOBAL_LAYER_END */

/* HOME_REAL_2X2_FIX_V1_START */
@media(max-width:760px){

    body.square-mobile-first .v35-home{
        gap:8px!important;
        padding-bottom:120px!important;
    }

    body.square-mobile-first .v35-home > .v35-action-grid{
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
        margin:8px 0!important;
    }

    body.square-mobile-first .v35-home > .v35-action-grid > .v35-action{
        min-height:72px!important;
        padding:10px 12px!important;
        border-radius:14px!important;
        display:flex!important;
        flex-direction:column!important;
        justify-content:space-between!important;
        box-shadow:0 1px 2px rgba(0,0,0,.035)!important;
    }

    body.square-mobile-first .v35-home > .v35-action-grid > .v35-action span{
        font-size:11px!important;
        line-height:1!important;
        font-weight:850!important;
    }

    body.square-mobile-first .v35-home > .v35-action-grid > .v35-action strong{
        margin-top:8px!important;
        font-size:20px!important;
        line-height:1!important;
        letter-spacing:-.03em!important;
    }

    body.square-mobile-first .v35-home .v35-hero{
        padding:12px!important;
        border-radius:18px!important;
        margin:0!important;
    }

    body.square-mobile-first .v35-home .v35-hero h1{
        font-size:28px!important;
        line-height:.95!important;
    }

    body.square-mobile-first .v35-home .v35-hero p{
        font-size:13px!important;
        line-height:1.18!important;
    }

    body.square-mobile-first .v35-home .v35-calendar-section{
        margin-top:6px!important;
    }

    body.square-mobile-first nav.mobile-bottom-nav{
        bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;
        min-height:64px!important;
    }
}
/* HOME_REAL_2X2_FIX_V1_END */

/* PENDING_HISTORY_VISUAL_SPLIT_V1_START */

/*
 * Objetivo:
 * - En curso/Pendientes = trabajo operativo vivo.
 * - Historial/Histórico = consulta cerrada.
 * No toca rutas ni lógica; solo jerarquía visual.
 */

/* Bottom nav: Pendientes debe sentirse como bandeja de trabajo */
body.square-mobile-first nav.mobile-bottom-nav a[href*="purchase-orders"],
body.square-mobile-first .mobile-bottom-nav.role-aware-bottom-nav a[href*="purchase-orders"]{
    position:relative!important;
}

/* Pedidos de compra: convertir la vista en bandeja viva */
body.square-mobile-first .purchase-orders-index .page-header h1{
    font-size:clamp(30px,8vw,48px)!important;
    line-height:.95!important;
}

body.square-mobile-first .purchase-orders-index .page-header p{
    max-width:92%!important;
    font-size:14px!important;
    line-height:1.22!important;
}

/* Cards de pedidos: más compactas y orientadas a acción */
body.square-mobile-first .purchase-orders-index .po-card{
    border-radius:18px!important;
    padding:14px!important;
    margin-bottom:10px!important;
    box-shadow:0 1px 2px rgba(0,0,0,.035)!important;
}

body.square-mobile-first .purchase-orders-index .po-card .po-status,
body.square-mobile-first .purchase-orders-index .po-status,
body.square-mobile-first .purchase-orders-index .badge{
    border-radius:999px!important;
    padding:7px 10px!important;
    font-size:12px!important;
    font-weight:900!important;
}

/* Estados vivos: que destaquen como pendientes */
body.square-mobile-first .purchase-orders-index .status-draft,
body.square-mobile-first .purchase-orders-index .status-sent,
body.square-mobile-first .purchase-orders-index .status-partially_received{
    background:#fff7dc!important;
    border-color:#eadca9!important;
    color:#5f4824!important;
}

/* Cancelados/completados: más apagados, menos acción */
body.square-mobile-first .purchase-orders-index .status-cancelled,
body.square-mobile-first .purchase-orders-index .status-received{
    background:#f1f1ee!important;
    border-color:rgba(0,0,0,.08)!important;
    color:#777!important;
}

/* Botones de cards */
body.square-mobile-first .purchase-orders-index .po-card .button,
body.square-mobile-first .purchase-orders-index .po-card button,
body.square-mobile-first .purchase-orders-index .po-card a.button{
    min-height:38px!important;
    border-radius:999px!important;
    font-size:13px!important;
}

/* Historial: bajar intensidad visual cuando sea la vista de consulta */
body.square-mobile-first .purchase-orders-index:has(.po-filter-button.is-active[href*="archived"]),
body.square-mobile-first .purchase-orders-index:has(.po-filter-button.is-active[data-filter*="history"]){
    opacity:.96!important;
}

/* Cinta inferior: nombres largos más legibles */
body.square-mobile-first nav.mobile-bottom-nav a span:last-child,
body.square-mobile-first .mobile-bottom-nav.role-aware-bottom-nav a span:last-child{
    font-size:11px!important;
    letter-spacing:-.02em!important;
}

/* PENDING_HISTORY_VISUAL_SPLIT_V1_END */

/* Mobile shell density is centralized in components/app-shell.css. */
/* FAVORITES_COMPACT_TEMPLATE_V2_START */
body.square-mobile-first .favorites-page.ca-template-page{
    display:grid!important;
    gap:10px!important;
    padding:8px 10px calc(176px + env(safe-area-inset-bottom))!important;
}

body.square-mobile-first .favorites-page .ca-template-header{
    padding:12px!important;
    margin:0!important;
    border:1px solid rgba(0,0,0,.07)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 1px 2px rgba(0,0,0,.03)!important;
}

body.square-mobile-first .favorites-page .ca-template-header h1{
    margin:0 0 4px!important;
    font-size:28px!important;
    line-height:1!important;
    letter-spacing:0!important;
}

body.square-mobile-first .favorites-page .ca-template-header p{
    margin:0!important;
    color:var(--sq-muted,#6b7075)!important;
    font-size:14px!important;
    font-weight:750!important;
    line-height:1.22!important;
    letter-spacing:0!important;
}

body.square-mobile-first .favorites-page .ca-template-list{
    display:grid!important;
    gap:10px!important;
}

body.square-mobile-first .favorites-page .ca-template-card{
    display:grid!important;
    gap:10px!important;
    min-width:0!important;
    padding:12px!important;
    border:1px solid rgba(0,0,0,.08)!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:0 1px 2px rgba(0,0,0,.035)!important;
}

body.square-mobile-first .favorites-page .ca-template-main{
    display:grid!important;
    gap:6px!important;
    min-width:0!important;
}

body.square-mobile-first .favorites-page .ca-template-title-form{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 58px!important;
    gap:8px!important;
    align-items:center!important;
    margin:0!important;
    min-width:0!important;
}

body.square-mobile-first .favorites-page .ca-template-title-input{
    min-width:0!important;
    width:100%!important;
    height:auto!important;
    min-height:36px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:var(--sq-text,#171717)!important;
    font-size:17px!important;
    font-weight:950!important;
    line-height:1.12!important;
    letter-spacing:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

body.square-mobile-first .favorites-page .ca-template-title-input.is-editing{
    padding:8px 10px!important;
    border:1px solid rgba(0,0,0,.16)!important;
    border-radius:10px!important;
    background:#fff!important;
}

body.square-mobile-first .favorites-page .ca-template-icon-button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:58px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0!important;
    border-radius:10px!important;
    font-size:12px!important;
    line-height:1!important;
}

body.square-mobile-first .favorites-page .ca-template-meta{
    display:flex!important;
    gap:6px!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    min-width:0!important;
    color:var(--sq-muted,#6b7075)!important;
    font-size:12px!important;
    font-weight:800!important;
    line-height:1.2!important;
}

body.square-mobile-first .favorites-page .ca-template-meta > *{
    min-width:0!important;
    max-width:100%!important;
}

body.square-mobile-first .favorites-page .ca-template-meta a{
    color:#3f4737!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

body.square-mobile-first .favorites-page .ca-template-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    align-items:center!important;
}

body.square-mobile-first .favorites-page .ca-template-actions form{
    margin:0!important;
    min-width:0!important;
}

body.square-mobile-first .favorites-page .ca-template-actions .button,
body.square-mobile-first .favorites-page .ca-template-actions button{
    width:100%!important;
    min-height:38px!important;
    padding:0 10px!important;
    border-radius:10px!important;
    font-size:13px!important;
    font-weight:900!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
}

body.square-mobile-first .favorites-page .ca-template-actions form:first-child{
    grid-column:1 / -1!important;
}

body.square-mobile-first .favorites-page .ca-template-preview{
    padding:8px 0 0!important;
    border-top:1px solid rgba(0,0,0,.07)!important;
}

body.square-mobile-first .favorites-page .ca-template-lines{
    display:grid!important;
    gap:6px!important;
    margin:0!important;
    padding:0!important;
    list-style:none!important;
}

body.square-mobile-first .favorites-page .ca-template-lines li{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:8px!important;
    align-items:start!important;
    min-width:0!important;
    color:#5d4624!important;
    font-size:13px!important;
    font-weight:800!important;
    line-height:1.2!important;
}

body.square-mobile-first .favorites-page .ca-template-qty{
    color:#5d4624!important;
    text-align:right!important;
    white-space:nowrap!important;
}

body.square-mobile-first .favorites-page .ca-template-name{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
}

body.square-mobile-first .favorites-page .ca-template-name span{
    display:block!important;
    margin-top:2px!important;
    color:var(--sq-muted,#6b7075)!important;
    font-size:11px!important;
    line-height:1.2!important;
}

@media(min-width:680px){
    body.square-mobile-first .favorites-page.ca-template-page{
        max-width:720px!important;
        margin:0 auto!important;
    }

    body.square-mobile-first .favorites-page .ca-template-actions{
        grid-template-columns:auto auto auto!important;
        justify-content:start!important;
    }

    body.square-mobile-first .favorites-page .ca-template-actions form:first-child{
        grid-column:auto!important;
    }

    body.square-mobile-first .favorites-page .ca-template-actions .button,
    body.square-mobile-first .favorites-page .ca-template-actions button{
        width:auto!important;
    }
}
/* FAVORITES_COMPACT_TEMPLATE_V2_END */

/* PURCHASE_ORDER_ATTACHMENT_THUMBNAILS_V2_START */
body.square-mobile-first .attachment-file-list{
    display:grid!important;
    gap:8px!important;
}

body.square-mobile-first .attachment-file-item{
    display:grid!important;
    grid-template-columns:88px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:start!important;
    padding:10px!important;
    border-radius:14px!important;
}

body.square-mobile-first .attachment-file-item > div{
    min-width:0!important;
}

body.square-mobile-first .attachment-file-item > div > strong,
body.square-mobile-first .attachment-file-item > div > span{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

body.square-mobile-first .attachment-file-item > div > strong{
    font-size:13px!important;
    line-height:1.15!important;
}

body.square-mobile-first .attachment-file-item > div > span{
    color:var(--sq-muted,#6b7075)!important;
    font-size:11.5px!important;
    line-height:1.2!important;
}

body.square-mobile-first .attachment-file-item .actions{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    margin-top:0!important;
}

body.square-mobile-first .attachment-file-item .actions .button,
body.square-mobile-first .attachment-file-item .actions button{
    min-height:34px!important;
    height:34px!important;
    border-radius:10px!important;
    font-size:12px!important;
}

body.square-mobile-first .attachment-thumbnail-button{
    appearance:none!important;
    -webkit-appearance:none!important;
    display:grid!important;
    grid-template-rows:76px auto!important;
    gap:4px!important;
    width:84px!important;
    min-width:84px!important;
    max-width:84px!important;
    min-height:0!important;
    height:auto!important;
    padding:4px!important;
    border:1px solid rgba(17,24,39,.12)!important;
    border-radius:12px!important;
    background:color-mix(in srgb,var(--app-accent,#aebc68) 8%,#fff 92%)!important;
    color:var(--sq-text,#111)!important;
    box-shadow:none!important;
    cursor:pointer!important;
    font:inherit!important;
    font-size:10px!important;
    font-weight:900!important;
    line-height:1!important;
    text-align:center!important;
}

body.square-mobile-first .attachment-thumbnail-button:focus-visible{
    outline:2px solid color-mix(in srgb,var(--app-accent,#aebc68) 72%,#111 28%)!important;
    outline-offset:3px!important;
}

body.square-mobile-first .attachment-thumbnail-image{
    display:block!important;
    width:76px!important;
    height:76px!important;
    max-width:76px!important;
    max-height:76px!important;
    aspect-ratio:1!important;
    object-fit:cover!important;
    border-radius:9px!important;
    background:#f8fafc!important;
}

body.square-mobile-first .attachment-zoom-dialog{
    width:min(96vw,780px)!important;
    max-width:96vw!important;
    max-height:92svh!important;
    padding:0!important;
    border:0!important;
    border-radius:18px!important;
    background:transparent!important;
}

body.square-mobile-first .attachment-zoom-dialog::backdrop{
    background:rgba(0,0,0,.68)!important;
}

body.square-mobile-first .attachment-zoom-panel{
    display:grid!important;
    gap:10px!important;
    max-height:92svh!important;
    padding:10px!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 24px 80px rgba(0,0,0,.28)!important;
}

body.square-mobile-first .attachment-zoom-header{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
}

body.square-mobile-first .attachment-zoom-header strong{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:13px!important;
    font-weight:900!important;
}

body.square-mobile-first .attachment-zoom-image{
    display:block!important;
    width:100%!important;
    max-height:calc(92svh - 72px)!important;
    object-fit:contain!important;
    border-radius:12px!important;
    background:#f8fafc!important;
}

@media(max-width:380px){
    body.square-mobile-first .attachment-file-item{
        grid-template-columns:82px minmax(0,1fr)!important;
        gap:8px!important;
    }

    body.square-mobile-first .attachment-thumbnail-button{
        width:78px!important;
        min-width:78px!important;
        max-width:78px!important;
        grid-template-rows:70px auto!important;
    }

    body.square-mobile-first .attachment-thumbnail-image{
        width:70px!important;
        height:70px!important;
        max-width:70px!important;
        max-height:70px!important;
    }
}
/* PURCHASE_ORDER_ATTACHMENT_THUMBNAILS_V2_END */

/* GLOBAL_VISIBILITY_STATUS_V2_START */
body.square-mobile-first .ca-compact-chip.ca-compact-chip--visible{
    background:#dff4e3!important;
    border-color:#60bd73!important;
    color:#126128!important;
}

body.square-mobile-first .ca-compact-chip.ca-compact-chip--hidden{
    background:#ffe7e2!important;
    border-color:#e07160!important;
    color:#9e2116!important;
}

body.square-mobile-first .ca-status-card.ca-status-card--visible{
    background:#eefaf1!important;
    border-color:#78c986!important;
}

body.square-mobile-first .ca-status-card.ca-status-card--hidden{
    background:#fff0ed!important;
    border-color:#e58a7c!important;
}

body.square-mobile-first .ca-status-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:12px!important;
    align-items:flex-start!important;
}

body.square-mobile-first .ca-status-card > div{
    min-width:0!important;
}

body.square-mobile-first .ca-status-card .button{
    align-self:center!important;
    max-width:190px!important;
    white-space:normal!important;
}

body.square-mobile-first .ca-visibility-card{
    border-width:1.5px!important;
}

body.square-mobile-first .ca-visibility-card__main{
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr)!important;
    gap:12px!important;
    align-items:start!important;
}

body.square-mobile-first .ca-visibility-card__light{
    display:inline-block!important;
    width:22px!important;
    height:22px!important;
    margin-top:4px!important;
    border-radius:999px!important;
    box-shadow:0 0 0 7px rgba(0,0,0,.035)!important;
}

body.square-mobile-first .ca-visibility-card__light.is-visible{
    background:#1f9d45!important;
    border:2px solid #0f6d2a!important;
    box-shadow:0 0 0 7px rgba(31,157,69,.14)!important;
}

body.square-mobile-first .ca-visibility-card__light.is-hidden{
    background:#d92d20!important;
    border:2px solid #9f2118!important;
    box-shadow:0 0 0 7px rgba(217,45,32,.12)!important;
}

@media(max-width:760px){
    body.square-mobile-first .ca-status-card{
        grid-template-columns:1fr!important;
    }

    body.square-mobile-first .ca-status-card .button{
        width:100%!important;
        max-width:none!important;
        margin-top:12px!important;
    }
}
/* GLOBAL_VISIBILITY_STATUS_V2_END */

/* SITES_INDEX_GLOBAL_UX_V2_START */
body.square-mobile-first .sites-index-page .ca-site-directory{
    display:grid!important;
    gap:0!important;
    overflow:hidden!important;
    border:1px solid rgba(17,17,17,.08)!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 14px 36px rgba(17,17,17,.055)!important;
}

body.square-mobile-first .sites-index-page .ca-site-row{
    display:grid!important;
    grid-template-columns:minmax(0,1.3fr) minmax(150px,.95fr) auto auto!important;
    gap:10px!important;
    align-items:center!important;
    padding:12px 14px!important;
    border:0!important;
    border-bottom:1px solid rgba(17,17,17,.08)!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

body.square-mobile-first .sites-index-page .ca-site-row:last-child{
    border-bottom:0!important;
}

@media(max-width:760px){
    body.square-mobile-first .sites-index-page .ca-site-directory{
        border-radius:14px!important;
    }

    body.square-mobile-first .sites-index-page .ca-site-row{
        grid-template-columns:minmax(0,1fr) auto!important;
        gap:8px 10px!important;
        padding:11px 12px!important;
    }
}
/* SITES_INDEX_GLOBAL_UX_V2_END */

/* ADMIN_MANAGEMENT_LISTS_UX_V3_START */
body.square-mobile-first .admin-users-index-page .ca-kpi-strip,
body.square-mobile-first .sites-index-page .ca-kpi-strip{
    display:flex!important;
    gap:8px!important;
    overflow-x:auto!important;
    margin:0 0 10px!important;
    padding:0 0 2px!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

body.square-mobile-first .admin-users-index-page .ca-kpi,
body.square-mobile-first .sites-index-page .ca-kpi{
    flex:0 0 auto!important;
    min-width:92px!important;
    padding:8px 10px!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:none!important;
}

body.square-mobile-first .admin-users-index-page .ca-kpi span,
body.square-mobile-first .sites-index-page .ca-kpi span{
    font-size:10px!important;
    line-height:1!important;
}

body.square-mobile-first .admin-users-index-page .ca-kpi strong,
body.square-mobile-first .sites-index-page .ca-kpi strong{
    font-size:22px!important;
    line-height:1!important;
}

body.square-mobile-first .admin-users-index-page .ca-inline-note,
body.square-mobile-first .sites-index-page .ca-inline-note{
    margin:0 0 10px!important;
    padding:8px 10px!important;
    border-radius:12px!important;
    font-size:12px!important;
    line-height:1.2!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-directory,
body.square-mobile-first .sites-index-page .ca-site-directory{
    display:grid!important;
    gap:0!important;
    overflow:hidden!important;
    border:1px solid rgba(17,17,17,.08)!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 26px rgba(17,17,17,.05)!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row,
body.square-mobile-first .sites-index-page .ca-site-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px 10px!important;
    align-items:center!important;
    padding:10px 12px!important;
    border:0!important;
    border-bottom:1px solid rgba(17,17,17,.08)!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row:last-child,
body.square-mobile-first .sites-index-page .ca-site-row:last-child{
    border-bottom:0!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__identity,
body.square-mobile-first .sites-index-page .ca-site-row__identity{
    grid-column:1 / -1!important;
    grid-template-columns:34px minmax(0,1fr)!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__avatar,
body.square-mobile-first .sites-index-page .ca-site-row__icon{
    width:34px!important;
    height:34px!important;
    border-radius:10px!important;
    font-size:14px!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__copy h2,
body.square-mobile-first .sites-index-page .ca-site-row__copy h2{
    font-size:16px!important;
    line-height:1.05!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__copy a,
body.square-mobile-first .sites-index-page .ca-site-row__copy p{
    font-size:12px!important;
    line-height:1.15!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__meta,
body.square-mobile-first .sites-index-page .ca-site-row__meta{
    grid-column:1 / -1!important;
    gap:6px!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__status,
body.square-mobile-first .sites-index-page .ca-site-row__status{
    justify-self:start!important;
    width:auto!important;
    min-width:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-status-pill,
body.square-mobile-first .sites-index-page .ca-user-status-pill{
    width:auto!important;
    min-width:0!important;
    max-width:max-content!important;
    min-height:30px!important;
    padding:6px 10px!important;
    font-size:12px!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-status-pill__dot,
body.square-mobile-first .sites-index-page .ca-user-status-pill__dot{
    width:8px!important;
    height:8px!important;
    box-shadow:0 0 0 3px rgba(255,255,255,.75)!important;
}

body.square-mobile-first .admin-users-index-page .ca-state-badge,
body.square-mobile-first .sites-index-page .ca-state-badge{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    width:auto!important;
    min-width:0!important;
    max-width:max-content!important;
    min-height:24px!important;
    padding:4px 8px!important;
    border-radius:7px!important;
    box-shadow:none!important;
    transform:none!important;
    cursor:default!important;
    font-size:11px!important;
    font-weight:900!important;
    line-height:1!important;
    white-space:nowrap!important;
}

body.square-mobile-first .admin-users-index-page .ca-state-badge__dot,
body.square-mobile-first .sites-index-page .ca-state-badge__dot{
    width:7px!important;
    height:7px!important;
    flex:0 0 auto!important;
    border-radius:999px!important;
    background:currentColor!important;
    box-shadow:none!important;
}

body.square-mobile-first .admin-users-index-page .ca-state-badge--active,
body.square-mobile-first .admin-users-index-page .ca-state-badge--visible,
body.square-mobile-first .sites-index-page .ca-state-badge--active,
body.square-mobile-first .sites-index-page .ca-state-badge--visible{
    border-color:#d7efdc!important;
    background:#f0faf2!important;
    color:#28723a!important;
}

body.square-mobile-first .admin-users-index-page .ca-state-badge--inactive,
body.square-mobile-first .admin-users-index-page .ca-state-badge--hidden,
body.square-mobile-first .sites-index-page .ca-state-badge--inactive,
body.square-mobile-first .sites-index-page .ca-state-badge--hidden{
    border-color:#f2d1ca!important;
    background:#fff2ef!important;
    color:#9b3327!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__actions,
body.square-mobile-first .sites-index-page .ca-site-row__actions{
    justify-self:end!important;
}

body.square-mobile-first .admin-users-index-page .ca-user-row__actions .button,
body.square-mobile-first .sites-index-page .ca-site-row__actions .button{
    min-height:34px!important;
    padding:7px 12px!important;
    border-radius:11px!important;
    font-size:13px!important;
}
/* ADMIN_MANAGEMENT_LISTS_UX_V3_END */

/* ADMIN_USER_FORM_COMPACT_UX_V2_START */
body.square-mobile-first .ca-user-form-page{
    gap:10px!important;
    max-width:720px!important;
    margin-inline:auto!important;
    padding-bottom:140px!important;
}

body.square-mobile-first .ca-user-form-page .ca-page-header{
    gap:8px!important;
    margin-bottom:0!important;
}

body.square-mobile-first .ca-user-form-page .ca-page-header h1{
    font-size:28px!important;
    line-height:1!important;
}

body.square-mobile-first .ca-user-form-page .ca-form-stack{
    gap:10px!important;
}

body.square-mobile-first .ca-user-form-page .ca-section-card{
    overflow:hidden!important;
    padding:12px!important;
    border-radius:14px!important;
}

body.square-mobile-first .ca-user-form-page .ca-section-card__head{
    margin-bottom:10px!important;
}

body.square-mobile-first .ca-user-form-page .ca-section-card__head h2{
    font-size:22px!important;
    line-height:1!important;
}

body.square-mobile-first .ca-user-form-page .ca-page-header p,
body.square-mobile-first .ca-user-form-page .ca-section-card__head p,
body.square-mobile-first .ca-user-form-page .ca-help-text{
    margin-top:4px!important;
    font-size:12px!important;
    line-height:1.22!important;
}

body.square-mobile-first .ca-user-form-page .ca-form-grid{
    grid-template-columns:1fr!important;
    gap:8px!important;
}

body.square-mobile-first .ca-user-form-page .ca-field{
    gap:5px!important;
}

body.square-mobile-first .ca-user-form-page .ca-field-label{
    font-size:11px!important;
    line-height:1!important;
}

body.square-mobile-first .ca-user-form-page input,
body.square-mobile-first .ca-user-form-page select,
body.square-mobile-first .ca-user-form-page textarea{
    min-height:44px!important;
    padding:10px 12px!important;
    border-radius:12px!important;
    font-size:16px!important;
}

body.square-mobile-first .ca-user-form-page .ca-status-edit-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    margin-top:10px!important;
    padding:10px!important;
    border:1px solid color-mix(in srgb,var(--app-accent,#111) 16%,rgba(17,24,39,.08))!important;
    border-radius:13px!important;
    background:color-mix(in srgb,var(--app-accent-soft,#f5f1e9) 42%,#fff)!important;
}

body.square-mobile-first .ca-user-form-page .ca-status-edit-card > div{
    min-width:0!important;
}

body.square-mobile-first .ca-user-form-page .ca-status-edit-card strong{
    display:block!important;
    font-size:14px!important;
    line-height:1.1!important;
}

body.square-mobile-first .ca-user-form-page .ca-status-edit-card p{
    display:-webkit-box!important;
    -webkit-line-clamp:1!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    margin:4px 0 0!important;
    font-size:12px!important;
    line-height:1.22!important;
}

body.square-mobile-first .ca-user-form-page .ca-user-status-pill{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    width:auto!important;
    min-width:98px!important;
    min-height:34px!important;
    padding:6px 10px!important;
    border-radius:999px!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
}

body.square-mobile-first .ca-user-form-page .ca-user-status-pill__dot{
    width:16px!important;
    height:16px!important;
    background:currentColor!important;
    box-shadow:0 2px 6px rgba(17,24,39,.14)!important;
}

body.square-mobile-first .ca-user-form-page .ca-user-status-pill--active{
    border-color:#d7efdc!important;
    background:#f0faf2!important;
    color:#28723a!important;
}

body.square-mobile-first .ca-user-form-page .ca-user-status-pill--active .ca-user-status-pill__dot{
    background:#2f9d4b!important;
}

body.square-mobile-first .ca-user-form-page .ca-user-status-pill--inactive{
    border-color:#f2d1ca!important;
    background:#fff2ef!important;
    color:#9b3327!important;
}

body.square-mobile-first .ca-user-form-page .ca-user-status-pill--inactive .ca-user-status-pill__dot{
    background:#d95345!important;
}

body.square-mobile-first .ca-user-form-page .ca-scope-selector{
    grid-template-columns:1fr!important;
    gap:8px!important;
}

body.square-mobile-first .ca-user-form-page .ca-radio-card{
    align-items:center!important;
    min-height:52px!important;
    padding:10px!important;
    border-radius:13px!important;
}

body.square-mobile-first .ca-user-form-page .ca-radio-card span{
    gap:2px!important;
}

body.square-mobile-first .ca-user-form-page .ca-radio-card strong{
    font-size:14px!important;
    line-height:1.1!important;
}

body.square-mobile-first .ca-user-form-page .ca-radio-card small{
    font-size:12px!important;
    line-height:1.18!important;
}

body.square-mobile-first .ca-user-form-page .ca-role-options{
    grid-template-columns:1fr!important;
    gap:6px!important;
}

body.square-mobile-first .ca-user-form-page .ca-role-chip{
    min-height:36px!important;
    padding:7px 9px!important;
    border-radius:12px!important;
    font-size:12px!important;
}
/* ADMIN_USER_FORM_COMPACT_UX_V2_END */

/* SITE_FORM_COMPACT_UX_V1_START */
body.square-mobile-first .ca-site-form-page{
    display:grid!important;
    gap:10px!important;
    max-width:720px!important;
    margin-inline:auto!important;
    padding-bottom:140px!important;
}

body.square-mobile-first .ca-site-form-page .page-header{
    margin-bottom:0!important;
}

body.square-mobile-first .ca-site-form-page .page-header h1{
    font-size:28px!important;
    line-height:1!important;
}

body.square-mobile-first .ca-site-form-card{
    display:grid!important;
    gap:10px!important;
    overflow:hidden!important;
    padding:12px!important;
    border-radius:14px!important;
}

body.square-mobile-first .ca-site-form-card > .card{
    margin:0!important;
    padding:10px!important;
    border-radius:13px!important;
}

body.square-mobile-first .ca-site-form-card .grid.two{
    grid-template-columns:1fr!important;
    gap:8px!important;
}

body.square-mobile-first .ca-site-form-card label{
    min-width:0!important;
    font-size:12px!important;
    line-height:1.1!important;
}

body.square-mobile-first .ca-site-form-card input,
body.square-mobile-first .ca-site-form-card select,
body.square-mobile-first .ca-site-form-card textarea{
    min-height:44px!important;
    padding:10px 12px!important;
    border-radius:12px!important;
    font-size:16px!important;
}

body.square-mobile-first .ca-site-form-card .ca-status-edit-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    margin:4px 0 0!important;
    padding:10px!important;
    border:1px solid color-mix(in srgb,var(--app-accent,#111) 14%,rgba(17,24,39,.08))!important;
    border-radius:13px!important;
    background:color-mix(in srgb,var(--app-accent-soft,#f5f1e9) 42%,#fff)!important;
}

body.square-mobile-first .ca-site-form-card .ca-status-edit-card > div{
    min-width:0!important;
}

body.square-mobile-first .ca-site-form-card .ca-status-edit-card strong{
    display:block!important;
    font-size:14px!important;
    line-height:1.1!important;
}

body.square-mobile-first .ca-site-form-card .ca-status-edit-card p{
    display:-webkit-box!important;
    -webkit-line-clamp:1!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    margin:4px 0 0!important;
    font-size:12px!important;
    line-height:1.2!important;
}

body.square-mobile-first .ca-site-form-card .ca-user-status-pill{
    min-width:98px!important;
    min-height:34px!important;
    padding:6px 10px!important;
    border-radius:999px!important;
    font-size:12px!important;
    white-space:nowrap!important;
}

body.square-mobile-first .ca-site-form-card .ca-user-status-pill__dot{
    width:16px!important;
    height:16px!important;
    background:currentColor!important;
    box-shadow:0 2px 6px rgba(17,24,39,.14)!important;
}

body.square-mobile-first .ca-site-form-card .ca-user-status-pill--active{
    border-color:#d7efdc!important;
    background:#f0faf2!important;
    color:#28723a!important;
}

body.square-mobile-first .ca-site-form-card .ca-user-status-pill--active .ca-user-status-pill__dot{
    background:#2f9d4b!important;
}

body.square-mobile-first .ca-site-form-card .ca-user-status-pill--inactive{
    border-color:#f2d1ca!important;
    background:#fff2ef!important;
    color:#9b3327!important;
}

body.square-mobile-first .ca-site-form-card .ca-user-status-pill--inactive .ca-user-status-pill__dot{
    background:#d95345!important;
}

body.square-mobile-first .ca-site-form-card .form-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:0!important;
}

body.square-mobile-first .ca-site-form-card .form-actions .button{
    min-height:44px!important;
    justify-content:center!important;
}
/* SITE_FORM_COMPACT_UX_V1_END */

/* SUPPLIER_DETAIL_COMPACT_UX_V1_START */
body.square-mobile-first .supplier-compact-page{
    display:grid!important;
    gap:10px!important;
    max-width:720px!important;
    margin-inline:auto!important;
    padding-bottom:140px!important;
}

body.square-mobile-first .supplier-compact-page .page-header{
    margin-bottom:0!important;
}

body.square-mobile-first .supplier-compact-page .page-header h1{
    font-size:28px!important;
    line-height:1!important;
}

body.square-mobile-first .supplier-compact-page .page-header .actions{
    gap:8px!important;
}

body.square-mobile-first .supplier-compact-page .page-header .button{
    min-height:38px!important;
    padding:8px 12px!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-visibility-strip{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:8px!important;
    align-items:center!important;
    padding:9px 10px!important;
    border-radius:12px!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-visibility-strip--visible{
    border-color:#d7efdc!important;
    background:#f7fcf8!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-visibility-strip--hidden{
    border-color:#f2d1ca!important;
    background:#fff7f5!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-visibility-strip__main{
    display:flex!important;
    gap:7px!important;
    align-items:center!important;
    min-width:0!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-visibility-strip p{
    overflow:hidden!important;
    margin:0!important;
    font-size:12px!important;
    line-height:1.15!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-visibility-strip .button{
    width:auto!important;
    max-width:none!important;
    min-height:30px!important;
    padding:6px 9px!important;
    border-radius:10px!important;
    font-size:12px!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details-card{
    overflow:hidden!important;
    padding:0!important;
    border-radius:14px!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details-card summary{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;
    align-items:center!important;
    min-height:52px!important;
    padding:10px 12px!important;
    list-style:none!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details-card summary strong{
    display:block!important;
    font-size:18px!important;
    line-height:1!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details-card summary small{
    display:block!important;
    overflow:hidden!important;
    margin-top:3px!important;
    font-size:12px!important;
    line-height:1.15!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:0!important;
    margin:0!important;
    padding:0 12px 12px!important;
    border-top:1px solid rgba(17,17,17,.08)!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details div{
    min-width:0!important;
    padding:8px 0!important;
    border-top:1px solid rgba(17,17,17,.08)!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details div:first-child{
    border-top:0!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details dt{
    margin:0 0 4px!important;
    font-size:10px!important;
    letter-spacing:.04em!important;
    line-height:1!important;
}

body.square-mobile-first .supplier-compact-page .ca-supplier-details dd{
    margin:0!important;
    font-size:14px!important;
    line-height:1.18!important;
    overflow-wrap:anywhere!important;
}
/* SUPPLIER_DETAIL_COMPACT_UX_V1_END */

/* SUPPLIERS_INDEX_COMPACT_CARDS_V1_START */
body.square-mobile-first .suppliers-index-page{
    display:grid!important;
    gap:10px!important;
    max-width:720px!important;
    margin-inline:auto!important;
    padding-bottom:140px!important;
}

body.square-mobile-first .suppliers-index-page .page-header{
    margin-bottom:0!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card--compact{
    display:grid!important;
    gap:8px!important;
    padding:12px!important;
    border-left-width:4px!important;
    border-radius:14px!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__identity{
    min-width:0!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__identity .u-title-sm{
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    margin:0!important;
    font-size:20px!important;
    line-height:1!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__badges{
    display:inline-flex!important;
    gap:6px!important;
    justify-content:flex-start!important;
    flex-wrap:wrap!important;
    max-width:none!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__warning{
    margin:0!important;
    padding:7px 9px!important;
    border:1px solid #f2d1ca!important;
    border-radius:10px!important;
    background:#fff7f5!important;
    color:#9b3327!important;
    font-size:12px!important;
    line-height:1.22!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__footer{
    display:flex!important;
    gap:8px!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    padding-top:0!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__footer .button{
    min-height:34px!important;
    padding:7px 12px!important;
    border-radius:10px!important;
}

body.square-mobile-first .suppliers-index-page .supplier-card__footer .muted{
    font-size:12px!important;
    line-height:1.15!important;
}
/* SUPPLIERS_INDEX_COMPACT_CARDS_V1_END */