@font-face {
    font-family: "Figtree";
    font-style: normal;
    font-weight: 400;
    font-stretch: 100%;
    font-display: swap;
    src: url("../fonts/figtree/figtree-latin-400-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Figtree";
    font-style: normal;
    font-weight: 400;
    font-stretch: 100%;
    font-display: swap;
    src: url("../fonts/figtree/figtree-latin-ext-400-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Figtree";
    font-style: normal;
    font-weight: 500;
    font-stretch: 100%;
    font-display: swap;
    src: url("../fonts/figtree/figtree-latin-500-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Figtree";
    font-style: normal;
    font-weight: 500;
    font-stretch: 100%;
    font-display: swap;
    src: url("../fonts/figtree/figtree-latin-ext-500-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Figtree";
    font-style: normal;
    font-weight: 600;
    font-stretch: 100%;
    font-display: swap;
    src: url("../fonts/figtree/figtree-latin-600-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Figtree";
    font-style: normal;
    font-weight: 600;
    font-stretch: 100%;
    font-display: swap;
    src: url("../fonts/figtree/figtree-latin-ext-600-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
    color-scheme: dark;
    --recicle-bg: 13 16 15;
    --recicle-deep: 17 20 19;
    --recicle-sidebar: 21 26 24;
    --recicle-topbar: 17 20 19;
    --recicle-surface: 29 36 34;
    --recicle-surface-strong: 35 43 40;
    --recicle-brand: 0 198 119;
    --recicle-brand-soft: 126 235 178;
    --recicle-brand-hover: 56 219 153;
    --recicle-brand-deep: 0 145 87;
    --recicle-brand-ink: 6 27 18;
    --recicle-brand-gray: 79 85 86;
    --recicle-title: 126 235 178;
    --recicle-text: 240 238 232;
    --recicle-text-soft: 222 218 208;
    --recicle-text-muted: 185 178 165;
    --recicle-text-dim: 137 143 139;
    --recicle-border: 58 65 62;
    --recicle-border-strong: 89 96 93;
    --recicle-danger: 244 63 94;
    --recicle-danger-soft: 253 164 175;
    --recicle-danger-text: 254 205 211;
    --recicle-warning: 245 158 11;
    --recicle-warning-soft: 253 230 138;
    --recicle-info: 45 212 191;
    --recicle-info-soft: 153 246 228;
    --recicle-success: 16 185 129;
    --recicle-success-soft: 110 231 183;
    /* Gestão: Figtree, shell 288px, controls 36/40px, spacing 12/16/20px.
       Breakpoints: 640 (spacing), 768 (fields), 1200 (wide grids); sidebar by device identity. */
    --recicle-font-family: Figtree, ui-sans-serif, system-ui, sans-serif;
    --recicle-font-xs: .75rem;
    --recicle-font-sm: .875rem;
    --recicle-font-body: .875rem;
    --recicle-font-title: 1.5rem;
    --recicle-line-height: 1.5;
    --recicle-space-xs: .25rem;
    --recicle-space-sm: .5rem;
    --recicle-space-control: .75rem;
    --recicle-space-section: 1rem;
    --recicle-space-panel: 1.25rem;
    --recicle-space-shell-mobile: .75rem;
    --recicle-space-shell-tablet: 1.25rem;
    --recicle-space-shell-desktop: 2rem;
    --recicle-height-control: 2.5rem;
    --recicle-height-compact: 2.25rem;
    --recicle-height-auth: 3rem;
    --recicle-border-width: 1px;
    --recicle-radius-control: .25rem;
    --recicle-radius-surface: .375rem;
    --recicle-radius-dialog: .5rem;
    --recicle-sidebar-width: 18rem;
    /* PNG 3155x1500; alpha visível em 492,492..2662,1007 (2171x516). */
    --recicle-logo-visible-fit-width: 144%;
    --recicle-shadow-surface: 0 25px 50px -12px rgb(0 0 0 / 30%);
    --recicle-background:
        linear-gradient(135deg, rgb(var(--recicle-brand) / 14%), transparent 32%),
        linear-gradient(225deg, rgb(var(--recicle-brand-gray) / 12%), transparent 34%),
        linear-gradient(135deg, rgb(var(--recicle-bg)), rgb(var(--recicle-surface)) 52%, rgb(var(--recicle-deep)));
}

/*
 * Tema claro: os neutros (fundo, superficie, texto, borda) sao o inverso exato
 * do tema escuro; marca e cores semanticas mantem o mesmo matiz, escurecidas
 * para sustentar contraste AA sobre superficie clara.
 * Todos os pares texto/fundo foram conferidos em WCAG AA (>= 4.5, borda >= 3).
 */
html[data-theme="light"] {
    color-scheme: light;
    --recicle-bg: 243 244 242;
    --recicle-deep: 235 237 234;
    --recicle-sidebar: 250 251 249;
    --recicle-topbar: 250 251 249;
    --recicle-surface: 255 255 255;
    --recicle-surface-strong: 244 246 243;
    --recicle-brand: 0 125 74;
    --recicle-brand-soft: 4 106 65;
    --recicle-brand-hover: 0 138 82;
    --recicle-brand-deep: 0 104 62;
    --recicle-brand-ink: 255 255 255;
    --recicle-brand-gray: 96 102 101;
    --recicle-title: 4 96 62;
    --recicle-text: 20 24 22;
    --recicle-text-soft: 38 44 41;
    --recicle-text-muted: 72 82 78;
    --recicle-text-dim: 92 101 97;
    --recicle-border: 219 223 218;
    --recicle-border-strong: 138 148 143;
    --recicle-danger: 190 18 60;
    --recicle-danger-soft: 159 18 57;
    --recicle-danger-text: 159 18 57;
    --recicle-warning: 180 83 9;
    --recicle-warning-soft: 146 64 14;
    --recicle-info: 13 116 111;
    --recicle-info-soft: 15 94 90;
    --recicle-success: 4 120 87;
    --recicle-success-soft: 5 95 70;
    --recicle-shadow-surface: 0 25px 50px -12px rgb(15 23 42 / 18%);
    --recicle-background:
        linear-gradient(135deg, rgb(var(--recicle-brand) / 8%), transparent 32%),
        linear-gradient(225deg, rgb(var(--recicle-brand-gray) / 8%), transparent 34%),
        linear-gradient(135deg, rgb(var(--recicle-bg)), rgb(var(--recicle-surface)) 52%, rgb(var(--recicle-deep)));
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

* {
    scrollbar-width: thin;
    scrollbar-color: rgb(var(--recicle-border-strong)) rgb(var(--recicle-bg));
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

[hidden] {
    display: none !important;
}

html,
body {
    min-width: 0;
    min-height: 100%;
    margin: 0;
}

body,
button,
input,
select,
textarea {
    font-family: var(--recicle-font-family);
}

body {
    background: var(--recicle-background);
    background-attachment: fixed;
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-body);
    line-height: var(--recicle-line-height);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

button,
summary,
label,
select {
    -webkit-tap-highlight-color: transparent;
}

:where(a, button, input, select, textarea, summary, [role="button"], [tabindex]):focus {
    outline: none;
}

:where(a, button, input, select, textarea, summary, [role="button"], [tabindex]):focus-visible {
    outline: 2px solid rgb(var(--recicle-brand));
    outline-offset: 3px;
}

svg {
    display: block;
}

:where(img, video, canvas) { max-width: 100%; }
fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }

.skip-link {
    position: fixed;
    z-index: 300;
    top: .75rem;
    left: .75rem;
    padding: .65rem .85rem;
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-brand));
    color: rgb(var(--recicle-bg));
    font-size: var(--recicle-font-sm);
    font-weight: 700;
    transform: translateY(-180%);
}

.skip-link:focus {
    transform: translateY(0);
}

/* Guest and authentication */
.auth-page {
    display: grid;
    min-height: 100vh;
    min-height: 100dvh;
    place-items: center;
    overflow-x: hidden;
    padding: 2rem 1.25rem;
}

.auth-shell {
    width: 100%;
    max-width: 28rem;
}

.auth-brand {
    display: flex;
    justify-content: center;
    margin-bottom: 2rem;
}

.auth-brand__viewport {
    position: relative;
    display: block;
    width: 100%;
    max-width: 22.5rem;
    height: 5rem;
    overflow: hidden;
}

.auth-brand__logo {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: min(var(--recicle-logo-visible-fit-width), 30.25rem);
    max-width: none;
    height: auto;
    transform: translate(-50%, -50%);
    transform-origin: center;
}

.auth-card {
    width: 100%;
    overflow: hidden;
    padding: 2rem;
    border: 1px solid rgb(var(--recicle-brand) / 18%);
    border-radius: var(--recicle-radius-surface);
    background: rgb(var(--recicle-surface) / 90%);
    box-shadow: var(--recicle-shadow-surface);
}

.auth-heading {
    margin-bottom: 1.5rem;
}

.auth-heading > * {
    margin: 0;
}

.auth-heading__eyebrow {
    margin-bottom: .5rem;
    color: rgb(var(--recicle-brand));
    font-size: var(--recicle-font-xs);
    font-weight: 600;
    letter-spacing: .22em;
    line-height: 1rem;
    text-transform: uppercase;
}

.auth-heading h1 {
    color: rgb(var(--recicle-text));
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 2rem;
}

.auth-heading h1 + p {
    margin-top: .5rem;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
    line-height: 1.5rem;
}

.auth-form {
    display: block;
}

.auth-form > * + * {
    margin-top: 1.25rem;
}

.field {
    min-width: 0;
}

.field > label,
.field > span,
.field-label,
.field__label,
.form-label,
.form-group > label:not(.form-check-line) {
    display: block;
    margin-bottom: var(--recicle-space-sm);
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    font-weight: 500;
    line-height: 1.25rem;
}

/* Rótulos de formulário ocupam a mesma linha de base: mesmo com texto em duas
   linhas, todos os controles de uma mesma grade começam na mesma altura. */
.form-group > label:not(.form-check-line),
.form-group > .form-label {
    display: flex;
    align-items: flex-end;
    min-height: 2rem;
    margin-bottom: 0;
    line-height: 1rem;
}

.field-control {
    position: relative;
    margin-top: .5rem;
}

.field-control__icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: .75rem;
    width: 1rem;
    height: 1rem;
    color: rgb(var(--recicle-text-dim));
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    transform: translateY(-50%);
    pointer-events: none;
}

.field :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea),
.form-control {
    display: block;
    width: 100%;
    min-height: var(--recicle-height-control);
    padding: .5rem .75rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-bg));
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-sm);
    line-height: 1.5rem;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.field-control--icon :where(input, select) {
    padding-left: 2.5rem;
}

.field :where(input, select, textarea):focus,
.form-control:focus {
    border-color: rgb(var(--recicle-brand));
    box-shadow: 0 0 0 3px rgb(var(--recicle-brand) / 20%);
}

.field-control--password input {
    padding-right: 2.75rem;
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: .25rem;
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    border: 0;
    border-radius: var(--recicle-radius-control);
    place-items: center;
    background: transparent;
    color: rgb(var(--recicle-text-muted));
    cursor: pointer;
    transform: translateY(-50%);
}

.password-toggle:hover {
    color: rgb(var(--recicle-text));
}

.password-toggle svg {
    width: 1rem;
    height: 1rem;
}

.field-link-row {
    display: flex;
    justify-content: flex-end;
    margin-top: .75rem;
}

.field-link-row a,
.auth-legal a,
.auth-link {
    color: rgb(var(--recicle-brand));
    font-size: var(--recicle-font-sm);
    font-weight: 500;
    line-height: 1.25rem;
    transition: color 150ms ease;
}

.field-link-row a:hover,
.auth-legal a:hover,
.auth-link:hover {
    color: rgb(var(--recicle-brand-hover));
}

.check-control {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: rgb(var(--recicle-text-soft));
    font-size: var(--recicle-font-sm);
    line-height: 1.25rem;
    cursor: pointer;
}

.check-control input {
    width: 1rem;
    height: 1rem;
    margin: 0;
    border: 1px solid rgb(var(--recicle-text-dim));
    border-radius: var(--recicle-radius-control);
    appearance: none;
    background: rgb(var(--recicle-text));
    cursor: pointer;
}

.check-control input:checked {
    border-color: rgb(var(--recicle-brand));
    background-color: rgb(var(--recicle-brand));
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%230d100f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='m3.25 8.25 3 3 6.5-7'/%3E%3C/svg%3E");
}

.auth-actions {
    display: grid;
    gap: .75rem;
}

.auth-form + .auth-actions,
.auth-actions + .auth-actions {
    margin-top: .75rem;
}

.auth-link {
    display: block;
    text-align: center;
}

.auth-legal {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem 1rem;
    margin-top: 1.25rem;
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
    line-height: 1rem;
}

.auth-legal a {
    color: inherit;
    font-size: inherit;
    font-weight: 400;
    line-height: 1rem;
}

.cookie-consent {
    position: relative;
    z-index: 50;
    width: auto;
    max-width: 56rem;
    margin: 1rem;
    padding: 1rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-dialog);
    background: rgb(var(--recicle-surface));
    color: rgb(var(--recicle-text));
    box-shadow: 0 25px 50px -12px rgb(0 0 0 / 40%);
}

.cookie-consent__layout {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.cookie-consent__message {
    display: flex;
    gap: .75rem;
}

.cookie-consent__icon {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    flex: 0 0 2.5rem;
    border-radius: var(--recicle-radius-control);
    place-items: center;
    background: linear-gradient(135deg, rgb(var(--recicle-brand-hover)), rgb(var(--recicle-brand)), rgb(var(--recicle-brand-gray)));
    color: rgb(var(--recicle-bg));
}

.cookie-consent__icon svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.cookie-consent h2 {
    margin: 0;
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-sm);
    font-weight: 600;
    line-height: 1.25rem;
}

.cookie-consent p {
    margin: .25rem 0 0;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
    line-height: 1.5rem;
}

.cookie-consent p a {
    color: rgb(var(--recicle-brand));
    font-weight: 500;
}

.cookie-consent p a:hover {
    color: rgb(var(--recicle-brand-hover));
}

.cookie-consent__actions {
    display: flex;
    width: 100%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
}

.cookie-consent__dismiss,
.cookie-consent__accept {
    height: 2.5rem;
    border-radius: var(--recicle-radius-control);
    cursor: pointer;
}

.cookie-consent__dismiss {
    display: grid;
    width: 2.5rem;
    padding: 0;
    border: 1px solid rgb(var(--recicle-border-strong));
    place-items: center;
    background: transparent;
    color: rgb(var(--recicle-text-muted));
}

.cookie-consent__dismiss:hover {
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-text));
}

.cookie-consent__dismiss svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.cookie-consent__accept {
    padding: 0 1rem;
    border: 0;
    background: linear-gradient(90deg, rgb(var(--recicle-brand-hover)), rgb(var(--recicle-brand)), rgb(var(--recicle-brand-gray)));
    color: rgb(var(--recicle-bg));
    font-size: var(--recicle-font-sm);
    font-weight: 600;
    line-height: 1.25rem;
}

.cookie-consent__accept:hover {
    filter: brightness(1.1);
}

.alert:where(:not(.page-stack > .alert)) { margin-bottom: 1.25rem; }

.alert {
    padding: .75rem;
    border: 1px solid;
    border-radius: var(--recicle-radius-control);
    font-size: var(--recicle-font-sm);
    line-height: 1.4;
}

.alert p {
    margin: 0;
}

.alert p + p {
    margin-top: .35rem;
}

.alert--error,
.alert-danger,
.alert-error {
    border-color: rgb(var(--recicle-danger) / 25%);
    background: rgb(var(--recicle-danger) / 10%);
    color: rgb(var(--recicle-danger-soft));
}

.alert--success,
.alert-success {
    border-color: rgb(var(--recicle-success) / 22%);
    background: rgb(var(--recicle-success) / 10%);
    color: rgb(var(--recicle-success-soft));
}

.alert--warning,
.alert-warning {
    border-color: rgb(var(--recicle-warning) / 25%);
    background: rgb(var(--recicle-warning) / 10%);
    color: rgb(var(--recicle-warning-soft));
}

.alert--info,
.alert-info {
    border-color: rgb(var(--recicle-info) / 25%);
    background: rgb(var(--recicle-info) / 10%);
    color: rgb(var(--recicle-info-soft));
}

.btn,
.btn-login,
.btn-primary,
.btn-secondary,
.btn-danger {
    display: inline-flex;
    min-height: var(--recicle-height-control);
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: .5rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--recicle-radius-control);
    font-size: var(--recicle-font-sm);
    font-weight: 600;
    line-height: 1.25rem;
    cursor: pointer;
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, opacity 150ms ease;
}

.btn svg,
.btn-login svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.btn-login,
.btn-primary {
    border-width: 0;
    background: rgb(var(--recicle-brand));
    color: rgb(var(--recicle-bg));
}

.btn-login:hover,
.btn-primary:hover {
    background: rgb(var(--recicle-brand-hover));
}

.btn-secondary {
    min-height: var(--recicle-height-compact);
    padding: .375rem .75rem;
    font-weight: 500;
    border-color: rgb(var(--recicle-border-strong));
    background: rgb(var(--recicle-bg));
    color: rgb(var(--recicle-text-soft));
}

.btn-secondary:hover {
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-text));
}

.btn-danger {
    border-color: rgb(var(--recicle-danger) / 35%);
    background: rgb(var(--recicle-danger) / 12%);
    color: rgb(var(--recicle-danger-text));
}

.btn:disabled,
.btn-login:disabled,
.btn-primary:disabled,
.btn-secondary:disabled,
.btn-danger:disabled {
    cursor: wait;
    opacity: .6;
}

.btn-login,
.btn--block {
    width: 100%;
}

/* Authenticated workspace shell — canonical Gestão geometry */
.workspace {
    min-width: 0;
    max-width: 100%;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
}

.workspace__frame {
    display: flex;
    min-width: 0;
    height: 100%;
    min-height: 0;
}

.workspace :where(.workspace-nav__icon, .workspace-company svg, .workspace-header svg, .workspace-sidebar__close svg) {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.workspace-sidebar {
    width: var(--recicle-sidebar-width);
    min-width: var(--recicle-sidebar-width);
    height: 100%;
    min-height: 0;
    flex: 0 0 var(--recicle-sidebar-width);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 1.25rem 1rem;
    border-right: 1px solid rgb(var(--recicle-border));
    background: rgb(var(--recicle-sidebar));
    scrollbar-color: rgb(var(--recicle-border-strong)) rgb(var(--recicle-bg));
    scrollbar-width: thin;
}

.workspace-sidebar__brand-block {
    margin-bottom: 1.5rem;
    padding: 0 .5rem;
}

.workspace-sidebar__brand-row {
    position: relative;
    min-width: 0;
}

.workspace-sidebar__brand {
    position: relative;
    display: block;
    width: 100%;
    height: 6rem;
    overflow: hidden;
}

.workspace-sidebar__brand img {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: min(var(--recicle-logo-visible-fit-width), 36rem);
    max-width: none;
    height: auto;
    transform: translate(-50%, -50%);
    transform-origin: center;
}

.workspace-sidebar__tagline {
    margin: -.5rem 0 0;
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
    line-height: 1rem;
    letter-spacing: .05em;
    text-align: center;
    text-transform: uppercase;
}

.workspace-sidebar__close {
    display: none;
}

.workspace-company__label {
    margin-top: .75rem;
    color: rgb(var(--recicle-text-dim));
    font-size: .625rem;
    font-weight: 600;
    line-height: 1rem;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.workspace-company {
    width: 100%;
    max-width: 20rem;
    margin-top: .25rem;
}

.workspace-company__trigger {
    display: flex;
    width: 100%;
    min-width: 0;
    height: 2.25rem;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: 0 .625rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-bg));
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-xs);
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.workspace-company__trigger:hover {
    border-color: rgb(var(--recicle-brand-gray));
}

.workspace-company__trigger[aria-expanded="true"] {
    border-color: rgb(var(--recicle-brand));
    box-shadow: 0 0 0 2px rgb(var(--recicle-brand) / 20%);
}

.workspace-company__trigger span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-company__trigger svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
}

.workspace-company__options {
    position: fixed;
    z-index: 150;
    width: var(--company-options-width, 16rem);
    max-width: calc(100vw - 1rem);
    max-height: min(18rem, calc(100dvh - 2rem));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: .25rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-sidebar));
    box-shadow: 0 25px 50px -12px rgb(0 0 0 / 60%);
}

