/* Lumii PWA Responsive V109
   Ajustes globais seguros para desktop, tablet, celular e modo instalado.
   Não altera regras de negócio: melhora layout, toque, leitura e prevenção de estouro horizontal. */
:root {
    --mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
    --mobile-safe-top: env(safe-area-inset-top, 0px);
    --mobile-bottom-nav-height: 76px;
    --lumii-radius: 1.2rem;
    --lumii-radius-sm: .95rem;
    --lumii-shadow-soft: 0 18px 42px rgba(0, 63, 92, .08);
    --lumii-border-soft: rgba(0, 166, 200, .14);
    --lumii-glass: rgba(255,255,255,.88);
}

* { box-sizing: border-box; }

html {
    min-height: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    min-width: 320px;
    overflow-x: hidden;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(0, 166, 200, .14);
}

body.lumii-app-shell {
    min-height: 100dvh;
}

img, svg, canvas, video, iframe {
    max-width: 100%;
}

canvas { display: block; }

button, a, input, select, textarea, .form-check-label {
    touch-action: manipulation;
}

input, select, textarea, button {
    font: inherit;
}

.form-control,
.form-select,
.btn {
    min-height: 44px;
}

.form-control,
.form-select,
textarea.form-control {
    border-radius: .85rem;
}

textarea.form-control {
    min-height: 118px;
    resize: vertical;
}

input[type="date"],
input[type="datetime-local"],
input[type="time"],
input[type="number"] {
    min-width: 0;
}

.app-shell,
.app-main,
.app-content,
.card,
.neo-card,
.bi-card,
.question-card,
.hero-card,
.ai-card,
.lumii-panel,
.lumii-card {
    min-width: 0;
}

.app-content {
    overflow-x: clip;
}

.card,
.neo-card,
.bi-card,
.question-card,
.hero-card,
.ai-card,
.lumii-card {
    overflow-wrap: anywhere;
}

