/* ERP shared visual theme - Passo 5A */
:root {
  --erp-primary: #0f172a;
  --erp-primary-50: #ececee;
  --erp-primary-100: #d9dadd;
  --erp-primary-200: #b7b9bf;
  --erp-primary-300: #8c9099;
  --erp-primary-400: #525866;
  --erp-primary-500: #272e3f;
  --erp-primary-600: #0f172a;
  --erp-primary-700: #0d1323;
  --erp-primary-800: #0a101d;
  --erp-primary-900: #080c16;
  --erp-primary-950: #05080f;
}

/* Compatibilidade com as classes Tailwind legadas: a cor agora vem da empresa. */
.bg-orange-50{background-color:var(--erp-primary-50)!important}
.bg-orange-100{background-color:var(--erp-primary-100)!important}
.bg-orange-500{background-color:var(--erp-primary-500)!important}
.bg-orange-600{background-color:var(--erp-primary-600)!important}
.text-orange-600{color:var(--erp-primary-600)!important}
.text-orange-700{color:var(--erp-primary-700)!important}
.border-orange-200{border-color:var(--erp-primary-200)!important}
.border-orange-300{border-color:var(--erp-primary-300)!important}
.border-orange-400{border-color:var(--erp-primary-400)!important}
.border-orange-500{border-color:var(--erp-primary-500)!important}
.border-orange-600{border-color:var(--erp-primary-600)!important}
.hover\:bg-orange-50:hover{background-color:var(--erp-primary-50)!important}
.hover\:bg-orange-700:hover{background-color:var(--erp-primary-700)!important}
.hover\:text-orange-600:hover{color:var(--erp-primary-600)!important}
.hover\:text-orange-700:hover{color:var(--erp-primary-700)!important}
.hover\:border-orange-300:hover{border-color:var(--erp-primary-300)!important}
.hover\:border-orange-400:hover{border-color:var(--erp-primary-400)!important}
.focus\:border-orange-500:focus{border-color:var(--erp-primary-500)!important}
.focus\:ring-orange-500:focus{--tw-ring-color:var(--erp-primary-500)!important}
.group:hover .group-hover\:text-orange-600{color:var(--erp-primary-600)!important}