.workspace-company__option {
    display: flex;
    width: 100%;
    min-height: var(--recicle-height-compact);
    align-items: center;
    gap: .5rem;
    padding: .375rem .75rem;
    border: 0;
    border-radius: .25rem;
    background: transparent;
    color: rgb(var(--recicle-text-soft));
    font-size: var(--recicle-font-xs);
    text-align: left;
    cursor: pointer;
}

.workspace-company__option:hover,
.workspace-company__option:focus-visible {
    background: rgb(var(--recicle-brand) / 15%);
    color: rgb(var(--recicle-text));
}

.workspace-company__option svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    color: rgb(var(--recicle-brand));
    opacity: 0;
}

.workspace-company__option[aria-selected="true"] {
    color: rgb(var(--recicle-text));
}

.workspace-company__option[aria-selected="true"] svg {
    opacity: 1;
}

.workspace-nav {
    display: grid;
    gap: .5rem;
}
.workspace-nav__group-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    min-height: var(--recicle-height-control);
    cursor: pointer;
    list-style: none;
}
.workspace-nav :is(.workspace-nav__group-toggle, .workspace-nav__subgroup > summary)::-webkit-details-marker { display: none; }
.workspace-nav__chevron { width: 1rem; height: 1rem; flex: 0 0 1rem; }
.workspace-nav__group[open] > summary .workspace-nav__chevron { transform: rotate(180deg); }
.workspace-nav__group-toggle:focus-visible { outline: 2px solid rgb(var(--recicle-brand)); outline-offset: 2px; }
.workspace-nav__subgroup > summary { cursor: pointer; list-style: none; }
.workspace-nav__subgroup > .workspace-nav__group-links { padding-left: .75rem; }

.workspace-nav__group-title {
    margin: 0 0 .25rem;
    padding: 0 .75rem;
    color: rgb(var(--recicle-text-dim));
    font-size: .625rem;
    font-weight: 600;
    line-height: 1rem;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.workspace-nav__group-title--link {
    display: flex;
    min-height: 2rem;
    align-items: center;
    gap: .5rem;
    border-radius: var(--recicle-radius-control);
    transition: background-color 150ms ease, color 150ms ease;
}

.workspace-nav__group-title--link svg {
    width: .875rem;
    height: .875rem;
    flex: 0 0 .875rem;
}

.workspace-nav__group-title--link:hover,
.workspace-nav__group-title--link.is-active {
    background: rgb(var(--recicle-brand) / 12%);
    color: rgb(var(--recicle-title));
}

.workspace-nav__group-links {
    display: grid;
    gap: .25rem;
}

.workspace-nav__link {
    display: flex;
    min-width: 0;
    min-height: var(--recicle-height-control);
    align-items: center;
    gap: .75rem;
    padding: .625rem .75rem;
    border-radius: var(--recicle-radius-control);
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
    font-weight: 500;
    line-height: 1.25rem;
    transition: background-color 150ms ease, color 150ms ease;
}

.workspace-nav__link span {
    min-width: 0;
}

.workspace-nav__link:hover {
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-text));
}

.workspace-nav__link.is-active {
    background: linear-gradient(90deg, rgb(var(--recicle-brand-hover)), rgb(var(--recicle-brand)), rgb(var(--recicle-brand-deep)));
    color: rgb(var(--recicle-brand-ink));
    box-shadow: 0 10px 20px -12px rgb(0 0 0 / 45%);
}

.workspace-nav__icon {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
}

.workspace-main {
    display: flex;
    min-width: 0;
    max-width: 100%;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    overflow: hidden;
}

.workspace-header {
    position: relative;
    z-index: 40;
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.25rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgb(var(--recicle-border));
    background: rgb(var(--recicle-topbar) / 95%);
    backdrop-filter: blur(12px);
}

.workspace-header__session {
    display: flex;
    min-width: 0;
    grid-column: 2;
    grid-row: 1;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
}

.workspace-header__session-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
}

.workspace-header__page {
    display: flex;
    min-width: 0;
    grid-column: 1;
    grid-row: 1;
    align-items: center;
    gap: .75rem;
}

.page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    width: 100%;
    min-width: 0;
    text-align: left;
}

.page-header h1 {
    margin: 0;
    overflow-wrap: break-word;
    color: rgb(var(--recicle-title));
    font-size: var(--recicle-font-title);
    font-weight: 600;
    line-height: 1.25;
}

.workspace-header__identity {
    min-width: 0;
    text-align: right;
}

.workspace-header__identity strong,
.workspace-header__identity span {
    display: block;
}

.workspace-header__identity strong {
    max-width: 15rem;
    overflow: hidden;
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-sm);
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-header__identity span {
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
}

.workspace-header__avatar,
.workspace-header__logout,
.workspace-header__theme,
.workspace-menu-toggle {
    height: 2.75rem;
    flex: 0 0 2.75rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
}

.workspace-header__avatar {
    display: grid;
    width: 2.75rem;
    overflow: hidden;
    place-items: center;
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-brand));
    font-size: var(--recicle-font-sm);
    font-weight: 600;
}

.workspace-header__logout {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: 0 .75rem;
    background: transparent;
    color: rgb(var(--recicle-text-soft));
    font-size: var(--recicle-font-sm);
    cursor: pointer;
}

.workspace-header__theme {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: 0 .6rem;
    background: rgb(var(--recicle-surface));
    color: rgb(var(--recicle-text-soft));
    font-size: var(--recicle-font-sm);
    cursor: pointer;
}

.workspace-header__theme:hover {
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-text));
}

.workspace-header__theme [data-theme-icon] {
    display: inline-flex;
    align-items: center;
}

.workspace-header__theme [hidden] {
    display: none;
}

.workspace-header__logout:hover,
.workspace-menu-toggle:hover {
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-text));
}

.workspace-header__logout svg,
.workspace-header__theme svg,
.workspace-menu-toggle svg,
.workspace-sidebar__close svg {
    width: 1.1rem;
    height: 1.1rem;
}

.workspace-menu-toggle {
    display: none;
    width: 2.75rem;
    padding: 0;
    place-items: center;
    background: transparent;
    color: rgb(var(--recicle-text-soft));
    cursor: pointer;
}

.workspace-content {
    min-width: 0;
    max-width: 100%;
    min-height: 0;
    flex: 1;
    overflow-x: auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: var(--recicle-space-shell-mobile);
}

.workspace-sidebar-backdrop {
    display: none;
}

.ui-grid { display: grid; min-width: 0; align-items: start; gap: var(--recicle-space-section); }
.ui-grid > * { min-width: 0; }
.ui-grid--1 { grid-template-columns: minmax(0,1fr); }
.ui-grid--2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ui-grid--3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.ui-grid--4 { grid-template-columns: repeat(4,minmax(0,1fr)); }
.ui-grid--12 { grid-template-columns: repeat(12,minmax(0,1fr)); }

/* Reusable record composition, following the Gestão Panel and detail primitives. */

/* Canonical action groups, including wrappers authored inside component slots.
   Menus and custom-select internals retain their own vertical/overlay layout. */
.list-toolbar,
.page-actions,
.actions-inline,
.page-header-actions,
.header-actions,
.filter-actions,
:is(.list-toolbar, .page-actions, .actions-inline, .page-header-actions, .header-actions, .filter-actions) :where(div):has(> :is(a[href], button, form, details.action-menu)):not(.action-menu__list):not(.action-menu__list *):not(.recicle-select):not(.recicle-select *) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--recicle-space-control);
    min-width: 0;
}
.page-actions,
.list-toolbar { justify-content: flex-end; }
:is(.list-toolbar, .page-actions, .actions-inline, .page-header-actions, .header-actions, .filter-actions) form { margin: 0; }

.list-toolbar[data-bulk-toolbar] {
    justify-content: space-between;
    margin-bottom: var(--recicle-space-control);
}
.list-toolbar > :is(select, .recicle-select) {
    width: auto;
    min-width: min(14rem, 100%);
    max-width: 100%;
}
.page-actions .btn { display: inline-flex; align-items: center; gap: .5rem; }
.page-actions .btn svg { width: 1rem; height: 1rem; }

.record-column { display: grid; min-width: 0; gap: var(--recicle-space-section); }
.record-wide { grid-column: 1 / -1; }
.record-badges { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.record-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.kpi-card.kpi-card--compact { min-width: 0; border: 0; box-shadow: none; border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-bg)); padding: .75rem; }
.kpi-card--compact .kpi-card__value { margin-top: .25rem; font-size: 1.125rem; }
.record-warning { margin-top: 1rem; font-size: .8125rem; }
.record-pairs { display: grid; gap: .75rem; margin-top: 0; margin-bottom: 0; }
.record-pair { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: baseline; gap: .2rem .75rem; min-width: 0; font-size: .875rem; line-height: 1.5; }
.record-pair dt { color: rgb(var(--recicle-text-muted)); }
.record-pair dd { margin: 0; text-align: right; color: rgb(var(--recicle-text)); overflow-wrap: anywhere; }
.record-pair small { display: block; margin-top: .25rem; text-align: inherit; font-size: .75rem; color: rgb(var(--recicle-text-dim)); overflow-wrap: anywhere; }
.record-pairs--financial .record-pair:last-child { padding-top: .75rem; border-top: 1px solid rgb(var(--recicle-border)); font-weight: 600; }
.record-notes { padding: .75rem; border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-bg)); white-space: pre-wrap; }
.record-notes, .record-empty-copy { font-size: .875rem; line-height: 1.5; color: rgb(var(--recicle-text-muted)); overflow-wrap: anywhere; }
.record-timeline { display: grid; gap: 1rem; }
.record-event__content { padding: .75rem; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-bg)); }
.record-event__content header { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; font-size: .75rem; }
.record-event__content strong, .record-event__content time, .record-event__content small { display: block; overflow-wrap: anywhere; }
.record-event__content time, .record-event__content small { margin-top: .25rem; color: rgb(var(--recicle-text-dim)); font-size: .75rem; }
.record-event__content b { display: block; margin-top: .5rem; font-size: .875rem; font-variant-numeric: tabular-nums; }
.record-event__content p { margin: .5rem 0; font-size: .8125rem; color: rgb(var(--recicle-text-muted)); overflow-wrap: anywhere; }
.record-event__files { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; font-size: .75rem; }
.record-files { display: grid; gap: .75rem; }
.record-file, .record-link-card { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-bg)); }
.record-file > div, .record-link-card > div { min-width: 0; }
.record-file strong, .record-file small, .record-file__context, .record-link-card span, .record-link-card strong, .record-link-card small { display: block; overflow-wrap: anywhere; }
.record-file strong, .record-link-card strong { font-size: .875rem; }
.record-file small, .record-file__context, .record-link-card small, .record-link-card span { font-size: .75rem; line-height: 1.5; color: rgb(var(--recicle-text-muted)); }
.record-table-gap { margin-top: 1rem; }
.ui-state.ui-state--empty { min-height: 0; padding: 1rem; border: 1px dashed rgb(var(--recicle-border-strong)); box-shadow: none; background: rgb(var(--recicle-bg) / 60%); }
.ui-state--empty .ui-state__title { font-size: .875rem; }
.ui-state--empty .ui-state__message { font-size: .8125rem; margin-top: .25rem; }
@media (max-width: 1199px) {
    .record-layout, .record-related { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
    .record-page { gap: 1rem; }
    .record-column, .record-layout, .record-related { gap: 1rem; }
    .record-summary { grid-template-columns: minmax(0, 1fr); }
    .record-file, .record-link-card { flex-direction: column; align-items: stretch; }
    .record-pair { grid-template-columns: minmax(0, 1fr); gap: .15rem; }
    .record-pair dd, .record-pair small { grid-column: 1; text-align: left; }
    .record-event__content header { flex-wrap: wrap; }
}
@media print {
    .page-actions { display: none !important; }
    .record-layout, .record-related { grid-template-columns: 1fr; }
    .card.ui-panel { break-inside: avoid; box-shadow: none; }
}

/* Universal content primitives */
.page-stack {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: var(--recicle-space-section);
}

.card,
.panel,
.kpi-card,
.table-shell,
.ui-state {
    min-width: 0;
    border: var(--recicle-border-width) solid rgb(var(--recicle-border));
    border-radius: var(--recicle-radius-surface);
    background: rgb(var(--recicle-surface) / 70%);
    box-shadow: 0 1px 2px rgb(0 0 0 / 10%);
}
.page-stack > *, .card__body > *, .form-grid > * { min-width: 0; max-width: 100%; }
.card { overflow: visible; }
.card__header {
    display: flex;
    flex-wrap: wrap;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: var(--recicle-space-control);
    padding: var(--recicle-space-section) var(--recicle-space-panel);
    border-bottom: 1px solid rgb(var(--recicle-border));
}
.filter-panel > .card__header { padding: .65rem .875rem; }
.card__header > div { min-width: 0; }
.card__header > .list-toolbar { margin-left: auto; flex: 0 1 auto; max-width: 100%; }
.page-header > .list-toolbar { margin-left: auto; }
.card__header h2 {
    margin: 0;
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    overflow-wrap: anywhere;
}
.card__body { min-width: 0; padding: var(--recicle-space-panel); }
.card__filters { min-width: 0; padding: var(--recicle-space-section) var(--recicle-space-panel); border-bottom: 1px solid rgb(var(--recicle-border)); }
.card__description { margin: 0 0 var(--recicle-space-section); color: rgb(var(--recicle-text-muted)); overflow-wrap: anywhere; }
.card__description:last-child { margin-bottom: 0; }
.card--compact .card__body { padding: var(--recicle-space-section); }
.card--compact .card__header { padding: var(--recicle-space-control) var(--recicle-space-section); }

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.kpi-card {
    display: flex;
    flex-direction: column;
    padding: var(--recicle-space-section);
}

.kpi-card__label {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: normal;
    text-transform: none;
}

.kpi-card__value {
    display: block;
    margin-top: 1rem;
    color: rgb(var(--recicle-text));
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    min-width: 0;
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.kpi-card__meta {
    display: block;
    margin-top: .35rem;
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
}
.kpi-card__head { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: var(--recicle-space-sm); }
.kpi-card__head svg { width: 1.25rem; height: 1.25rem; flex: 0 0 auto; color: rgb(var(--recicle-brand)); }
.kpi-card__action { display: flex; align-items: center; gap: .25rem; margin-top: auto; padding-top: .75rem; color: rgb(var(--recicle-brand)); font-size: var(--recicle-font-xs); }
.kpi-card__action svg { width: .875rem; height: .875rem; }
a.kpi-card:hover { border-color: rgb(var(--recicle-brand) / 60%); }


/* Executive content components — aligned with the canonical Gestão cards */


.panel__heading {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .75rem;
}

.panel__heading > div {
    min-width: 0;
}

.panel__icon {
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 1.25rem;
    color: rgb(var(--recicle-brand));
}



.panel__action {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .25rem;
    color: rgb(var(--recicle-brand));
    font-size: var(--recicle-font-xs);
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.panel__action:hover {
    color: rgb(var(--recicle-title));
}



.period-toolbar {
    display: grid;
    grid-template-columns: repeat(2, minmax(11rem, 15rem)) minmax(0, 1fr);
    align-items: end;
    gap: .75rem;
}

.period-toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
}

.period-toolbar__actions .btn {
    width: auto;
}

.indicator-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.indicator-card {
    display: flex;
    min-width: 0;
    min-height: 0;
    flex-direction: column;
    padding: 1rem;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .5rem;
    background: rgb(var(--recicle-bg));
    transition: border-color 150ms ease;
}

a.indicator-card:hover {
    border-color: rgb(var(--recicle-brand) / 60%);
}

.indicator-card__row {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
}

.indicator-card__label {
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.indicator-card strong {
    margin-top: .75rem;
    color: rgb(var(--recicle-text));
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.indicator-card small {
    margin-top: .25rem;
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
    line-height: 1.25rem;
}

.status-badge {
    gap: .3rem;
    font-family: inherit;
    display: inline-flex;
    min-height: 1.5rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: .15rem .5rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .6875rem;
    font-weight: 600;
    max-width: 100%;
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.status-badge__icon {
    width: .875rem;
    height: .875rem;
    flex: 0 0 .875rem;
}

button.status-badge { cursor: pointer; }
button.status-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.status-badge--neutral { background: rgb(var(--recicle-bg)); color: rgb(var(--recicle-text-muted)); }
.status-badge--info { background: rgb(var(--recicle-brand) / 12%); color: rgb(var(--recicle-text)); }

.status-badge--danger {
    border-color: rgb(var(--recicle-danger-soft) / 30%);
    background: rgb(var(--recicle-danger) / 15%);
    color: rgb(var(--recicle-danger-text));
}

.status-badge--warning {
    border-color: rgb(var(--recicle-warning-soft) / 30%);
    background: rgb(var(--recicle-warning) / 15%);
    color: rgb(var(--recicle-warning-soft));
}

.metric-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin-top: .75rem;
}

.metric-row {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .25rem .75rem;
    padding: .75rem 1rem;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .5rem;
    background: rgb(var(--recicle-bg) / 60%);
}

.metric-row > span {
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
}

.metric-row > strong {
    color: rgb(var(--recicle-text));
    font-size: .8125rem;
    font-weight: 600;
    text-align: right;
}

.metric-row > small {
    grid-column: 1 / -1;
    color: rgb(var(--recicle-text-dim));
    font-size: .6875rem;
}

.progress-summary {
    margin-top: .75rem;
    padding: 1rem;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .5rem;
    background: rgb(var(--recicle-bg) / 60%);
}

.progress-summary > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
}

.progress-summary > div:first-child strong {
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-sm);
}

.progress-track {
    height: .5rem;
    margin-top: .625rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgb(var(--recicle-border));
}

.progress-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: rgb(var(--recicle-brand));
}

.progress-summary > small {
    display: block;
    margin-top: .5rem;
    color: rgb(var(--recicle-text-dim));
    font-size: .6875rem;
    line-height: 1.1rem;
}

/* Financial overview — universal Recicle UI composition */
.finance-period-toolbar {
    grid-template-columns: repeat(3, minmax(10rem, 1fr)) auto;
}

.finance-balance-grid,
.finance-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: var(--recicle-space-section);
}

.finance-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.finance-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--recicle-space-section);
}





.finance-account-list,
.finance-category-list,
.finance-flow-list {
    display: grid;
    gap: .75rem;
}

.finance-account-row {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .5rem;
    background: rgb(var(--recicle-bg));
}

.finance-account-row > div {
    min-width: 0;
}

.finance-account-row strong,
.finance-account-row span {
    display: block;
    overflow-wrap: anywhere;
}

.finance-account-row strong {
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-sm);
}

.finance-account-row span {
    margin-top: .25rem;
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
}

.finance-account-row__unknown {
    text-align: right;
}

.finance-account-row__unknown strong {
    color: rgb(var(--recicle-text-muted));
}

.finance-account-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgb(var(--recicle-border));
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
}

.finance-account-total strong {
    color: rgb(var(--recicle-text));
}

.finance-forecast-note {
    padding: 1rem 1.25rem;
    border-top: 1px solid rgb(var(--recicle-border));
    background: rgb(var(--recicle-bg) / 55%);
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
    line-height: 1.25rem;
}

.finance-readonly-label {
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
    white-space: nowrap;
}

.amount-positive {
    color: rgb(var(--recicle-success-soft)) !important;
    font-weight: 600;
}

.amount-danger {
    color: rgb(var(--recicle-danger-soft)) !important;
    font-weight: 600;
}

.status-badge--positive {
    border-color: rgb(var(--recicle-success-soft) / 30%);
    background: rgb(var(--recicle-success) / 15%);
    color: rgb(var(--recicle-success-soft));
}

.finance-flow-list {
    margin: 0;
}

.finance-flow-list > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .875rem 1rem;
    border-radius: .375rem;
    background: rgb(var(--recicle-bg));
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
}

.finance-flow-list :where(dt, dd) {
    margin: 0;
}

.finance-flow-list dd {
    text-align: right;
}

.finance-flow-list__result {
    border: 1px solid rgb(var(--recicle-border));
    color: rgb(var(--recicle-text-soft)) !important;
}

.finance-category-row {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .5rem 1rem;
    padding: 1rem;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .5rem;
    background: rgb(var(--recicle-bg));
}

