/* RAWA — módulos principais v1
 * Dashboard, Clientes, Veículos e Ordens de Serviço.
 * Camada visual; não altera regras de negócio, API, sessão ou dados.
 */
#app-view .rawa-module-page { min-width: 0; }

#app-view .module-kicker {
    display: block;
    margin-bottom: 6px;
    color: #438cf2;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .15em;
    line-height: 1;
    text-transform: uppercase;
}
html[data-theme="dark"] #app-view .module-kicker { color: #72a9ff; }

/* Dashboard */
#app-view .rawa-dashboard-page .dashboard-hero { margin-bottom: 16px !important; }
#app-view .rawa-dashboard-page .dashboard-kicker { margin-bottom: 6px !important; color: #438cf2 !important; }
#app-view .rawa-dashboard-page .dashboard-date-card {
    min-width: 265px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    background: var(--v3-card) !important;
    box-shadow: var(--rawa-shadow-soft) !important;
}
#app-view .rawa-dashboard-page .dashboard-date-icon { width: 35px !important; height: 35px !important; border-radius: 10px !important; }
#app-view .rawa-dashboard-page .content-grid { gap: 14px !important; }
#app-view .rawa-dashboard-page .rawa-section-panel { margin-top: 14px !important; }
#app-view .rawa-dashboard-page .status-list { gap: 4px !important; }
#app-view .rawa-dashboard-page .status-row { min-height: 42px; padding: 5px 4px; border-radius: 9px; }
#app-view .rawa-dashboard-page .status-row:hover { background: color-mix(in srgb, #3182f6 5%, transparent); }
#app-view .rawa-dashboard-page .progress { height: 6px !important; background: var(--v3-card-soft) !important; }
#app-view .rawa-dashboard-page .alert-list { gap: 5px !important; }
#app-view .rawa-dashboard-page .alert-item {
    min-height: 50px;
    padding: 9px 10px !important;
    border: 1px solid transparent;
    background: var(--v3-card-2) !important;
}
#app-view .rawa-dashboard-page .alert-item:hover {
    border-color: color-mix(in srgb, #3182f6 18%, var(--v3-border));
    background: color-mix(in srgb, #3182f6 5%, var(--v3-card-2)) !important;
}
#app-view .rawa-dashboard-page .alert-icon { width: 32px !important; height: 32px !important; border-radius: 9px !important; }
#app-view .rawa-dashboard-page .alert-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; }
#app-view .rawa-dashboard-page .quick-grid { gap: 9px !important; }
#app-view .rawa-dashboard-page .quick-card {
    min-height: 88px;
    padding: 14px !important;
    border: 1px solid var(--v3-border) !important;
    border-radius: 12px !important;
    background: var(--v3-card-2) !important;
}
#app-view .rawa-dashboard-page .quick-card strong { color: var(--v3-text) !important; font-size: 22px !important; }
#app-view .rawa-dashboard-page .quick-card span { color: var(--v3-muted) !important; font-size: 10.5px !important; }

/* Clientes, Veículos e OS */
#app-view .rawa-clientes-page .module-toolbar,
#app-view .rawa-veiculos-page .module-toolbar,
#app-view .rawa-os-page .module-toolbar {
    min-height: 62px;
    align-items: center !important;
}
#app-view .rawa-clientes-page .module-toolbar-left,
#app-view .rawa-veiculos-page .module-toolbar-left,
#app-view .rawa-os-page .module-toolbar-left { width: 100%; }
#app-view .rawa-os-page .search-box { flex: 1 1 420px; }
#app-view .rawa-os-page .toolbar-select { width: min(245px, 100%) !important; flex: 0 1 245px; }

#app-view .module-statline { display: flex !important; flex-wrap: wrap !important; align-items: center; }
#app-view .module-stat {
    min-height: 28px;
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    padding: 5px 10px !important;
    border-radius: 999px !important;
    font-size: 10px !important;
    font-weight: 650;
    line-height: 1;
}
#app-view .module-stat strong { color: var(--v3-text) !important; font-size: 11px !important; font-weight: 850 !important; }
#app-view .module-stat.success { border-color: rgba(36,201,138,.20) !important; background: rgba(36,201,138,.085) !important; color: #269b70 !important; }
#app-view .module-stat.warning { border-color: rgba(243,168,31,.22) !important; background: rgba(243,168,31,.09) !important; color: #b97808 !important; }
#app-view .module-stat.info { border-color: rgba(49,130,246,.20) !important; background: rgba(49,130,246,.085) !important; color: #337fdc !important; }
#app-view .module-stat.muted { color: var(--v3-muted) !important; }
html[data-theme="dark"] #app-view .module-stat.success { color: #63d9ad !important; }
html[data-theme="dark"] #app-view .module-stat.warning { color: #ffc360 !important; }
html[data-theme="dark"] #app-view .module-stat.info { color: #78adff !important; }

