/* Componentes globais: blocos de estilo que eram repetidos em vários CSS de tela.
   Carregado antes de todos os CSS de tela (main.tsx). Cores e raios só por tokens de theme.css.
   Um bloco novo que repita o aspecto de um daqui entra na lista de seletores da regra existente, nunca numa cópia. */

/* Botões e ações */
.inventory-product-search {
   display: flex;
   align-items: center;
   gap: 8px
}

.profile-list-title>span,
.stock-list-actions>span {
   font-size: 9px;
   color: var(--text-faint);
   background: var(--surface-2);
   padding: 4px 7px;
   border-radius: var(--radius-sm)
}

.address-remove,
.danger-link {
   margin-right: auto;
   display: flex;
   align-items: center;
   gap: 6px;
   border: 0;
   background: none;
   color: var(--danger-text);
   font-size: 10px;
   padding-left: 0;
   padding-right: 0
}

.address-danger,
.danger-button {
   display: flex;
   align-items: center;
   gap: 6px;
   border: 0;
   background: var(--danger);
   color: var(--on-fill);
   font-weight: 600
}

.address-action:hover:not(:disabled),
.inventory-action:hover:not(:disabled),
.apartment-barcode-print:hover:not(:disabled) {
   border-color: var(--blue);
   color: var(--blue);
   background: var(--primary-faint)
}

.reservation-search,
.kardex-search {
   display: grid;
   place-items: center;
   border: 0;
   background: none;
   color: var(--text-muted);
   cursor: pointer;
   padding: 0 2px
}

.reservation-chip button,
.kardex-chip button {
   display: grid;
   place-items: center;
   border: 0;
   background: none;
   color: var(--text-muted);
   cursor: pointer
}

.putaway-destination-actions,
.supply-actions,
.work-area-actions {
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
   margin-top: 10px
}

/* Confirmações */
.address-confirm,
.confirm-box {
   margin-top: 18px;
   padding: 14px;
   border-radius: var(--radius-lg);
   border: 1px solid var(--danger-border);
   background: var(--danger-faint)
}

.address-confirm strong,
.confirm-box strong {
   display: block;
   font-size: 11px;
   color: var(--danger-text)
}

.address-confirm p,
.confirm-box p {
   font-size: 10px;
   line-height: 1.6;
   color: var(--danger-text);
   margin: 6px 0 12px
}

.address-confirm div,
.confirm-box div {
   display: flex;
   justify-content: flex-end;
   align-items: center;
   gap: 16px
}

/* Grades e tabelas */
.inventory-grid input[type=checkbox],
.receiving-grid input[type=checkbox] {
   width: 14px;
   height: 14px;
   margin: 0;
   vertical-align: middle
}

.inventory-count-banner small,
.inventory-sheet-meta,
.stock-grid td small {
   display: block;
   font-size: 9px;
   color: var(--text-faint);
   margin-top: 4px
}

.stock-rows-grid td>span:not(.stock-operational),
.stock-rows-grid td>strong,
.stock-rows-grid td>small,
.reservation-total small,
.reservation-total strong,
.reservation-total span,
.reservation-grid td>span,
.reservation-grid td>small,
.reservation-grid td>strong,
.kardex-grid td>span,
.kardex-grid td>small,
.kardex-grid td>strong {
   display: block;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap
}

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

.stock-grid.receiving-grid td small,
.stock-grid.putaway-grid td small,
.stock-grid.picking-grid td small,
.returns-key small {
   display: block;
   font-size: 9px;
   color: var(--text-faint);
   margin-top: 3px
}

/* Chips, níveis e legendas */
.dashboard-date i {
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background: var(--success)
}

.occupancy-legend>span,
.dashboard-footer>span {
   display: flex;
   align-items: center;
   gap: 7px
}

.compact-level,
.tree-level {
   flex-shrink: 0;
   padding: 3px 6px;
   border-radius: var(--radius-sm);
   font-size: 8px;
   letter-spacing: .4px;
   text-transform: uppercase;
   background: var(--surface-3);
   color: var(--text-2)
}