.finance-category-row > div:first-child {
    min-width: 0;
}

.finance-category-row strong,
.finance-category-row span {
    overflow-wrap: anywhere;
}

.finance-category-row strong {
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-sm);
}

.finance-category-row span {
    display: block;
    margin-top: .2rem;
    color: rgb(var(--recicle-text-dim));
    font-size: var(--recicle-font-xs);
}

.finance-category-track {
    height: .45rem;
    grid-column: 1 / -1;
    overflow: hidden;
    border-radius: 999px;
    background: rgb(var(--recicle-border));
}

.finance-category-track span {
    display: block;
    height: 100%;
    margin: 0;
    border-radius: inherit;
    background: rgb(var(--recicle-brand));
}

/* Shared select presentation for the global enhancer in app.js. */
.recicle-select {
    position: relative;
    width: 100%;
    min-width: 0;
}

.recicle-native-select {
    position: absolute !important;
    left: 0;
    bottom: 0;
    width: 1px !important;
    height: 1px !important;
    min-width: 0 !important;
    opacity: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    pointer-events: none !important;
}

.recicle-select-trigger {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: calc(var(--recicle-height-control) + 2px);
    padding: .5rem 2.25rem .5rem .75rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-surface));
    color: rgb(var(--recicle-text));
    font: inherit;
    font-size: var(--recicle-font-sm);
    font-weight: 500;
    line-height: 1.2;
    text-align: left;
    cursor: pointer;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.recicle-select-trigger::after {
    content: "";
    position: absolute;
    right: 13px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid rgb(var(--recicle-text-soft));
    border-bottom: 2px solid rgb(var(--recicle-text-soft));
    transform: translateY(-65%) rotate(45deg);
    transition: transform .16s ease;
}

.recicle-select.is-open .recicle-select-trigger {
    border-color: rgb(var(--recicle-brand));
    box-shadow: 0 0 0 3px rgba(0, 191, 125, .12);
}

.recicle-select.is-open .recicle-select-trigger::after {
    transform: translateY(-25%) rotate(225deg);
}

.recicle-select-label {
    display: block;
    min-width: 0;
    white-space: normal;
    overflow-wrap: break-word;
}

.recicle-select-panel {
    position: fixed;
    z-index: 10050;
    inset: auto;
    width: max-content;
    min-width: 160px;
    max-width: calc(100vw - 16px);
    max-height: 260px;
    overflow-y: auto;
    padding: 5px;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-surface);
    background: rgb(var(--recicle-surface));
    box-shadow: 0 16px 34px rgba(16, 33, 26, .17);
}

.recicle-select-search {
    position: sticky;
    top: 0;
    z-index: 1;
    width: 100%;
    min-height: 36px;
    margin-bottom: 6px;
    padding: 7px 10px;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-surface));
    color: rgb(var(--recicle-text));
    font: inherit;
    outline: none;
}

.recicle-select-search:focus {
    border-color: rgb(var(--recicle-brand));
    box-shadow: 0 0 0 3px rgba(5, 166, 107, .12);
}

.recicle-select-option {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: var(--recicle-height-compact);
    padding: .375rem .75rem;
    border: 0;
    border-radius: var(--recicle-radius-control);
    background: transparent;
    color: rgb(var(--recicle-text));
    font: inherit;
    font-size: var(--recicle-font-sm);
    font-weight: 500;
    text-align: left;
    cursor: pointer;
}

.recicle-select-option:hover,
.recicle-select-option:focus {
    outline: 0;
    background: rgb(var(--recicle-brand) / 10%);
    color: rgb(var(--recicle-brand-soft));
}

.recicle-select-option[aria-selected="true"] {
    background: rgb(var(--recicle-brand) / 18%);
    color: rgb(var(--recicle-brand-soft));
}

.recicle-select-check {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: 4px;
    background: rgb(var(--recicle-surface));
}

.recicle-select-option[aria-selected="true"] .recicle-select-check {
    border-color: rgb(var(--recicle-brand));
    background: rgb(var(--recicle-brand));
    box-shadow: inset 0 0 0 3px rgb(var(--recicle-bg));
}

.auth-form .field-control input { min-height: var(--recicle-height-auth); font-size: 1rem; }
.field-control > input { margin: 0; }
textarea.form-control, .field textarea { min-height: 6rem; resize: vertical; }
:where(input, select, textarea, button):disabled { opacity: .55; cursor: not-allowed; }
:where(input, textarea)[readonly] { color: rgb(var(--recicle-text-muted)); }
:where(input, select, textarea)[aria-invalid="true"], .is-invalid { border-color: rgb(var(--recicle-danger)); }
.field-error, .text-danger { color: rgb(var(--recicle-danger-text)); font-size: var(--recicle-font-xs); }
.text-muted { color: rgb(var(--recicle-text-muted)); }
:where(input[type="checkbox"], input[type="radio"]) { width: 1rem; height: 1rem; accent-color: rgb(var(--recicle-brand)); }
input[type="range"] { accent-color: rgb(var(--recicle-brand)); }
input[type="file"]::file-selector-button { padding: .25rem .5rem; border: 0; border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-surface-strong)); color: inherit; }
select:not(.recicle-native-select) { color-scheme: dark; min-width: 0; max-width: 100%; }
.recicle-select:has(> select[hidden]) { display: none; }
.recicle-select:has(> select[disabled]) .recicle-select-trigger { opacity: .55; cursor: not-allowed; }
.form-group { display: grid; align-content: start; min-width: 0; gap: var(--recicle-space-sm); }
.form-check-line { display: flex; align-items: center; gap: var(--recicle-space-sm); font-size: var(--recicle-font-sm); }
.form-group > .form-check-line { min-height: calc(var(--recicle-height-control) + 2px); }

.modal-page { padding: var(--recicle-space-section); }
.field-with-action { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: var(--recicle-space-sm); }
.search-card { display: none; position: relative; z-index: 20; margin-top: var(--recicle-space-sm); border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-sidebar)); }
.cliente-resultados { max-height: 15rem; overflow: auto; padding: var(--recicle-space-xs); }
.cliente-resultado { display: block; width: 100%; padding: var(--recicle-space-control); border: 0; border-radius: var(--recicle-radius-control); color: rgb(var(--recicle-text)); background: transparent; text-align: left; cursor: pointer; }
.cliente-resultado:hover { background: rgb(var(--recicle-brand) / 12%); }
.cliente-resultado :where(strong,span,small) { display: block; }
.card__body > .form-grid + .form-grid, .card__body > .card { margin-top: var(--recicle-space-section); }
.card__body h3 { margin: 0 0 var(--recicle-space-section); font-size: var(--recicle-font-sm); }

.form-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: .75rem;
}

/* Filter layout is explicit and scoped; operational form grids are independent. */
.filters[data-ui-filters],
.filters[data-ui-filters] .filters__fields {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: end;
    gap: var(--recicle-space-control);
    min-width: 0;
    margin: 0;
    padding: 0;
}
.filters[data-ui-filters] .filters__fields { grid-column: 1 / -1; }
/* A compact search and its submit are one indivisible toolbar group. The card
   places this form directly beside the heading, before its independent actions. */
.filters.filters--toolbar[data-ui-filters] { display: grid; grid-template-columns: minmax(0, 1fr) auto; flex: 1 1 16rem; align-items: center; gap: var(--recicle-space-control); min-width: 0; }

.filters[data-ui-filters] .field {
    display: grid;
    align-self: end;
    gap: var(--recicle-space-sm);
    min-width: 0;
    margin: 0;
    grid-column: span 3;
}
.filters.filters--toolbar[data-ui-filters] > .field { grid-column: auto; align-self: center; gap: 0; }
.filters[data-ui-filters] .field--half { grid-column: span 6; }
.filters[data-ui-filters] .field--third { grid-column: span 4; }
.filters[data-ui-filters] .field--full { grid-column: 1 / -1; }
.filters[data-ui-filters] .field > :is(label, span:first-child) {
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    line-height: 1.4;
}
.filters[data-ui-filters] .field > :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, .recicle-select) {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
}
.filters[data-ui-filters] .filter-actions {
    display: flex;
    flex-wrap: wrap;
    grid-column: 1 / -1;
    justify-content: flex-end;
    align-items: center;
    gap: var(--recicle-space-control);
    padding: 0;
    margin: 0;
}
@media (max-width: 1023px) {
    .filters[data-ui-filters] .field { grid-column: span 6; }
    .filters[data-ui-filters] :is(.field--half, .field--full) { grid-column: 1 / -1; }
}
@media (max-width: 639px) {
    .filters[data-ui-filters] .field { grid-column: 1 / -1; }
    .filters[data-ui-filters] .filter-actions > :is(a, button) { flex: 1 1 auto; justify-content: center; }
}

.form-grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.form-grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }

.field--full {
    grid-column: 1 / -1;
}

.field--half {
    grid-column: span 6;
}

.field--third {
    grid-column: span 4;
}

.field--quarter {
    grid-column: span 3;
}

.filter-actions { grid-column: 1 / -1; justify-content: flex-end; }

.form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    grid-column: 1 / -1;
}

.table-shell {
    min-width: 0;
    max-width: 100%;
}

.table-responsive {
    min-width: 0;
    max-width: 100%;
    overflow: visible;
}

.data-table,
.table-responsive table,
.table-shell table {
    width: 100%;
    min-width: 0;
    table-layout: var(--recicle-table-layout, auto);
    border-collapse: collapse;
}

.data-table :where(th, td),
.table-responsive table :where(th, td),
.table-shell table :where(th, td) {
    padding: var(--recicle-table-cell-padding, .4rem .75rem);
    line-height: 1.35;
    border-bottom: 1px solid rgb(var(--recicle-border));
    text-align: left;
    vertical-align: middle;
}

.data-table th,
.table-responsive table th,
.table-shell table th {
    /* Gestão Workspace DataTable: px-3 py-3, text-[11px], font-semibold, tracking-wide. */
    padding: var(--recicle-table-heading-padding, .75rem);
    font-family: var(--recicle-font-family);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: .025em;
    text-transform: uppercase;
    color: rgb(var(--recicle-text-dim));
    background: rgb(var(--recicle-bg));
    border-bottom: 1px solid rgb(var(--recicle-border));
    vertical-align: middle;
    overflow-wrap: var(--recicle-table-wrap, normal);
    word-break: normal;
    hyphens: none;
}

.data-table td,
.table-responsive table td,
.table-shell table td {
    color: rgb(var(--recicle-text-soft));
    font-size: .8125rem;
    overflow-wrap: var(--recicle-table-wrap, normal);
    word-break: normal;
}

/* Fitted tables: column budgets belong to the consumer colgroup. Text and
   native monetary textareas wrap within that budget instead of clipping a
   single-line input. Other editors retain their full-span row. */
.data-table--fit {
    --recicle-table-layout: fixed;
    --recicle-table-cell-padding: .4rem .3rem;
    --recicle-table-heading-padding: .6rem .3rem;
    --recicle-table-wrap: anywhere;
}
.data-table--fit :where(.cell-stack, .badge, .table-subtitle, .table-title, .amount) { white-space: normal; overflow-wrap: anywhere; }
.data-table--fit :where(.badge, .action-menu, .action-menu > summary) { min-width: 0; max-width: 100%; box-sizing: border-box; }
.data-table--fit .action-menu > summary { flex-wrap: wrap; gap: .2rem; padding: .25rem; overflow-wrap: anywhere; }
.data-table--fit input[type="checkbox"] { margin: 0; max-width: 100%; }

/* Independent information stays in its own column. Related primary/secondary
   content may share a cell; the consumer owns that semantic relationship.
   Default tables retain intrinsic widths; fitted text tables opt into wrapping. */
.table-responsive table :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not(.recicle-native-select), select:not(.recicle-native-select), textarea),
.table-responsive table .recicle-select,
.table-responsive table .recicle-select-trigger {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.table-responsive table :is(button, .btn, .action-menu > summary, .status-badge, .recicle-select-label) {
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    height: auto;
}
.table-responsive table textarea { field-sizing: content; resize: vertical; min-height: 4.5rem; }
.data-table--fit textarea[data-numero-moeda] {
    min-height: 1.6em;
    padding: .15rem .1rem;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .25rem;
    background: rgb(var(--recicle-surface) / .7);
    color: inherit;
    font: inherit;
    line-height: 1.4;
    text-align: right;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    resize: vertical;
}
.data-table--fit textarea[data-numero-moeda]:focus {
    outline: 2px solid rgb(var(--recicle-brand));
    outline-offset: 1px;
}

.data-table :is(th, td).text-right,
.data-table :is(th, td).table-actions { text-align: right; }
.data-table :is(th, td).text-center { text-align: center; }

.data-table tbody tr:hover td,
.table-responsive table tbody tr:hover td,
.table-shell table tbody tr:hover td {
    background: rgb(var(--recicle-brand) / 4%);
}

.action-menu {
    position: relative;
    display: inline-flex;
}

.action-menu > summary {
    display: inline-flex;
    min-height: var(--recicle-height-compact);
    align-items: center;
    justify-content: center;
    gap: .4rem;
    padding: .35rem .65rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    color: rgb(var(--recicle-text-soft));
    font-size: var(--recicle-font-xs);
    cursor: pointer;
    list-style: none;
}

.action-menu > summary::-webkit-details-marker {
    display: none;
}

.action-menu > summary::after {
    border-width: .3rem .25rem 0;
    border-style: solid;
    border-color: currentColor transparent transparent;
    content: "";
}

.action-menu[open] { z-index: 25; }

.action-menu[open] > summary,
.action-menu > summary:hover {
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-text));
}

.action-menu__list {
    max-height: min(70vh, 34rem);
    overflow-y: auto;
    position: fixed;
    z-index: 160;
    inset: auto;
    display: grid;
    width: max-content;
    min-width: 10rem;
    max-width: min(20rem, 80vw);
    gap: .15rem;
    padding: .25rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-bg));
    box-shadow: 0 18px 36px -18px rgb(0 0 0 / 80%);
}

/* Ações com formulário (Pagar/Excluir) precisam ocupar a linha inteira como os links. */
.action-menu__list form { margin: 0; width: 100%; }


.action-menu__list :where(a, button) {
    display: flex;
    width: 100%;
    min-height: var(--recicle-height-control);
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    padding: .5rem .75rem;
    border: 0;
    border-radius: var(--recicle-radius-control);
    background: transparent;
    color: rgb(var(--recicle-text-soft));
    font-size: .8125rem;
    text-align: left;
    cursor: pointer;
}

.action-menu__list :where(a, button):hover {
    background: rgb(var(--recicle-surface-strong));
    color: rgb(var(--recicle-text));
}

.action-menu__list hr { width: 100%; margin: .25rem 0; border: 0; border-top: 1px solid rgb(var(--recicle-border)); }

.action-menu__list .is-danger {
    color: rgb(var(--recicle-danger-text));
}

.action-menu__list .is-danger:hover {
    background: rgb(var(--recicle-danger) / 12%);
}

.ui-state,
.empty-state {
    display: grid;
    min-height: 12rem;
    place-items: center;
    padding: 2rem;
    text-align: center;
}

.ui-state__content {
    max-width: 28rem;
}

.ui-state__title {
    margin: 0;
    color: rgb(var(--recicle-text));
    font-size: 1rem;
    font-weight: 600;
}

.ui-state__message {
    margin: .5rem 0 0;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
    line-height: 1.5;
}

.ui-state__spinner {
    width: 1.75rem;
    height: 1.75rem;
    margin: 0 auto .75rem;
    border: 2px solid rgb(var(--recicle-brand) / 20%);
    border-top-color: rgb(var(--recicle-brand));
    border-radius: 999px;
    animation: recicle-spin .75s linear infinite;
}

@keyframes recicle-spin {
    to { transform: rotate(360deg); }
}

.modal-backdrop,
.work-modal {
    position: fixed;
    z-index: 200;
    inset: 0;
    display: grid;
    overflow-y: auto;
    place-items: center;
    padding: .75rem;
    background: rgb(0 0 0 / 70%);
}

.work-modal { display: none; }
.work-modal.active { display: grid; }
.ui-modal-open { overflow: hidden; }
.modal-card__body > form, form.modal-card__body { display: grid; gap: var(--recicle-space-section); }
.modal-card__body > div > .form-group + .form-group { margin-top: var(--recicle-space-section); }
.modal-close { display: grid; width: var(--recicle-height-compact); height: var(--recicle-height-compact); place-items: center; border: 0; background: transparent; color: rgb(var(--recicle-text-muted)); cursor: pointer; }
.modal-close svg { width: 1rem; height: 1rem; }
.finance-payment-summary { padding: var(--recicle-space-control); background: rgb(var(--recicle-bg)); border-radius: var(--recicle-radius-control); font-size: var(--recicle-font-sm); }
.finance-payment-summary :where(strong,small,span) { display: block; }
.finance-launch-kind { display: flex; gap: var(--recicle-space-sm); margin-bottom: var(--recicle-space-section); }
.finance-launch-kind button { min-height: var(--recicle-height-control); padding: .5rem 1rem; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); color: rgb(var(--recicle-text)); background: rgb(var(--recicle-bg)); cursor: pointer; }
.finance-launch-kind button.is-active { border-color: rgb(var(--recicle-brand)); color: rgb(var(--recicle-brand)); }