body.dark .bg-orange-50{background-color:var(--erp-primary-950)!important;color:var(--erp-primary-300)!important}
body.dark .hover\:bg-orange-50:hover{background-color:var(--erp-primary-950)!important}
/* Espelha a OS: o hover dos grupos do menu permanece escuro e legivel. */
body.dark .hover\:bg-slate-100:hover{background-color:#262626!important}

/* Form controls and generic accents */
input[type="checkbox"],input[type="radio"],input[type="range"]{accent-color:var(--erp-primary-600)}
::selection{background:var(--erp-primary-200);color:#0f172a}

/* Responsividade mobile centralizada. */
/* ============================================================
   ERP - RESPONSIVIDADE MOBILE PADRÃO
   Mantém o desktop original e acrescenta navegação mobile.
   ============================================================ */
.erp-mobile-menu-button { display: none; }
.erp-mobile-overlay, .erp-mobile-drawer { display: none; }
.erp-mobile-table-scroll { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }

@media (max-width: 767px) {
    html, body { max-width:100%; overflow-x:hidden; }

    header {
        min-height: 68px !important;
        padding: 6px 12px !important;
        gap: 8px !important;
    }

    header > div:first-child {
        min-width: 0 !important;
        gap: 8px !important;
    }

    header img#main-logo,
    header img[id*="logo"] {
        height: 56px !important;
        max-height: 56px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    /* O menu desktop continua preservado, mas fica escondido no celular. */
    header nav { display:none !important; }

    /* Área de ações do cabeçalho */
    header > div:last-child {
        margin-left:auto !important;
        display:flex !important;
        align-items:center !important;
        gap:8px !important;
        flex-shrink:0 !important;
    }

    /* E-mail e botão Sair antigos ficam escondidos; o menu ⋮ continua valendo. */
    header #user-display { display:none !important; }
    header button[onclick*="realizarLogout"] { display:none !important; }

    .erp-mobile-menu-button {
        display:inline-flex !important;
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        align-items:center !important;
        justify-content:center !important;
        padding:0 !important;
        border:1px solid #e2e8f0 !important;
        border-radius:9px !important;
        background:#f8fafc !important;
        color:#475569 !important;
        cursor:pointer !important;
        font-size:20px !important;
        line-height:1 !important;
        transition:.15s ease !important;
    }
    .erp-mobile-menu-button:hover { background:#f1f5f9 !important; color:var(--erp-primary-600) !important; }

    body.dark .erp-mobile-menu-button {
        background:#171717 !important;
        color:#e5e5e5 !important;
        border-color:#333 !important;
    }

    .erp-mobile-overlay {
        position:fixed !important;
        inset:0 !important;
        display:block !important;
        background:rgba(2,6,23,.62) !important;
        backdrop-filter:blur(2px) !important;
        opacity:0 !important;
        visibility:hidden !important;
        transition:opacity .2s ease, visibility .2s ease !important;
        z-index:99980 !important;
    }
    .erp-mobile-overlay.open { opacity:1 !important; visibility:visible !important; }

    .erp-mobile-drawer {
        position:fixed !important;
        top:0 !important;
        right:0 !important;
        bottom:0 !important;
        display:flex !important;
        flex-direction:column !important;
        width:min(88vw, 360px) !important;
        max-width:360px !important;
        background:#fff !important;
        border-left:1px solid #e2e8f0 !important;
        box-shadow:-18px 0 45px rgba(15,23,42,.22) !important;
        transform:translateX(105%) !important;
        transition:transform .24s cubic-bezier(.16,1,.3,1) !important;
        z-index:99990 !important;
        overflow:hidden !important;
    }
    .erp-mobile-drawer.open { transform:translateX(0) !important; }
    body.dark .erp-mobile-drawer { background:#111 !important; border-color:#2f2f2f !important; }

    .erp-mobile-drawer-head {
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        min-height:64px !important;
        padding:12px 16px !important;
        border-bottom:1px solid #e2e8f0 !important;
    }
    body.dark .erp-mobile-drawer-head { border-color:#2f2f2f !important; }
    .erp-mobile-drawer-title { font-size:16px !important; font-weight:800 !important; color:#0f172a !important; }
    body.dark .erp-mobile-drawer-title { color:#fff !important; }
    .erp-mobile-close {
        width:36px !important; height:36px !important; border-radius:9px !important;
        border:1px solid #e2e8f0 !important; background:#f8fafc !important;
        color:#475569 !important; font-size:22px !important; line-height:1 !important;
        display:flex !important; align-items:center !important; justify-content:center !important;
    }
    body.dark .erp-mobile-close { background:#171717 !important; color:#fff !important; border-color:#333 !important; }

    .erp-mobile-nav {
        flex:1 !important;
        overflow-y:auto !important;
        -webkit-overflow-scrolling:touch !important;
        padding:10px 12px 24px !important;
    }
    .erp-mobile-group { margin-bottom:10px !important; }
    .erp-mobile-group-title {
        padding:10px 10px 6px !important;
        font-size:10px !important; line-height:14px !important; font-weight:800 !important;
        color:#94a3b8 !important; text-transform:uppercase !important; letter-spacing:.08em !important;
    }
    .erp-mobile-link {
        display:flex !important; align-items:center !important; min-height:44px !important;
        padding:10px 12px !important; margin:2px 0 !important;
        border-radius:10px !important; color:#334155 !important;
        font-size:14px !important; line-height:20px !important; font-weight:600 !important;
        text-decoration:none !important;
    }
    .erp-mobile-link:hover, .erp-mobile-link.active {
        background:var(--erp-primary-50) !important; color:var(--erp-primary-600) !important;
    }
    body.dark .erp-mobile-link { color:#e5e5e5 !important; }
    body.dark .erp-mobile-link:hover, body.dark .erp-mobile-link.active {
        background:var(--erp-primary-950) !important; color:var(--erp-primary-300) !important;
    }

    /* Conteúdo principal: respiro sem eliminar informações. */
    main { padding-left:12px !important; padding-right:12px !important; }
    main > section, main > div { max-width:100% !important; }

    /* Formulários e campos sempre cabem na tela. */
    input, select, textarea, button { max-width:100%; }
    input, select, textarea { font-size:16px !important; } /* evita zoom automático no iPhone */

    /* Tabelas continuam completas com rolagem horizontal, sem cortar colunas. */
    .erp-mobile-table-scroll { overflow-x:auto !important; border-radius:inherit; }
    .erp-mobile-table-scroll > table { min-width:720px; }

    /* Modais e drawers existentes: nunca ultrapassar a viewport. */
    [class*="fixed"][class*="inset-0"] > div:not(.erp-mobile-drawer),
    [id*="modal"] > div,
    [role="dialog"] {
        max-width:calc(100vw - 24px) !important;
        max-height:calc(100dvh - 24px) !important;
    }

    /* Cards de ações: evita botões espremidos quando o HTML usa flex-row fixo. */
    .erp-mobile-stack-actions {
        display:flex !important;
        flex-wrap:wrap !important;
        gap:8px !important;
    }

    /* Menu ⋮: no celular abre para dentro da tela. */
    #erp-user-menu {
        right:0 !important;
        left:auto !important;
        width:min(256px, calc(100vw - 24px)) !important;
        min-width:0 !important;
        max-width:calc(100vw - 24px) !important;
    }
}

/* ============================================================
   Shared user menu - padronização visual (Passo 5C.3B)
   ============================================================ */
#erp-user-menu-btn {
    background:#f1f5f9 !important;
    border-color:#e2e8f0 !important;
    color:#334155 !important;
}
#erp-user-menu-btn:hover {
    background:#e2e8f0 !important;
    color:#0f172a !important;
}
#erp-user-menu {
    background:#fff !important;
    border-color:#e2e8f0 !important;
}
body.dark #erp-user-menu-btn {
    background:#171717 !important;
    border-color:#333 !important;
    color:#e5e5e5 !important;
}
body.dark #erp-user-menu-btn:hover {
    background:#262626 !important;
    color:#fff !important;
}
body.dark #erp-user-menu {
    background:#111 !important;
    border-color:#262626 !important;
}
body.dark #erp-user-menu .border-slate-100 {
    border-color:#262626 !important;
}
body.dark #erp-user-menu .text-slate-800,
body.dark #erp-user-menu .text-slate-700 {
    color:#f5f5f5 !important;
}
body.dark #erp-user-menu .text-slate-500 {
    color:#a3a3a3 !important;
}
body.dark #erp-user-menu a:hover,
body.dark #erp-menu-dark-row:hover {
    background:#1a1a1a !important;
}