.compact-group em,
.tree-label em {
   margin-left: auto;
   font-style: normal;
   font-size: 8px;
   color: var(--text-faint);
   background: var(--surface-2);
   padding: 2px 6px;
   border-radius: var(--radius-sm)
}

.reservation-chip,
.kardex-chip {
   display: flex;
   align-items: center;
   gap: 8px;
   min-width: 0;
   padding: 6px 8px;
   border: 1px solid var(--primary-border);
   background: var(--primary-faint);
   border-radius: var(--radius-lg)
}

.reservation-chip .compact-title,
.kardex-chip .compact-title {
   flex: 1;
   min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   font-size: 10px;
   color: var(--text-2)
}

/* Layout e filtros */
.chart-legend span,
.users-warehouse-filter label,
.address-warehouse-field label,
.product-warehouse-field label,
.stock-warehouse-field label,
.reservation-warehouse-field label,
.branch-warehouse-filter label,
.kardex-warehouse-field label {
   display: flex;
   align-items: center;
   gap: 5px
}

.profile-form-title>div,
.reservation-detail .profile-form-title>div,
.receiving-title-actions {
   display: flex;
   align-items: center;
   gap: 10px
}

.user-field label,
.catalog-label {
   display: block;
   color: var(--text-2);
   font-size: 10px;
   margin-bottom: 9px
}

.product-local-scope,
.configuration-scope {
   display: flex;
   align-items: center;
   gap: 6px;
   font-size: 10px;
   color: var(--text-muted);
   margin: -12px 0 16px
}

.product-master,
.receiving-fieldset {
   border: 0;
   padding: 0;
   margin: 0;
   min-width: 0
}

.reservations-layout,
.kardex-layout {
   display: grid;
   grid-template-columns: minmax(270px, 290px) minmax(0, 1fr);
   gap: 22px;
   align-items: start
}

.reservation-period,
.kardex-period {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 10px
}

.reservation-more,
.kardex-more {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 10px;
   flex-wrap: wrap
}

.profile-list-actions,
.integration-key>div:last-child {
   display: flex;
   justify-content: flex-end;
   margin-top: 10px
}

.orders-page .compact-list .compact-chip,
.warehouse-requests-page .compact-list .compact-chip,
.carriers-page .compact-list .compact-chip,
.outbound-page .compact-list .compact-chip,
.loads-page .compact-list .compact-chip,
.loading-page .compact-list .compact-chip {
   max-width: 100%;
   min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap
}

/* Textos e blocos auxiliares */
.profile-row span:not(.profile-avatar),
.profile-row small {
   display: block;
   font-size: 8px;
   color: var(--text-faint);
   margin-top: 5px
}

.address-form .profile-form-footer .profile-cancel,
.inventory-section .profile-list-title h2 {
   display: flex;
   align-items: center;
   gap: 6px
}

.inventory-kinds,
.inventory-summary {
   display: flex;
   flex-wrap: wrap;
   gap: 6px;
   margin-bottom: 12px
}

.inventory-progress-card small,
.stock-selection small {
   display: block;
   font-size: 9px;
   color: var(--text-muted)
}

.inventory-history,
.receiving-history,
.returns-quantities {
   list-style: none;
   margin: 0;
   padding: 0;
   display: grid;
   gap: 8px
}

.inventory-history span,
.inventory-history small,
.receiving-history small {
   display: block;
   font-size: 9px;
   color: var(--text-faint);
   margin-top: 3px;
   overflow-wrap: anywhere
}

.product-address-hint svg,
.product-barcode-hint svg {
   flex-shrink: 0;
   margin-top: 2px;
   color: var(--primary-text)
}

.reservation-products,
.reservation-stock,
.kardex-products {
   grid-template-columns: minmax(0, 1fr);
   max-height: 220px;
   overflow: auto;
   margin-top: 8px
}

.kardex-main,
.integration-webhook-main {
   min-width: 0;
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   gap: 16px
}

.receiving-manual-lines small,
.returns-quantities li small {
   display: block;
   font-size: 9px;
   color: var(--text-faint)
}