.modal-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    width: calc(100vw - 1.5rem);
    max-width: calc(100vw - 1.5rem);
    max-height: calc(100vh - 1.5rem);
    max-height: calc(100dvh - 1.5rem);
    padding: 0;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-dialog);
    background: rgb(var(--recicle-sidebar));
    color: rgb(var(--recicle-text));
    box-shadow: 0 25px 50px rgb(0 0 0 / 40%);
}
dialog.modal-card { inset: 0; margin: auto; }
dialog.modal-card:not([open]) { display: none; }
dialog.modal-card::backdrop { background: rgb(0 0 0 / 70%); }
.modal-card__header, .modal-card__body, .modal-card__footer { padding: 1rem; }
.modal-card__header, .modal-card__footer { flex: none; background: rgb(var(--recicle-sidebar)); }
.modal-card__header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; border-bottom: 1px solid rgb(var(--recicle-border-strong)); }
.modal-card__header h2 { min-width: 0; overflow-wrap: break-word; margin: 0; font-size: 1rem; font-weight: 600; }
.modal-card__body { flex: 1 1 auto; min-height: 0; min-width: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
.modal-card__footer { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .75rem; border-top: 1px solid rgb(var(--recicle-border-strong)); }
.modal-card__footer[hidden] { display: none; }
.recicle-record [data-empresa-record], .recicle-record [data-finance-record] { padding: 0; margin: 0; }
@media (min-width: 640px) {
    .modal-backdrop, .work-modal { padding: 1.5rem; }
    .modal-card { width: calc(100vw - 3rem); max-width: 48rem; max-height: calc(100dvh - 3rem); }
    .modal-card--small { max-width: 32rem; }
    .modal-card--lg { max-width: 72rem; }
    .modal-card__header, .modal-card__body, .modal-card__footer { padding-left: 1.25rem; padding-right: 1.25rem; }
}
.recicle-record > .modal-card__footer, .personnel-record > .modal-card__footer { flex-direction: column-reverse; align-items: stretch; }
@media (min-width: 768px) { .recicle-record > .modal-card__footer, .personnel-record > .modal-card__footer { flex-direction: row; align-items: center; } }
.modal-card--period > .modal-card__header { padding: .75rem 1rem; }
.modal-card--period > .modal-card__body, .modal-card--period > .modal-card__footer { padding: 1rem; }
@media (min-width: 640px) { .recicle-record.modal-card--period > .modal-card__footer { flex-direction: row; align-items: center; } }
/* TenantCompaniesModal has 12/20px viewport margins and a 64rem panel. */
.modal-card--company { width: calc(100vw - 1.5rem); max-width: 64rem; max-height: calc(100dvh - 1.5rem); }
.modal-card--company > .modal-card__header { align-items: flex-start; padding-top: .75rem; padding-bottom: .75rem; }
.modal-card--company .form-actions { flex-direction: column-reverse; flex-wrap: nowrap; align-items: stretch; gap: .5rem; }
@media (min-width: 640px) {
    .modal-card--company { width: calc(100vw - 2.5rem); max-height: calc(100dvh - 2.5rem); }
    .modal-card--company > .modal-card__header { padding-top: 1rem; padding-bottom: 1rem; }
    .modal-card--company .form-actions { flex-direction: row; align-items: center; }
}
/* PartyModal uses its own explicit bottom-sheet variant in the reference. */
.modal-card--party { max-height: calc(100dvh - 1rem); width: 100%; max-width: 48rem; border-radius: .75rem; }
@media (max-width: 639.98px) {
    dialog.modal-card--party { margin: auto auto 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
}
@media (min-width: 640px) { .modal-card--party { width: calc(100vw - 2rem); } .recicle-record.modal-card--party > .modal-card__footer { flex-direction: row; align-items: center; } }

@media (max-width: 1100px) {
    .kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }



    

    .finance-balance-grid,
    .finance-detail-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 640px) {
    .cookie-consent {
        position: fixed;
        right: 1rem;
        bottom: 1rem;
        left: 1rem;
        margin: 0 auto;
    }

    .workspace-header {
        padding: 1rem 1.25rem;
    }

    .workspace-content {
        padding: var(--recicle-space-shell-tablet);
    }
}

@media (min-width: 1024px) {
    .workspace-content { padding: var(--recicle-space-shell-desktop); }
}

@media (min-width: 768px) {
    .cookie-consent__layout {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .cookie-consent__actions {
        width: auto;
    }
}

/* Shell presentation follows device identity, independent of viewport and zoom. */
html[data-ui-mobile="true"] .workspace-sidebar {
    position: fixed;
    z-index: 100;
    inset: 0 auto 0 0;
    width: min(22rem, 88vw);
    min-width: 0;
    padding-top: max(1.25rem, env(safe-area-inset-top));
    padding-bottom: max(1.25rem, env(safe-area-inset-bottom));
    box-shadow: 1.5rem 0 3rem rgb(0 0 0 / 45%);
    visibility: hidden;
    transform: translateX(-105%);
    transition: transform 180ms ease;
}

html[data-ui-mobile="true"] .workspace-sidebar__brand-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

html[data-ui-mobile="true"] .workspace-sidebar__brand {
    width: min(100%, 13.75rem);
    height: 5rem;
    flex: 1;
}

html[data-ui-mobile="true"] .workspace-sidebar__brand img {
    left: 0;
    width: min(var(--recicle-logo-visible-fit-width), 30rem);
    max-width: none;
    height: auto;
    transform: translate(0, -50%);
    transform-origin: left center;
}

html[data-ui-mobile="true"] .workspace-sidebar__tagline {
    text-align: left;
}

html[data-ui-mobile="true"] .workspace.is-menu-open .workspace-sidebar {
    visibility: visible;
    transform: translateX(0);
}

html[data-ui-mobile="true"] .workspace-sidebar__close {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 2.75rem;
    padding: 0;
    border: 0;
    border-radius: var(--recicle-radius-control);
    place-items: center;
    background: transparent;
    color: rgb(var(--recicle-text-muted));
    cursor: pointer;
}

html[data-ui-mobile="true"] .workspace-sidebar-backdrop {
    position: fixed;
    z-index: 90;
    inset: 0;
    background: rgb(0 0 0 / 70%);
}

html[data-ui-mobile="true"] .workspace.is-menu-open .workspace-sidebar-backdrop {
    display: block;
}

html[data-ui-mobile="true"] .workspace-menu-toggle {
    display: grid;
}

html[data-ui-mobile="true"] .workspace-header {
    padding: max(.75rem, env(safe-area-inset-top)) .75rem .75rem;
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
}

html[data-ui-mobile="true"] .workspace-header__session {
    width: 100%;
    grid-column: 1;
    grid-row: 1;
    justify-content: space-between;
}

html[data-ui-mobile="true"] .workspace-header__identity { display: none; }

html[data-ui-mobile="true"] .workspace-header__page {
    grid-column: 1;
    grid-row: 2;
}

html[data-ui-mobile="true"] .workspace-header .page-header h1 {
    font-size: 1.25rem;
}

@media (max-width: 767px) {
    .ui-grid--2, .ui-grid--3, .ui-grid--4, .form-grid-2, .form-grid-3 { grid-template-columns: minmax(0,1fr); }

    .field--half,
    .field--third,
    .field--quarter {
        grid-column: 1 / -1;
    }

    .period-toolbar,
    .finance-period-toolbar {
        grid-template-columns: minmax(0, 1fr);
    }

    .period-toolbar__actions {
        justify-content: stretch;
    }

    .period-toolbar__actions .btn {
        flex: 1 1 10rem;
    }

    .panel__action {
        align-self: flex-start;
    }
}

@media (max-width: 639px) {
    .auth-card {
        padding: 1.5rem;
    }

    .kpi-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .indicator-grid,
    .metric-list,
    .finance-summary-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-account-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-account-row__unknown {
        text-align: left;
    }

    .page-header h1 {
        font-size: 1.125rem;
    }

}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* Financial list workspace */
.status-tabs,
.selection-metrics {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
}




.status-tabs {
    margin-bottom: 1rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid rgb(var(--recicle-border));
}

.status-tab {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    background: transparent;
    font-family: inherit;
    padding: .45rem .75rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    font-weight: 600;
}

.status-tab:focus-within { outline: 2px solid rgb(var(--recicle-brand)); outline-offset: 2px; }

.status-tab:hover,
.status-tab.is-active,
.status-tab:has(input:checked) {
    border-color: rgb(var(--recicle-brand) / 50%);
    background: rgb(var(--recicle-brand) / 12%);
    color: rgb(var(--recicle-brand-soft));
}

.form-help {
    margin-right: auto;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
}

.selection-metrics {
    margin-bottom: .75rem;
}

.selection-metrics span {
    flex: 0 1 auto;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
}

.selection-metrics strong {
    color: rgb(var(--recicle-text));
    font-size: inherit;
}

.cell-stack {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .2rem;
    overflow-wrap: var(--recicle-table-wrap, normal);
    word-break: normal;
}

.cell-stack strong,
.amount {
    color: rgb(var(--recicle-text));
}

.table-title { display: block; }
.table-subtitle,
.cell-stack :where(span, small) {
    display: block;
    color: rgb(var(--recicle-text-muted));
    font-size: .725rem;
    line-height: 1.35;
}

.table-selection {
    width: 2.75rem;
    text-align: center !important;
}

.table-actions {
    text-align: right !important;
}



.action-menu__list form {
    margin: 0;
}

.modal-form {
    display: grid;
    gap: 1rem;
}

.modal-form p {
    margin: 0;
    color: rgb(var(--recicle-text-muted));
    line-height: 1.5;
}

/* Shared table presentation. This is the only table/mobile layout owner. */
.responsive-table-layout { min-width: 0; max-width: 100%; }
.responsive-table-cards { display: none; min-width: 0; }
html[data-ui-mobile="true"] .responsive-table-layout[data-table-mobile-slot] > .responsive-table-cards { display: block; }
html[data-ui-mobile="true"] .responsive-table-layout[data-table-mobile-slot] > .table-responsive { display: none; }
html[data-ui-mobile="true"] .responsive-table-layout:not([data-table-mobile-slot]) > .table-responsive > table {
    display: block;
    width: 100%;
}
html[data-ui-mobile="true"] .responsive-table-layout:not([data-table-mobile-slot]) > .table-responsive > table > thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
}
html[data-ui-mobile="true"] .responsive-table-layout:not([data-table-mobile-slot]) > .table-responsive > table > :is(tbody, tfoot) { display: grid; gap: .75rem; }
html[data-ui-mobile="true"] .responsive-table-layout:not([data-table-mobile-slot]) > .table-responsive > table > :is(tbody, tfoot) > tr {
    display: block;
    min-width: 0;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-surface));
}
html[data-ui-mobile="true"] .responsive-table-layout:not([data-table-mobile-slot]) > .table-responsive > table > :is(tbody, tfoot) > tr > :is(td, th) {
    display: block;
    width: auto;
    min-width: 0;
    text-align: left !important;
    padding: .65rem .75rem;
}
html[data-ui-mobile="true"] .responsive-table-layout:not([data-table-mobile-slot]) > .table-responsive > table > :is(tbody, tfoot) > tr > :is(td, th):last-child { border-bottom: 0; }
html[data-ui-mobile="true"] .responsive-table-layout:not([data-table-mobile-slot]) > .table-responsive > table > tbody > tr > [data-label]:not([data-label=""])::before {
    content: attr(data-label);
    display: block;
    margin-bottom: .25rem;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    font-weight: 600;
}

/* Quadro kanban: cartão de registro dentro da coluna de etapa. */
.board-card {
    display: grid;
    gap: var(--recicle-space-sm);
    min-width: 0;
    padding: var(--recicle-space-control);
    border: 1px solid rgb(var(--recicle-border));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-surface));
}
.board-card + .board-card { margin-top: var(--recicle-space-sm); }
.board-card__head { display: flex; align-items: center; justify-content: space-between; gap: var(--recicle-space-sm); min-width: 0; }
/* Pagina publica institucional: conteudo sem a sidebar do sistema. */
.public-shell { width: 100%; max-width: 60rem; }
.public-brand { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.public-brand img { width: 11rem; height: auto; }
/* Secoes internas de um card: titulo com respiro em relacao ao bloco anterior. */
.form-grid + h3 { margin-top: var(--recicle-space-section); }
/* Grade de fotos/anexos em paginas publicas e cards. */
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: var(--recicle-space-sm); }
.photo-grid a { display: grid; gap: .35rem; padding: .5rem; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text-muted)); font-size: var(--recicle-font-xs); overflow-wrap: anywhere; }
.photo-grid img { width: 100%; height: 7rem; object-fit: cover; border-radius: calc(var(--recicle-radius-control) - 2px); }
/* Mapa publico de coletas (Leaflet) com painel lateral em cards. */
.public-map-shell { position: relative; min-height: 100vh; min-height: 100dvh; overflow: hidden; background: rgb(var(--recicle-bg)); }
.public-map-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.public-map-brand { position: absolute; top: var(--recicle-space-section); left: var(--recicle-space-section); z-index: 500; display: flex; align-items: center; gap: var(--recicle-space-sm); padding: var(--recicle-space-sm) var(--recicle-space-control); border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-sidebar)); }
.public-map-brand img { width: 7rem; height: auto; }
.public-map-brand span { font-size: var(--recicle-font-xs); color: rgb(var(--recicle-text-muted)); }
.public-map-panel { position: absolute; top: var(--recicle-space-section); right: var(--recicle-space-section); bottom: var(--recicle-space-section); z-index: 500; display: grid; gap: var(--recicle-space-section); align-content: start; width: min(24rem, calc(100% - 2rem)); overflow: auto; padding-right: .25rem; }
.public-map-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--recicle-space-sm); }
.public-map-stat { display: grid; gap: .15rem; padding: var(--recicle-space-sm); border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-surface)); }
.public-map-stat span { font-size: var(--recicle-font-xs); color: rgb(var(--recicle-text-muted)); }
.public-map-stat strong { font-size: var(--recicle-font-md); }
.public-city-list { display: grid; gap: var(--recicle-space-sm); }
.public-city-item { display: grid; gap: .15rem; padding: var(--recicle-space-sm) var(--recicle-space-control); border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: rgb(var(--recicle-surface)); }
.public-city-item strong { font-size: var(--recicle-font-sm); }
.public-city-item span { font-size: var(--recicle-font-xs); color: rgb(var(--recicle-text-muted)); }
.public-map-empty { padding: var(--recicle-space-control); border: 1px dashed rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); color: rgb(var(--recicle-text-muted)); font-size: var(--recicle-font-xs); }
.public-map-legend-row { display: flex; align-items: center; gap: var(--recicle-space-sm); font-size: var(--recicle-font-xs); color: rgb(var(--recicle-text-muted)); }
.public-map-dot { width: .75rem; height: .75rem; border-radius: 50%; display: inline-block; }
.public-map-dot.dot-hoje { background: #27c98d; }
.public-map-dot.dot-amanha { background: #f5c044; }
.public-map-dot.dot-proximos { background: #8fb3a6; }
.public-marker { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; border: 2px solid rgba(0, 0, 0, .25); background: #27c98d; color: #04150f; font-size: .75rem; font-weight: 800; }
.public-marker.amanha { background: #f5c044; }
.public-marker.proximos { background: #8fb3a6; }
.public-popup { display: grid; gap: .2rem; color: #0b1a14; font-size: .8rem; }
.public-popup a { color: #007a53; font-weight: 700; }
@media (max-width: 767px) {
    .public-map-panel { position: static; width: auto; max-height: 45vh; padding: var(--recicle-space-section); }
}
/* Sobre o mapa, o card precisa de fundo solido para leitura. */
.public-map-panel > .card { background: rgb(var(--recicle-sidebar)); backdrop-filter: blur(3px); }
/* Navegacao interna do workspace CRM (abas Visao geral / Leads / Configuracoes). */
.crm-workspace-nav {
    display: flex;
    gap: 8px;
    align-items: center;
    overflow-x: auto;
    padding: 6px;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: var(--recicle-radius-surface);
    background: rgb(var(--recicle-surface));
    box-shadow: none;
    scrollbar-width: thin;
}
.crm-workspace-nav a {
    flex: 0 0 auto;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border-radius: 11px;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.crm-workspace-nav a:hover,
.crm-workspace-nav a.active {
    background: rgb(var(--recicle-surface));
    color: rgb(var(--recicle-brand-soft));
}
@media (max-width: 720px) {
    .crm-workspace-nav { margin-inline: -4px; }
}
/* Carteira de clientes: busca com autocomplete e campanha WhatsApp. */
.clientes-select-cell { width: 42px; text-align: center; }
.clientes-search-autocomplete { position: relative; display: grid; gap: 7px; min-width: 0; }
.clientes-search-row { display: flex; gap: 8px; align-items: center; min-width: 0; }
.clientes-search-row .form-control { min-width: 0; flex: 1 1 auto; }
.clientes-clear-geo { flex: 0 0 auto; white-space: nowrap; }
.clientes-clear-geo[hidden], .clientes-radius-field[hidden] { display: none !important; }
.clientes-radius-help { display: block; margin-top: 5px; color: rgb(var(--recicle-text-muted)); font-size: var(--recicle-font-xs); line-height: 1.25; }
.clientes-geo-note { padding: 10px 12px; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); line-height: 1.4; }
.clientes-autocomplete-results { position: absolute; z-index: 80; top: calc(100% + 6px); left: 0; right: 0; display: grid; gap: 6px; max-height: 280px; overflow-y: auto; padding: 8px; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-sidebar)); }
.clientes-autocomplete-results[hidden] { display: none !important; }
.clientes-autocomplete-option, .clientes-autocomplete-empty { width: 100%; padding: 10px 12px; border: 1px solid transparent; border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); text-align: left; }
.clientes-autocomplete-option { display: grid; gap: 3px; cursor: pointer; }
.clientes-autocomplete-option:hover, .clientes-autocomplete-option:focus { border-color: rgb(var(--recicle-brand) / 45%); outline: none; }
.clientes-autocomplete-option[aria-selected="true"] { border-color: rgb(var(--recicle-brand)); }
.clientes-autocomplete-option strong { font-size: var(--recicle-font-xs); font-weight: 600; }
.clientes-autocomplete-option span, .clientes-autocomplete-empty { color: rgb(var(--recicle-text-muted)); font-size: var(--recicle-font-xs); line-height: 1.35; }
.clientes-campaign-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 8px; align-items: stretch; width: 100%; min-width: 0; }
.clientes-campaign-actions > label { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; font-size: var(--recicle-font-sm); line-height: 1.4; }
.clientes-campaign-actions > form { display: flex; margin: 0; min-width: 0; }
.clientes-campaign-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 12px 0; }
.clientes-campaign-summary span { padding: 9px; border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); font-size: var(--recicle-font-xs); }
.clientes-campaign-warning { padding: 10px 12px; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }
.clientes-template-preview { white-space: pre-wrap; padding: 12px; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); }
@media (max-width: 760px) { .clientes-campaign-summary { grid-template-columns: 1fr; } }
/* Diretorio e ficha de pessoal (colaboradores, cargos, setores, curriculos). */
/* Personnel directory and record port of Gestão Workspace DirectoryPage / RecordModal.
   Recicle theme tokens remain owned by the shared shell. */
.personnel-page { min-width:0; width:100%; }
.personnel-page .personnel-search { display:flex; align-items:end; flex-wrap:wrap; gap:12px; margin-bottom:20px; }
.personnel-page .personnel-search .field { flex:1 1 150px; }
.personnel-page .personnel-search .field:first-child { flex:2 1 240px; }
.personnel-page .colaboradores-tabs, .personnel-page .curriculos-funnel { display:flex; flex-wrap:wrap; gap:8px; }
.personnel-page .curriculos-funnel { margin-bottom:16px; }
.personnel-page .colaboradores-tabs a, .personnel-page .curriculos-funnel a { display:flex; gap:8px; align-items:center; padding:8px 12px; border:1px solid rgb(var(--recicle-border)); border-radius:6px; color:rgb(var(--recicle-text)); font-size:12px; text-decoration:none; }
.personnel-page .colaboradores-tabs a.active, .personnel-page .curriculos-funnel a.active { background:rgb(var(--recicle-brand) / .08); border-color:rgb(var(--recicle-brand)); color:rgb(var(--recicle-brand-soft)); }
.personnel-page .report-text-preview { display:block; max-width:320px; color:rgb(var(--recicle-text-muted)); font-size:12px; }
.personnel-page .report-validation-stack { display:grid; gap:6px; }
.personnel-page .curriculo-perfil { display:grid; gap:4px; font-size:12px; }
.personnel-page .curriculo-perfil div { display:flex; gap:8px; justify-content:space-between; }
.personnel-page .curriculo-referencias-resumo { padding-left:16px; font-size:12px; }
.personnel-record .page-shell { width:100%; padding:0; }
.personnel-record .card { padding:0; border:0; box-shadow:none; margin-bottom:20px; background:transparent; }
.personnel-record .form-layout { display:block; }
.personnel-record .personnel-fields, .personnel-record .form-grid, .personnel-record .curriculo-create-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.personnel-record .form-grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.personnel-record .form-group { min-width:0; margin-bottom:var(--personnel-field-spacing,16px); }
.personnel-record .form-label, .personnel-record label { font-size:12px; font-weight:500; color:rgb(var(--recicle-text-muted)); }
.personnel-record .form-control { width:100%; min-width:0; border-radius:6px; font-size:14px; }
.personnel-record .is-wide, .personnel-record .permission-section, .personnel-record .personnel-fields > .form-actions { grid-column:1/-1; }
.personnel-record h3 { font-size:14px; font-weight:600; margin:16px 0 12px; }
.personnel-record hr { margin:20px 0; border:0; border-top:1px solid rgb(var(--recicle-border)); }
.personnel-record small { font-size:12px; color:rgb(var(--recicle-text-muted)); }
.personnel-record .permission-module { margin-top:16px; border:1px solid rgb(var(--recicle-border)); border-radius:6px; padding:16px; }
.personnel-record .permission-module-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }
.personnel-record .permission-check { display:flex; align-items:center; gap:8px; padding:8px; border:1px solid rgb(var(--recicle-border)); border-radius:6px; }
.personnel-record input[type=checkbox] { accent-color:rgb(var(--recicle-brand)); }
.personnel-record .form-actions, .personnel-record .form-actions-card, .personnel-record .curriculo-create-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:20px; padding-top:16px; border-top:1px solid rgb(var(--recicle-border)); }
.personnel-record .curriculo-referencias { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; border:1px solid rgb(var(--recicle-border)); border-radius:6px; padding:16px; }
.personnel-record .curriculo-referencia { display:grid; gap:8px; min-width:0; }
.personnel-record .curriculo-status-form { display:grid; gap:16px; }
.personnel-record .report-mini-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.personnel-record .report-mini { border:1px solid rgb(var(--recicle-border)); padding:12px; border-radius:6px; }
.personnel-record .report-mini span, .personnel-record .report-mini strong { display:block; }
.personnel-record .report-points { display:flex; flex-wrap:wrap; gap:8px; }
.personnel-record .report-point { padding:6px 12px; border-radius:6px; background:rgb(var(--recicle-brand) / .08); }
@media(max-width:640px) {
 .personnel-record .personnel-fields, .personnel-record .form-grid, .personnel-record .form-grid-3, .personnel-record .curriculo-create-grid, .personnel-record .curriculo-referencias, .personnel-record .report-mini-grid { grid-template-columns:1fr; }
 .personnel-record .form-actions, .personnel-record .form-actions-card, .personnel-record .curriculo-create-actions { flex-direction:column-reverse; }
 .personnel-page .personnel-search > * { width:100%; }
}