#app-view .rawa-clientes-page .data-panel,
#app-view .rawa-veiculos-page .data-panel,
#app-view .rawa-os-page .data-panel { box-shadow: var(--rawa-shadow-card) !important; }

#app-view .table-main { display: block; color: var(--v3-text) !important; font-size: 11.5px !important; font-weight: 760 !important; line-height: 1.35; }
#app-view .table-sub { display: block; margin-top: 3px; color: var(--v3-muted) !important; font-size: 9.5px !important; line-height: 1.3; }
#app-view .table-footer {
    min-height: 42px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 12px !important;
    border-top: 1px solid var(--v3-border) !important;
    background: color-mix(in srgb, var(--v3-card-2) 72%, var(--v3-card));
    color: var(--v3-muted) !important;
    font-size: 9.5px !important;
}
#app-view .row-action { min-height: 32px !important; padding: 6px 9px !important; border-radius: 8px !important; font-size: 10px !important; }
#app-view .row-action.primary-link { border-color: rgba(49,130,246,.22) !important; background: rgba(49,130,246,.09) !important; color: #2d78da !important; }
html[data-theme="dark"] #app-view .row-action.primary-link { color: #77adff !important; }
#app-view .row-action.primary-link:hover { border-color: rgba(49,130,246,.38) !important; background: rgba(49,130,246,.14) !important; }

/* Ordem de Serviço */
#app-view .rawa-os-page .os-status {
    min-height: 25px;
    display: inline-flex;
    align-items: center;
    padding: 4px 8px !important;
    font-size: 9px !important;
    font-weight: 780 !important;
    white-space: nowrap;
}
#app-view .os-detail-modal .os-detail-grid { gap: 10px !important; }
#app-view .os-detail-modal .os-summary-card,
#app-view .os-detail-modal .os-total-card,
#app-view .os-detail-modal .os-item { border-radius: 12px !important; box-shadow: none !important; }
#app-view .os-detail-modal .os-flow-actions { box-shadow: 0 -8px 22px rgba(0,0,0,.035); }

/* Formulários dos cadastros */
#app-view .modal .form-grid { align-items: start; }
#app-view .modal .field { margin-bottom: 0 !important; }
#app-view .modal .field.full { grid-column: 1 / -1; }
#app-view .modal .form-error { margin-top: 12px !important; }

@media (max-width: 900px) {
    #app-view .rawa-dashboard-page .dashboard-date-card { min-width: 0 !important; width: auto; }
    #app-view .rawa-os-page .toolbar-select { flex: 1 1 220px; }
}
@media (max-width: 720px) {
    #app-view .rawa-dashboard-page .dashboard-hero,
    #app-view .rawa-clientes-page .hero-row,
    #app-view .rawa-veiculos-page .hero-row,
    #app-view .rawa-os-page .hero-row { align-items: stretch !important; flex-direction: column !important; }
    #app-view .rawa-dashboard-page .dashboard-date-card { width: 100%; }
    #app-view .rawa-clientes-page .hero-row > .action-button,
    #app-view .rawa-veiculos-page .hero-row > .action-button,
    #app-view .rawa-os-page .hero-row > .action-button { width: 100%; }
    #app-view .rawa-os-page .module-toolbar-left { flex-direction: column; align-items: stretch !important; }
    #app-view .rawa-os-page .search-box,
    #app-view .rawa-os-page .toolbar-select { width: 100% !important; max-width: none !important; flex: 1 1 auto; }
    #app-view .table-footer { align-items: flex-start; flex-direction: column; gap: 3px; }
}
@media (prefers-reduced-motion: reduce) {
    #app-view .rawa-dashboard-page .status-row,
    #app-view .rawa-dashboard-page .alert-item,
    #app-view .row-action { transition: none !important; }
}
