:root {
    --nf-green: #004937;
    --nf-green-700: #006049;
    --nf-lime: #b4d059;
    --nf-lime-100: #edf5cf;
    --nf-cream: #f2f2e7;
    --nf-surface: #ffffff;
    --nf-ink: #123b31;
    --nf-muted: #668077;
    --nf-border: #dbe3d4;
    --nf-shadow: 0 16px 45px rgba(0, 73, 55, 0.09);
}

/* Administracao de usuarios */
.login-alert { padding: 12px 14px; border-radius: 8px; background: #fff0f0; color: #9b1c1c; font-size: 0.84rem; line-height: 1.45; }
.login-alert--warning { background: #fff8df; color: #725600; }
.admin-users-wrap { display: grid; gap: 24px; padding-bottom: 28px; }
.admin-panel { background: #fff; border: 1px solid #e3e8e6; border-radius: 16px; box-shadow: 0 12px 32px rgba(20, 55, 43, .08); padding: 24px; }
.admin-panel__header { display: flex; justify-content: space-between; gap: 20px; align-items: end; margin-bottom: 22px; }
.admin-panel__header span { color: #e27c22; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.admin-panel__header h2 { color: #173f32; font-size: 1.35rem; margin: 4px 0 0; }
.admin-panel__header small { color: #718078; }
.admin-message { border-radius: 10px; padding: 14px 16px; font-weight: 600; }
.admin-message--success { background: #e8f7ef; color: #17633e; }
.admin-message--error { background: #fff0f0; color: #9b1c1c; }
.admin-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.admin-user-form label > span, .permission-fieldset legend { color: #315447; font-size: .78rem; font-weight: 700; }
.admin-user-form input:not([type="checkbox"]), .admin-user-form select { width: 100%; border: 1px solid #cdd8d3; border-radius: 8px; padding: 11px 12px; margin-top: 7px; font: inherit; color: #173f32; background: #fff; }
.admin-user-form input:focus, .admin-user-form select:focus { border-color: #2c8a62; box-shadow: 0 0 0 3px rgba(44, 138, 98, .12); outline: 0; }
.admin-field-wide { grid-column: span 2; }
.admin-form-options { display: flex; gap: 24px; flex-wrap: wrap; margin: 22px 0; color: #3f5f53; font-size: .85rem; }
.permission-fieldset { border: 1px solid #dce5e1; border-radius: 12px; padding: 18px; }
.permission-fieldset > p { color: #718078; font-size: .82rem; margin: 4px 0 16px; }
.access-tree-fieldset { margin-top: 4px; }
.access-tree { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.access-tree__children { position: relative; display: grid; gap: 4px; margin: 6px 0 2px 13px; padding: 0 0 0 22px; list-style: none; }
.access-tree__children[hidden] { display: none; }
.access-tree__children::before { content: ""; position: absolute; inset: 2px auto 8px 7px; border-left: 1px solid #d4dfda; }
.access-tree__item { position: relative; }
.access-tree__item .access-tree__item::before { content: ""; position: absolute; top: 20px; left: -15px; width: 14px; border-top: 1px solid #d4dfda; }
.access-tree__row { display: flex; align-items: flex-start; gap: 3px; width: fit-content; max-width: 100%; }
.access-tree__toggle, .access-tree__toggle-spacer { width: 30px; height: 36px; flex: 0 0 30px; }
.access-tree__toggle { display: grid; place-items: center; border: 0; border-radius: 6px; padding: 0; background: transparent; color: #315447; cursor: pointer; }
.access-tree__toggle:hover { background: #edf4f0; color: #004937; }
.access-tree__toggle:focus-visible { outline: 3px solid rgba(180, 208, 89, .58); outline-offset: 1px; }
.access-tree__toggle span { display: block; font-size: 1.35rem; font-weight: 700; line-height: 1; transition: transform 160ms ease; }
.access-tree__toggle[aria-expanded="true"] span { transform: rotate(90deg); }
.access-tree__node { display: flex; gap: 10px; align-items: flex-start; width: fit-content; max-width: 100%; min-height: 36px; padding: 6px 9px; border-radius: 8px; color: #315447; cursor: pointer; }
.access-tree__node:hover { background: #f5f9f6; }
.access-tree__node input { margin-top: 3px; }
.access-tree__node span { display: grid; gap: 2px; }
.access-tree__node b { color: #173f32; font-size: .86rem; }
.access-tree__node small { color: #718078; font-size: .75rem; font-weight: 400; line-height: 1.35; }
.access-tree__item--level-0 > .access-tree__row { width: 100%; border: 1px solid #e1e9e5; border-radius: 8px; background: #f7faf8; font-weight: 800; }
.access-tree__item--level-0 > .access-tree__row > .access-tree__node b { color: #004937; font-size: .92rem; text-transform: uppercase; }
.access-tree__item--level-1 > .access-tree__row > .access-tree__node b { color: #315447; text-transform: uppercase; letter-spacing: .04em; font-size: .78rem; }
.access-branches-fieldset { margin-top: 18px; }
.access-branches-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 18px; }
.access-branch-option { min-height: 48px; }
.permission-modules { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.permission-module { background: #f7faf8; border-radius: 10px; padding: 16px; }
.permission-module > div { display: flex; justify-content: space-between; gap: 10px; border-bottom: 1px solid #dce5e1; padding-bottom: 10px; margin-bottom: 10px; color: #173f32; }
.permission-module > div span { color: #718078; font-size: .75rem; }
.permission-option { display: flex; gap: 10px; align-items: start; padding: 7px 0; }
.permission-option span { display: grid; gap: 2px; }
.permission-option small { color: #718078; font-weight: 400; }
.permission-subgroup { border-left: 2px solid #dce5e1; margin: 2px 0 8px 10px; padding: 6px 0 4px 16px; }
.permission-subgroup > strong { color: #315447; display: block; font-size: .76rem; font-weight: 800; margin-bottom: 2px; text-transform: uppercase; letter-spacing: .04em; }
.permission-option--sub { padding-block: 6px; }
.admin-form-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 20px; }
.admin-primary-button, .admin-secondary-button { border-radius: 8px; padding: 11px 18px; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.admin-primary-button { border: 0; background: #1c7653; color: #fff; }
.admin-secondary-button { border: 1px solid #b9c9c2; color: #315447; }
.admin-users-table-wrap { overflow-x: auto; }
.admin-users-table { width: 100%; border-collapse: collapse; color: #315447; font-size: .84rem; }
.admin-users-table th, .admin-users-table td { border-bottom: 1px solid #e5ebe8; padding: 12px 10px; text-align: left; }
.admin-users-table th { color: #718078; font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; }
.admin-users-table td strong, .admin-users-table td small { display: block; }
.admin-users-table td small { color: #718078; margin-top: 3px; }
.admin-status { display: inline-block; border-radius: 999px; padding: 4px 9px; background: #f3e5e5; color: #8f3434; font-weight: 700; }
.admin-status.is-active { background: #e2f3ea; color: #17633e; }
.admin-edit-link { color: #176b4c; font-weight: 700; text-decoration: none; }
.admin-edit-link:hover { text-decoration: underline; }
.admin-row-actions { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.admin-row-actions form { margin: 0; }
.admin-delete-button { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #e3bcbc; border-radius: 7px; background: #fff7f7; cursor: pointer; transition: background-color .18s ease, border-color .18s ease; }
.admin-delete-button:hover, .admin-delete-button:focus-visible { border-color: #a33b3b; background: #fdeaea; outline: none; }
.admin-delete-button img { width: 18px; height: 18px; }
.profile-password-wrap { display: grid; place-items: start center; padding-block: 36px; }
.profile-password-panel { width: min(100%, 620px); }
.profile-password-form { display: grid; gap: 16px; }
.profile-password-form label { display: grid; gap: 7px; color: #315447; font-size: .8rem; font-weight: 700; }
.profile-password-form input { width: 100%; border: 1px solid #c9d5d0; border-radius: 8px; padding: 11px 12px; color: #173f32; font: inherit; }
.profile-password-form input:focus { border-color: #1c7653; box-shadow: 0 0 0 3px rgba(28, 118, 83, .12); outline: none; }
@media (max-width: 900px) { .admin-form-grid, .permission-modules, .access-branches-grid { grid-template-columns: 1fr 1fr; } .admin-field-wide { grid-column: span 2; } }
@media (max-width: 900px) { .calendar-month-summary, .calendar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .calendar-add-form { grid-template-columns: 1fr 1fr; } .calendar-add-form .admin-primary-button { grid-column: span 2; } }
@media (max-width: 640px) { .admin-panel { padding: 17px; } .admin-panel__header { align-items: start; flex-direction: column; } .admin-form-grid, .permission-modules, .access-branches-grid, .calendar-month-summary, .calendar-grid, .calendar-add-form { grid-template-columns: 1fr; } .admin-field-wide, .calendar-add-form .admin-primary-button { grid-column: span 1; } .admin-form-actions { flex-direction: column-reverse; } .admin-primary-button, .admin-secondary-button { text-align: center; } }

/* Calendario laboral */
.calendar-wrap { display: grid; gap: 22px; padding-bottom: 36px; }
.calendar-toolbar { display: grid; gap: 16px; }
.calendar-year-form label,
.calendar-add-form label { display: grid; gap: 7px; color: #315447; font-size: .78rem; font-weight: 700; }
.calendar-year-form select,
.calendar-add-form input { width: 100%; border: 1px solid #cdd8d3; border-radius: 8px; padding: 11px 12px; color: #173f32; font: inherit; background: #fff; }
.calendar-year-form select:focus,
.calendar-add-form input:focus { border-color: #1c7653; box-shadow: 0 0 0 3px rgba(28, 118, 83, .12); outline: none; }
.calendar-add-form { display: grid; grid-template-columns: 180px minmax(220px, 1fr) auto; gap: 14px; align-items: end; }
.calendar-add-form .admin-primary-button { min-height: 44px; }
.calendar-help { margin: 0; color: #668077; font-size: .84rem; line-height: 1.55; }
.calendar-legend { display: flex; flex-wrap: wrap; gap: 10px 16px; color: #668077; font-size: .78rem; font-weight: 700; }
.calendar-legend span { display: inline-flex; gap: 7px; align-items: center; }
.calendar-legend i { display: inline-block; width: 13px; height: 13px; border: 1px solid #dce5e1; border-radius: 4px; background: #fff; }
.calendar-legend__half { background: #fff9e8 !important; border-color: #f0d28f !important; }
.calendar-legend__default { background: #eef3ec !important; border-color: #d2ded5 !important; }
.calendar-legend__manual { background: var(--nf-lime-100) !important; border-color: var(--nf-lime) !important; }
.calendar-month-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.calendar-month-summary article { border: 1px solid var(--nf-border); border-radius: 12px; background: #fff; box-shadow: 0 8px 22px rgba(20, 55, 43, .06); padding: 14px; }
.calendar-month-summary span,
.calendar-month-summary small { display: block; color: #718078; font-size: .72rem; font-weight: 750; text-transform: uppercase; }
.calendar-month-summary strong { display: block; margin: 4px 0 1px; color: var(--nf-green); font-size: 1.45rem; line-height: 1; }
.calendar-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.calendar-month { border: 1px solid var(--nf-border); border-radius: 16px; background: #fff; box-shadow: var(--nf-shadow); padding: 16px; }
.calendar-month header { display: flex; gap: 12px; align-items: end; justify-content: space-between; margin-bottom: 12px; }
.calendar-month h3 { margin: 0; color: var(--nf-green); font-size: 1.02rem; font-weight: 800; }
.calendar-month header span { color: #718078; font-size: .74rem; font-weight: 700; }
.calendar-weekdays,
.calendar-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.calendar-weekdays { margin-bottom: 6px; color: #718078; font-size: .66rem; font-weight: 800; text-align: center; text-transform: uppercase; }
.calendar-day { display: grid; min-height: 34px; place-items: center; border: 1px solid #dce5e1; border-radius: 8px; background: #fff; color: #315447; font: inherit; font-size: .78rem; font-weight: 750; cursor: pointer; }
.calendar-day:hover,
.calendar-day:focus-visible { border-color: var(--nf-green); background: #edf5f1; outline: none; }
.calendar-day--empty { border: 0; background: transparent; }
.calendar-day.is-half { background: #fff9e8; border-color: #f0d28f; color: #7d5b0b; }
.calendar-day.is-nonwork { background: #f4eeee; border-color: #e0c5c5; color: #9b3434; }
.calendar-day.is-default { background: #eef3ec; border-color: #d2ded5; color: #668077; }
.calendar-day.is-manual { background: var(--nf-lime-100); border-color: var(--nf-lime); color: var(--nf-green); }
.calendar-day.is-half.is-manual { background: #fff4d6; border-color: #e7b84d; color: #725600; }
.calendar-day span { line-height: 1; }
.calendar-choice-dialog { width: min(420px, calc(100vw - 32px)); border: 0; border-radius: 14px; padding: 0; color: #173f32; box-shadow: 0 24px 70px rgba(20, 55, 43, .24); }
.calendar-choice-dialog::backdrop { background: rgba(18, 59, 49, .34); }
.calendar-choice-dialog__content { display: grid; gap: 18px; padding: 22px; }
.calendar-choice-dialog__header { display: grid; gap: 6px; }
.calendar-choice-dialog__header span { color: var(--nf-green); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.calendar-choice-dialog__header h2 { margin: 0; font-size: 1.16rem; }
.calendar-choice-dialog__header p { margin: 0; color: #668077; font-size: .86rem; line-height: 1.45; }
.calendar-choice-dialog__actions { display: grid; gap: 10px; }
.calendar-choice-dialog__close { justify-self: center; border: 0; background: transparent; color: #668077; font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; }
.calendar-choice-dialog__close:hover,
.calendar-choice-dialog__close:focus-visible { color: var(--nf-green); outline: none; }

* {
    box-sizing: border-box;
}

.d-none {
    display: none !important;
}

body {
    min-height: 100vh;
    margin: 0;
    background:
        linear-gradient(180deg, rgba(180, 208, 89, 0.2), rgba(180, 208, 89, 0) 270px),
        var(--nf-cream);
    color: var(--nf-ink);
    font-family: "Gotham", "Montserrat", "Aptos", "Segoe UI", sans-serif;
}

.access-denied-page { display: grid; min-height: 100vh; place-items: center; padding: 20px; }
.access-denied-card { width: min(100%, 620px); border: 1px solid var(--nf-border); border-radius: 16px; background: #fff; box-shadow: var(--nf-shadow); padding: clamp(28px, 6vw, 54px); text-align: center; }
.access-denied-card img { width: min(100%, 190px); margin-bottom: 28px; }
.access-denied-card > span { display: block; color: #a33b3b; font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.access-denied-card h1 { margin: 10px 0; color: var(--nf-green); font-size: clamp(1.45rem, 4vw, 2.2rem); }
.access-denied-card p { margin: 0 0 24px; color: var(--nf-muted); line-height: 1.6; }

.dashboard-shell {
    min-height: 100vh;
}

.brand-header {
    background: var(--nf-green);
    color: #ffffff;
    border-bottom: 8px solid var(--nf-lime);
}

.brand-header__inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(180px, 280px) 1fr;
    gap: 32px;
    align-items: center;
    padding: 26px clamp(20px, 4vw, 56px);
}

.user-profile {
    position: absolute;
    top: 50%;
    right: clamp(16px, 3vw, 40px);
    transform: translateY(-50%);
    z-index: 20;
}

.header-settings {
    right: calc(clamp(16px, 3vw, 40px) + 54px);
}

.header-settings .user-profile__trigger img {
    width: 24px;
    height: 24px;
}

.user-profile__trigger {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
    padding: 0;
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease;
}

.user-profile__trigger:hover,
.user-profile__trigger:focus-visible,
.user-profile__trigger[aria-expanded="true"] {
    border-color: rgba(180, 208, 89, .9);
    background: rgba(255, 255, 255, .13);
    outline: none;
}

.user-profile__trigger img { width: 23px; height: 23px; }
.user-profile__menu[hidden] { display: none; }
.user-profile__menu {
    position: absolute;
    top: calc(100% + 9px);
    right: 0;
    width: 280px;
    overflow: hidden;
    border: 1px solid var(--nf-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(13, 52, 39, .22);
    color: var(--nf-ink);
}
.user-profile__identity { display: grid; gap: 4px; padding: 16px; border-bottom: 1px solid var(--nf-border); }
.user-profile__identity strong { font-size: .84rem; }
.user-profile__identity span { color: var(--nf-muted); font-size: .75rem; }
.user-profile__menu a,
.user-profile__menu button { display: block; width: 100%; border: 0; background: #fff; padding: 12px 16px; color: #315447; font: inherit; font-size: .8rem; font-weight: 700; text-align: left; text-decoration: none; cursor: pointer; }
.user-profile__menu a:hover,
.user-profile__menu a:focus-visible,
.user-profile__menu button:hover,
.user-profile__menu button:focus-visible { background: #edf5f1; outline: none; }
.user-profile__menu form { margin: 0; border-top: 1px solid var(--nf-border); }
.user-profile__menu form button { color: #9b3434; }

.brand-logo {
    display: block;
    width: min(100%, 260px);
    height: auto;
}

.brand-heading {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.brand-heading__eyebrow {
    color: var(--nf-lime);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.brand-heading h1 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.65rem, 3vw, 2.65rem);
    font-weight: 800;
    line-height: 1.05;
}

.brand-heading p {
    max-width: 760px;
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1rem;
}

.content-wrap {
    width: min(100%, 1480px);
    margin: 0 auto;
    padding: 28px clamp(16px, 3vw, 40px) 48px;
}

.portal-menu-wrap {
    display: grid;
    gap: 24px;
    padding-top: 34px;
}

.portal-menu-hero {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--nf-border);
    border-radius: 18px;
    background:
        radial-gradient(circle at 92% 14%, rgba(180, 208, 89, .28), transparent 28%),
        linear-gradient(135deg, #ffffff 0%, #f8fbef 100%);
    box-shadow: var(--nf-shadow);
    padding: clamp(24px, 4vw, 42px);
}

.portal-menu-hero span {
    display: block;
    color: #e27c22;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.portal-menu-hero h2 {
    max-width: 760px;
    margin: 8px 0 10px;
    color: var(--nf-green);
    font-size: clamp(1.65rem, 3vw, 2.55rem);
    font-weight: 800;
    line-height: 1.05;
}

.portal-menu-hero p {
    max-width: 820px;
    margin: 0;
    color: var(--nf-muted);
    font-size: .98rem;
    line-height: 1.65;
}

.portal-menu-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.portal-menu-card {
    position: relative;
    display: grid;
    min-height: 230px;
    align-content: space-between;
    gap: 22px;
    overflow: hidden;
    border: 1px solid var(--nf-border);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: var(--nf-shadow);
    color: var(--nf-ink);
    padding: 24px;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.portal-menu-card::after {
    content: "";
    position: absolute;
    inset: auto -42px -52px auto;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: rgba(180, 208, 89, .16);
}

.portal-menu-card:hover,
.portal-menu-card:focus-visible {
    border-color: rgba(0, 73, 55, .26);
    box-shadow: 0 20px 52px rgba(0, 73, 55, .14);
    outline: none;
    transform: translateY(-2px);
}

.portal-menu-card--disabled {
    opacity: .76;
    box-shadow: none;
}

.portal-menu-card--disabled:hover {
    border-color: var(--nf-border);
    transform: none;
}

.portal-menu-card__status {
    justify-self: start;
    border-radius: 999px;
    background: var(--nf-lime-100);
    color: var(--nf-green);
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .06em;
    padding: 5px 10px;
    text-transform: uppercase;
}

.portal-menu-card--disabled .portal-menu-card__status {
    background: #eef1ed;
    color: var(--nf-muted);
}

.portal-menu-card__icon {
    position: relative;
    z-index: 1;
    width: 56px;
    height: 56px;
    object-fit: contain;
}

.portal-menu-card h3 {
    position: relative;
    z-index: 1;
    margin: 0 0 8px;
    color: var(--nf-green);
    font-size: 1.22rem;
    font-weight: 800;
}

.portal-menu-card p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--nf-muted);
    font-size: .88rem;
    font-weight: 500;
    line-height: 1.55;
}

.products-wrap {
    display: grid;
    gap: 18px;
    padding-top: 28px;
}

.products-module-tabs {
    display: flex;
    gap: 8px;
    border-bottom: 1px solid var(--nf-border);
    padding: 0 2px 10px;
}

.products-module-tabs button {
    min-width: 112px;
    min-height: 40px;
    border: 1px solid rgba(0, 73, 55, .22);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font: inherit;
    font-size: .82rem;
    font-weight: 800;
    cursor: pointer;
}

.products-module-tabs button.is-active {
    border-color: var(--nf-green);
    background: var(--nf-green);
    color: #ffffff;
}

.products-module-panel {
    display: grid;
    gap: 18px;
}

.products-module-panel[hidden] {
    display: none;
}

.products-filter-panel,
.products-toolbar,
.products-criteria,
.products-search-panel,
.products-panel,
.products-summary-grid article {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: var(--nf-shadow);
}

.products-filter-panel {
    padding: 18px;
}

.products-filter-grid,
.products-losses-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr)) 130px;
    gap: 12px;
    align-items: end;
}

.products-losses-filter-grid {
    grid-template-columns:
        minmax(170px, 1fr)
        minmax(170px, 1fr)
        minmax(260px, 1.35fr)
        repeat(2, minmax(150px, .9fr))
        minmax(180px, auto);
}

.products-filter-grid label,
.products-losses-filter-grid label {
    display: grid;
    min-width: 0;
    gap: 6px;
    margin: 0;
}

.products-filter-grid span,
.products-losses-filter-grid span {
    color: var(--nf-green);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.products-filter-grid input,
.products-filter-grid select,
.products-losses-filter-grid input,
.products-losses-filter-grid select {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 42px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    color: #173c31;
    font: inherit;
    font-size: .88rem;
    font-weight: 700;
    padding: 0 12px;
}

@media (min-width: 992px) and (max-width: 1240px) {
    .products-losses-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.products-update-button {
    display: grid;
    min-height: 42px;
    place-items: center;
    border: 0;
    border-radius: 8px;
    font-weight: 800;
}

.products-update-button.is-loading {
    cursor: wait;
}

.products-update-button img {
    width: 30px;
    height: 24px;
    filter: brightness(0) invert(1);
}

.products-filter-grid .products-update-button span {
    color: #ffffff;
}

.products-losses-filter-actions {
    display: grid;
    grid-template-columns: minmax(72px, auto) minmax(94px, 1fr);
    gap: 8px;
}

.products-losses-filter-actions .products-update-button span {
    color: #ffffff;
}

.products-clear-button {
    min-height: 42px;
    border: 1px solid rgba(0, 73, 55, .22);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font: inherit;
    font-size: .76rem;
    font-weight: 800;
    cursor: pointer;
}

.products-clear-button:hover,
.products-clear-button:focus-visible {
    border-color: var(--nf-green);
    background: #f5f8ed;
    outline: none;
}

.products-update-button img[hidden],
.products-update-button span[hidden] {
    display: none;
}

.products-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px;
}

.products-segments,
.products-criteria,
.products-export-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.products-segments button,
.products-criteria button,
.products-export-button {
    min-height: 38px;
    border: 1px solid rgba(0, 73, 55, .18);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font: inherit;
    font-size: .78rem;
    font-weight: 800;
    padding: 0 13px;
}

.products-segments button.is-active,
.products-criteria button.is-active {
    border-color: rgba(0, 73, 55, .48);
    background: var(--nf-green);
    color: #ffffff;
}

.products-export-button {
    background: #fbfcf7;
}

.products-export-button:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.products-criteria {
    padding: 12px;
}

.products-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.products-losses-summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.products-losses-summary strong {
    white-space: nowrap;
}

.products-summary-grid article {
    display: grid;
    gap: 5px;
    min-height: 92px;
    align-content: center;
    padding: 16px;
}

.products-summary-grid article > span,
.products-panel__header span {
    color: #e27c22;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.products-summary-grid strong {
    color: var(--nf-green);
    font-size: 1.24rem;
    font-weight: 800;
}

.products-search-panel {
    display: flex;
    justify-content: stretch;
    padding: 14px 16px;
}

.products-panel {
    overflow: hidden;
}

.products-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid var(--nf-border);
    padding: 16px 18px;
}

.products-panel__header h2 {
    margin: 3px 0 0;
    color: var(--nf-green);
    font-size: 1.05rem;
    font-weight: 800;
}

.products-panel__header p {
    margin: 0;
    color: var(--nf-muted);
    font-size: .82rem;
    font-weight: 700;
    text-align: right;
}

.products-panel__tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
}

.products-favorite-button.is-active,
.products-favorite-button.is-favorite {
    border-color: var(--nf-green);
    background: var(--nf-green);
}

.products-favorite-button {
    padding: 0;
    line-height: 0;
}

.products-favorite-button img {
    display: block;
    margin: 0;
    object-fit: contain;
    object-position: center;
}

.products-panel__tools #produtos_filtrar_favoritos.is-active,
.products-panel__tools #produtos_filtrar_favoritos.is-active:hover,
.products-panel__tools #produtos_filtrar_favoritos.is-active:focus,
.products-panel__tools #produtos_filtrar_favoritos.is-active:focus-visible,
.products-panel__tools #produtos_perdas_filtrar_favoritos.is-active,
.products-panel__tools #produtos_perdas_filtrar_favoritos.is-active:hover,
.products-panel__tools #produtos_perdas_filtrar_favoritos.is-active:focus,
.products-panel__tools #produtos_perdas_filtrar_favoritos.is-active:focus-visible {
    border-color: var(--nf-green);
    background: var(--nf-green);
}

.products-panel__tools #produtos_filtrar_favoritos img,
.products-panel__tools #produtos_perdas_filtrar_favoritos img {
    width: 28px;
    height: 28px;
}

.products-panel__tools #produtos_filtrar_favoritos:not(.is-active) img,
.products-panel__tools #produtos_perdas_filtrar_favoritos:not(.is-active) img {
    position: relative;
    left: -1px;
}

.products-favorite-button.is-active img,
.products-favorite-button.is-favorite img {
    filter: brightness(0) invert(1);
}

.products-search-control {
    display: grid;
    gap: 6px;
    width: 100%;
    margin: 0;
}

.products-search-control span {
    color: #e27c22;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.products-search-control input {
    min-height: 42px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    color: #173c31;
    font: inherit;
    font-size: .88rem;
    font-weight: 700;
    padding: 0 12px;
}

.products-table-wrap {
    max-height: 476px;
    overflow: auto;
}

.products-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    table-layout: fixed;
}

.products-panel > .products-table-wrap {
    overflow-x: hidden;
}

.products-curve-table {
    min-width: 100%;
}

.products-curve-table th,
.products-curve-table td {
    padding: 12px 9px;
}

.products-curve-table th {
    font-size: .68rem;
    line-height: 1.25;
}

.products-curve-table th.products-table__numeric,
.products-curve-table th.products-table__money {
    white-space: normal;
}

.products-curve-table .products-sort-button span {
    min-width: 0;
    white-space: normal;
}

.products-curve-table .products-money {
    gap: 3px;
}

@media (max-width: 900px) {
    .products-panel > .products-table-wrap {
        overflow-x: auto;
    }

    .products-curve-table {
        min-width: 980px;
    }
}

.products-table th,
.products-table td {
    border-bottom: 1px solid var(--nf-border);
    color: #173c31;
    font-size: .82rem;
    padding: 13px 16px;
    text-align: left;
    vertical-align: middle;
}

.products-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fbfcf7;
    color: var(--nf-green);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.products-table td {
    font-weight: 650;
}

.products-table th.products-table__text,
.products-table td.products-table__text {
    min-width: 0;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
}

.products-table th.products-table__numeric,
.products-table td.products-table__numeric,
.products-table th.products-table__money,
.products-table td.products-table__money {
    text-align: right;
    white-space: nowrap;
}

.products-table th.products-table__position,
.products-table td.products-table__position {
    color: var(--nf-green);
    font-weight: 800;
    text-align: center;
    white-space: nowrap;
}

.products-table th.products-table__code,
.products-table td.products-table__code {
    color: var(--nf-green);
    font-weight: 800;
    white-space: nowrap;
}

.products-sort-button {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    width: 100%;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    padding: 0;
    text-align: inherit;
    text-transform: inherit;
}

.products-table__money .products-sort-button,
.products-table__numeric .products-sort-button {
    justify-content: flex-end;
}

.products-sort-button b {
    min-width: 10px;
    color: #e27c22;
    font-size: .82rem;
    line-height: 1;
}

.products-sort-button:not(.is-active) b {
    opacity: 0;
}

.products-sort-button:hover b,
.products-sort-button:focus b {
    opacity: 1;
}

.products-money {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-start;
    gap: 4px;
    width: max-content;
    max-width: 100%;
    white-space: nowrap;
}

.products-money__currency,
.products-money__value {
    color: inherit;
    flex: 0 0 auto;
    font: inherit;
    letter-spacing: 0;
    text-transform: none;
}

.products-table__clickable-row {
    cursor: pointer;
}

.products-table__clickable-row:hover,
.products-table__clickable-row:focus {
    background: #fbfcf7;
    outline: none;
}

.products-table__search-match {
    background: #fbfcf7;
    box-shadow: inset 4px 0 0 #b4d059;
}

.products-table__clickable-row:focus-visible {
    outline: 3px solid rgba(180, 208, 89, 0.62);
    outline-offset: -3px;
}

.products-detail-link {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--nf-green);
    font: inherit;
    font-weight: 800;
    text-align: left;
    cursor: pointer;
}

.products-detail-link:hover,
.products-detail-link:focus-visible {
    color: #e27c22;
    outline: none;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.products-empty-cell {
    color: var(--nf-muted) !important;
    font-weight: 700 !important;
    text-align: center !important;
}

.products-losses-heading p {
    margin-top: 5px;
    text-align: left;
}

.products-losses-table-wrap {
    max-height: 492px;
    overflow-x: hidden;
}

.products-losses-table {
    min-width: 100%;
}

.products-losses-col-code { width: 7%; }
.products-losses-col-name { width: 18%; }
.products-losses-col-branch { width: 7%; }
.products-losses-col-lot { width: 12%; }
.products-losses-col-stock { width: 10%; }
.products-losses-col-days { width: 11%; }
.products-losses-col-expiry { width: 12%; }
.products-losses-col-lost { width: 11%; }
.products-losses-col-loss { width: 12%; }

.products-losses-table th,
.products-losses-table td {
    overflow: hidden;
    padding: 11px 10px;
}

.products-losses-table th {
    font-size: .67rem;
    line-height: 1.25;
    white-space: normal;
}

.products-losses-table .products-sort-button {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 10px;
    gap: 4px;
    align-items: center;
}

.products-losses-table .products-sort-button span {
    min-width: 0;
    white-space: normal;
}

.products-losses-table .products-sort-button b {
    justify-self: end;
}

.products-losses-table td {
    font-size: .78rem;
}

.products-losses-stock {
    white-space: nowrap;
}

.products-losses-name {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.products-losses-name > span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.products-inline-favorite {
    display: grid;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    place-items: center;
    border: 1px solid rgba(0, 73, 55, .22);
    border-radius: 6px;
    background: #ffffff;
    cursor: pointer;
}

.products-inline-favorite img {
    width: 18px;
    height: 18px;
}

.products-inline-favorite.is-favorite {
    border-color: var(--nf-green);
    background: var(--nf-green);
}

.products-inline-favorite.is-favorite img {
    filter: brightness(0) invert(1);
}

.products-loss-status {
    font-weight: 800;
}

.products-loss-status.is-critical { color: #b42318; }
.products-loss-status.is-warning { color: #b54708; }
.products-losses-table td.products-loss-status.is-no-consumption {
    color: #e27c22;
}
.products-loss-status.is-ok { color: #16794a; }
.products-loss-status.is-muted { color: var(--nf-muted); }

.products-prescribers-dialog {
    width: min(1100px, calc(100vw - 28px));
    max-height: min(760px, calc(100vh - 28px));
    border: 0;
    border-radius: 8px;
    padding: 0;
    box-shadow: 0 24px 72px rgba(0, 73, 55, .24);
}

.products-prescribers-dialog::backdrop {
    background: rgba(0, 32, 24, .42);
}

.products-prescribers-dialog__content {
    display: grid;
    max-height: inherit;
    overflow: hidden;
    background: #ffffff;
}

.products-prescribers-dialog__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid var(--nf-border);
    padding: 18px;
}

.products-prescribers-dialog__header span {
    color: #e27c22;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.products-prescribers-dialog__header h2 {
    margin: 4px 0;
    color: var(--nf-green);
    font-size: 1.12rem;
    font-weight: 800;
}

.products-prescribers-dialog__header p {
    margin: 0;
    color: var(--nf-muted);
    font-size: .82rem;
    font-weight: 700;
}

.products-detail-header-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
    align-items: center;
}

.products-prescribers-dialog__close {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1;
}

.products-prescribers-dialog__close:hover,
.products-prescribers-dialog__close:focus {
    background: #fbfcf7;
    border-color: rgba(0, 73, 55, .36);
}

.products-detail-tabs {
    display: flex;
    gap: 2px;
    border-bottom: 1px solid var(--nf-border);
    padding: 0 18px;
    background: #fbfcf9;
}

.products-detail-tabs button {
    min-height: 44px;
    border: 0;
    border-bottom: 3px solid transparent;
    padding: 0 18px;
    background: transparent;
    color: var(--nf-muted);
    font: inherit;
    font-size: .78rem;
    font-weight: 800;
    cursor: pointer;
}

.products-detail-tabs button:hover,
.products-detail-tabs button:focus-visible,
.products-detail-tabs button.is-active {
    border-bottom-color: var(--nf-lime);
    color: var(--nf-green);
    outline: none;
}

.products-detail-panel[hidden] {
    display: none;
}

.products-loss-detail-panel {
    min-height: 0;
    overflow-y: auto;
    padding: 18px;
}

.products-loss-detail-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    border-top: 1px solid var(--nf-border);
    border-left: 1px solid var(--nf-border);
}

.products-loss-detail-grid > div {
    min-width: 0;
    border-right: 1px solid var(--nf-border);
    border-bottom: 1px solid var(--nf-border);
    padding: 16px;
    background: #ffffff;
}

.products-loss-detail-grid dt {
    color: #e27c22;
    font-size: .66rem;
    font-weight: 800;
    text-transform: uppercase;
}

.products-loss-detail-grid dd {
    margin: 7px 0 0;
    color: var(--nf-green);
    font-size: 1rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.products-loss-detail-grid__highlight {
    background: #fbfcf7 !important;
    grid-column: span 2;
}

.products-loss-detail-grid__highlight dd {
    font-size: 1.22rem;
}

.products-loss-detail-grid__highlight dd.is-negative {
    color: #b42318;
}

.products-loss-detail-period {
    margin: 14px 0 0;
    color: var(--nf-muted);
    font-size: .76rem;
    font-weight: 700;
}

.products-prescribers-table-wrap {
    max-height: min(480px, calc(100vh - 220px));
}

.products-prescribers-table {
    min-width: 960px;
    table-layout: fixed;
}

.products-prescribers-table th:nth-child(1) { width: 13%; }
.products-prescribers-table th:nth-child(2) { width: 27%; }
.products-prescribers-table th:nth-child(3) { width: 17%; }
.products-prescribers-table th:nth-child(4) { width: 17%; }
.products-prescribers-table th:nth-child(5) { width: 13%; }
.products-prescribers-table th:nth-child(6) { width: 13%; }

.products-prescribers-table th:nth-child(n+3),
.products-prescribers-table td:nth-child(n+3) {
    text-align: right;
}

.products-detail-empty {
    display: grid;
    min-height: 280px;
    place-items: center;
    color: var(--nf-muted);
    font-size: .86rem;
    font-weight: 700;
}

.products-lifecycle-panel {
    min-height: 0;
    overflow-y: auto;
    padding: 16px 18px 20px;
}

.products-lifecycle-toolbar,
.products-lifecycle-toolbar > div,
.products-lifecycle-segments {
    display: flex;
    align-items: center;
}

.products-lifecycle-toolbar {
    justify-content: space-between;
    gap: 18px;
}

.products-lifecycle-toolbar > div {
    gap: 12px;
}

.products-lifecycle-toolbar > div > span {
    color: #e27c22;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.products-lifecycle-toolbar p {
    margin: 0;
    color: var(--nf-muted);
    font-size: .78rem;
    font-weight: 700;
    text-align: right;
}

.products-lifecycle-segments {
    gap: 4px;
}

.products-lifecycle-segments button {
    min-height: 36px;
    border: 1px solid rgba(0, 73, 55, .2);
    border-radius: 8px;
    padding: 0 13px;
    background: #ffffff;
    color: var(--nf-green);
    font: inherit;
    font-size: .76rem;
    font-weight: 800;
    cursor: pointer;
}

.products-lifecycle-segments button:hover,
.products-lifecycle-segments button:focus-visible,
.products-lifecycle-segments button.is-active {
    border-color: var(--nf-green);
    background: var(--nf-green);
    color: #ffffff;
    outline: none;
}

.products-lifecycle-chart {
    height: 410px;
    min-height: 410px;
    margin-top: 12px;
}

.products-lifecycle-chart .products-detail-empty {
    min-height: 410px;
}

.products-lifecycle-y-label {
    fill: var(--nf-muted);
    font-family: "Montserrat", sans-serif;
    font-size: 11px;
    font-weight: 700;
}

.products-comparison-panel {
    min-height: 0;
    overflow-y: auto;
    padding: 18px;
}

.products-comparison-filters {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 18px;
    align-items: end;
}

.products-comparison-period {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.products-comparison-period h3 {
    grid-column: 1 / -1;
    margin: 0;
    color: #e27c22;
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.products-comparison-period label {
    display: grid;
    gap: 6px;
}

.products-comparison-period label span {
    color: var(--nf-green);
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.products-comparison-period input {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    padding: 0 11px;
    background: #fbfcf7;
    color: var(--nf-green);
    font: inherit;
    font-size: .78rem;
    font-weight: 700;
}

.products-comparison-period input:focus {
    border-color: var(--nf-green);
    outline: 3px solid rgba(180, 208, 89, .42);
}

.products-comparison-button {
    min-width: 118px;
    min-height: 42px;
}

.products-comparison-status {
    min-height: 18px;
    margin: 14px 0 8px;
    color: var(--nf-muted);
    font-size: .76rem;
    font-weight: 700;
}

.products-comparison-table-wrap {
    max-height: min(330px, calc(100vh - 390px));
    overflow-x: hidden;
    border-top: 1px solid var(--nf-border);
}

.products-comparison-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.products-comparison-table th,
.products-comparison-table td {
    padding: 10px 8px;
}

.products-comparison-table th:first-child,
.products-comparison-table td:first-child {
    width: 28%;
    text-align: left;
}

.products-comparison-table th:not(:first-child),
.products-comparison-table td:not(:first-child) {
    width: 24%;
    text-align: right;
}

.products-comparison-table th {
    white-space: normal;
}

.products-comparison-table td:not(:first-child) {
    white-space: nowrap;
}

.products-comparison-table td {
    height: 48px;
    vertical-align: middle;
}

.products-comparison-table td:first-child {
    color: var(--nf-green);
    font-weight: 800;
}

.products-comparison-change {
    font-weight: 800;
}

.products-comparison-change.is-positive {
    color: #187548;
}

.products-comparison-change.is-negative {
    color: #b63832;
}

.products-comparison-change.is-neutral {
    color: var(--nf-muted);
}

@media (max-width: 575px) {
    .products-loss-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .products-lifecycle-toolbar,
    .products-lifecycle-toolbar > div {
        align-items: stretch;
        flex-direction: column;
    }

    .products-lifecycle-toolbar p {
        text-align: left;
    }

    .products-comparison-filters,
    .products-comparison-period {
        grid-template-columns: 1fr;
    }

    .products-comparison-period h3 {
        grid-column: auto;
    }

    .products-comparison-button {
        width: 100%;
    }

    .products-comparison-table {
        min-width: 0;
    }

    .products-comparison-table th,
    .products-comparison-table td {
        padding: 9px 4px;
        font-size: .68rem;
    }

    .products-comparison-table th:first-child,
    .products-comparison-table td:first-child {
        width: 31%;
    }

    .products-comparison-table th:not(:first-child),
    .products-comparison-table td:not(:first-child) {
        width: 23%;
    }
}

.filter-panel,
.metric-card,
.chart-panel,
.branch-card {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: var(--nf-surface);
    box-shadow: var(--nf-shadow);
}

.filter-panel {
    margin-top: -44px;
    padding: 18px;
    position: relative;
    z-index: 2;
}

.filter-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(170px, 1fr)) minmax(160px, 210px) 52px;
    gap: 14px;
    align-items: end;
}

.form-label {
    margin-bottom: 6px;
    color: var(--nf-green);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.form-control {
    min-height: 46px;
    border-color: var(--nf-border);
    border-radius: 8px;
    color: var(--nf-ink);
    font-weight: 650;
}

.form-control:focus {
    border-color: var(--nf-lime);
    box-shadow: 0 0 0 0.22rem rgba(180, 208, 89, 0.28);
}

.btn-nath {
    min-height: 46px;
    border: 0;
    border-radius: 8px;
    background: var(--nf-green);
    color: #ffffff;
    font-weight: 800;
}

.btn-nath:hover,
.btn-nath:focus {
    background: var(--nf-green-700);
    color: #ffffff;
}

.btn-nath:disabled {
    background: #7d9991;
}

.btn-nath-outline {
    border: 1px solid rgba(0, 73, 55, 0.28);
    background: #ffffff;
    color: var(--nf-green);
}

.btn-nath-outline:hover,
.btn-nath-outline:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
    color: var(--nf-green);
}

.settings-button {
    display: grid;
    width: 46px;
    height: 46px;
    min-height: 46px;
    place-items: center;
    justify-self: end;
    padding: 0;
}

.settings-button img {
    width: 23px;
    height: 23px;
    transition: transform 160ms ease;
}

.settings-button:hover img,
.settings-button:focus img {
    transform: scale(1.06);
}

.metrics-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin: 24px 0;
}

.metric-card {
    min-height: 150px;
    padding: 22px;
    position: relative;
    overflow: visible;
}

.metric-card--clickable {
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.metric-card--clickable:hover,
.metric-card--clickable:focus {
    border-color: rgba(0, 73, 55, 0.32);
    box-shadow: 0 18px 40px rgba(0, 73, 55, 0.12);
    transform: translateY(-1px);
}

.metric-card--clickable:focus-visible {
    outline: 3px solid rgba(180, 208, 89, 0.62);
    outline-offset: 3px;
}

.metric-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 8px;
    background: var(--nf-lime);
}

.metric-card__label {
    margin-bottom: 12px;
    color: var(--nf-muted);
    font-size: 0.82rem;
    font-weight: 800;
    text-transform: uppercase;
}

.metric-card__value {
    margin: 0;
    color: var(--nf-green);
    font-size: clamp(1.7rem, 2.4vw, 2.2rem);
    font-weight: 800;
    line-height: 1.05;
    white-space: nowrap;
}

.metric-card__hint {
    margin: 12px 0 0;
    color: var(--nf-muted);
    font-size: 0.9rem;
    line-height: 1.25;
}

.metric-card__hint span {
    display: block;
}

.metric-card__hint .branch-growth {
    margin-top: 4px;
    font-size: 0.78rem;
    font-weight: 700;
}

.metric-card--total {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(104px, 0.72fr);
    gap: 12px;
    align-items: center;
}

.metric-card--total .metric-card__main {
    min-width: 0;
}

.metric-card--total .metric-card__value {
    font-size: clamp(1.45rem, 2vw, 2rem);
}

.metric-card__gauge {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    border-left: 1px solid var(--nf-border);
    padding-left: 10px;
    text-align: center;
}

.metric-card__gauge .gauge-wrap {
    min-width: 96px;
}

.metric-card__gauge .gauge-svg {
    width: 96px;
    height: 58px;
}

.metric-card__gauge .gauge-wrap strong {
    margin-top: -23px;
    font-size: 1.02rem;
}

.metric-card__gauge .gauge-wrap span {
    max-width: 104px;
}

.chart-panel,
.branch-card {
    margin-bottom: 24px;
}

.panel-header,
.branch-card__header {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--nf-border);
    padding: 18px 22px;
}

.panel-title,
.branch-card__title {
    margin: 0;
    color: var(--nf-green);
    font-size: 1rem;
    font-weight: 800;
}

.branch-card .branch-card__title {
    font-size: 2rem;
    line-height: 1.08;
}

.branch-title-button {
    appearance: none;
    -webkit-appearance: none;
    display: inline;
    border: 0;
    background: transparent;
    color: var(--nf-green);
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    padding: 0;
    text-align: left;
    text-decoration: none;
    text-transform: inherit;
    cursor: pointer;
}

.branch-title-button:hover,
.branch-title-button:focus {
    color: var(--nf-green);
    outline: 0;
    text-decoration: none;
}

.branch-title-button:focus-visible {
    outline: 3px solid rgba(180, 208, 89, 0.62);
    outline-offset: 4px;
    border-radius: 4px;
}

.branch-title-button--disabled {
    cursor: default;
    opacity: 0.58;
}

.branch-observation-button {
    display: inline-flex;
    width: fit-content;
    min-height: 34px;
    gap: 7px;
    align-items: center;
    margin-top: 10px;
    border: 1px solid rgba(0, 73, 55, 0.18);
    border-radius: 999px;
    background: #ffffff;
    color: var(--nf-green);
    font-size: 0.74rem;
    font-weight: 400;
    line-height: 1.15;
    padding: 7px 12px;
    text-transform: uppercase;
}

.branch-observation-button img {
    width: 19px;
    height: 19px;
}

.branch-observation-button span {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    transform: translateY(1px);
}

.branch-observation-button:hover,
.branch-observation-button:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
    outline: 0;
}

.branch-observation-button:focus-visible {
    box-shadow: 0 0 0 0.22rem rgba(180, 208, 89, 0.34);
}

.panel-kicker,
.branch-code {
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.ranking-control {
    width: min(100%, 190px);
}

.ranking-control .form-label {
    margin-bottom: 5px;
}

.ranking-control .form-select {
    min-height: 42px;
    border-color: var(--nf-border);
    border-radius: 8px;
    color: var(--nf-green);
    font-weight: 800;
}

.ranking-control .form-select:focus {
    border-color: var(--nf-lime);
    box-shadow: 0 0 0 0.22rem rgba(180, 208, 89, 0.28);
}

.chart-body {
    padding: 12px 12px 6px;
}

#grafico_vendedores {
    min-height: 300px;
}

.empty-state {
    display: grid;
    min-height: 280px;
    place-items: center;
    color: var(--nf-muted);
    font-weight: 650;
    text-align: center;
}

.mobile-ranking {
    display: grid;
    gap: 12px;
    padding: 16px;
}

.ranking-row {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    padding: 12px;
}

.ranking-row__header {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4px;
}

.ranking-row__name {
    color: var(--nf-green);
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.25;
}

.ranking-row__value {
    color: var(--nf-green);
    font-size: 0.95rem;
    font-weight: 800;
}

.ranking-row__branch {
    display: block;
    margin-top: 3px;
    color: var(--nf-muted);
    font-size: 0.76rem;
    font-weight: 700;
}

.ranking-row__bar {
    height: 9px;
    margin-top: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--nf-lime-100);
}

.ranking-row__bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--nf-green);
}

.branch-card__header {
    align-items: center;
    background: linear-gradient(90deg, rgba(180, 208, 89, 0.14), rgba(180, 208, 89, 0));
}

.branch-card__heading {
    display: flex;
    min-width: 220px;
    flex-direction: column;
    justify-content: center;
}

.branch-totals {
    display: grid;
    grid-template-columns: repeat(3, minmax(130px, 1fr));
    gap: 10px;
    align-items: stretch;
    min-width: min(100%, 820px);
}

.branch-total {
    display: grid;
    min-height: 106px;
    grid-template-rows: auto auto auto;
    row-gap: 2px;
    border: 1px solid rgba(0, 73, 55, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.74);
    padding: 10px 12px;
    text-align: right;
}

.branch-total > span,
.branch-total--double > div:first-child > span {
    display: block;
    color: var(--nf-muted);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.branch-total strong {
    display: block;
    margin-top: 5px;
    color: var(--nf-green);
    font-size: clamp(1.08rem, 1.4vw, 1.28rem);
    line-height: 1.05;
}

.branch-total small {
    display: block;
    align-self: start;
    color: var(--nf-muted);
    font-size: 0.68rem;
    font-weight: 400;
    line-height: 1.18;
}

.branch-total small span {
    display: block;
    font-weight: 300;
    text-transform: none;
}

.branch-total small .branch-growth {
    margin-top: 3px;
    font-size: 0.66rem;
    font-weight: 800;
    line-height: 1.15;
}

.branch-growth--positive {
    color: var(--nf-green);
}

.branch-growth--negative {
    color: #a33b3b;
}

.branch-growth--neutral,
.branch-growth--muted {
    color: var(--nf-muted);
}

.branch-total--double {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(92px, 0.72fr);
    gap: 8px;
    align-items: center;
}

.branch-total--double > div:first-child {
    display: grid;
    grid-template-rows: auto auto auto;
}

.branch-total--double small .branch-growth {
    margin-top: 10px;
}

.branch-total--double > div:first-child strong {
    align-self: auto;
}

.branch-total__gauge {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-left: 1px solid var(--nf-border);
    padding-left: 8px;
}

.branch-total__gauge .gauge-wrap {
    min-width: 88px;
}

.branch-total__gauge .gauge-svg {
    width: 90px;
    height: 54px;
}

.branch-total__gauge .gauge-wrap strong {
    margin-top: -22px;
    font-size: 0.92rem;
}

.branch-total__gauge .gauge-wrap span {
    max-width: 88px;
    font-size: 0.64rem;
    line-height: 1.15;
}

.gauge-wrap {
    display: grid;
    min-width: 108px;
    justify-items: center;
}

.gauge-svg {
    width: 104px;
    height: 62px;
}

.gauge-track,
.gauge-value {
    fill: none;
    stroke-linecap: butt;
    stroke-width: 24;
}

.gauge-track {
    stroke: var(--nf-lime-100);
}

.gauge-value {
    stroke: var(--nf-green);
}

.gauge-target {
    stroke: #526b61;
    stroke-linecap: butt;
    stroke-width: 3.5;
}

.gauge-wrap strong {
    margin-top: -24px;
    color: var(--nf-green);
    font-size: 1.08rem;
    font-weight: 800;
}

.gauge-wrap span {
    margin-top: 5px;
    color: var(--nf-muted);
    font-size: 0.58rem;
    font-weight: 300;
    line-height: 1.2;
}

.gauge-wrap .gauge-expected b {
    white-space: nowrap;
    font: inherit;
    font-weight: inherit;
}

.table-wrap {
    padding: 0;
}

.table {
    margin: 0;
    color: var(--nf-ink);
}

.table thead th {
    border-bottom: 1px solid var(--nf-border);
    background: #fbfcf7;
    color: var(--nf-green);
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
}

.table tbody td {
    border-color: #edf1e8;
    padding: 0.92rem 1rem;
    vertical-align: middle;
}

.table-hover tbody tr:hover {
    background-color: rgba(180, 208, 89, 0.1);
}

.seller-row {
    cursor: pointer;
}

.seller-row--disabled {
    cursor: default;
    opacity: 0.68;
}

.seller-row:focus-visible {
    outline: 3px solid rgba(180, 208, 89, 0.62);
    outline-offset: -3px;
}

.value-strong {
    color: var(--nf-green);
    font-weight: 800;
}

.table-meta {
    display: block;
    margin-top: 3px;
    color: var(--nf-muted);
    font-size: 0.72rem;
    font-weight: 650;
}

.seller-identity {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    line-height: 1.25;
}

.seller-name {
    display: block;
}

.seller-role {
    display: block;
    width: 100%;
    margin-top: 2px;
    color: var(--nf-muted);
    font-size: 0.72rem;
    font-weight: 700;
}

.alert-nath {
    border: 1px solid rgba(153, 23, 23, 0.2);
    border-left: 8px solid #b42318;
    border-radius: 8px;
    background: #fff6f5;
    color: #8a1f17;
    font-weight: 650;
}

body.modal-open {
    overflow: hidden;
}

.goals-overlay {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: grid;
    place-items: stretch end;
    background: rgba(0, 36, 27, 0.46);
}

.goals-dialog {
    display: grid;
    grid-template-rows: auto 1fr auto;
    width: min(100%, 980px);
    height: 100vh;
    background: var(--nf-cream);
    box-shadow: -24px 0 60px rgba(0, 35, 26, 0.24);
}

.goals-dialog__header,
.goals-dialog__footer {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--nf-border);
    background: #ffffff;
    padding: 18px 22px;
}

.goals-dialog__footer {
    border-top: 1px solid var(--nf-border);
    border-bottom: 0;
    justify-content: flex-end;
}

.goals-dialog__body {
    overflow: auto;
    padding: 18px;
}

.date-warning-overlay {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: grid;
    place-items: center;
    background: rgba(0, 36, 27, 0.5);
    padding: 18px;
}

.date-warning-dialog {
    width: min(100%, 520px);
    overflow: hidden;
    border: 1px solid rgba(180, 208, 89, 0.38);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(0, 35, 26, 0.28);
}

.date-warning-dialog__header,
.date-warning-dialog__footer {
    padding: 18px 20px;
}

.date-warning-dialog__header {
    border-bottom: 1px solid var(--nf-border);
    background: linear-gradient(90deg, rgba(180, 208, 89, 0.18), rgba(180, 208, 89, 0));
}

.date-warning-dialog__header h2 {
    margin: 3px 0 0;
    color: var(--nf-green);
    font-size: 1.18rem;
    font-weight: 800;
}

.date-warning-dialog__body {
    padding: 20px;
}

.date-warning-dialog__body p {
    margin: 0;
    color: var(--nf-ink);
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.55;
}

.date-warning-dialog__footer {
    display: flex;
    justify-content: flex-end;
    border-top: 1px solid var(--nf-border);
    background: #fbfcf7;
}

.notes-overlay {
    position: fixed;
    inset: 0;
    z-index: 1120;
    display: grid;
    place-items: center;
    background: rgba(0, 36, 27, 0.52);
    padding: 18px;
}

.notes-dialog {
    display: grid;
    grid-template-rows: auto 1fr;
    width: min(100%, 720px);
    max-height: min(92vh, 760px);
    overflow: hidden;
    border: 1px solid rgba(180, 208, 89, 0.38);
    border-radius: 8px;
    background: var(--nf-cream);
    box-shadow: 0 28px 80px rgba(0, 35, 26, 0.28);
}

.notes-dialog__header {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--nf-border);
    background: #ffffff;
    padding: 18px 20px;
}

.notes-dialog__body {
    overflow: auto;
    padding: 18px;
}

.notes-list {
    display: grid;
    gap: 10px;
    margin-bottom: 16px;
}

.notes-empty,
.note-item,
.notes-form {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
}

.notes-empty {
    color: var(--nf-muted);
    font-weight: 650;
    padding: 18px;
    text-align: center;
}

.note-item {
    overflow: hidden;
}

.note-item__summary {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(120px, 0.9fr) minmax(180px, 1.45fr) minmax(130px, 0.85fr) auto;
    gap: 12px;
    align-items: center;
    border: 0;
    background: #ffffff;
    color: var(--nf-ink);
    cursor: pointer;
    font: inherit;
    padding: 12px 14px;
    text-align: left;
}

.note-item__summary:hover,
.note-item__summary:focus {
    background: var(--nf-lime-100);
    outline: none;
}

.note-item.is-open .note-item__summary {
    border-bottom: 1px solid var(--nf-border);
    background: #fbfcf7;
}

.note-item__sender,
.note-item__subject,
.note-item__date,
.note-item__module {
    min-width: 0;
}

.note-item__sender,
.note-item__subject {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.note-item__sender {
    color: var(--nf-green);
    font-size: 0.88rem;
    font-weight: 800;
}

.note-item__subject {
    font-size: 0.94rem;
    font-weight: 650;
}

.note-item__date {
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-align: right;
}

.note-item__module {
    justify-self: end;
    border-radius: 999px;
    background: var(--nf-lime-100);
    color: var(--nf-green);
    font-size: 0.72rem;
    font-weight: 800;
    padding: 4px 9px;
    text-transform: uppercase;
}

.note-item__body {
    padding: 14px;
}

.note-item__body p {
    margin: 0;
    color: var(--nf-ink);
    font-size: 0.94rem;
    font-weight: 500;
    line-height: 1.5;
    white-space: normal;
}

.note-item__actions,
.notes-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 12px;
}

.note-link-button,
.note-delete-button {
    min-height: 36px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font-weight: 800;
}

.note-link-button {
    padding: 0 12px;
}

.note-delete-button {
    display: grid;
    width: 38px;
    place-items: center;
    padding: 0;
}

.note-delete-button img {
    width: 20px;
    height: 20px;
}

.note-link-button:hover,
.note-link-button:focus,
.note-delete-button:hover,
.note-delete-button:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.notes-form {
    display: grid;
    gap: 10px;
    padding: 14px;
}

.notes-form input,
.notes-form textarea {
    width: 100%;
}

.notes-form textarea {
    min-height: 132px;
    resize: vertical;
}

.goals-period {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(140px, 220px) minmax(180px, 220px);
    gap: 14px;
    align-items: end;
    margin-bottom: 16px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    padding: 16px 18px;
    box-shadow: var(--nf-shadow);
}

.goals-period label {
    display: grid;
    gap: 6px;
}

.goals-period span {
    color: var(--nf-green);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.goals-period .form-select {
    min-height: 46px;
    border-color: var(--nf-border);
    border-radius: 8px;
    color: var(--nf-green);
    font-weight: 800;
}

.period-copy-button {
    min-height: 46px;
}

.config-tabs {
    display: flex;
    gap: 8px;
    border-bottom: 1px solid var(--nf-border);
    background: #ffffff;
    padding: 0 22px 14px;
}

.config-tab {
    min-height: 38px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font-weight: 800;
    padding: 0 16px;
}

.config-tab.is-active {
    border-color: var(--nf-green);
    background: var(--nf-green);
    color: #ffffff;
}

.goals-close {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1;
}

.goals-close:hover,
.goals-close:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.goals-branch {
    overflow: hidden;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: var(--nf-shadow);
}

.goals-branch + .goals-branch {
    margin-top: 16px;
}

.goals-branch__header {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--nf-border);
    background: linear-gradient(90deg, rgba(180, 208, 89, 0.16), rgba(180, 208, 89, 0));
    padding: 16px 18px;
}

.config-note-button {
    display: grid;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    place-items: center;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    padding: 0;
}

.config-note-button img {
    width: 22px;
    height: 22px;
}

.config-note-button:hover,
.config-note-button:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.goals-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(260px, 1fr));
    gap: 16px;
    padding: 16px 18px;
}

.goals-fields__group {
    display: grid;
    gap: 12px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    padding: 14px;
}

.goals-fields__group h4 {
    margin: 0;
    color: var(--nf-green);
    font-size: 0.86rem;
    font-weight: 800;
    text-transform: uppercase;
}

.goals-fields label {
    display: grid;
    gap: 6px;
}

.goals-fields span {
    color: var(--nf-green);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.team-branch__header {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: space-between;
}

.team-add {
    display: grid;
    width: min(100%, 410px);
    flex: 0 0 410px;
    grid-template-columns: 44px 44px minmax(190px, 1fr);
    gap: 8px 10px;
    align-items: center;
    justify-content: end;
}

.team-add .form-select,
.team-add-button {
    min-height: 44px;
    border-color: var(--nf-border);
    border-radius: 8px;
    color: var(--nf-green);
    font-weight: 750;
}

.team-add-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--nf-border);
    background: #ffffff;
    padding: 0 14px;
    white-space: nowrap;
}

.team-add .form-select {
    grid-column: 1 / -1;
}

.team-add-button:hover,
.team-add-button:focus {
    outline: 0;
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.team-add .config-note-button:focus,
.team-leader-menu-button:focus {
    outline: 0;
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.team-add-button:focus-visible,
.team-leader-menu-button:focus-visible,
.team-add .config-note-button:focus-visible {
    outline: 0;
    border-color: var(--nf-green);
    box-shadow: 0 0 0 3px rgba(180, 208, 89, 0.34);
}

.team-leader-menu-button {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    padding: 0;
}

.team-leader-menu-button img {
    width: 24px;
    height: 24px;
}

.team-leader-menu-button:hover,
.team-leader-menu-button:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.team-leader-menu-button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.team-list {
    display: grid;
    gap: 8px;
    padding: 16px 18px;
}

.team-seller {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    padding: 10px 12px;
}

.team-seller > div,
.team-seller-main {
    min-width: 0;
}

.team-seller strong,
.team-seller span,
.team-seller em,
.team-seller small {
    display: block;
}

.team-seller strong {
    color: var(--nf-green);
    font-size: 0.92rem;
}

.team-seller em,
.team-seller small,
.team-empty {
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 600;
}

.team-seller em {
    font-style: normal;
    margin-top: 2px;
}

.team-seller small {
    margin-top: 4px;
    line-height: 1.35;
}

.team-seller-main {
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    text-align: left;
}

.team-seller-main:hover strong,
.team-seller-main:focus strong {
    text-decoration: underline;
}

.team-seller-main:focus-visible {
    outline: 3px solid rgba(180, 208, 89, 0.34);
    outline-offset: 4px;
    border-radius: 6px;
}

.team-seller__remove {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1;
}

.team-seller__remove:hover,
.team-seller__remove:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.team-seller.is-expanded {
    align-items: start;
}

.team-seller-goals {
    display: grid;
    grid-column: 1 / -1;
    gap: 12px;
    border-top: 1px solid var(--nf-border);
    margin-top: 4px;
    padding-top: 12px;
}

.team-seller-goals__header strong {
    font-size: 0.82rem;
    text-transform: uppercase;
}

.team-seller-goals__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(140px, 1fr));
    gap: 12px;
}

.team-seller-goals label {
    display: grid;
    gap: 6px;
}

.team-seller-goals label span {
    color: var(--nf-green);
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
}

.team-goals-reset {
    justify-self: start;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--nf-green);
    font-weight: 800;
    padding: 9px 12px;
}

.team-goals-reset:hover,
.team-goals-reset:focus {
    border-color: var(--nf-green);
    background: var(--nf-lime-100);
}

.team-seller.is-leader {
    border-color: rgba(180, 208, 89, 0.9);
    background: #fbfcf0;
}

.team-seller.is-leader strong {
    color: var(--nf-green);
}

.analysis-wrap {
    display: grid;
    gap: 18px;
}

.analysis-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: -18px;
}

.export-actions {
    position: relative;
    display: flex;
    justify-content: flex-end;
}

.export-button {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(0, 73, 55, 0.28);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 22px rgba(0, 73, 55, 0.08);
    transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.export-button:hover,
.export-button:focus {
    border-color: rgba(0, 73, 55, 0.5);
    background: #fbfcf7;
    transform: translateY(-1px);
}

.export-button:focus-visible {
    outline: 3px solid rgba(180, 208, 89, 0.62);
    outline-offset: 3px;
}

.export-button:disabled {
    cursor: wait;
    opacity: 0.68;
}

.export-button img {
    width: 22px;
    height: 22px;
    filter: invert(21%) sepia(25%) saturate(1666%) hue-rotate(122deg) brightness(91%) contrast(102%);
}

.export-button.is-loading img {
    opacity: 0.48;
}

.export-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 20;
    display: grid;
    min-width: 160px;
    overflow: hidden;
    border: 1px solid rgba(0, 73, 55, 0.16);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 18px 42px rgba(0, 73, 55, 0.16);
}

.export-menu button {
    border: 0;
    background: transparent;
    color: var(--nf-green);
    padding: 11px 14px;
    text-align: left;
    font-size: 0.84rem;
    font-weight: 700;
}

.export-menu button:hover,
.export-menu button:focus {
    background: #fbfcf7;
}

.empty-analysis,
.analysis-hero,
.analysis-panel,
.analysis-section {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: var(--nf-shadow);
}

.empty-analysis {
    padding: 34px;
    text-align: center;
}

.empty-analysis h2 {
    color: var(--nf-green);
    font-size: 1.45rem;
    font-weight: 800;
}

.empty-analysis p {
    margin: 8px 0 0;
    color: var(--nf-muted);
    font-weight: 600;
}

.analysis-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 24px;
}

.analysis-hero h2 {
    margin: 4px 0 4px;
    color: var(--nf-green);
    font-size: clamp(1.8rem, 3vw, 2.85rem);
    font-weight: 800;
}

.analysis-hero p {
    margin: 0;
    color: var(--nf-muted);
    font-weight: 700;
}

.analysis-hero__totals {
    display: grid;
    grid-template-columns: repeat(3, minmax(170px, 1fr));
    gap: 12px;
    min-width: min(100%, 660px);
}

.analysis-hero__totals div,
.analysis-metric {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    padding: 14px;
}

.analysis-hero__totals span,
.analysis-metric span,
.analysis-metric small {
    display: block;
}

.analysis-hero__totals span,
.analysis-metric span {
    color: var(--nf-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.analysis-hero__totals strong {
    display: block;
    margin-top: 4px;
    color: var(--nf-green);
    font-size: 1.08rem;
    font-weight: 800;
    text-align: right;
}

.analysis-hero__totals small {
    display: block;
    margin-top: 6px;
    color: var(--nf-muted);
    font-size: 0.72rem;
    font-weight: 400;
    text-align: right;
}

.analysis-hero__totals strong span {
    display: block;
}

.analysis-total-value {
    font-size: 1.42rem !important;
}

.analysis-period-value,
.analysis-period-value span {
    font-weight: 600 !important;
}

.analysis-period-value .analysis-period-days {
    margin-top: 6px;
    color: var(--nf-muted);
    font-size: 0.72rem;
    font-weight: 400 !important;
    text-transform: none;
}

.analysis-gauges {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.analysis-gauges--with-daily {
    align-items: stretch;
}

.analysis-gauges--with-daily > .analysis-panel {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    min-height: 440px;
}

.analysis-side-panels {
    display: grid;
    min-height: 440px;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.analysis-panel {
    padding: 22px;
}

.analysis-panel--compact,
.analysis-panel--daily {
    min-height: 0;
}

.analysis-panel--compact {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    padding: 18px 20px;
}

.analysis-panel--daily {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    padding: 18px 20px 16px;
}

.daily-panel__header {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 10px;
}

.analysis-panel h3 {
    margin: 4px 0 16px;
    color: var(--nf-green);
    font-size: 1.04rem;
    font-weight: 800;
}

.analysis-panel--compact h3,
.analysis-panel--daily h3 {
    margin-bottom: 10px;
}

.analysis-panel--daily h3 {
    margin: 0;
}

.daily-panel__average {
    color: var(--nf-muted);
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.25;
    max-width: 58%;
    padding-top: 2px;
    text-align: right;
    text-transform: uppercase;
}

.analysis-panel--compact h3 {
    font-size: 0.9rem;
}

.analysis-gauge {
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 4px;
    width: 100%;
}

#gauge_meta_total {
    display: grid;
    min-height: 0;
    height: 100%;
}

#gauge_meta_total .analysis-gauge {
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    align-content: stretch;
    padding: 0 6px;
}

.analysis-gauge__visual {
    position: relative;
    display: grid;
    width: 100%;
    height: 100%;
    justify-items: center;
    align-items: end;
}

.analysis-gauge svg,
.analysis-gauge__visual svg {
    width: min(100%, 230px);
    height: auto;
}

#gauge_meta_total .analysis-gauge__visual svg {
    align-self: stretch;
    justify-self: center;
    width: min(100%, 620px);
    height: 100%;
}

.analysis-gauge__track,
.analysis-gauge__value {
    fill: none;
    stroke-linecap: butt;
    stroke-width: 20;
}

.analysis-gauge__track {
    stroke: var(--nf-lime-100);
}

.analysis-gauge__value {
    stroke: var(--nf-green);
}

.analysis-gauge__target {
    stroke: #526b61;
    stroke-linecap: butt;
    stroke-width: 2.2;
}

.analysis-gauge__label {
    position: absolute;
    left: 50%;
    bottom: clamp(18px, 8%, 34px);
    display: grid;
    gap: 4px;
    width: min(76%, 360px);
    transform: translateX(-50%);
    justify-items: center;
    text-align: center;
}

.analysis-gauge strong {
    color: var(--nf-green);
    font-size: 1.65rem;
    font-weight: 800;
}

#gauge_meta_total .analysis-gauge strong {
    font-size: 2rem;
}

.analysis-gauge span {
    color: var(--nf-muted);
    font-size: 0.82rem;
    font-weight: 700;
    text-align: center;
}

.analysis-gauge small {
    display: block;
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 500;
    text-align: center;
}

.participation-stack {
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 42px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: var(--nf-lime-100);
}

#participacao_filiais,
#participacao_equipe {
    display: grid;
    min-height: 0;
    align-content: center;
    gap: 12px;
}

.participation-segment {
    min-width: 3px;
    border-right: 1px solid rgba(255, 255, 255, 0.82);
    background: #c8d98a;
    opacity: 0.5;
    transition: opacity 160ms ease, box-shadow 160ms ease;
}

.participation-segment:nth-child(3n + 1) {
    background: #dce8ab;
}

.participation-segment:nth-child(3n + 2) {
    background: #b9cf67;
}

.participation-segment:nth-child(3n + 3) {
    background: #91aa4e;
}

.participation-segment.is-selected {
    background: var(--nf-green);
    opacity: 1;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.72);
}

.participation-segment:hover,
.participation-segment:focus {
    opacity: 1;
}

.participation-summary {
    display: grid;
    gap: 2px;
}

.participation-summary small,
.participation-empty {
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.participation-summary strong {
    color: var(--nf-green);
    font-size: 0.94rem;
    font-weight: 800;
    line-height: 1.2;
}

.daily-chart {
    height: 166px;
    min-height: 0;
}

.daily-chart .js-plotly-plot,
.daily-chart .plot-container,
.daily-chart .svg-container {
    width: 100% !important;
    height: 100% !important;
}

.daily-chart__fallback {
    display: grid;
    min-height: 150px;
    align-items: stretch;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    padding: 8px;
}

.daily-chart__svg {
    width: 100%;
    min-height: 140px;
}

.daily-chart__bar {
    fill: var(--nf-green);
    stroke: var(--nf-lime);
    stroke-width: 0.8;
}

.participation-empty {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    padding: 18px;
    text-align: center;
}

.analysis-sections {
    display: grid;
    gap: 18px;
}

.analysis-section {
    padding: 20px;
}

.analysis-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.analysis-metric {
    min-height: 122px;
}

.analysis-metric.is-clickable {
    cursor: pointer;
    transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
}

.analysis-hero__totals div.is-clickable,
.analysis-panel.is-clickable {
    cursor: pointer;
    transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.analysis-metric.is-clickable:hover,
.analysis-metric.is-clickable:focus,
.analysis-hero__totals div.is-clickable:hover,
.analysis-hero__totals div.is-clickable:focus,
.analysis-panel.is-clickable:hover,
.analysis-panel.is-clickable:focus {
    border-color: rgba(0, 73, 55, 0.42);
    background: #ffffff;
    transform: translateY(-1px);
}

.analysis-metric.is-clickable:focus-visible,
.analysis-hero__totals div.is-clickable:focus-visible,
.analysis-panel.is-clickable:focus-visible {
    outline: 3px solid rgba(180, 208, 89, 0.62);
    outline-offset: 3px;
}

.analysis-metric strong {
    display: block;
    margin-top: 10px;
    color: var(--nf-green);
    font-size: 1.24rem;
    font-weight: 800;
    line-height: 1.15;
}

.analysis-metric small {
    margin-top: 10px;
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 600;
}

.analysis-metric.is-pending {
    background: #ffffff;
}

.analysis-metric.is-pending strong {
    color: var(--nf-muted);
    font-size: 0.98rem;
    font-weight: 700;
}

.trend-overlay {
    position: fixed;
    inset: 0;
    z-index: 1090;
    display: grid;
    place-items: center;
    background: rgba(7, 35, 28, 0.5);
    padding: 22px;
}

.trend-dialog {
    display: grid;
    width: min(100%, 980px);
    max-height: min(92vh, 760px);
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(0, 73, 55, 0.18);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(0, 73, 55, 0.24);
}

.trend-dialog__header {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--nf-border);
    background: #fbfcf7;
    padding: 18px 20px;
}

.trend-dialog__body {
    display: grid;
    gap: 12px;
    min-height: 0;
    padding: 18px 20px 20px;
}

.trend-status {
    color: var(--nf-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.trend-chart {
    min-height: 420px;
}

.trend-chart__fallback {
    display: grid;
    min-height: 420px;
    align-items: stretch;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    padding: 10px;
}

.trend-chart__svg {
    width: 100%;
    min-height: 390px;
}

.trend-chart__grid {
    stroke: #edf1e8;
    stroke-width: 1;
}

.trend-chart__axis {
    stroke: #dbe3d4;
    stroke-width: 1.5;
}

.trend-chart__line {
    fill: none;
    stroke: var(--nf-green);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 4;
}

.trend-chart__point circle {
    fill: var(--nf-lime);
    stroke: var(--nf-green);
    stroke-width: 2;
}

.trend-chart__label {
    fill: var(--nf-muted);
    font-family: "Montserrat", sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.app-footer {
    margin-top: 24px;
    border-top: 1px solid rgba(0, 73, 55, 0.14);
    background: rgba(255, 255, 255, 0.72);
}

.app-footer__inner {
    display: grid;
    width: min(100%, 1480px);
    margin: 0 auto;
    grid-template-columns: minmax(220px, .9fr) minmax(280px, 1.35fr) minmax(220px, .9fr) minmax(130px, 190px);
    gap: 22px;
    align-items: start;
    padding: 22px clamp(16px, 3vw, 40px);
}

.app-footer span {
    display: block;
    color: var(--nf-muted);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.app-footer strong {
    display: block;
    margin-top: 6px;
    color: var(--nf-green);
    font-size: 0.95rem;
    font-weight: 800;
}

.app-footer small,
.app-footer p {
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 500;
}

.app-footer small {
    display: block;
    margin-top: 4px;
    font-weight: 300;
}

.app-footer p {
    margin: 6px 0;
    line-height: 1.45;
}

.app-footer a {
    color: var(--nf-green);
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: none;
}

.app-footer a:hover,
.app-footer a:focus {
    color: var(--nf-green-700);
    text-decoration: underline;
}

.app-footer__map {
    display: grid;
    align-content: start;
    gap: 6px;
}

.app-footer__map a {
    font-weight: 300;
}

.app-footer__logo {
    display: block;
    justify-self: end;
    width: min(100%, 170px);
    height: auto;
}

.terms-wrap {
    display: grid;
    gap: 18px;
}

.terms-document {
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: var(--nf-shadow);
    padding: clamp(22px, 3vw, 42px);
}

.terms-document h2 {
    margin: 0 0 24px;
    color: var(--nf-green);
    font-size: clamp(1.55rem, 3vw, 2.2rem);
    font-weight: 800;
}

.terms-document section + section {
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid var(--nf-border);
}

.terms-document h3 {
    margin: 0 0 10px;
    color: var(--nf-green);
    font-size: 1rem;
    font-weight: 800;
}

.terms-document p,
.terms-document li {
    color: var(--nf-ink);
    font-size: 0.96rem;
    font-weight: 500;
    line-height: 1.68;
}

.terms-document p {
    margin: 0 0 10px;
}

.terms-document ul {
    margin: 8px 0 12px;
    padding-left: 22px;
}

.terms-document strong {
    color: var(--nf-green);
    font-weight: 800;
}

.login-page {
    min-height: 100vh;
    background:
        linear-gradient(90deg, rgba(0, 28, 22, 0.92), rgba(0, 73, 55, 0.68)),
        url("/static/img/login-background.png") center / cover no-repeat fixed;
    color: var(--nf-ink);
}

.login-shell {
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: clamp(18px, 4vw, 52px);
}

.login-card {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    width: min(100%, 1180px);
    min-height: 620px;
    overflow: hidden;
    border: 1px solid rgba(237, 245, 207, 0.28);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 30px 70px rgba(0, 24, 18, 0.34);
}

.login-card__brand {
    position: relative;
    display: grid;
    align-content: space-between;
    overflow: hidden;
    padding: clamp(28px, 4vw, 52px);
    background:
        linear-gradient(135deg, rgba(0, 73, 55, 0.96), rgba(0, 96, 73, 0.76)),
        url("/static/img/login-background.png") center / cover no-repeat;
    color: #ffffff;
}

.login-card__brand::before,
.login-card__brand::after {
    position: absolute;
    content: "";
    border: 1px solid rgba(237, 245, 207, 0.22);
    pointer-events: none;
}

.login-card__brand::before {
    inset: 24px auto auto 24px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
}

.login-card__brand::after {
    right: -80px;
    bottom: -96px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: rgba(180, 208, 89, 0.08);
}

.login-logo {
    position: relative;
    z-index: 1;
    width: min(100%, 260px);
    height: auto;
}

.login-card__brand-copy {
    position: relative;
    z-index: 1;
    max-width: 560px;
}

.login-card__brand-copy span,
.login-form__header span {
    color: var(--nf-lime);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.login-card__brand-copy h1 {
    margin: 10px 0 12px;
    color: #ffffff;
    font-size: clamp(2.35rem, 5vw, 4.2rem);
    font-weight: 800;
    line-height: 1;
}

.login-card__brand-copy p {
    max-width: 480px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: clamp(1rem, 1.5vw, 1.22rem);
    font-weight: 500;
    line-height: 1.5;
}

.login-card__form {
    display: grid;
    align-content: center;
    gap: 28px;
    padding: clamp(32px, 5vw, 70px);
    background: #ffffff;
}

.login-form__header h2 {
    margin: 8px 0;
    color: var(--nf-green);
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 800;
    line-height: 1;
}

.login-form__header p {
    margin: 0;
    color: var(--nf-muted);
    font-weight: 600;
    line-height: 1.48;
}

.login-form {
    display: grid;
    gap: 16px;
}

.login-field {
    display: grid;
    gap: 7px;
}

.login-field span {
    color: var(--nf-green);
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
}

.login-field input {
    width: 100%;
    min-height: 52px;
    border: 1px solid var(--nf-border);
    border-radius: 8px;
    background: #fbfcf7;
    color: var(--nf-ink);
    font: inherit;
    font-weight: 650;
    padding: 0 16px;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.login-field input::placeholder {
    color: rgba(102, 128, 119, 0.66);
    font-weight: 500;
}

.login-field input:focus {
    outline: 0;
    border-color: var(--nf-lime);
    background: #ffffff;
    box-shadow: 0 0 0 0.22rem rgba(180, 208, 89, 0.28);
}

.login-options {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    color: var(--nf-muted);
    font-size: 0.86rem;
    font-weight: 650;
}

.login-check {
    display: inline-flex;
    gap: 8px;
    align-items: center;
}

.login-check input {
    width: 16px;
    height: 16px;
    accent-color: var(--nf-green);
}

.login-options a,
.login-help-trigger,
.login-form__footer a {
    color: var(--nf-green);
    font-weight: 800;
    text-decoration: none;
}

.login-options a:hover,
.login-help-trigger:hover,
.login-form__footer a:hover {
    text-decoration: underline;
}

.login-help-trigger {
    border: 0;
    background: transparent;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.login-help-trigger:focus-visible {
    border-radius: 3px;
    outline: 2px solid var(--nf-lime);
    outline-offset: 3px;
}

.login-help-dialog {
    width: min(calc(100% - 32px), 480px);
    max-width: none;
    border: 0;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 28px 70px rgba(0, 36, 27, .32);
    padding: 0;
    color: var(--nf-ink);
}

.login-help-dialog::backdrop {
    background: rgba(0, 28, 22, .66);
    backdrop-filter: blur(2px);
}

.login-help-dialog__content {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 18px;
    padding: 28px;
}

.login-help-dialog__icon {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: 50%;
    background: var(--nf-lime-100);
    color: var(--nf-green);
    font-size: 1.35rem;
    font-weight: 800;
}

.login-help-dialog__content span {
    color: #d87522;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.login-help-dialog__content h2 {
    margin: 6px 0 10px;
    color: var(--nf-green);
    font-size: 1.35rem;
}

.login-help-dialog__content p {
    margin: 0;
    color: var(--nf-muted);
    font-size: .9rem;
    font-weight: 550;
    line-height: 1.6;
}

.login-help-dialog__content p a {
    color: var(--nf-green);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.login-help-dialog__close {
    grid-column: 2;
    justify-self: end;
    min-width: 104px;
    border: 0;
    border-radius: 8px;
    background: var(--nf-green);
    padding: 10px 18px;
    color: #fff;
    font: inherit;
    font-size: .82rem;
    font-weight: 800;
    cursor: pointer;
}

.login-help-dialog__close:hover,
.login-help-dialog__close:focus-visible {
    background: var(--nf-green-700);
    outline: 3px solid rgba(180, 208, 89, .35);
}

.login-submit {
    min-height: 52px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--nf-green), var(--nf-green-700));
    color: #ffffff;
    font: inherit;
    font-size: 1rem;
    font-weight: 800;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.login-submit:hover,
.login-submit:focus {
    box-shadow: 0 14px 30px rgba(0, 73, 55, 0.24);
    transform: translateY(-1px);
}

.login-form__footer {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    border-top: 1px solid var(--nf-border);
    padding-top: 18px;
    color: var(--nf-muted);
    font-size: 0.78rem;
    font-weight: 600;
}

@media (max-width: 991px) {
    .brand-header__inner,
    .filter-grid,
    .metrics-grid,
    .branch-totals,
    .goals-period,
    .goals-fields,
    .team-seller-goals__grid,
    .analysis-gauges,
    .analysis-side-panels,
    .analysis-grid,
    .app-footer__inner {
        grid-template-columns: 1fr;
    }

    .filter-panel {
        margin-top: -28px;
    }

    .panel-header,
    .branch-card__header {
        flex-direction: column;
        align-items: stretch;
    }

    .branch-total {
        text-align: left;
    }

    .ranking-control {
        width: 100%;
    }

    .settings-button {
        justify-self: start;
    }

    .config-tabs,
    .team-branch__header {
        flex-direction: column;
        align-items: stretch;
    }

    .team-add {
        width: 100%;
        flex: 1 1 auto;
        min-width: 0;
        grid-template-columns: 44px 44px minmax(0, 1fr);
    }

    .team-add-button {
        min-width: 0;
    }

    .notes-dialog {
        width: min(100%, 640px);
    }

    .app-footer__logo {
        justify-self: start;
        width: min(100%, 150px);
    }

    .analysis-actions {
        margin-top: -28px;
    }

    .analysis-hero {
        flex-direction: column;
        align-items: stretch;
    }

    .analysis-hero__totals {
        grid-template-columns: 1fr;
        min-width: 0;
    }

    .analysis-gauges--with-daily > .analysis-panel,
    .analysis-side-panels {
        min-height: 0;
    }

    .analysis-side-panels {
        grid-template-rows: auto auto;
    }

    .login-card {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .login-card__brand {
        min-height: 300px;
    }

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

    .products-filter-grid,
    .products-losses-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .products-losses-filter-actions {
        grid-column: span 2;
    }

    .products-update-button {
        grid-column: span 2;
    }

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

@media (max-width: 575px) {
    .brand-header__inner {
        padding: 22px 16px 50px;
    }

    .header-settings { top: 22px; right: 64px; transform: none; }
    .user-profile { top: 22px; right: 16px; transform: none; }
    .user-profile__trigger { width: 40px; height: 40px; }
    .user-profile__menu { width: min(300px, calc(100vw - 32px)); }

    .content-wrap {
        padding-inline: 12px;
    }

    .portal-menu-grid {
        grid-template-columns: 1fr;
    }

    .portal-menu-card {
        min-height: 210px;
        padding: 20px;
    }

    .products-filter-grid,
    .products-losses-filter-grid,
    .products-summary-grid {
        grid-template-columns: 1fr;
    }

    .products-losses-filter-actions {
        grid-column: auto;
    }

    .products-update-button {
        grid-column: auto;
    }

    .products-toolbar,
    .products-panel__header {
        align-items: stretch;
        flex-direction: column;
    }

    .products-panel__tools {
        align-items: stretch;
        flex-direction: column;
    }

    .products-search-panel {
        justify-content: stretch;
    }

    .products-search-control {
        width: 100%;
    }

    .products-panel__header p {
        text-align: left;
    }

    .products-module-tabs button {
        flex: 1 1 0;
        min-width: 0;
    }

    .products-losses-table-wrap {
        overflow-x: auto;
    }

    .products-losses-table {
        min-width: 860px;
    }

    .metric-card {
        min-height: 132px;
    }

    .metric-card--total {
        grid-template-columns: 1fr;
    }

    .metric-card__gauge {
        justify-content: flex-start;
        border-left: 0;
        border-top: 1px solid var(--nf-border);
        padding-top: 12px;
        padding-left: 0;
    }

    .table tbody td,
    .table thead th {
        padding-inline: 0.72rem;
    }

    .analysis-hero,
    .analysis-panel,
    .analysis-section,
    .empty-analysis {
        padding: 16px;
    }

    .notes-overlay {
        padding: 10px;
    }

    .notes-dialog {
        max-height: 94vh;
    }

    .note-item__summary {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .note-item__date {
        text-align: left;
    }

    .note-item__module {
        justify-self: start;
    }

    .notes-actions,
    .note-item__actions {
        justify-content: stretch;
    }

    .notes-actions .btn,
    .note-link-button {
        flex: 1;
    }

    .login-shell {
        padding: 12px;
    }

    .login-card__brand,
    .login-card__form {
        padding: 24px;
    }

    .login-options,
    .login-form__footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .login-help-dialog__content {
        grid-template-columns: 1fr;
        padding: 22px;
    }

    .login-help-dialog__close {
        grid-column: 1;
        width: 100%;
    }
}