/* Acessos e auditoria administrativa. (incorporado de administrativo-acessos.css) */
/* Owners: permissões and audit detail. Gestão: UserAccessModal/SystemsPage. */
.permissions-page { display:grid; gap:1.5rem; }
.permissions-mode-tabs,.permissions-company-tabs { display:flex; flex-wrap:wrap; gap:.5rem; }
.permissions-mode-tabs a,.permissions-company-tabs a { display:block; padding:.5rem .75rem; border:1px solid rgb(var(--recicle-border)); border-radius:.375rem; background:rgb(var(--recicle-bg)); color:rgb(var(--recicle-text-muted)); text-decoration:none; font-size:.75rem; }
.permissions-mode-tabs a.active,.permissions-company-tabs a.active { border-color:rgb(var(--recicle-brand) / .6); color:rgb(var(--recicle-brand-soft)); background:rgb(var(--recicle-brand) / .05); }
.permissions-company-tabs span,.permissions-company-tabs small { display:block; }
.permissions-company-tabs small { margin-top:.25rem; color:rgb(var(--recicle-text-dim)); }
.permissions-system-grid { display:grid; gap:1rem; grid-template-columns:repeat(3,minmax(0,1fr)); }
.permissions-system-card { min-width:0; padding:1rem; text-align:left; border:1px solid rgb(var(--recicle-border)); border-radius:.5rem; background:rgb(var(--recicle-bg)); color:rgb(var(--recicle-text)); cursor:pointer; font:inherit; }
.permissions-system-card:hover { border-color:rgb(var(--recicle-brand) / .6); background:rgb(var(--recicle-surface)); }
.permissions-system-card strong,.permissions-system-card span,.permissions-system-card small { display:block; }
.permissions-system-card strong { font-size:.875rem; font-weight:600; }
.permissions-system-card span { min-height:3rem; margin-top:.5rem; font-size:.875rem; line-height:1.5rem; color:rgb(var(--recicle-text-muted)); }
.permissions-system-card small { margin-top:1rem; color:rgb(var(--recicle-brand-soft)); font-size:.75rem; }
.access-dialog { width:calc(100vw - 1.5rem); max-width:calc(100vw - 1.5rem); max-height:calc(100dvh - 1.5rem); padding:0; border:1px solid rgb(var(--recicle-border-strong)); border-radius:.5rem; background:rgb(var(--recicle-bg)); color:rgb(var(--recicle-text)); box-shadow:0 25px 50px -12px rgb(0 0 0 / .4); }
.access-dialog::backdrop { background:rgb(0 0 0 / .7); }
.access-dialog[open],.access-dialog > form { display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.access-dialog > form { flex:1; margin:0; }
.access-dialog .modal-card__header { flex:none; align-items:center; background:rgb(var(--recicle-sidebar)); }
.access-dialog .modal-card__header h2 { font-size:1rem; font-weight:600; }
.access-dialog-fields { min-height:0; overflow-y:auto; overscroll-behavior:contain; display:grid; gap:1rem; padding:1rem; }
.permissions-toolbar { padding:1rem; border:1px solid rgb(var(--recicle-border)); border-radius:.5rem; background:rgb(var(--recicle-bg)); }
.permissions-save-footer { display:flex; flex:none; justify-content:flex-end; gap:.75rem; border-top:1px solid rgb(var(--recicle-border)); background:rgb(var(--recicle-sidebar)); padding:1rem; }
.permission-setor,.permission-cargo { min-width:0; border:1px solid rgb(var(--recicle-border)); border-radius:.5rem; background:rgb(var(--recicle-bg)); overflow:hidden; }
.permission-setor > summary,.permission-cargo > summary { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:1rem; list-style:none; cursor:pointer; }
.permission-setor > summary::-webkit-details-marker,.permission-cargo > summary::-webkit-details-marker { display:none; }
.permission-title strong { display:block; font-size:.875rem; font-weight:600; }
.permission-title span { display:block; margin-top:.25rem; font-size:.75rem; color:rgb(var(--recicle-text-dim)); }
.permission-body { display:grid; gap:1rem; padding:0 1rem 1rem; }
.permission-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:.5rem; padding:.75rem; border-top:1px solid rgb(var(--recicle-border)); }
.permission-check-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; padding:.75rem; }
.permission-check { display:flex; align-items:flex-start; gap:.5rem; padding:.75rem; min-width:0; border:1px solid rgb(var(--recicle-border)); border-radius:.375rem; font-size:.75rem; color:rgb(var(--recicle-text-soft)); }
.permission-check input { flex:none; margin-top:.125rem; accent-color:rgb(var(--recicle-brand)); }
.audit-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.audit-detail-item { min-width:0; padding:1rem; border:1px solid rgb(var(--recicle-border)); border-radius:.5rem; background:rgb(var(--recicle-bg)); }
.audit-detail-item span { display:block; color:rgb(var(--recicle-text-dim)); font-size:.6875rem; font-weight:600; text-transform:uppercase; letter-spacing:.025em; }
.audit-detail-item strong { display:block; margin-top:.25rem; font-size:.875rem; font-weight:500; overflow-wrap:anywhere; }
.audit-detail-item-wide { grid-column:1 / -1; }
.audit-values { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-top:1.5rem; }
.audit-values > div { min-width:0; }
.audit-values pre { max-height:32.5rem; overflow:auto; margin:0; padding:1rem; border:1px solid rgb(var(--recicle-border)); border-radius:.5rem; background:rgb(var(--recicle-bg)); color:rgb(var(--recicle-text-soft)); white-space:pre-wrap; overflow-wrap:anywhere; font-size:.75rem; line-height:1.5; }
.audit-fields { display:flex; flex-wrap:wrap; gap:.5rem; }
@media(min-width:640px) { .access-dialog { width:calc(100vw - 3rem); max-width:72rem; max-height:calc(100dvh - 3rem); } .access-dialog-fields { padding:1.25rem; } .access-dialog .modal-card__header { padding:1rem 1.25rem; } .permissions-save-footer { padding:1rem 1.25rem; } }
@media(max-width:1023px) { .permissions-system-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .permission-check-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:639px) { .permissions-system-grid,.permission-check-grid,.audit-detail-grid,.audit-values { grid-template-columns:1fr; } .permissions-save-footer { flex-direction:column-reverse; } }

/* Tabelas de preco e notificacoes. (incorporado de tabelas-precos.css) */
/* WorkspaceLayout context tabs; Panel / DataTable and RecordModal use shared owners. */
.tabelas-page { display:grid; gap:1.25rem; min-width:0; max-width:100%; color:rgb(var(--recicle-text)); }
.tabelas-tabs, .tabelas-mode-tabs { display:flex; gap:.5rem; max-width:100%; min-width:0; overflow-x:auto; padding:.5rem; border:1px solid rgb(var(--recicle-border)); border-radius:var(--recicle-radius-surface); background:rgb(var(--recicle-surface) / .7); }
.tabelas-tabs a, .tabelas-mode-tabs a { display:inline-flex; flex-shrink:0; align-items:center; gap:.5rem; min-height:2.25rem; padding:.375rem .75rem; border:1px solid rgb(var(--recicle-border)); border-radius:var(--recicle-radius-control); background:rgb(var(--recicle-bg)); color:rgb(var(--recicle-text-muted)); text-decoration:none; font-size:.75rem; font-weight:600; }
.tabelas-tabs a.active, .tabelas-mode-tabs a.active { border-color:rgb(var(--recicle-brand)); background:rgb(var(--recicle-brand) / .1); color:rgb(var(--recicle-brand-soft)); }
.tabelas-tabs a:hover, .tabelas-mode-tabs a:hover { border-color:rgb(var(--recicle-brand)); color:rgb(var(--recicle-text)); }
.tabelas-tabs a:focus-visible, .tabelas-mode-tabs a:focus-visible { outline:2px solid rgb(var(--recicle-brand)); outline-offset:2px; }
.tabelas-tabs small { color:rgb(var(--recicle-text-dim)); font-size:.75rem; }
.tabelas-last-update { margin-right:auto; color:rgb(var(--recicle-text-muted)); font-size:.75rem; font-weight:600; }
.tabelas-page .tabelas-form-grid, .tabelas-page .comissao-form-grid, .comissoes-config .comissao-form-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:1rem; min-width:0; }
.comissoes-config { display:grid; gap:1.25rem; min-width:0; }
.tabelas-form-grid .form-group, .comissao-form-grid .form-group { min-width:0; margin:0; }
.tabelas-form-grid .form-label, .comissao-form-grid .form-label { display:block; margin-bottom:.375rem; font-size:.75rem; font-weight:500; color:rgb(var(--recicle-text-muted)); }
.tabelas-form-grid .form-control, .comissao-form-grid .form-control { width:100%; min-width:0; }
.tabelas-observacao-field, .comissao-observacao-field, .comissao-ativo-field, .tabelas-form-grid .form-actions, .comissao-form-grid .form-actions { grid-column:1/-1; }
.comissao-regras-list { display:grid; gap:.75rem; }
.comissao-regras-list > div { display:grid; grid-template-columns:1.5rem minmax(0,1fr); gap:.75rem; padding:.75rem; border:1px solid rgb(var(--recicle-border)); border-radius:var(--recicle-radius-control); background:rgb(var(--recicle-bg)); font-size:.8125rem; color:rgb(var(--recicle-text-muted)); }
.comissao-regras-list strong { color:rgb(var(--recicle-brand-soft)); }
.price-preview { display:block; margin-top:.25rem; color:rgb(var(--recicle-brand-soft)); font-size:.75rem; }
.table-check-line { display:flex; gap:.5rem; align-items:center; font-size:.75rem; }
@media(min-width:768px) {
 .tabelas-page .tabelas-form-grid, .tabelas-page .comissao-form-grid, .comissoes-config .comissao-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Central de atendimento (conversas CRM). (incorporado de crm-operations.css) */
/* Conversation workspace. Device identity selects panels; available area controls desktop reflow. */
.crm-ops * { box-sizing: border-box; }

.crm-ops button { font: inherit; }

.crm-ops a { font: inherit; }

.crm-ops input { font: inherit; }

.crm-ops select { font: inherit; }

.crm-ops textarea { font: inherit; }

.crm-ops button:focus-visible { outline: 3px solid rgba(0,157,111,.26); outline-offset: 2px; }

.crm-ops a:focus-visible { outline: 3px solid rgba(0,157,111,.26); outline-offset: 2px; }

.crm-ops input:focus-visible { outline: 3px solid rgba(0,157,111,.26); outline-offset: 2px; }

.crm-ops select:focus-visible { outline: 3px solid rgba(0,157,111,.26); outline-offset: 2px; }

.crm-ops textarea:focus-visible { outline: 3px solid rgba(0,157,111,.26); outline-offset: 2px; }

.crm-ops .crm-ops-brand { display: flex; align-items: center; gap: 12px; min-width: 0; }

.crm-ops .crm-ops-title { min-width: 0; }

.crm-ops .ops-btn.icon { width: 44px; }

.crm-ops .ops-btn[aria-pressed=true] { background: rgb(var(--recicle-brand) / 18%); color: rgb(var(--recicle-text)); border-color: rgb(var(--recicle-brand)); }

.crm-ops .ops-status { min-height: 34px; display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; border-radius: 999px; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); font-weight: 600; }

.crm-ops .ops-status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #95a69f; }

.crm-ops .ops-status.online { background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-status.online::before { background: #10a769; box-shadow: 0 0 0 4px rgba(16,167,105,.12); }

.crm-ops .ops-panel { min-width: 0; min-height: 0; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-eyebrow { margin: 0; color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }

.crm-ops .ops-section-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }

.crm-ops .ops-section-title h2 { font-size: 15px; margin: 2px 0 0; }

.crm-ops .ops-section-title h3 { font-size: 15px; margin: 2px 0 0; }

.crm-ops .ops-count { min-width: 24px; height: 24px; padding: 0 7px; border-radius: 999px; background: rgb(var(--recicle-surface)); display: grid; place-items: center; font-size: var(--recicle-font-xs); font-weight: 600; }

.crm-ops .ops-departments { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin-top: 10px; }

.crm-ops .ops-department { border: 1px solid var(--ops-border); border-radius: var(--recicle-radius-surface); padding: 8px 5px; text-align: center; color: rgb(var(--recicle-text)); text-decoration: none; font-size: var(--recicle-font-xs); font-weight: 600; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-department i { display: block; width: 7px; height: 7px; border-radius: 50%; background: #a5afa9; margin: 0 auto 5px; }

.crm-ops .ops-department i.online { background: #17b26a; }

.crm-ops .ops-queue-link.active { background: rgb(var(--recicle-surface)); border-color: #9bd5c0; color: rgb(var(--recicle-text)); }

.crm-ops .ops-filter-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }

.crm-ops .ops-filter-grid select { min-width: 0; height: 38px; border: 1px solid var(--ops-border); border-radius: var(--recicle-radius-surface); padding: 0 8px; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-filter-grid .full { grid-column: 1/-1; }

.crm-ops .ops-avatar { width: 38px; height: 38px; border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); display: grid; place-items: center; font-size: var(--recicle-font-xs); font-weight: 600; }

.crm-ops .ops-tag { padding: 3px 6px; border-radius: 999px; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); font-weight: 600; text-transform: uppercase; }

.crm-ops .ops-tag.department { background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-contact-text { min-width: 0; }

.crm-ops .ops-day { align-self: center; padding: 5px 10px; border: 1px solid var(--ops-border); border-radius: 999px; background: rgb(var(--recicle-surface)); color: var(--ops-muted); font-size: var(--recicle-font-xs); font-weight: 600; }

.crm-ops .ops-message.system { align-self: center; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); text-align: center; }

.crm-ops .ops-attachments { display: grid; gap: 7px; margin-top: 8px; }

.crm-ops .ops-attachment { display: flex; align-items: center; gap: 9px; padding: 8px; border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface-strong)); border: 1px solid rgba(45,86,70,.13); color: rgb(var(--recicle-text)); text-decoration: none; }

.crm-ops .ops-attachment-icon { width: 34px; height: 34px; border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); display: grid; place-items: center; font-weight: 600; }

.crm-ops .ops-attachment-info { min-width: 0; }

.crm-ops .ops-attachment-info strong { display: block; font-size: var(--recicle-font-xs); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.crm-ops .ops-attachment-info small { font-size: var(--recicle-font-xs); color: var(--ops-muted); }

.crm-ops .ops-empty { margin: auto; max-width: 360px; padding: 28px; text-align: center; color: var(--ops-muted); }

.crm-ops .ops-empty-icon { width: 62px; height: 62px; margin: 0 auto 14px; border-radius: 20px; background: rgb(var(--recicle-surface)); display: grid; place-items: center; color: rgb(var(--recicle-text)); font-size: 24px; }

.crm-ops .ops-empty h2 { margin: 0 0 7px; color: var(--ops-ink); font-size: 18px; }

.crm-ops .ops-empty p { margin: 0; line-height: 1.5; font-size: 13px; }

.crm-ops .ops-upload-list { display: flex; gap: 7px; overflow: visible; margin-bottom: 7px; flex-wrap: wrap; }

.crm-ops .ops-upload { min-width: 0; padding: 7px 9px; border: 1px solid var(--ops-border); border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); font-size: var(--recicle-font-xs); max-width: 100%; overflow-wrap: anywhere; flex: 1 1 12rem; }

.crm-ops .ops-upload-top { display: flex; justify-content: space-between; gap: 8px; }

.crm-ops .ops-progress { height: 4px; border-radius: 999px; background: rgb(var(--recicle-surface)); margin-top: 6px; overflow: hidden; }

.crm-ops .ops-progress span { display: block; height: 100%; width: 0; background: #0e9f6e; transition: width .15s; }

.crm-ops .ops-compose-row .ops-compose-help { margin: 6px 0 0 48px; color: var(--ops-muted); font-size: var(--recicle-font-xs); }

.crm-ops .ops-details-head { position: sticky; top: 0; z-index: 2; background: rgb(var(--recicle-surface)); border-bottom: 1px solid var(--ops-border); padding: 13px; display: flex; align-items: center; justify-content: space-between; }

.crm-ops .ops-profile { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; }

.crm-ops .ops-detail-card { border: 1px solid var(--ops-border); border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface)); margin-bottom: 9px; overflow: hidden; }

.crm-ops .ops-detail-card summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; padding: 10px 12px; font-size: var(--recicle-font-xs); font-weight: 600; }

.crm-ops .ops-detail-card summary::after { content: "+"; }

.crm-ops .ops-detail-card[open] summary::after { content: "−"; }

.crm-ops .ops-detail-content { padding: 0 12px 12px; }

.crm-ops .ops-data { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

.crm-ops .ops-data-item span { display: block; color: var(--ops-muted); font-size: var(--recicle-font-xs); text-transform: uppercase; font-weight: 600; }

.crm-ops .ops-data-item strong { display: block; margin-top: 3px; font-size: var(--recicle-font-xs); overflow-wrap: anywhere; }

:is(.crm-ops, .modal-card--crm-workspace) .ops-form { display: grid; gap: 8px; }

:is(.crm-ops, .modal-card--crm-workspace) .ops-field label { display: block; margin-bottom: 4px; color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); font-weight: 600; }

:is(.crm-ops, .modal-card--crm-workspace) .ops-field input { width: 100%; min-height: 38px; border: 1px solid var(--ops-border, rgb(var(--recicle-border))); border-radius: var(--recicle-radius-surface); padding: 8px; background: rgb(var(--recicle-surface)); }

:is(.crm-ops, .modal-card--crm-workspace) .ops-field select { width: 100%; min-height: 38px; border: 1px solid var(--ops-border, rgb(var(--recicle-border))); border-radius: var(--recicle-radius-surface); padding: 8px; background: rgb(var(--recicle-surface)); }

:is(.crm-ops, .modal-card--crm-workspace) .ops-field textarea { width: 100%; border: 1px solid var(--ops-border, rgb(var(--recicle-border))); border-radius: var(--recicle-radius-surface); padding: 8px; background: rgb(var(--recicle-surface)); min-height: 58px; }

:is(.crm-ops, .modal-card--crm-workspace) .ops-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }

.crm-ops .ops-timeline { display: grid; gap: 9px; }

.crm-ops .ops-timeline-item { position: relative; padding-left: 16px; font-size: var(--recicle-font-xs); color: rgb(var(--recicle-text)); }