.card,
.neo-card,
.bi-card,
.question-card,
.hero-card {
    border-radius: var(--lumii-radius);
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.table-responsive > .table {
    margin-bottom: 0;
}

.table th,
.table td {
    vertical-align: middle;
}

.table td,
.table th,
.card,
.badge,
.alert {
    word-break: normal;
    overflow-wrap: anywhere;
}

.page-actions,
.toolbar-actions,
.action-row,
.lumii-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.chart-box,
.bi-chart-box,
.chart-card,
.dash-chart-box,
.lumii-chart-box {
    position: relative;
    width: 100%;
    min-height: 260px;
}

.chart-box canvas,
.bi-chart-box canvas,
.chart-card canvas,
.dash-chart-box canvas,
.lumii-chart-box canvas {
    width: 100% !important;
}

.offline-warning,
.pwa-install-card {
    position: fixed;
    left: 1rem;
    right: 1rem;
    z-index: 1080;
    border-radius: 1rem;
    padding: .85rem 1rem;
    color: #ffffff;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .25);
}

.offline-warning {
    display: none;
    bottom: calc(1rem + var(--mobile-safe-bottom));
    background: linear-gradient(135deg, #7c2d12, #b45309);
}

body.is-offline .offline-warning { display: block; }

.pwa-install-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    bottom: calc(1rem + var(--mobile-safe-bottom));
    background: linear-gradient(135deg, #003f5c, #006b5f);
}

.pwa-install-card strong { display: block; line-height: 1.1; }
.pwa-install-card small { opacity: .86; }
.pwa-install-actions { display: flex; gap: .45rem; flex: 0 0 auto; }
.pwa-install-actions button {
    border: 0;
    border-radius: 999px;
    padding: .55rem .85rem;
    font-weight: 800;
}
.pwa-install-actions .pwa-install-now { background: #fff; color: #003f5c; }
.pwa-install-actions .pwa-install-close { background: rgba(255,255,255,.14); color: #fff; }

.mobile-bottom-nav {
    position: fixed;
    left: .75rem;
    right: .75rem;
    bottom: calc(.65rem + var(--mobile-safe-bottom));
    z-index: 1040;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(54px, 1fr));
    gap: .35rem;
    min-height: 64px;
    padding: .45rem;
    border-radius: 1.25rem;
    background:
        linear-gradient(135deg, rgba(3, 40, 58, .94), rgba(0, 83, 96, .88)),
        radial-gradient(circle at 80% 0%, rgba(125, 249, 255, .16), transparent 9rem);
    border: 1px solid rgba(125, 249, 255, .24);
    box-shadow: 0 20px 46px rgba(0, 24, 35, .34), inset 0 1px 0 rgba(255,255,255,.09);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.mobile-bottom-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .08rem;
    min-height: 52px;
    border-radius: .95rem;
    color: rgba(236, 252, 255, .78);
    text-decoration: none;
    font-weight: 850;
    line-height: 1;
    border: 1px solid transparent;
    transition: background .16s ease, color .16s ease, transform .16s ease, border-color .16s ease;
}

.mobile-bottom-link span { font-size: 1.15rem; line-height: 1; }
.mobile-bottom-link small { font-size: .69rem; letter-spacing: -.01em; }
.mobile-bottom-link.active,
.mobile-bottom-link:focus,
.mobile-bottom-link:hover {
    color: #fff;
    background: linear-gradient(135deg, rgba(0, 166, 200, .42), rgba(0, 169, 121, .30));
    border-color: rgba(125, 249, 255, .22);
    transform: translateY(-1px);
    outline: 0;
}

/* Melhora áreas clicáveis sem depender de mudança em cada view */
.btn, .top-action-btn, .nav-link-app, .mobile-bottom-link, summary, .form-check-input, .form-check-label {
    cursor: pointer;
}

/* Evita cards enormes por texto técnico/ementa */
.text-truncate-2,
.lumii-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.text-truncate-3,
.lumii-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (display-mode: standalone) {
    body { padding-top: var(--mobile-safe-top); }
    .app-sidebar { min-height: calc(100dvh - var(--mobile-safe-top)); }
    .mobile-menu { max-height: calc(100dvh - 64px - var(--mobile-safe-top)); }
}

@media (max-width: 1199.98px) {
    .app-content { max-width: 100% !important; }
    .top-action-btn { padding: .5rem .72rem; }
}

@media (max-width: 991.98px) {
    .app-shell { display: block !important; width: 100%; overflow-x: hidden; }
    .app-main, .app-content { width: 100%; max-width: 100%; min-width: 0; }
    .app-content { padding: 1rem !important; padding-bottom: calc(var(--mobile-bottom-nav-height) + 1.35rem + var(--mobile-safe-bottom)) !important; }

    .mobile-topbar {
        padding-top: calc(.75rem + var(--mobile-safe-top)) !important;
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
    }

    .mobile-menu {
        max-height: calc(100dvh - 72px - var(--mobile-safe-top));
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .sidebar-menu-accordion { gap: .45rem; }
    .sidebar-accordion summary { min-height: 48px; }
    .nav-link-app { min-height: 46px; }
    .nav-text { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }

    h1, .h1 { font-size: clamp(1.55rem, 6vw, 2.05rem); }
    h2, .h2 { font-size: clamp(1.35rem, 5vw, 1.75rem); }
    h3, .h3 { font-size: clamp(1.2rem, 4.4vw, 1.5rem); }

    .d-flex.justify-content-between,
    .d-flex.justify-content-between.align-items-center,
    .d-flex.justify-content-between.align-items-start {
        gap: .75rem;
    }

    .top-action-btn { flex: 1 1 155px; justify-content: center; }
}

@media (max-width: 767.98px) {
    body { font-size: .96rem; }

    .container, .container-fluid { padding-left: 14px; padding-right: 14px; }
    .app-content { padding: .85rem !important; padding-bottom: calc(var(--mobile-bottom-nav-height) + 1.2rem + var(--mobile-safe-bottom)) !important; }

    .card, .neo-card, .bi-card, .question-card, .hero-card, .ai-card, .lumii-card {
        border-radius: 1rem !important;
        box-shadow: 0 10px 24px rgba(0,63,92,.07) !important;
    }

    .card-body,
    .hero-head,
    .question-card.p-4,
    .bi-card.p-4,
    .neo-card.p-4,
    .ai-card.p-4,
    .lumii-card.p-4 {
        padding: 1rem !important;
    }

    .row { --bs-gutter-x: .85rem; --bs-gutter-y: .85rem; }
    .row.g-4 { --bs-gutter-y: 1rem; }

    .btn { width: auto; max-width: 100%; white-space: normal; }
    .btn-lg { font-size: 1rem; padding: .68rem 1rem; }

    .d-flex.flex-wrap.gap-2 > .btn,
    .d-flex.flex-wrap.gap-2 > a.btn,
    .d-flex.flex-wrap.gap-2 > button.btn {
        flex: 1 1 170px;
    }

    .form-control, .form-select, .btn { min-height: 46px; }
    .form-label { font-weight: 700; }
    input, select, textarea { font-size: 16px !important; }

    .table-responsive {
        border-radius: .9rem;
        border: 1px solid rgba(0, 166, 200, .10);
    }

    .table-responsive .table { min-width: 680px; }
    .table-responsive .table.table-sm { min-width: 560px; }
    .table-responsive .table { font-size: .9rem; }

    .pagination { flex-wrap: wrap; gap: .25rem; }
    .pagination .page-link { border-radius: .65rem; }

    .chart-box, .bi-chart-box, .chart-card, .dash-chart-box, .lumii-chart-box { min-height: 320px; }
    .chart-box canvas, .bi-chart-box canvas, .chart-card canvas, .dash-chart-box canvas, .lumii-chart-box canvas { min-height: 280px; }

    .bi-kanban, .kanban-board, .dash-kanban-board, .lumii-kanban, .action-kanban {
        display: flex !important;
        overflow-x: auto;
        gap: .85rem;
        padding-bottom: .6rem;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }

    .bi-kanban > *, .kanban-board > *, .dash-kanban-board > *, .lumii-kanban > *, .action-kanban > * {
        min-width: 82vw !important;
        scroll-snap-align: start;
    }

    .question-nav { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .question-nav .d-flex.flex-wrap.gap-2:last-child { flex-wrap: nowrap !important; min-width: max-content; }
    .option-card { padding: .9rem !important; }
    .option-card .form-check-input { margin-top: .25rem; }

    #answersForm > .card.question-card:last-child {
        position: sticky;
        bottom: calc(var(--mobile-bottom-nav-height) + var(--mobile-safe-bottom));
        z-index: 30;
        margin-left: -2px;
        margin-right: -2px;
        margin-bottom: calc(1rem + var(--mobile-safe-bottom)) !important;
        box-shadow: 0 -12px 28px rgba(15, 23, 42, .14) !important;
    }

    #answersForm > .card.question-card:last-child .d-flex.justify-content-between { align-items: stretch !important; }
    #saveAnswersBtn, #finishAssessmentBtn, #startExamBtn, #enterFullscreenBtn { width: 100%; }

    .topbar .container-fluid > .d-flex { align-items: flex-start !important; }
    .topbar .countdown-box, .topbar .security-pill { font-size: .82rem; }

    .pwa-install-card {
        flex-direction: column;
        align-items: stretch;
        text-align: left;
    }

    .pwa-install-actions button { flex: 1; }
}

/* V134 - camada mobile para painel, BI, listas e criação com IA. */
@media (max-width: 767.98px) {
    .mobile-topbar {
        position: sticky;
        top: 0;
        z-index: 1035;
        border-bottom: 1px solid rgba(0, 166, 200, .14);
    }

    .mobile-topbar .btn {
        min-height: 40px;
        padding: .45rem .75rem;
    }

    .mobile-bottom-nav {
        min-height: 58px;
        padding: .35rem;
        border-radius: 1rem;
    }

    .mobile-bottom-link {
        min-height: 48px;
        border-radius: .8rem;
    }

    .mobile-bottom-link span { font-size: 1.02rem; }
    .mobile-bottom-link small { font-size: .62rem; }

    .lumii-dashboard,
    .bi-v107-hero,
    .lumii-ai-shell,
    .assessments-mobile-list {
        isolation: isolate;
    }

    .lumii-dashboard .lumii-hero,
    .bi-v107-hero {
        border-radius: 1rem !important;
        padding: 1rem !important;
        margin-bottom: .9rem !important;
        box-shadow: 0 12px 28px rgba(0, 63, 92, .12) !important;
    }

    .lumii-dashboard .lumii-hero::after,
    .bi-v107-hero::after {
        opacity: .12;
        transform: scale(.78);
    }

    .lumii-dashboard .lumii-hero h1,
    .bi-v107-hero h1,
    .lumii-ai-shell h1,
    .app-content > .d-flex:first-child h1 {
        font-size: 1.35rem !important;
        line-height: 1.18 !important;
        letter-spacing: 0 !important;
    }

    .lumii-dashboard .lumii-hero p,
    .bi-v107-hero p {
        font-size: .92rem !important;
        line-height: 1.42 !important;
    }

    .lumii-eyebrow,
    .bi-chip,
    .lumii-chip,
    .lumii-tab,
    .bi-tab2,
    .lumii-preview-pill {
        min-height: 36px;
        padding: .5rem .7rem;
        font-size: .78rem !important;
        letter-spacing: 0 !important;
        white-space: nowrap;
    }

    .lumii-dashboard .lumii-hero .d-flex.flex-wrap,
    .bi-v107-hero .d-flex.flex-wrap,
    .lumii-dashboard [data-severity-filter],
    .lumii-dashboard [data-performance-scope] {
        overflow-x: auto;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .lumii-dashboard .lumii-hero .d-flex.flex-wrap::-webkit-scrollbar,
    .bi-v107-hero .d-flex.flex-wrap::-webkit-scrollbar {
        display: none;
    }

    .lumii-card.lumii-kpi,
    .bi-glass.bi-kpi2 {
        min-height: 108px !important;
        padding: .85rem !important;
    }

    .lumii-number,
    .bi-value2 {
        font-size: 1.55rem !important;
        letter-spacing: 0 !important;
    }

    .lumii-icon,
    .bi-icon2 {
        width: 38px;
        height: 38px;
        border-radius: .85rem;
    }

    .lumii-label,
    .bi-label2 {
        font-size: .68rem !important;
        letter-spacing: .035em !important;
    }

    .lumii-help-text,
    .bi-sub2 {
        font-size: .78rem !important;
        line-height: 1.35;
    }

    .chart-wrap,
    .chart-wrap-sm,
    .bi-chart-box,
    .bi-chart-box canvas,
    .lumii-chart-box,
    .chart-box {
        min-height: 230px !important;
        height: 240px !important;
    }

    .bi-kanban2,
    .lumii-kanban {
        display: flex !important;
        overflow-x: auto;
        gap: .75rem;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        padding-bottom: .45rem;
    }

    .bi-kanban2 > *,
    .lumii-kanban > * {
        min-width: min(86vw, 320px) !important;
        scroll-snap-align: start;
    }

    .bi-kanban-col2,
    .lumii-kanban-col {
        min-height: 160px !important;
        padding: .75rem !important;
    }

    .bi-plan-card,
    .bi-kanban-item2,
    .lumii-action,
    .lumii-card-flat {
        border-radius: .95rem !important;
        padding: .78rem !important;
    }

    .lumii-select,
    .lumii-input,
    .bi-search,
    .form-control.rounded-pill,
    .form-select.rounded-pill {
        border-radius: .85rem !important;
        min-height: 46px;
    }

    .app-content > .d-flex.justify-content-between:first-child,
    .app-content > .d-flex.flex-wrap.justify-content-between:first-child {
        padding: .85rem;
        border: 1px solid rgba(0, 166, 200, .12);
        border-radius: 1rem;
        background: rgba(255,255,255,.94);
        box-shadow: 0 10px 24px rgba(0,63,92,.06);
    }

    .app-content > .d-flex.justify-content-between:first-child > div:last-child,
    .app-content > .d-flex.flex-wrap.justify-content-between:first-child > div:last-child {
        width: 100%;
        display: grid !important;
        grid-template-columns: 1fr;
    }

    .assessments-mobile-list .table-responsive {
        overflow: visible;
        border: 0;
    }

    .assessments-mobile-list table,
    .assessments-mobile-list thead,
    .assessments-mobile-list tbody,
    .assessments-mobile-list tr,
    .assessments-mobile-list th,
    .assessments-mobile-list td {
        display: block;
        width: 100%;
    }

    .assessments-mobile-list thead {
        display: none;
    }

    .assessments-mobile-list tbody tr {
        margin-bottom: .85rem;
        padding: .85rem;
        border: 1px solid rgba(0, 166, 200, .13);
        border-radius: 1rem;
        background: #fff;
        box-shadow: 0 10px 24px rgba(0,63,92,.06);
    }

    .assessments-mobile-list tbody td {
        border: 0 !important;
        padding: .35rem 0 !important;
        text-align: left !important;
    }

    .assessments-mobile-list tbody td:not(:first-child):not(:last-child)::before {
        display: block;
        margin-bottom: .12rem;
        color: #60737d;
        font-size: .72rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

    .assessments-mobile-list tbody td:nth-child(2)::before { content: "Tipo"; }
    .assessments-mobile-list tbody td:nth-child(3)::before { content: "Turma"; }
    .assessments-mobile-list tbody td:nth-child(4)::before { content: "UC"; }
    .assessments-mobile-list tbody td:nth-child(5)::before { content: "Status"; }

    .assessments-mobile-list tbody td:last-child {
        margin-top: .55rem;
    }

    .assessments-mobile-list tbody td:last-child .d-inline-flex {
        display: grid !important;
        grid-template-columns: 1fr;
        width: 100%;
        gap: .45rem !important;
    }

    .assessments-mobile-list tbody td:last-child .btn,
    .assessments-mobile-list tbody td:last-child form,
    .assessments-mobile-list tbody td:last-child button {
        width: 100%;
    }

    .lumii-ai-shell {
        border-radius: 1rem !important;
        padding: .85rem !important;
        box-shadow: 0 12px 28px rgba(0,63,92,.08) !important;
    }

    .lumii-section {
        border-radius: 1rem !important;
        padding: .85rem !important;
        margin-bottom: .85rem !important;
    }

    .lumii-section .row > [class*="col-"],
    .lumii-ai-shell > .row > [class*="col-"] {
        margin-bottom: .65rem !important;
    }

    .lumii-choice-card,
    .lumii-switch-tile {
        min-height: auto !important;
        border-radius: .95rem !important;
        padding: .85rem !important;
    }

    .lumii-choice-card .form-check-input {
        right: 12px;
        top: 12px;
    }

    .lumii-choice-icon {
        width: 34px;
        height: 34px;
        border-radius: .8rem;
        margin-bottom: .35rem;
    }

    #assessmentAcademicForm .btn-lg,
    #generateButton {
        width: 100%;
        min-height: 50px;
        border-radius: .95rem !important;
    }

    #promptPreviewText {
        max-height: 240px !important;
        font-size: .78rem;
    }

    .table-responsive[id$="Container"],
    #recentAssessmentsContainer,
    #mapTableContainer {
        border: 0;
        padding-bottom: .25rem;
    }
}

@media (max-width: 575.98px) {
    .app-content { padding: .72rem !important; padding-bottom: calc(var(--mobile-bottom-nav-height) + 1.1rem + var(--mobile-safe-bottom)) !important; }

    .public-shell, .exam-shell, main.container.py-4 { padding-top: .9rem !important; }
    .hero-card, .login-card, .question-card { margin-left: 0; margin-right: 0; }

    .d-flex.justify-content-between.mb-3,
    .d-flex.justify-content-between.align-items-center.mb-3,
    .d-flex.justify-content-between.align-items-start.mb-3 {
        flex-direction: column;
        align-items: stretch !important;
    }

    .d-flex.justify-content-between.mb-3 .btn,
    .d-flex.justify-content-between.align-items-center.mb-3 .btn,
    .d-flex.justify-content-between.align-items-start.mb-3 .btn,
    .d-flex.justify-content-between.mb-3 a.btn,
    .d-flex.justify-content-between.align-items-center.mb-3 a.btn,
    .d-flex.justify-content-between.align-items-start.mb-3 a.btn {
        width: 100%;
    }

    .mobile-bottom-nav {
        left: .55rem;
        right: .55rem;
        bottom: calc(.5rem + var(--mobile-safe-bottom));
        min-height: 62px;
    }

    .mobile-bottom-link small { font-size: .65rem; }
    .student-footer, .app-footer { padding-left: 1rem; padding-right: 1rem; }
}

@media (max-width: 380px) {
    .mobile-bottom-link small { display: none; }
    .mobile-bottom-link span { font-size: 1.25rem; }
    .mobile-bottom-nav { grid-template-columns: repeat(auto-fit, minmax(46px, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .001ms !important;
    }
}

@media print {
    .mobile-topbar,
    .mobile-menu,
    .mobile-bottom-nav,
    .offline-warning,
    .pwa-install-card,
    .app-sidebar {
        display: none !important;
    }

    .app-content {
        padding: 0 !important;
        max-width: 100% !important;
    }
}