/* ========================================================================== */
/* AcliveOS — Passo 5: central de notificações + avisos globais              */
/* ========================================================================== */
.erp-notification-center{position:relative;display:inline-flex;align-items:center}
.erp-notification-bell{position:relative;width:38px;height:38px;border-radius:10px;border:1px solid #e2e8f0;background:#f8fafc;color:#334155;display:inline-flex;align-items:center;justify-content:center;transition:.18s ease}
.erp-notification-bell:hover{background:#f1f5f9;color:var(--erp-primary-600);border-color:#cbd5e1}
.erp-notification-bell svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.erp-notification-count{position:absolute;top:-5px;right:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#dc2626;color:#fff;border:2px solid #fff;font:800 10px/14px ui-sans-serif,system-ui;text-align:center;box-sizing:border-box}
.erp-notification-count.hidden,.erp-notification-popover.hidden,.erp-system-announcements.hidden,.erp-notification-read-all.hidden{display:none!important}
.erp-notification-popover{position:absolute;right:0;top:calc(100% + 10px);width:min(390px,calc(100vw - 24px));max-height:min(620px,calc(100dvh - 100px));overflow:hidden;border:1px solid #e2e8f0;border-radius:16px;background:#fff;box-shadow:0 24px 70px rgba(15,23,42,.22);z-index:700}
.erp-notification-popover-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:15px 16px 13px;border-bottom:1px solid #e2e8f0;background:#fff}
.erp-notification-popover-title{font-size:14px;font-weight:800;color:#0f172a}
.erp-notification-popover-summary{margin-top:2px;font-size:11px;color:#64748b}
.erp-notification-read-all{border:0;background:transparent;color:var(--erp-primary-600);font-size:11px;font-weight:800;cursor:pointer;padding:3px 0;white-space:nowrap}
.erp-notification-read-all:disabled{opacity:.5;cursor:wait}
.erp-notification-list{overflow-y:auto;max-height:min(520px,calc(100dvh - 170px));overscroll-behavior:contain}
.erp-notification-empty{padding:28px 18px;text-align:center;color:#94a3b8;font-size:12px}
.erp-notification-item{width:100%;display:flex;align-items:flex-start;gap:10px;text-align:left;border:0;border-bottom:1px solid #f1f5f9;background:#fff;padding:13px 15px;cursor:pointer;transition:.15s ease}
.erp-notification-item:last-child{border-bottom:0}
.erp-notification-item:hover{background:#f8fafc}
.erp-notification-item.is-unread{background:#f8fafc}
.erp-notification-item-dot{flex:0 0 auto;width:8px;height:8px;border-radius:999px;margin-top:6px;background:#cbd5e1}
.erp-notification-item.is-unread .erp-notification-item-dot{background:var(--erp-primary-600);box-shadow:0 0 0 3px var(--erp-primary-50)}
.erp-notification-item[data-level="sucesso"] .erp-notification-item-dot{background:#16a34a}
.erp-notification-item[data-level="aviso"] .erp-notification-item-dot{background:#d97706}
.erp-notification-item[data-level="critico"] .erp-notification-item-dot{background:#dc2626}
.erp-notification-item-content{min-width:0;flex:1;display:block}
.erp-notification-item-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;color:#0f172a;font-size:12px}
.erp-notification-item-top strong{font-weight:800;min-width:0}
.erp-notification-item-top time{flex:0 0 auto;color:#94a3b8;font-size:10px;font-weight:600}
.erp-notification-item-message{display:block;margin-top:4px;color:#64748b;font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.erp-notification-item-action{display:inline-block;margin-top:7px;color:var(--erp-primary-600);font-size:10px;font-weight:800}

.erp-system-announcements{position:relative;z-index:65;width:100%}
.erp-system-announcement{width:100%;background:#0f172a;color:#fff;border-bottom:1px solid rgba(255,255,255,.10)}
.erp-system-announcement[data-level="sucesso"]{background:#166534}
.erp-system-announcement[data-level="aviso"]{background:#92400e}
.erp-system-announcement[data-level="critico"]{background:#991b1b}
.erp-system-announcement-inner{min-height:38px;display:flex;align-items:center;justify-content:center;gap:18px;padding:8px 18px;text-align:center}
.erp-system-announcement-copy{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;font-size:12px;line-height:1.4}
.erp-system-announcement-copy strong{font-weight:900;white-space:nowrap}
.erp-system-announcement-copy span{font-weight:600;overflow-wrap:anywhere}
.erp-system-announcement-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.erp-system-announcement-actions a{color:#fff;text-decoration:underline;text-underline-offset:2px;font-size:11px;font-weight:800;white-space:nowrap}
.erp-system-announcement-actions button{width:25px;height:25px;border-radius:7px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;font-size:18px;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.erp-system-announcement-actions button:hover{background:rgba(255,255,255,.16)}

body.dark .erp-notification-bell{background:#171717;border-color:#333;color:#e5e7eb}
body.dark .erp-notification-bell:hover{background:#202020;border-color:#444;color:#fff}
body.dark .erp-notification-count{border-color:#111}
body.dark .erp-notification-popover{background:#111;border-color:#2f2f2f;box-shadow:0 24px 70px rgba(0,0,0,.5)}
body.dark .erp-notification-popover-head{background:#111;border-color:#2f2f2f}
body.dark .erp-notification-popover-title,body.dark .erp-notification-item-top{color:#f8fafc}
body.dark .erp-notification-popover-summary,body.dark .erp-notification-item-message{color:#a3a3a3}
body.dark .erp-notification-item{background:#111;border-color:#242424}
body.dark .erp-notification-item:hover,body.dark .erp-notification-item.is-unread{background:#171717}
body.dark .erp-notification-item-dot{background:#525252}

@media(max-width:767px){
  .erp-notification-popover{position:fixed;top:66px;right:12px;left:12px;width:auto;max-height:calc(100dvh - 82px)}
  .erp-notification-list{max-height:calc(100dvh - 150px)}
  .erp-system-announcement-inner{align-items:flex-start;gap:10px;padding:9px 12px;text-align:left}
  .erp-system-announcement-copy{align-items:flex-start;flex-direction:column;gap:2px;font-size:11px}
  .erp-system-announcement-copy strong{white-space:normal}
  .erp-system-announcement-actions{margin-left:auto}
}