.crm-ops .ops-timeline-item::before { content: ""; position: absolute; left: 0; top: 4px; width: 7px; height: 7px; border-radius: 50%; background: #0b8a63; }

.crm-ops .ops-timeline-item strong { display: block; color: rgb(var(--recicle-text)); margin-top: 2px; }

.crm-ops .crm-panel-nav { display: none; }

.crm-ops:fullscreen { height: 100dvh; border-radius: 0; border: 0; }

.crm-ops:fullscreen .crm-ops-grid { min-height: 0; height: auto; flex: 1; }

.crm-ops .ops-btn.primary { background-color: var(--ops-primary); border-color: var(--ops-primary); }

.crm-ops .ops-department.active { color: rgb(var(--recicle-text)); background: #087d5c; background-color: var(--ops-primary); border-color: var(--ops-primary); }

.crm-ops .ops-presence-toggle { align-items: center; background: rgb(var(--recicle-surface)); border: 1px solid rgb(var(--recicle-border)); border-radius: .75rem; color: rgb(var(--recicle-text)); cursor: pointer; display: inline-flex; flex: 0 0 auto; gap: .5rem; min-height: 2.5rem; padding: .35rem .65rem; text-align: left; }

.crm-ops .ops-presence-toggle:is(:hover, :focus-visible) { border-color: var(--ops-primary); box-shadow: 0 0 0 3px rgba(0, 140, 93, .12); }

.crm-ops .ops-presence-toggle.is-on { background: var(--ops-primary-soft); border-color: #83cdb3; color: var(--ops-primary-dark); }

.crm-ops .ops-presence-toggle:disabled { cursor: not-allowed; opacity: .62; }

.crm-ops .ops-presence-dot { background: #9aa9a3; border-radius: 50%; box-shadow: 0 0 0 .2rem rgba(154, 169, 163, .14); height: .65rem; width: .65rem; }

.crm-ops .ops-presence-toggle.is-on .ops-presence-dot { background: var(--ops-primary); box-shadow: 0 0 0 .2rem rgba(0, 140, 93, .14); }

.crm-ops .ops-presence-copy { display: block; line-height: 1.15; white-space: normal; }

.crm-ops .ops-presence-copy strong { display: block; line-height: 1.15; white-space: normal; font-size: var(--recicle-font-xs); }

.crm-ops .ops-presence-copy small { display: block; line-height: 1.15; white-space: normal; font-size: var(--recicle-font-xs); margin-top: .12rem; opacity: .78; }

.crm-ops .ops-queue .ops-section { min-width: 0; overflow-x: hidden; }

.crm-ops .ops-section { border-bottom: 1px solid var(--ops-border); padding: .75rem; }

.crm-ops .ops-queues { margin-top: 10px; display: flex; flex-wrap: wrap; gap: .35rem; margin: .65rem -.15rem 0; padding: .1rem .15rem .35rem; max-width: 100%; }

.crm-ops .ops-queue-link { display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--ops-border); border-radius: var(--recicle-radius-surface); color: rgb(var(--recicle-text)); text-decoration: none; font-size: var(--recicle-font-xs); font-weight: 600; flex: 0 0 auto; gap: .5rem; min-height: 2.15rem; padding: .4rem .6rem; white-space: normal; min-width: 0; overflow-wrap: anywhere; }

.crm-ops .ops-filters { margin: 0; }

.crm-ops .ops-conversation + .ops-conversation { border-top-color: rgb(var(--recicle-border)); }

.crm-ops .ops-conversation-main { align-content: center; display: grid; gap: .18rem; grid-column: 2; grid-row: 1; min-width: 0; overflow: hidden; }

.crm-ops .ops-conversation-side { text-align: right; font-size: var(--recicle-font-xs); color: var(--ops-muted); align-items: flex-end; align-self: stretch; display: flex; flex-direction: column; gap: .35rem; grid-column: 3; grid-row: 1; justify-content: space-between; min-width: 2.75rem; overflow: hidden; white-space: nowrap; }

.crm-ops .ops-conversation-side time { display: block; font-variant-numeric: tabular-nums; line-height: 1.2; text-align: right; width: 100%; }

.crm-ops .ops-mobile-back { display: none; flex: 0 0 auto; }

.crm-ops .ops-contact { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1 1 auto; overflow: hidden; }

.crm-ops .ops-contact-state { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; flex: 0 1 auto; max-width: 45%; }

.crm-ops .ops-pagination { padding: 8px; }

.crm-ops .ops-profile-meta { display: block; color: var(--ops-muted); }

.crm-ops .ops-data-spaced { margin-bottom: 9px; }

.crm-ops .ops-btn-block { width: 100%; }

.crm-ops .ops-data-item-full { grid-column: 1 / -1; }

.crm-ops .ops-details-body { padding: 12px; min-width: 0; }

.crm-ops .ops-data-item { padding: 8px; border-radius: var(--recicle-radius-surface); background: var(--ops-soft); min-width: 0; }

.crm-ops .ops-quick .ops-tag { text-align: right; white-space: normal; }

.crm-ops .ops-chat[aria-busy="true"] { opacity: .58; pointer-events: none; }

.crm-ops .ops-details[aria-busy="true"] { opacity: .58; pointer-events: none; }

.crm-ops .ops-negotiation .ops-detail-content { display: grid; gap: .7rem; }

.crm-ops .ops-negotiation-feedback { border: 1px solid rgb(var(--recicle-border)); border-radius: .65rem; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); line-height: 1.4; padding: .55rem .65rem; }

.crm-ops .ops-negotiation-feedback[data-type="success"] { border-color: #a7d9c3; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-negotiation-feedback[data-type="error"] { border-color: #efb7b2; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-negotiation-section { display: grid; gap: .55rem; border-top: 1px solid var(--ops-border); padding-top: .7rem; }

.crm-ops .ops-negotiation-section:first-child { border-top: 0; padding-top: 0; }

.crm-ops .ops-negotiation-heading { display: flex; align-items: center; justify-content: space-between; gap: .65rem; }

.crm-ops .ops-negotiation-heading h3 { margin: .1rem 0 0; font-size: var(--recicle-font-xs); }

.crm-ops .ops-negotiation-heading > strong { color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); white-space: nowrap; }

.crm-ops .ops-negotiation-badge { border-radius: 999px; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); font-weight: 600; padding: .28rem .45rem; text-transform: uppercase; white-space: nowrap; }

.crm-ops .ops-negotiation-badge[data-status="ENVIADA"] { background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-negotiation-badge[data-status="ACEITA"] { background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-negotiation-badge[data-status="RECUSADA"] { background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-negotiation-lines { display: grid; gap: .4rem; min-width: 0; }

.crm-ops .ops-negotiation-current { display: grid; gap: .4rem; min-width: 0; }

.crm-ops .ops-negotiation-history { display: grid; gap: .4rem; min-width: 0; }

.crm-ops .ops-negotiation-line { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .55rem; border-radius: .55rem; background: var(--ops-soft); padding: .5rem .55rem; }

.crm-ops .ops-negotiation-line-main { min-width: 0; }

.crm-ops .ops-negotiation-line-main strong { display: block; overflow: hidden; font-size: var(--recicle-font-xs); text-overflow: ellipsis; white-space: nowrap; }

.crm-ops .ops-negotiation-line-main small { display: block; color: var(--ops-muted); font-size: var(--recicle-font-xs); margin-top: .12rem; }

.crm-ops .ops-negotiation-line-values span { display: block; color: var(--ops-muted); font-size: var(--recicle-font-xs); margin-top: .12rem; }

.crm-ops .ops-negotiation-line-values { min-width: 0; text-align: right; }

.crm-ops .ops-negotiation-line-values strong { display: block; color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); margin-top: .12rem; }

.crm-ops .ops-negotiation-summary { display: flex; align-items: center; justify-content: space-between; gap: .65rem; border: 1px solid rgb(var(--recicle-border)); border-radius: .6rem; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); padding: .5rem .55rem; }

.crm-ops .ops-negotiation-summary.draft { border-style: dashed; background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); }

.crm-ops .ops-negotiation-offer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(6.7rem, 38%); align-items: center; gap: .55rem; border-radius: .6rem; background: rgb(var(--recicle-surface)); padding: .5rem .55rem; }

.crm-ops .ops-negotiation-offer label { display: block; min-width: 0; }

.crm-ops .ops-negotiation-offer label strong { display: block; min-width: 0; overflow: hidden; font-size: var(--recicle-font-xs); text-overflow: ellipsis; white-space: nowrap; }

.crm-ops .ops-negotiation-offer label small { display: block; min-width: 0; color: var(--ops-muted); font-size: var(--recicle-font-xs); line-height: 1.35; margin-top: .12rem; }

.crm-ops .ops-negotiation-offer input { width: 100%; min-height: 2.35rem; border: 1px solid var(--ops-border); border-radius: .55rem; background: rgb(var(--recicle-surface)); padding: .45rem .55rem; text-align: right; }

.crm-ops .ops-negotiation-note { margin: 0; color: var(--ops-muted); font-size: var(--recicle-font-xs); line-height: 1.45; }

.crm-ops .ops-negotiation-empty { margin: 0; color: var(--ops-muted); font-size: var(--recicle-font-xs); line-height: 1.45; }

.crm-ops .ops-negotiation-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; }

.crm-ops .ops-negotiation-actions .ops-btn { min-width: 0; padding-inline: .45rem; font-size: var(--recicle-font-xs); }

.crm-ops .ops-negotiation-history-item { display: flex; align-items: center; justify-content: space-between; gap: .65rem; border-bottom: 1px solid var(--ops-border); color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); padding: .35rem 0; }

.crm-ops .ops-negotiation-history-item:last-child { border-bottom: 0; }

.crm-ops .ops-negotiation button:disabled { cursor: not-allowed; opacity: .58; }

.crm-ops .ops-negotiation input:disabled { cursor: not-allowed; opacity: .58; }

.crm-ops .ops-negotiation textarea:disabled { cursor: not-allowed; opacity: .58; }

.crm-ops { display: flex; flex-direction: column; color: var(--ops-ink); max-width: 100%; --ops-primary: rgb(var(--recicle-brand)); --ops-primary-dark: rgb(var(--recicle-text)); --ops-primary-soft: rgb(var(--recicle-brand) / 12%); border-radius: var(--recicle-radius-surface); border: 1px solid rgb(var(--recicle-border)); position: relative; box-shadow: none; height: auto; min-height: 0; width: 100%; --ops-border: rgb(var(--recicle-border)); --ops-soft: rgb(var(--recicle-bg)); --ops-ink: rgb(var(--recicle-text)); --ops-muted: rgb(var(--recicle-text-muted)); background: rgb(var(--recicle-surface)); container: crm-workspace / inline-size; }

.crm-ops .crm-ops-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--ops-border); min-height: 3.5rem; padding: .45rem .8rem; background: rgb(var(--recicle-surface)); flex-wrap: wrap; }

.crm-ops .crm-ops-brand-icon { display: grid; place-items: center; background: rgb(var(--recicle-brand) / 18%); color: rgb(var(--recicle-text)); font-weight: 600; width: 2.15rem; height: 2.15rem; border-radius: 50%; }

.crm-ops .crm-ops-title h2 { line-height: 1.15; margin: 0; font-size: .95rem; }

.crm-ops .crm-ops-title p { margin: 3px 0 0; color: var(--ops-muted); white-space: normal; margin-top: .1rem; font-size: var(--recicle-font-xs); }

.crm-ops .ops-membership-statuses { gap: .3rem; max-width: 15rem; min-width: 0; overflow: hidden; display: none; }

.crm-ops .crm-ops-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; flex-wrap: wrap; }

.crm-ops .crm-ops-actions .ops-presence-toggle { min-height: 2.5rem; }

.crm-ops .crm-ops-grid { display: grid; min-height: 0; flex: none; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); height: max(28rem, calc(100dvh - 16rem)); }

.crm-ops .ops-inbox-head { position: relative; padding: .75rem .85rem .6rem; border-bottom: 1px solid var(--ops-border); background: rgb(var(--recicle-surface)); }

.crm-ops .ops-queue { border-right: 1px solid var(--ops-border); display: flex; flex-direction: column; min-width: 0; overflow-x: hidden; position: relative; }

.crm-ops .ops-inbox-head .ops-section-title h2 { margin: 0; font-size: 1.05rem; }

.crm-ops .ops-inbox-actions { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }

.crm-ops .ops-inbox-actions .ops-btn { width: 2.35rem; }

.crm-ops .ops-search { gap: 7px; align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr) 2.5rem; width: 100%; margin-top: .65rem; }

.crm-ops .ops-search input { min-width: 0; flex: 1; max-width: 100%; overflow: hidden; text-overflow: ellipsis; width: 100%; height: 2.5rem; border: 0; border-radius: 999px; padding: 0 .9rem; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-search button { min-width: 2.5rem; width: 2.5rem; min-height: 2.5rem; border-radius: 50%; }

.crm-ops .ops-inbox-chips { display: flex; gap: .4rem; margin-top: .65rem; flex-wrap: wrap; }

.crm-ops .ops-filter-chip { flex: 0 0 auto; min-height: 1.9rem; display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .65rem; border: 1px solid rgb(var(--recicle-border)); border-radius: 999px; color: rgb(var(--recicle-text)); background: rgb(var(--recicle-surface)); font-size: var(--recicle-font-xs); font-weight: 600; text-decoration: none; min-width: 0; max-width: 100%; overflow-wrap: anywhere; flex-wrap: wrap; }

.crm-ops .ops-filter-chip.active { color: rgb(var(--recicle-text)); border-color: #b5ddcd; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-channel-chips [data-channel-health]::before { content: ""; width: .42rem; height: .42rem; flex: 0 0 .42rem; border-radius: 50%; background: #9aa9a3; box-shadow: 0 0 0 .16rem rgba(154, 169, 163, .12); }

.crm-ops .ops-channel-chips [data-channel-health="healthy"]::before { background: #0e9f6e; box-shadow: 0 0 0 .16rem rgba(14, 159, 110, .12); }

.crm-ops .ops-channel-chips [data-channel-health="unavailable"]::before { background: rgb(var(--recicle-surface)); box-shadow: 0 0 0 .16rem rgba(217, 154, 36, .12); }

.crm-ops .ops-filter-chip span { font-size: var(--recicle-font-xs); }

.crm-ops .ops-filter-chip .ops-channel-unread { min-width: 1.15rem; height: 1.15rem; display: inline-grid; place-items: center; padding: 0 .28rem; border-radius: 999px; background: #087d5c; color: rgb(var(--recicle-text)); font-weight: 600; line-height: 1; }

.crm-ops .ops-template-cta { position: absolute; z-index: 8; right: .75rem; bottom: 5.5rem; width: min(22rem, calc(100% - 1.5rem)); border: 1px solid rgb(var(--recicle-border)); border-radius: .85rem; background: rgb(var(--recicle-surface)); box-shadow: 0 .5rem 1.4rem rgba(56, 44, 22, .12); }

.crm-ops .ops-template-cta > summary { display: flex; align-items: center; gap: .35rem; width: fit-content; margin-left: auto; padding: .48rem .65rem; cursor: pointer; color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); font-weight: 600; list-style: none; }

.crm-ops .ops-template-cta > summary::-webkit-details-marker { display: none; }

.crm-ops .ops-template-cta:not([open]) { width: fit-content; max-width: calc(100% - 1.5rem); }

.crm-ops .ops-template-popover { max-height: min(52dvh, 26rem); padding: 0 .75rem .75rem; overflow: auto; }

.crm-ops .ops-template-cta p { margin: 0 0 .55rem; font-size: var(--recicle-font-xs); line-height: 1.4; }

.crm-ops .ops-template-cta form { display: grid; gap: .55rem; }

.crm-ops .ops-template-cta select { width: 100%; min-height: 2.6rem; border: 1px solid var(--ops-border); border-radius: .65rem; padding: .55rem .7rem; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-template-cta input { width: 100%; min-height: 2.6rem; border: 1px solid var(--ops-border); border-radius: .65rem; padding: .55rem .7rem; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-template-fields { display: grid; gap: .45rem; }

.crm-ops .ops-channel-chips [data-channel-health="unavailable"] { border-color: #e5b35a; color: rgb(var(--recicle-text)); background: rgb(var(--recicle-surface)); }

.crm-ops .ops-department-options { border: 0; padding: .25rem 0; margin: 0; }

.crm-ops .ops-department-options legend { margin-bottom: .35rem; color: var(--ops-muted); font-size: var(--recicle-font-xs); font-weight: 600; }

.crm-ops .ops-department-options label { display: inline-flex; align-items: center; gap: .3rem; margin-right: .65rem; font-size: var(--recicle-font-xs); }

.crm-ops .ops-conversations { overflow: auto; min-height: 0; flex: 1; contain: inline-size; overscroll-behavior: contain; overflow-x: hidden; overflow-y: auto; scrollbar-gutter: stable; padding: 0; }

.crm-ops .ops-conversation { color: inherit; text-decoration: none; margin-bottom: 5px; column-gap: .65rem; display: grid; grid-template-rows: minmax(4rem, auto); isolation: isolate; max-width: 100%; min-width: 0; overflow: hidden; width: 100%; min-height: 4.55rem; grid-template-columns: 3rem minmax(0, 1fr) 2.75rem; gap: .7rem; align-items: center; margin: 0; padding: .65rem .8rem; border: 0; border-bottom: 1px solid rgb(var(--recicle-border)); border-radius: 0; }

.crm-ops .ops-conversation:hover { background: rgb(var(--recicle-surface)); }

.crm-ops .ops-conversation.active { border-color: #a6dbc7; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-conversation .ops-avatar { align-self: center; grid-column: 1; grid-row: 1; width: 3rem; height: 3rem; border-radius: 50%; font-size: .8rem; }

.crm-ops .ops-conversation-name { font-weight: 600; display: block; max-width: 100%; min-width: 0; overflow: hidden; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; }

.crm-ops .ops-conversation-preview { color: var(--ops-muted); display: block; max-width: 100%; min-width: 0; overflow: hidden; margin: 0; text-overflow: ellipsis; white-space: nowrap; margin-top: .16rem; font-size: var(--recicle-font-xs); }

.crm-ops .ops-conversation-meta { max-width: 100%; min-width: 0; overflow: hidden; align-items: center; display: flex; flex-wrap: nowrap; gap: .3rem; margin: .2rem 0 0; margin-top: .25rem; }

.crm-ops .ops-conversation-meta .ops-tag { flex: 0 1 auto; max-width: min(8rem, 48%); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: .12rem .35rem; font-size: var(--recicle-font-xs); }

.crm-ops .ops-unread { margin-left: auto; border-radius: 50%; place-items: center; background: #087d5c; color: rgb(var(--recicle-text)); font-weight: 600; background-color: var(--ops-primary); border-color: var(--ops-primary); align-items: center; display: inline-flex; font-size: var(--recicle-font-xs); justify-content: center; margin: 0; min-width: 1.25rem; padding: 0 .28rem; align-self: flex-end; width: 1.2rem; height: 1.2rem; margin-top: .45rem; }

.crm-ops .ops-chat-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--ops-border); background: rgb(var(--recicle-surface)); min-height: 3.9rem; padding: .45rem .7rem; flex-wrap: wrap; }

.crm-ops .ops-chat-head .ops-avatar { width: 2.55rem; height: 2.55rem; border-radius: 50%; }

.crm-ops .ops-contact-text strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .86rem; }

.crm-ops .ops-contact-text small { display: block; color: var(--ops-muted); margin-top: 3px; max-width: 42vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--recicle-font-xs); }

.crm-ops .ops-mobile-details { font-size: var(--recicle-font-xs); display: inline-flex; flex: 0 0 auto; }

.crm-ops .ops-chat-actions { display: flex; align-items: center; gap: .35rem; flex: 0 0 auto; }

.crm-ops .ops-chat-actions .ops-btn { font-size: var(--recicle-font-xs); }

.crm-ops .ops-messages { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; min-width: 0; padding-left: max(.75rem, calc((100% - 70rem) / 2)); padding-right: max(.75rem, calc((100% - 70rem) / 2)); gap: .45rem; padding: 1rem clamp(.8rem, 3vw, 2.4rem); background-color: rgb(var(--recicle-surface)); background-image: radial-gradient(circle at 16px 16px, rgba(31, 90, 68, .035) 1.2px, transparent 1.3px), radial-gradient(circle at 42px 38px, rgba(31, 90, 68, .025) 1px, transparent 1.1px); background-size: 58px 58px; }

.crm-ops .ops-message { background: rgb(var(--recicle-surface)); border: 1px solid rgb(var(--recicle-border)); white-space: normal; overflow-wrap: anywhere; width: fit-content; max-width: min(70%, 40rem); padding: .48rem .62rem .35rem; border-color: rgba(50, 72, 63, .1); border-radius: .72rem; box-shadow: 0 1px 1px rgba(30, 47, 40, .06); }

.crm-ops .ops-message.out { align-self: flex-end; border-color: #b9e7cf; background: rgb(var(--recicle-surface)); border-bottom-right-radius: .18rem; }

.crm-ops .ops-message.in { align-self: flex-start; border-bottom-left-radius: .18rem; }

.crm-ops .ops-message p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: .84rem; line-height: 1.38; }

.crm-ops .ops-message-meta { display: flex; align-items: center; justify-content: flex-end; gap: 6px; color: rgb(var(--recicle-text)); font-weight: 600; margin-top: .2rem; font-size: var(--recicle-font-xs); }

.crm-ops .ops-chat { display: flex; flex-direction: column; min-height: 0; background: rgb(var(--recicle-surface)); position: relative; }

.crm-ops .ops-composer { border-top: 1px solid var(--ops-border); padding-bottom: max(.55rem, env(safe-area-inset-bottom)); padding-left: max(.75rem, calc((100% - 70rem) / 2)); padding-right: max(.75rem, calc((100% - 70rem) / 2)); padding: .4rem .65rem .5rem; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-composer-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .45rem; min-width: 0; margin-bottom: .35rem; flex-wrap: wrap; }

.crm-ops .ops-capability-notice { display: inline-flex; align-items: center; gap: .4rem; flex: 0 1 auto; width: fit-content; max-width: min(18rem, 44%); margin: 0; padding: .25rem .5rem; border-radius: 999px; color: rgb(var(--recicle-text)); background: rgb(var(--recicle-surface)); font-size: var(--recicle-font-xs); line-height: 1.2; }

.crm-ops .ops-capability-notice.is-ready { color: rgb(var(--recicle-text)); background: rgb(var(--recicle-surface)); }

.crm-ops .ops-quick { display: flex; align-items: center; gap: 7px; justify-content: space-between; min-width: 0; margin: 0; flex-wrap: wrap; max-width: 100%; }

.crm-ops .ops-quick select { max-width: 230px; border: 1px solid var(--ops-border); padding: 0 9px; background: rgb(var(--recicle-surface)); height: 1.85rem; border-radius: 999px; font-size: var(--recicle-font-xs); min-width: 0; width: 100%; }

.crm-ops .ops-emoji-palette { width: fit-content; display: flex; gap: .2rem; margin: 0 0 .35rem; padding: .3rem; border: 1px solid var(--ops-border); border-radius: 999px; background: rgb(var(--recicle-surface)); box-shadow: 0 .4rem 1.2rem rgba(25, 48, 39, .1); flex-wrap: wrap; max-width: 100%; }

.crm-ops .ops-emoji-palette[hidden] { display: none; }

.crm-ops .ops-emoji-palette button { width: 2rem; height: 2rem; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }

.crm-ops .ops-emoji-palette button:hover { background: rgb(var(--recicle-surface)); }

.crm-ops .ops-emoji-palette button:focus-visible { background: rgb(var(--recicle-surface)); }

.crm-ops .ops-compose-row { display: flex; gap: .3rem; align-items: center; padding: .25rem; border: 1px solid rgb(var(--recicle-border)); border-radius: 1.65rem; background: rgb(var(--recicle-surface)); }

.crm-ops .ops-compose-row textarea { border-radius: var(--recicle-radius-surface); line-height: 1.35; flex: 1 1 auto; min-width: 0; min-height: 2.45rem; max-height: 7.5rem; padding: .62rem .4rem; overflow-y: auto; resize: none; border: 0; background: transparent; }

.crm-ops .ops-compose-row .ops-btn { flex: 0 0 2.5rem; width: 2.5rem; min-width: 2.5rem; border-radius: 999px; }

.crm-ops .ops-compose-row .ops-send { font-size: 1rem; transform: rotate(-8deg); }

.crm-ops .ops-compose-row.has-error { border-color: #d96b61; box-shadow: 0 0 0 2px rgba(217, 107, 97, .12); }

.crm-ops .ops-compose-feedback { width: fit-content; max-width: 22rem; margin: .3rem 0 0 auto; padding: .25rem .5rem; border-radius: 999px; color: rgb(var(--recicle-text)); background: rgb(var(--recicle-surface)); font-size: var(--recicle-font-xs); }

.crm-ops .ops-compose-feedback[hidden] { display: none; }

.crm-ops .ops-compose-help { margin: .3rem 0 0 3rem; }

.crm-ops .ops-details { overflow-x: hidden; overflow-y: auto; display: none; position: fixed; z-index: 30; inset: 0 0 0 auto; width: min(25rem, 92vw); overflow: auto; border-left: 1px solid var(--ops-border); background: rgb(var(--recicle-surface)); box-shadow: -1rem 0 2.8rem rgba(18, 51, 39, .2); container: crm-details / inline-size; max-width: 100%; }

.crm-ops.details-open .ops-details { display: block; }

.crm-ops .ops-details-backdrop { display: none; position: fixed; z-index: 29; inset: 0; border: 0; background: rgba(12, 28, 22, .35); width: 100%; height: 100%; }

.crm-ops.details-open .ops-details-backdrop { display: block; }

.crm-ops .ops-mobile-bottom { display: none; }

html[data-ui-mobile="true"] .crm-ops .crm-ops-header { min-height: 3.35rem; padding: calc(.38rem + env(safe-area-inset-top)) .55rem .38rem; }

html[data-ui-mobile="true"] .crm-ops .crm-ops-title p { display: none; }

html[data-ui-mobile="true"] .crm-ops .crm-ops-actions .ops-configure { display: none; }

html[data-ui-mobile="true"] .crm-ops #detailsToggle { display: none; }

html[data-ui-mobile="true"] .crm-ops #fullscreenToggle { display: none; }

html[data-ui-mobile="true"] .crm-ops .crm-panel-nav { display: none; }

html[data-ui-mobile="true"] .crm-ops .crm-ops-grid { display: block; height: max(28rem, calc(100dvh - 18rem)); }

html[data-ui-mobile="true"] .crm-ops .ops-mobile-bottom { display: grid; position: static; grid-auto-flow: column; grid-auto-columns: 1fr; min-height: 3.7rem; padding-bottom: env(safe-area-inset-bottom); border-top: 1px solid var(--ops-border); background: rgb(var(--recicle-surface)); }

html[data-ui-mobile="true"] .crm-ops:not([data-active-panel="queue"]) .ops-mobile-bottom { display: none; }

html[data-ui-mobile="true"] .crm-ops .ops-mobile-bottom a { display: grid; place-items: center; align-content: center; gap: .12rem; color: rgb(var(--recicle-text)); font-size: var(--recicle-font-xs); font-weight: 600; text-decoration: none; }

html[data-ui-mobile="true"] .crm-ops .ops-mobile-bottom a span { font-size: 1rem; }

html[data-ui-mobile="true"] .crm-ops .ops-mobile-bottom a.active { color: rgb(var(--recicle-text)); }

html[data-ui-mobile="true"] .crm-ops .ops-chat-head { min-height: 3.7rem; padding: .35rem .45rem; gap: .38rem; }

html[data-ui-mobile="true"] .crm-ops .ops-chat-head .ops-mobile-back { display: inline-flex; width: 2.4rem; border: 0; }

html[data-ui-mobile="true"] .crm-ops .ops-chat-head .ops-avatar { width: 2.25rem; height: 2.25rem; }

html[data-ui-mobile="true"] .crm-ops .ops-contact { gap: .45rem; flex: 1; }

html[data-ui-mobile="true"] .crm-ops .ops-contact-text small { max-width: 47vw; }

html[data-ui-mobile="true"] .crm-ops .ops-contact-state { display: none; }

html[data-ui-mobile="true"] .crm-ops .ops-chat-actions { gap: .2rem; }

html[data-ui-mobile="true"] .crm-ops .ops-chat-actions .ops-btn { font-size: var(--recicle-font-xs); }

html[data-ui-mobile="true"] .crm-ops .ops-message { max-width: 88%; }

html[data-ui-mobile="true"] .crm-ops .ops-quick .ops-tag { display: none; }

html[data-ui-mobile="true"] .crm-ops .ops-composer { position: sticky; bottom: 0; }

html[data-ui-mobile="true"] .crm-ops .ops-capability-notice { max-width: 48%; }

html[data-ui-mobile="true"] .crm-ops .ops-template-cta { right: .5rem; bottom: 5rem; width: min(21rem, calc(100% - 1rem)); }

html[data-ui-mobile="true"] .crm-ops .ops-compose-help { display: none; }

html[data-ui-mobile="true"] .crm-ops .ops-panel { height: 100%; display: none; }

html[data-ui-mobile="true"] .crm-ops .ops-panel.mobile-active { display: flex; }

html[data-ui-mobile="true"] .crm-ops .ops-details.mobile-active { display: block; position: static; width: 100%; box-shadow: none; height: 100%; overflow-y: auto; }

@container crm-workspace (max-width: 46rem) {
    html:not([data-ui-mobile="true"]) .crm-ops .crm-ops-grid { grid-template-columns: minmax(0, 1fr); height: auto; }
    html:not([data-ui-mobile="true"]) .crm-ops .ops-queue { max-height: 28rem; }
    html:not([data-ui-mobile="true"]) .crm-ops .ops-chat { height: 32rem; }
}

@container crm-details (max-width: 26rem) {
    .crm-ops .ops-negotiation-offer, .crm-ops .ops-negotiation-line { grid-template-columns: minmax(0, 1fr); }
    .crm-ops .ops-negotiation-line-values { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
    .crm-ops * { animation: none; scroll-behavior: auto; transition: none; }
}

/* Workspace de configuracoes do CRM. (incorporado de crm-settings.css) */
.crm-settings-shell,
.modal-card--crm-settings {
    --settings-green:rgb(var(--recicle-brand));
    --settings-green-dark:rgb(var(--recicle-brand-soft));
    --settings-ink:rgb(var(--recicle-text));
    --settings-muted:rgb(var(--recicle-text-muted));
    --settings-line:rgb(var(--recicle-border));
}

.crm-settings-shell {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.crm-settings-hero {
    flex-wrap: wrap;
    align-items: center;
    background:rgb(var(--recicle-surface));
    border-radius:8px;
    color:rgb(var(--recicle-text));
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.2rem;
}

.crm-settings-hero h1 {
    color: inherit;
    font-size: clamp(1.3rem, 2vw, 1.75rem);
    margin: 0;
}

.crm-settings-hero p {
    color:var(--settings-muted);
    margin: .25rem 0 0;
    max-width: 52rem;
}

.crm-settings-hero__status {
    flex-wrap: wrap;
    align-items: center;
    background: rgb(var(--recicle-surface, 255 255 255) / 0.13);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: .75rem;
    display: flex;
    flex: 0 1 auto;
    gap: .5rem;
    padding: .65rem .8rem;
}

.crm-settings-hero__status i {
    background: #78f0ad;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(120, 240, 173, .15);
    height: .55rem;
    width: .55rem;
}

.crm-settings-layout {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr);
}

.crm-settings-nav {
    background:rgb(var(--recicle-surface));
    border: 1px solid var(--settings-line);
    border-radius:8px;
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
    padding: 16px;
    position:static;
}

.crm-settings-nav button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: .65rem;
    color:rgb(var(--recicle-text));
    cursor: pointer;
    display: grid;
    font: inherit;
    gap: .1rem;
    min-height: 3.25rem;
    padding: .55rem .7rem;
    text-align: left;
}

.crm-settings-nav button strong {
    font-size: .9rem;
}

.crm-settings-nav button small {
    color:rgb(var(--recicle-text));
    font-size:var(--recicle-font-xs);
}

.crm-settings-nav button[aria-selected="true"] {
    background:rgb(var(--recicle-surface));
    color: var(--settings-green-dark);
}

.crm-settings-nav button:focus-visible,
.crm-settings-panel :is(input, select, textarea, button, a):focus-visible {
    outline: 3px solid rgba(8, 120, 62, .28);
    outline-offset: 2px;
}

.crm-settings-content {
    min-width: 0;
}

.crm-settings-panel[hidden] {
    display: none;
}

.crm-settings-panel {
    display: grid;
    gap: 1rem;
}

.settings-panel-head,
.settings-card {
    background:rgb(var(--recicle-surface));
    border: 1px solid var(--settings-line);
    border-radius:8px;
}

.settings-panel-head {
    flex-wrap: wrap;
    align-items: start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding:16px 20px;
}

.settings-panel-head h2,
.settings-card h3,
.settings-card h4 {
    color: var(--settings-ink);
    margin: 0;
}

.settings-panel-head p,
.settings-card__intro p {
    color: var(--settings-muted);
    margin: .25rem 0 0;
}

.settings-state {
    background:rgb(var(--recicle-surface));
    border-radius: 999px;
    color:rgb(var(--recicle-text));
    flex: 0 1 auto;
    font-size:var(--recicle-font-xs);
    font-weight: 700;
    padding: .4rem .65rem;
}

.settings-state.is-dirty {
    background:rgb(var(--recicle-surface));
    color:rgb(var(--recicle-text));
}

.settings-card {
    min-width: 0;
    overflow-wrap: anywhere;
}

.settings-card__intro {
    flex-wrap: wrap;
    align-items: start;
    border-bottom: 1px solid rgb(var(--recicle-border));
    display: flex;
    gap: .75rem;
    justify-content: space-between;
    padding:16px 20px;
}

.settings-card__body,
.settings-form {
    padding:20px;
}

.settings-grid {
    display: grid;
    gap: .85rem 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
}

.settings-grid--three {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
}

.settings-field {
    display: grid;
    gap: .35rem;
    min-width: 0;
}

.settings-field--full {
    grid-column: 1 / -1;
}

.settings-field label,
.settings-field > span {
    color:rgb(var(--recicle-text));
    font-size: .8rem;
    font-weight:600;
}

.settings-field textarea {
    min-height: 6.5rem;
    resize: vertical;
}

.settings-help,
.settings-secret-note {
    flex-wrap: wrap;
    color:rgb(var(--recicle-text));
    font-size:var(--recicle-font-xs);
    line-height: 1.45;
}

.settings-secret-note {
    align-items: center;
    background:rgb(var(--recicle-surface));
    border-radius: .45rem;
    color:rgb(var(--recicle-text));
    display: flex;
    padding: .4rem .5rem;
}

.settings-check {
    align-items: center;
    color:rgb(var(--recicle-text));
    display: inline-flex;
    gap: .45rem;
    min-height: 2.75rem;
}

.settings-check input {
    height: 1.15rem;
    width: 1.15rem;
}

.settings-check-list {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .8rem;
}

.settings-form-actions {
    flex-wrap: wrap;
    align-items: center;
    background:rgb(var(--recicle-surface));
    border-top: 1px solid rgb(var(--recicle-border));
    display: flex;
    gap: .75rem;
    justify-content: flex-end;
    margin: 1rem 0 0;
    padding: .75rem 1rem;

}

.settings-webhooks {
    display: grid;
    gap: .7rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
}

.settings-webhook {
    background:rgb(var(--recicle-surface));
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .65rem;
    display: grid;
    gap: .3rem;
    min-width: 0;
    padding: .7rem;
}

.settings-webhook code {
    color:rgb(var(--recicle-text));
    font-size:var(--recicle-font-xs);
    overflow-wrap: anywhere;
    white-space: normal;
}

.settings-departments,
.settings-stage-list {
    display: grid;
    gap: 1rem;
}

.settings-department-head,
.settings-member {
    flex-wrap: wrap;
    align-items: center;
    display: flex;
    gap: .75rem;
    justify-content: space-between;
}

.settings-online-badge {
    background:rgb(var(--recicle-surface));
    border-radius: 999px;
    color:rgb(var(--recicle-text));
    font-size:var(--recicle-font-xs);
    font-weight:600;
    padding: .35rem .6rem;
}

.settings-online-badge.is-online {
    background:rgb(var(--recicle-surface));
    color:rgb(var(--recicle-text));
}

.settings-members {
    border-top: 1px solid rgb(var(--recicle-border));
    display: grid;
    gap: .55rem;
    margin-top: 1rem;
    padding-top: 1rem;
}

.settings-member {
    background:rgb(var(--recicle-surface));
    border-radius: .65rem;
    padding: .65rem .75rem;
}

.settings-member small {
    color:rgb(var(--recicle-text));
    display: block;
    margin-top: .15rem;
}

.settings-danger-zone {
    border-left: 3px solid #b5413d;
    padding-left: .75rem;
}

.settings-errors {
    background:rgb(var(--recicle-surface));
    border: 1px solid rgb(var(--recicle-border));
    border-radius: .75rem;
    color:rgb(var(--recicle-text));
    padding: .75rem 1rem;
}

.settings-errors ul {
    margin: .4rem 0 0 1.1rem;
}

.settings-new-stage {
    border: 1px dashed #9bc9ae;
}

/* Ajustes de sistema para os portais (cliente, colaborador, motorista). (incorporado de recicle-system.css) */
/* Portal domain semantics. Shared UI geometry/theme: recicle-ui.css, the single owner. */
.portal-nav-heading { display: inline-flex; align-items: center; gap: .5rem; }
.portal-heading { margin: 0 0 .75rem; color: rgb(var(--recicle-text)); font-size: 1rem; line-height: 1.5rem; font-weight: 600; }
.portal-heading:is(h1) { font-size: 1.5rem; line-height: 2rem; }
.portal-heading:is(h2) { font-size: .875rem; line-height: 1.25rem; letter-spacing: .05em; text-transform: uppercase; }
.portal-section-heading { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.portal-section-heading h2 { margin: 0; font-size: .875rem; line-height: 1.25rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.portal-section-heading p { margin: .25rem 0 0; color: rgb(var(--recicle-text-muted)); }
.portal-eyebrow { display: block; color: rgb(var(--recicle-brand)); font-size: .75rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.portal-cell-title { display: block; font-weight: 600; }
.portal-cell-meta { display: block; margin-top: .25rem; color: rgb(var(--recicle-text-muted)); font-size: .75rem; }
.portal-pagination { margin-top: 1rem; }
.portal-empty-icon { font-size: 2rem; color: rgb(var(--recicle-text-dim)); }
.portal-emphasis { border-color: rgb(var(--recicle-brand) / 28%); }
.driver-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .5rem; margin-top: 1rem; }
.driver-actions__full { grid-column: 1 / -1; }

/* Portal do cliente: lista de ordens de servico. (incorporado de cliente-os.css) */
.client-order-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.client-order-actions .client-order-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid #087653;
    border-radius: 8px;
    background: #fff;
    color: #087653;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    white-space: normal;
}

.client-order-actions .client-order-button:hover {
    background: #eefbf5;
}

.client-order-actions .client-order-button-primary {
    background: #087653;
    color: #fff;
}

.client-order-actions .client-order-button-primary:hover {
    background: #055b40;
}

.client-order-actions .client-order-button:focus-visible {
    outline: 3px solid #087653;
    outline-offset: 3px;
}

.client-os-actions.client-order-actions {
    min-width: 172px;
    align-items: stretch;
}

.approval-content > .client-order-actions {
    margin-bottom: 20px;
}

@media (max-width: 760px) {
    .client-order-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        min-width: 0;
    }

    .client-order-actions .client-order-button {
        min-width: 0;
        padding-inline: 8px;
    }

    .client-order-actions .client-order-button:only-child {
        grid-column: 1 / -1;
    }
}

/* Logistica: indice de rotas. (incorporado de rotas-index.css) */
/* Operational map geometry; shared cards, filters, KPIs and table own their contracts. */
#map { height: 500px; width: 100%; border-radius: 8px; margin-top: 1rem; }
#map .leaflet-pane > svg, #map .leaflet-marker-icon, #map .leaflet-marker-icon > div,
#map .leaflet-popup, #map .leaflet-popup-content-wrapper, #map .leaflet-popup-content,
#map .leaflet-popup-tip-container { max-width: none; }
#map .leaflet-popup-content-wrapper, #map .leaflet-popup-tip {
    background: rgb(var(--recicle-surface, 255 255 255)); color: rgb(var(--recicle-text, 15 23 42)); opacity: 1;
}
#map .leaflet-popup-content-wrapper { border: 1px solid #cbd5e1; box-shadow: 0 6px 24px rgb(15 23 42 / 25%); }
.rotas-operacao .map-card-header { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.rotas-operacao .map-toolbar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin: 1rem 0; }
.rotas-operacao .map-toolbar label { display: flex; gap: .5rem; align-items: center; }
.rotas-operacao .map-status { margin-top: .75rem; font-size: .875rem; color: rgb(var(--recicle-text-muted, 100 116 139)); }
.rotas-operacao .map-legenda { display: flex; gap: .75rem; flex-wrap: wrap; font-size: .875rem; }
.rotas-operacao .rotas-custos { margin-top: 1rem; }
.rotas-operacao .paradas-box { margin-top: 1rem; min-width: 0; }
.rotas-operacao .paradas-lista { list-style: none; padding: 0; margin: 0; }
.rotas-operacao .parada-item { padding: .75rem; margin-bottom: .5rem; border: 1px solid rgb(var(--recicle-border, 226 232 240)); border-radius: .5rem; }
.rotas-operacao .rotas-nome { font-weight: 600; }
.custom-map-marker { width: 36px; height: 36px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; color: #fff; border: 3px solid #fff; box-shadow: 0 2px 10px rgb(0 0 0 / 25%); }
.marker-origem { background: #16a34a; }
.marker-parada { background: #2563eb; }
.marker-retorno { background: #dc2626; }
.rotas-operacao .rota-grupo { margin-bottom: .75rem; min-width: 0; }
 .rotas-operacao .rota-grupo-painel { border:1px solid #e5e7eb; border-left:5px solid var(--rota-cor); border-radius:12px; background:rgb(var(--recicle-surface, 255 255 255)); overflow:hidden; }
 .rotas-operacao .rota-grupo-cabecalho { padding:10px 12px; display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:center; background:rgb(var(--recicle-bg, 248 250 252)); }
 .rotas-operacao .rota-grupo-identidade { min-width:0;flex:1 1 180px; }
 .rotas-operacao .rota-grupo-nome { font-size:15px;font-weight:600;color:rgb(var(--recicle-text, 15 23 42));overflow-wrap:anywhere; }
 .rotas-operacao .rota-grupo-descricao { font-size:12px;color:rgb(var(--recicle-text-muted, 100 116 139));margin-top:2px; }
 .rotas-operacao .rota-grupo-veiculo { font-size:11px;color:rgb(var(--recicle-text-muted, 100 116 139));margin-top:5px;line-height:1.35; }
 .rotas-operacao .rota-grupo-aviso { margin-top:7px;padding:7px 9px;border-radius:9px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-size:11px;font-weight:600; }
 .rotas-operacao .rota-grupo-metricas { display:grid; grid-template-columns:repeat(auto-fit, minmax(82px, 1fr)); gap:8px; flex:1; min-width:0; width:100%; max-width:620px; }
 .rotas-operacao .rota-grupo-metrica { background:rgb(var(--recicle-surface, 255 255 255));border:1px solid #e5e7eb;border-radius:10px;padding:8px; }
 .rotas-operacao .rota-grupo-metrica-label { font-size:14px;line-height:20px;font-weight:400;color:rgb(var(--recicle-text-muted, 100 116 139)); }
 .rotas-operacao .rota-grupo-metrica-valor { display:block;font-size:18px;font-weight:600;margin-top:4px; }
 .rotas-operacao .rota-grupo-total { background:rgb(var(--recicle-bg, 248 250 252));border:1px solid rgb(var(--recicle-border, 226 232 240));border-radius:10px;padding:8px; }
 .rotas-operacao .rota-grupo-parada { display:grid; grid-template-columns:38px 1fr 120px; gap:10px; align-items:center; padding:9px 12px; border-top:1px solid #f1f5f9; }
 .rotas-operacao .rota-grupo-ordem { width:28px; height:28px; border-radius:50%; background:var(--rota-cor); color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:600; }
 .rotas-operacao .rota-grupo-cliente { font-size:13px;font-weight:600;color:rgb(var(--recicle-text, 15 23 42)); }
 .rotas-operacao .rota-grupo-status { font-size:12px;font-weight:600;color:rgb(var(--recicle-text, 15 23 42));text-align:right; }
@media (width < 640px) {
    #map { height: 320px; }
    .rotas-operacao .rota-grupo-cabecalho { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; }
    .rotas-operacao .rota-grupo-identidade { min-width: 0; }
    .rotas-operacao .rota-grupo-metricas { max-width: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rotas-operacao .rota-grupo-parada { grid-template-columns: 32px minmax(0, 1fr); align-items: start; }
    .rotas-operacao .rota-grupo-status { grid-column: 2; text-align: left; }
}

/* Navegacao lateral. (incorporado de sidebar-navigation.css) */
/* Shared mobile navigation, loaded after the layouts' legacy overrides. */
@media (max-width: 900px) {
    body.recicle-app-shell {
        --mobile-topbar-height: calc(54px + env(safe-area-inset-top, 0px));
    }

    body.recicle-app-shell .mobile-menu-toggle {
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        min-height: var(--mobile-topbar-height) !important;
        padding: env(safe-area-inset-top, 0px) max(16px, env(safe-area-inset-right, 0px)) 0 max(16px, env(safe-area-inset-left, 0px)) !important;
        border: 0 !important;
        border-radius: 0 !important;
        justify-content: flex-start !important;
        z-index: 130 !important;
    }

    body.recicle-app-shell .mobile-menu-toggle:focus-visible {
        outline: 3px solid #fff;
        outline-offset: -5px;
    }

    body.recicle-app-shell .mobile-menu-backdrop {
        z-index: 110 !important;
        visibility: hidden;
    }

    body.recicle-app-shell.menu-open .mobile-menu-backdrop {
        visibility: visible;
    }

    body.recicle-app-shell .sidebar {
        z-index: 120 !important;
        padding-top: calc(var(--mobile-topbar-height) + 8px) !important;
    }

    body.recicle-app-shell .content {
        padding-top: calc(var(--mobile-topbar-height) + 12px) !important;
    }

    /* Keep notification/profile actions clickable above the full-width button. */
    body.recicle-app-shell main.content > .content-top-actions {
        z-index: 135 !important;
        inset-block-start: calc(7px + env(safe-area-inset-top, 0px)) !important;
    }

    body.recicle-app-shell.menu-open .content .content-top-actions {
        visibility: hidden;
    }
}

/* Terminal de etiquetas: area de pre-visualizacao e folha A3 (30x15mm). */
.labels { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 2mm; min-height: 12rem; max-height: 60vh; overflow: auto; padding: var(--recicle-space-section); border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); background: #ffffff; }
.labels .print-sheet { display: inline-block; vertical-align: top; }
.labels .label { width: 30mm; height: 15mm; display: inline-flex; flex-direction: row; justify-content: center; align-items: center; gap: .45mm; padding: .45mm .55mm; background: #fff; border: 1px dashed #b8c0cc; vertical-align: top; page-break-inside: avoid; }
.labels .label-logo { width: 7.4mm; height: 13.8mm; display: flex; align-items: center; justify-content: center; flex: 0 0 7.4mm; overflow: hidden; }
.labels .label-logo img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.labels .label-body { width: 20.9mm; height: 13.8mm; min-width: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .25mm; }
.labels .label.no-logo .label-body { width: 28.5mm; }
.labels .label svg { width: 100%; height: 9.8mm; display: block; }
.labels .label-code { font-family: Arial, sans-serif; font-size: 7.2pt; font-weight: 700; line-height: 1; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #111; }
.code-cell { font-family: "Courier New", monospace; font-weight: 700; }
.status--ok { color: rgb(120 230 170); }
.status--error { color: rgb(255 170 160); }

@page { size: A3 portrait; margin: 0; }

@media print {
    html, body { background: #fff !important; width: 297mm; min-height: 420mm; margin: 0 !important; padding: 0 !important; overflow: visible; }
    body * { visibility: hidden; }
    #labels, #labels * { visibility: visible; }
    #labels { position: absolute; left: 0; top: 0; display: flex; flex-wrap: wrap; gap: 0; padding: 0; margin: 0; border: 0; background: #fff; max-height: none; height: auto; overflow: visible; }
    .labels .label { border: 0; margin: 2mm; }
}
/* Utilitario: agrupa filhos de grid sem criar caixa. */
.contents { display: contents; }

/* Quadro de leads: colunas lado a lado com rolagem horizontal e limite vertical. */
.pipeline-board {
    display: flex;
    gap: var(--recicle-space-section);
    overflow-x: auto;
    padding-bottom: var(--recicle-space-sm);
    scroll-snap-type: x proximity;
}
.pipeline-board > [data-pipeline-stage] {
    flex: 0 0 clamp(17rem, 23vw, 21rem);
    min-width: 0;
    scroll-snap-align: start;
}
.pipeline-column__list {
    display: grid;
    gap: var(--recicle-space-sm);
    max-height: 62vh;
    overflow-y: auto;
    padding-right: .25rem;
}
/* Cartao do quadro de leads: acoes acomodadas na largura da coluna. */
.pipeline-column__list .board-card { min-width: 0; }
.pipeline-column__list .board-card__head { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; justify-content: space-between; }
.pipeline-column__list .board-card .list-toolbar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.pipeline-column__list .board-card .list-toolbar form[data-board-move] { flex: 1 1 100%; display: flex; gap: 6px; min-width: 0; }
.pipeline-column__list .board-card .list-toolbar form[data-board-move] .form-control { flex: 1 1 auto; min-width: 0; }
.pipeline-column__list .board-card .list-toolbar .action-menu { flex: 0 0 auto; }
.pipeline-column__list .board-card .list-toolbar [data-card-drag] { flex: 0 0 auto; }
.pipeline-column__list .pagination-area { margin-top: var(--recicle-space-sm); }
.pipeline-column__list .pagination-area nav { flex-wrap: wrap; gap: 4px; }
/* Blocos de registro dentro de um cartao (listas de provedores/contas). */
.record-stack { display: grid; gap: var(--recicle-space-section); margin-block: var(--recicle-space-sm); }
.record-block { display: grid; gap: var(--recicle-space-sm); padding: var(--recicle-space-section); border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-surface); background: rgb(var(--recicle-surface) / 45%); }
.record-block__head { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; justify-content: space-between; }
.record-block__head strong { display: block; font-size: var(--recicle-font-sm); }
.record-block__head small { display: block; color: rgb(var(--recicle-text-muted)); font-size: var(--recicle-font-xs); line-height: 1.35; overflow-wrap: anywhere; }
.record-block .form-actions { margin: 0; }
/* Blocos de registro: pares compactos em grade. */
.record-stack { grid-template-columns: repeat(auto-fit, minmax(min(100%, 21rem), 1fr)); align-items: start; }
.record-block .record-pairs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: 10px 16px; margin: 0; }
.record-block .record-pair { display: grid; gap: 2px; padding: 0; border: 0; background: none; }
.record-block .record-pair dt { color: rgb(var(--recicle-text-muted)); font-size: var(--recicle-font-xs); font-weight: 500; }
.record-block .record-pair dd { margin: 0; font-size: var(--recicle-font-sm); font-weight: 600; overflow-wrap: anywhere; }
.record-block .form-actions { justify-content: flex-start; }
/* Portal do motorista: navegacao inferior fixa (app), sem barra lateral. */
.motorista-portal .workspace-sidebar,
.motorista-portal .workspace-menu-toggle,
.motorista-portal .workspace-sidebar-backdrop { display: none !important; }

.motorista-portal .workspace-content { padding-bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px)); }

.portal-tabbar {
    position: fixed;
    z-index: 120;
    inset: auto 0 0 0;
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    gap: 2px;
    padding: 6px max(6px, env(safe-area-inset-right, 0px)) calc(6px + env(safe-area-inset-bottom, 0px)) max(6px, env(safe-area-inset-left, 0px));
    border-top: 1px solid rgb(var(--recicle-border));
    background: rgb(var(--recicle-sidebar));
    box-shadow: 0 -8px 24px rgb(0 0 0 / 35%);
}
.portal-tabbar__item {
    flex: 1 1 0;
    min-width: 0;
    display: grid;
    justify-items: center;
    gap: 3px;
    padding: 6px 2px;
    border-radius: var(--recicle-radius-control);
    color: rgb(var(--recicle-text-muted));
    font-size: 11px;
    font-weight: 600;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
}
.portal-tabbar__item span:last-child { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-tabbar__item:hover { color: rgb(var(--recicle-text)); }
.portal-tabbar__item.is-active { color: rgb(var(--recicle-brand-soft)); background: rgb(var(--recicle-brand) / 12%); }
.portal-tabbar__icon { display: grid; place-items: center; }
.portal-tabbar__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
/* Grades de pecas: grupos por SKU pai e checklist de itens disponiveis. */
.grade-details > summary { width: fit-content; cursor: pointer; list-style: none; }
.grade-details > summary::-webkit-details-marker { display: none; }
.grade-details[open] > summary { margin-bottom: var(--recicle-space-section); }
.grade-grupos { display: grid; gap: var(--recicle-space-section); }
.grade-grupo { display: grid; gap: var(--recicle-space-sm); }
.grade-grupo__head { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; justify-content: space-between; border-bottom: 1px solid rgb(var(--recicle-border)); padding-bottom: 6px; }
.grade-items { display: grid; gap: 4px; max-height: 40vh; overflow-y: auto; padding: 8px; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); }
/* Grades de pecas: linha de filtros por familia (SKU pai). */
.grade-filtros {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 6px;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: var(--recicle-radius-surface);
    background: rgb(var(--recicle-surface));
}
.grade-filtro {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 11px;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.grade-filtro:hover { color: rgb(var(--recicle-brand-soft)); }
.grade-filtro.is-active { background: rgb(var(--recicle-brand) / 14%); color: rgb(var(--recicle-brand-soft)); }
/* Grades de pecas: abas Aguardando/Codificados e planilha com celulas mescladas. */
.grade-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 6px;
    border: 1px solid rgb(var(--recicle-border));
    border-radius: var(--recicle-radius-surface);
    background: rgb(var(--recicle-surface));
}
.grade-tab {
    flex: 1 1 12rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 11px;
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-sm);
    font-weight: 600;
    text-decoration: none;
}
.grade-tab:hover { color: rgb(var(--recicle-brand-soft)); }
.grade-tab.is-active { background: rgb(var(--recicle-brand) / 14%); color: rgb(var(--recicle-brand-soft)); }
.grade-tab__count {
    padding: 1px 8px;
    border-radius: 999px;
    background: rgb(var(--recicle-border) / 60%);
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-xs);
    font-weight: 700;
}

.planilha-scroll { overflow: auto; max-height: 70vh; border: 1px solid rgb(var(--recicle-border)); border-radius: var(--recicle-radius-control); }
.planilha { width: 100%; border-collapse: collapse; font-size: var(--recicle-font-sm); }
.planilha th,
.planilha td { border: 1px solid rgb(var(--recicle-border)); padding: 8px 10px; text-align: left; vertical-align: top; }
.planilha thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: rgb(var(--recicle-sidebar));
    color: rgb(var(--recicle-text-muted));
    font-size: var(--recicle-font-xs);
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.planilha tbody tr:nth-child(even) { background: rgb(var(--recicle-surface) / 35%); }
.planilha .planilha__merged {
    vertical-align: middle;
    background: rgb(var(--recicle-brand) / 8%);
    font-weight: 600;
    white-space: nowrap;
}
/* Botao + de qualificacao na grade. */
.grade-item__abrir { min-width: 2.75rem; padding-inline: 0; font-size: 1.1rem; font-weight: 700; line-height: 1; }

/* Modal de qualificacao: alinhamento no desktop e tela cheia no mobile. */
[data-qualificar-modal] .form-grid { align-items: end; }
[data-qualificar-modal] .form-group { min-width: 0; }
[data-qualificar-modal] .form-control { width: 100%; }
[data-qualificar-modal] .modal-card { width: min(46rem, calc(100vw - 2rem)); }

@media (max-width: 640px) {
    .modal-backdrop { padding: 0; align-items: stretch; }
    .modal-backdrop .modal-card,
    .modal-backdrop .modal-card--lg { width: 100vw; max-width: 100vw; max-height: 100dvh; height: 100dvh; border-radius: 0; margin: 0; }
    .modal-backdrop .modal-card__body { overflow-y: auto; }
    .modal-backdrop .modal-card__footer { position: sticky; bottom: 0; }
    [data-qualificar-modal] .modal-card { width: 100vw; height: auto; max-height: 100dvh; }
    [data-qualificar-modal] .form-grid-2 { grid-template-columns: minmax(0, 1fr); }
    .grade-item__abrir { min-width: 2.5rem; }
}
/* Rodape do modal nunca cortado quando o form envolve corpo e rodape. */
.modal-card > form { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.modal-card > form > .modal-card__body { flex: 1 1 auto; min-height: 0; }
.modal-card > form > .modal-card__footer { flex: 0 0 auto; }

/* Botao encerrar linha: compacto, vermelho com degrade para preto. */
.grade-item__encerrar {
    min-width: 2.5rem;
    padding-inline: 0;
    border: 1px solid rgb(127 29 29);
    background: linear-gradient(135deg, #b91c1c 0%, #000000 100%);
    color: #fff;
    font-weight: 700;
    line-height: 1;
}
.grade-item__encerrar:hover { background: linear-gradient(135deg, #dc2626 0%, #111111 100%); }

/* Coluna Acoes das grades: celula normal, botoes agrupados em linha. */
.planilha th:last-child,
.planilha td:last-child { width: 1%; white-space: nowrap; vertical-align: middle; }
.grade-acoes { display: flex; gap: 6px; align-items: center; }
.grade-acoes .grade-item__abrir,
.grade-acoes .grade-item__encerrar { flex: 0 0 auto; width: 2.25rem; height: 2.25rem; min-width: 2.25rem; padding: 0; display: grid; place-items: center; }
/* Ajuda de campo: circulo verde com explicacao ao clicar. */
.field-help {
    display: inline-grid;
    place-items: center;
    width: 1.1rem;
    height: 1.1rem;
    margin-left: .35rem;
    padding: 0;
    border: 1px solid rgb(var(--recicle-brand));
    border-radius: 999px;
    background: rgb(var(--recicle-brand) / 18%);
    color: rgb(var(--recicle-brand));
    font-size: .7rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}
.field-help:hover { background: rgb(var(--recicle-brand) / 35%); }
/* Ajuda de campo: balao no padrao global, fecha ao clicar em qualquer lugar. */
.field-help__tip {
    position: fixed;
    z-index: 1400;
    max-width: 19rem;
    padding: .55rem .7rem;
    border: 1px solid rgb(var(--recicle-border-strong));
    border-radius: var(--recicle-radius-control);
    background: rgb(var(--recicle-sidebar));
    color: rgb(var(--recicle-text));
    font-size: var(--recicle-font-xs);
    line-height: 1.4;
    box-shadow: 0 12px 28px rgb(0 0 0 / 45%);
}
/* Bloco de variacao no modal de qualificacao. */
.variacao-bloco { display: grid; gap: var(--recicle-space-sm); padding: var(--recicle-space-sm) 0; border-bottom: 1px dashed rgb(var(--recicle-border)); }
.variacao-bloco:last-child { border-bottom: 0; }
.variacao-bloco__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.variacao-bloco__titulo { font-size: var(--recicle-font-xs); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: rgb(var(--recicle-text-muted)); }
.grade-item__remover { width: 2rem; height: 2rem; min-width: 2rem; }
/* Qualificacao compacta: campos em uma unica linha que se ajusta sozinha. */
.variacao-bloco {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    gap: 8px 10px;
    align-items: end;
}
.variacao-bloco .variacao-bloco__head { grid-column: 1 / -1; }
.variacao-bloco > .form-grid,
.variacao-bloco [data-qualificar-atributos] { display: contents; }
.variacao-bloco .form-group { min-width: 0; margin: 0; }
.variacao-bloco .form-label { min-height: 0; font-size: var(--recicle-font-xs); }
.variacao-bloco .form-control { height: var(--recicle-height-control); }
@media (max-width: 640px) {
    .variacao-bloco { grid-template-columns: minmax(0, 1fr); }
}
/* Acao ao lado do campo (remover variacao). */
.campo-com-acao { display: flex; align-items: center; gap: 6px; }
.campo-com-acao .form-control { flex: 1 1 auto; min-width: 0; }
.campo-com-acao .grade-item__remover { flex: 0 0 auto; width: 2.25rem; height: var(--recicle-height-control); min-width: 2.25rem; }
/* Celulas clicaveis da planilha da grade. */
.planilha__clicavel { cursor: pointer; }
.planilha__clicavel:hover { background: rgb(var(--recicle-brand) / 12%); }
/* Fechar do cabecalho do modal em formato X */
.btn-fechar-x { display:inline-flex; align-items:center; justify-content:center; width:2.25rem; min-width:2.25rem; padding:0; font-size:1.35rem; line-height:1; }


/* Dialogos do sistema (substituem alert/confirm nativos) */
.recicle-dialog { position: fixed; inset: 0; z-index: 2147483600; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(2, 6, 23, .62); }
.recicle-dialog[hidden] { display: none; }
.recicle-dialog__card { width: min(520px, 94vw); background: rgb(var(--recicle-surface)); color: rgb(var(--recicle-text)); border: 1px solid rgb(var(--recicle-border)); border-radius: .75rem; box-shadow: 0 24px 48px rgba(0,0,0,.45); padding: 1.1rem 1.25rem; }
.recicle-dialog__msg { margin: 0 0 1rem; font-size: .9rem; line-height: 1.5; white-space: pre-line; }
.recicle-dialog__actions { display: flex; gap: .5rem; justify-content: flex-end; }
.recicle-dialog__actions [hidden] { display: none; }