.vr-app{
display:flex;
min-height:600px;
height:auto;
border-radius:10px;
overflow:hidden;
font-family:system-ui;
background:#f5f5f5;
}


/* Blindagem de layout: garante sidebar + conteudo lado a lado no desktop */
.vr-app{
display:grid !important;
grid-template-columns:240px minmax(0,1fr) !important;
align-items:stretch;
}

/* Blindagem extra: corrige wrappers do editor (Elementor/wpautop) */
.vr-app > p{
margin:0 !important;
display:contents !important;
}

.vr-app > br{
display:none !important;
}

.vr-app > .vr-sidebar,
.vr-app > p > .vr-sidebar{
grid-column:1;
}

.vr-app > .vr-content,
.vr-app > p > .vr-content{
grid-column:2;
min-width:0;
}

@media (max-width: 768px){
.vr-app > .vr-sidebar,
.vr-app > p > .vr-sidebar,
.vr-app > .vr-content,
.vr-app > p > .vr-content{
grid-column:1;
}
.vr-sidebar{
min-height:auto !important;
align-self:auto;
}
}
/* SIDEBAR */

.vr-sidebar{
width:240px;
flex:0 0 240px;
box-sizing:border-box;
background:#0f172a;
color:white;
padding:20px;
min-height:100vh;
align-self:stretch;
}

.vr-logo{
font-size:20px;
font-weight:bold;
margin-bottom:30px;
}

.vr-menu{
display:flex;
flex-direction:column;
gap:8px;
}

.vr-menu-item{
display:flex;
align-items:center;
justify-content:flex-start;
width:100%;
margin:0;
box-sizing:border-box;
appearance:none;
-webkit-appearance:none;
background:none;
border:none;
color:#cbd5e1;
font:inherit;
text-align:left;
line-height:1.2;
padding:10px 12px;
border-radius:6px;
cursor:pointer;
}

.vr-menu-item:hover{
background:#1e293b;
color:white;
}

.vr-menu-item.active{
  background:#4D3900;
  color:white;
  display:flex;
  align-items:center; /* alinhamento vertical */
}

/* CONTENT */

.vr-content{
flex:1;
padding:5px;
background:white;
overflow:auto;
border:1px solid #e5e7eb; /* borda fina (cinza suave) */
border-radius:0 8px 8px 0; /* esquerda 0 | direita 8px */
min-width:0;
}

.vr-cards{
display:flex;
gap:20px;
margin-top:5px;
}

.vr-card{
flex:1;
background:#f8fafc;
border:1px solid #e2e8f0;
padding:20px;
border-radius:8px;
margin-bottom:20px;
}

.vr-card h3{
margin:0 0 10px 0;
font-size:14px;
color:#64748b;
}

.vr-card p{
font-size:28px;
font-weight:bold;
margin:0;
}

.vr-timer{
text-align:center;
margin-top:20px;
}

#vr-timer-display{
font-size:48px;
font-weight:bold;
display:block;
margin-bottom:20px;
}

.vr-timer-buttons button{
padding:10px 15px;
margin:5px;
border:none;
border-radius:6px;
cursor:pointer;
background:#4D3900;
color:white;
}

.vr-timer-buttons button:hover{
background:#6b5100;
}

.vr-stats-switch{
display:flex;
gap:10px;
margin-bottom:20px;
align-items:center;
flex-wrap:wrap;
justify-content:space-between;
}

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

@media (max-width:768px){
.vr-grid-2{
grid-template-columns:1fr;
}
}

.vr-stats-tabs{
display:flex;
gap:10px;
flex-wrap:wrap;
}

.vr-stats-filtros-card{
margin-bottom:20px;
}

.vr-stats-filtros{
display:flex;
gap:10px;
align-items:center;
flex-wrap:wrap;
}

.vr-stats-field{
display:flex;
align-items:stretch;
flex-direction:column;
gap:0;
}

.vr-stats-field:first-child{
margin-top:2px;
}

.vr-stats-filtros .vr-label{
margin-bottom:0;
display:inline-block;
line-height:1;
}

.vr-stats-field .vr-label{
margin-bottom:0;
line-height:1.2;
min-height:16px;
margin-bottom:6px;
}

.vr-stats-field .vr-select,
.vr-stats-field .vr-input{
min-width:180px;
width:180px;
height:44px;
box-sizing:border-box;
line-height:1.2;
padding:10px 14px;
margin:0;
display:block;
}

.vr-stats-field input[type="month"]{
padding-right:36px;
}

.vr-stats-filtros .vr-select,
.vr-stats-filtros .vr-input{
min-width:160px;
}

#vr-stats-mes-wrap{
display:flex;
align-items:center;
gap:8px;
}

.vr-stats-export{
margin-left:auto;
}

@media (max-width:768px){
.vr-stats-export{
width:100%;
margin-left:0;
}
.vr-stats-filtros{
width:100%;
}
}

.vr-stats-tab{
cursor:pointer;
}

.vr-stats-tab.active{
box-shadow:0 0 0 2px #0f2a16 inset;
}

.vr-stats-export{
display:inline-flex;
align-items:center;
gap:8px;
background:#dc2626 !important;
border:1px solid #b91c1c !important;
color:#fff !important;
box-shadow:0 6px 16px rgba(220,38,38,0.18);
}

.vr-stats-export:hover{
background:#b91c1c !important;
border-color:#991b1b !important;
}

.vr-stats-export:active{
background:#991b1b !important;
}

.vr-button-icon{
display:inline-flex;
align-items:center;
justify-content:center;
}

.vr-checkbox{
display:flex;
align-items:center;
gap:8px;
font-size:14px;
color:#475569;
}

.vr-disciplinas-lista{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:8px 16px;
margin-top:10px;
}

.vr-disciplinas-item{
display:flex;
align-items:center;
gap:8px;
font-size:14px;
color:#475569;
}

.vr-disciplinas-actions{
display:flex;
gap:10px;
flex-wrap:wrap;
}

@media (max-width:768px){
.vr-disciplinas-lista{
grid-template-columns:1fr;
}
}

.vr-row-good td{
background:linear-gradient(90deg, rgba(34,197,94,0.18), rgba(34,197,94,0.04));
border-left:3px solid #22c55e;
}

.vr-row-warn td{
background:linear-gradient(90deg, rgba(251,146,60,0.18), rgba(251,146,60,0.04));
border-left:3px solid #fb923c;
}

.vr-row-bad td{
background:linear-gradient(90deg, rgba(239,68,68,0.18), rgba(239,68,68,0.04));
border-left:3px solid #ef4444;
}

.vr-table-total tfoot th{
background:#f1e6d2;
font-weight:700;
}

.vr-chart-container{
max-width: 350px;
margin: 0 auto;
}

.vr-chart-container canvas{
width:100% !important;
height:350px !important;
}

.vr-chart-status{
margin-top:8px;
font-size:13px;
color:#475569;
display:flex;
flex-direction:column;
gap:4px;
}

.vr-chart-scroll{
overflow-x:auto;
padding-bottom:10px;
}

.vr-chart-container{
min-width:350px;
height:350px;
}

.vr-chart-scroll::-webkit-scrollbar{
height:8px;
}

.vr-chart-scroll::-webkit-scrollbar-thumb{
background:#4D3900;
border-radius:10px;
}

.vr-streak-bar{

display:flex;
align-items:center;
gap:14px;

background:#fff7e6;
border:1px solid #f5d28a;
border-top:4px solid #ff9800;

padding:14px 18px;
border-radius:10px;

font-size:14px;
color:#4D3900;

margin-bottom:20px;

}

.vr-streak-fire{
font-size:20px;
line-height:1;
}

.vr-streak-fire::before{
content:"\1F525 ";
display:inline-block;
}

#vr-streak-atual{
font-size:18px;
font-weight:700;
}

.vr-divider{
opacity:0.4;
}

.vr-streak-msg{
opacity:0.8;
}

#vr-heatmap{
padding-top:10px;
margin-top:20px;
padding-bottom: 20px;
overflow-x:auto;
overflow-y:hidden;
}

#vr-heatmap-grid{
display:flex;
align-items:flex-start;
gap:4px;
min-width:max-content;
}

.vr-week{
display:flex;
flex-direction:column;
gap:4px;
height:auto;
}

.vr-day{
width:14px;
height:14px;
border-radius:3px;
background:#ebedf0;
flex-shrink:0;
}

/* intensidade */

.vr-n1{background:#9be9a8;}
.vr-n2{background:#40c463;}
.vr-n3{background:#30a14e;}
.vr-n4{background:#216e39;}

#vr-heatmap-months{
display:flex;
gap:56px;
font-size:12px;
color:#666;
margin-bottom:6px;
}

#vr-heatmap-body{
display:flex;
align-items:flex-start;
gap:8px;
}

#vr-heatmap-weekdays{
display:flex;
flex-direction:column;
gap:4px;
font-size:11px;
color:#666;
height:auto;
}

.vr-weekday{
height:14px;
display:flex;
align-items:center;
}

#vr-heatmap-legend{
display:flex;
align-items:center;
gap:6px;
font-size:12px;
color:#666;
margin-top:20px;
}

#vr-heatmap-legend .vr-day{
width:14px;
height:14px;
border-radius:3px;
}

.vr-today{
outline:1px solid #4D3900;
outline-offset:1px;
}

.vr-table{
width:100%;
border-collapse:collapse;
font-size:13px;
background:#fff;
}

.vr-table thead{
background:#f5f7fa;
}

.vr-table th{
text-align:left;
font-weight:600;
font-size:12px;
color:#FFFFFF;
padding:6px 8px;
border-bottom:1px solid #e5e7eb;
letter-spacing:0.3px;
}

.vr-table td{
padding:5px 8px;
border-bottom:1px solid #eef2f6;
color:#334155;
line-height:1.2;
}

.vr-table tbody tr:hover{
background:#f8fafc;
}

.vr-table tbody tr:last-child td{
border-bottom:none;
}

.vr-input,
.vr-select,
.vr-textarea,
.vr-number{
width:100%;
padding:7px 10px;
font-size:13px;
border:1px solid #d1d5db;
border-radius:6px;
background:#ffffff;
color:#1f2937;
transition:border-color .15s ease, box-shadow .15s ease;
outline:none;
box-sizing:border-box;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
}

.vr-select{
cursor:pointer;
}

.vr-input,
.vr-select,
.vr-number{
height:34px;
}
/* foco */

.vr-number:focus,
.vr-input:focus,
.vr-select:focus,
.vr-textarea:focus{
border-color:#4D3900;
box-shadow:0 0 0 3px rgba(201,162,75,0.25);
}

/* hover */

.vr-number:hover,
.vr-input:hover,
.vr-select:hover,
.vr-textarea:hover{
border-color:#9ca3af;
}

/* placeholder */

.vr-number::placeholder,
.vr-input::placeholder,
.vr-textarea::placeholder{
color:#9ca3af;
}

/* textarea */

.vr-textarea{
resize:vertical;
min-height:70px;
}

/* label */

.vr-label{
font-size:12px;
font-weight:600;
color:#475569;
margin-bottom:4px;
display:block;
}

/* remover setas do input number */

.vr-number::-webkit-outer-spin-button,
.vr-number::-webkit-inner-spin-button{
-webkit-appearance:none;
margin:0;
}

.vr-number{
-moz-appearance:textfield;
}

.vr-button{
display:inline-flex;
align-items:center;
justify-content:center;
gap:6px;
padding:6px 12px;
font-size:13px;
font-weight:600;
border-radius:6px;
border:1px solid transparent;
cursor:pointer;
transition:all .15s ease;
line-height:1;
user-select:none;
}

/* hover geral */

.vr-button:hover{
transform:translateY(-1px);
}

/* clique */

.vr-button:active{
transform:translateY(0);
}

.vr-button-primary{
background:#4D3900;
color:#fff;
border-color:#4D3900;
}

.vr-button-primary:hover{
background:#5e4600;
border-color:#5e4600;
}

.vr-button-secondary{
background:#f8fafc;
color:#334155;
border:1px solid #e2e8f0;
}

.vr-button-secondary:hover{
background:#f1f5f9;
}

/* botoes de disciplinas na configuracao */
.vr-disciplinas-actions{
display:flex;
gap:8px;
flex-wrap:wrap;
}

.vr-disciplinas-actions .vr-button{
background:#f8fafc !important;
color:#334155 !important;
border:1px solid #e2e8f0 !important;
box-shadow:none !important;
}

.vr-disciplinas-actions .vr-button:hover{
background:#f1f5f9 !important;
border-color:#d1d5db !important;
}

.vr-configuracoes-salvar{
display:flex;
justify-content:flex-end;
}

.vr-button-success{
background:#22c55e;
color:#fff;
border-color:#22c55e;
}

.vr-button-success:hover{
background:#16a34a;
}

.vr-button-danger{
background:#ef4444;
color:#fff;
border-color:#ef4444;
}

.vr-button-danger:hover{
background:#dc2626;
}

/* container do filtro */

.dataTables_filter{
margin-bottom:10px;
font-size:12px;
color:#475569;
}

/* input de busca */

.dataTables_filter input{
margin-left:6px;
padding:5px 8px;
font-size:13px;
border:1px solid #d1d5db;
border-radius:6px;
background:#fff;
color:#1f2937;
outline:none;
transition:border-color .15s ease, box-shadow .15s ease;
width:160px;
}

/* foco */

.dataTables_filter input:focus{
border-color:#4D3900;
box-shadow:0 0 0 3px rgba(201,162,75,0.25);
}

/* hover */

.dataTables_filter input:hover{
border-color:#9ca3af;
}

.dataTables_filter input{
padding-left:28px;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='%239ca3af' d='M10.5 9h-.79l-.28-.27A5.471 5.471 0 0010 5.5 5.5 5.5 0 104.5 11c1.61 0 3.09-.66 4.18-1.73l.27.28v.79L14 15l1-1-4.5-4.5z'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:8px center;
}

/* header da tabela */

.vr-table-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:8px;
}

/* footer */

.vr-table-footer{
display:flex;
justify-content:space-between;
align-items:center;
margin-top:8px;
font-size:12px;
color:#64748b;
}

.dataTables_paginate{
display:flex;
gap:4px;
}

.dataTables_paginate .paginate_button{
padding:4px 8px;
border-radius:5px;
border:1px solid #e5e7eb;
background:#fff;
cursor:pointer;
font-size:12px;
}

.dataTables_paginate .paginate_button:hover{
background:#f1f5f9;
}

.dataTables_paginate .current{
background:#4D3900;
color:#fff !important;
border-color:#4D3900;
}

.dataTables_length select{
padding:4px 6px;
font-size:12px;
border:1px solid #d1d5db;
border-radius:6px;
background:#fff;
}

.dataTables_wrapper{
font-size:13px;
}

.vr-meu-ranking{
background:#ffe9a8;
font-weight:700;
}


/* Sidebar reset estavel */
.vr-sidebar{
background:linear-gradient(180deg,#4D3900 0%,#3a2b00 100%);
padding:16px 12px;
min-height:100vh;
align-self:stretch;
}

.vr-sidebar .vr-logo{
font-size:18px;
font-weight:700;
line-height:1.2;
margin:4px 8px 14px;
color:#f8fafc;
}

.vr-sidebar .vr-menu{
display:flex !important;
flex-direction:column !important;
justify-content:flex-start !important;
align-items:stretch !important;
gap:8px !important;
row-gap:8px !important;
column-gap:0 !important;
margin:0 !important;
padding:0 !important;
height:auto !important;
min-height:0 !important;
}

.vr-sidebar .vr-menu-item{
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
width:100% !important;
gap:10px !important;
min-height:46px !important;
margin:0 !important;
margin-top:0 !important;
margin-bottom:0 !important;
padding:10px 12px !important;
box-sizing:border-box !important;
appearance:none !important;
-webkit-appearance:none !important;
font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
font-size:14px !important;
font-weight:600 !important;
line-height:1.25 !important;
text-align:left !important;
white-space:normal !important;
word-break:break-word;
color:#dbe7ff !important;
background:#5e4600 !important;
border:1px solid #6b5100 !important;
border-radius:10px !important;
box-shadow:none !important;
cursor:pointer;
}

.vr-sidebar .vr-menu-item .vr-menu-icon{
display:inline-flex;
align-items:center;
justify-content:center;
width:20px;
height:20px;
margin-right:8px;
flex:0 0 20px;
opacity:0.9;
}

.vr-sidebar .vr-menu-item svg{
width:18px;
height:18px;
}

.vr-sidebar .vr-menu-item:hover{
background:#6b5100 !important;
border-color:#7a5c00 !important;
color:#ffffff !important;
}

.vr-sidebar .vr-menu-item.active{
background:#3a2b00 !important;
border-color:#3a2b00 !important;
color:#ffffff !important;
}


.vr-sidebar .vr-menu-item:focus-visible{
outline:none;
box-shadow:0 0 0 3px rgba(201,162,75,.35) !important;
}
.vr-sidebar .vr-menu-item + .vr-menu-item{margin-top:0 !important;}

/* Blindagem contra wpautop e CSS global do tema no front publico */
.vr-sidebar .vr-menu > *{
margin:0 !important;
padding:0 !important;
}

.vr-sidebar .vr-menu p,
.vr-sidebar .vr-menu div,
.vr-sidebar .vr-menu span{
margin:0 !important;
}

.vr-sidebar .vr-menu p:empty{
display:none !important;
}

/* Se o wpautop envolver botoes em <p>, manter espacamento uniforme */
.vr-sidebar .vr-menu p{
display:flex !important;
flex-direction:column !important;
gap:8px !important;
}
.vr-sidebar .vr-menu p .vr-menu-item{
margin:0 0 8px 0 !important;
}
.vr-sidebar .vr-menu p .vr-menu-item:last-child{
margin-bottom:0 !important;
}

.vr-sidebar .vr-menu br{
display:none !important;
}

.vr-sidebar .vr-menu .vr-menu-item,
.vr-sidebar .vr-menu p .vr-menu-item,
.vr-sidebar .vr-menu div .vr-menu-item{
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
width:100% !important;
min-height:46px !important;
margin:0 !important;
padding:10px 12px !important;
}
/* Responsive: tablet and mobile */
@media (max-width: 768px){
.vr-app{
display:grid !important;
grid-template-columns:1fr !important;
min-height:auto;
height:auto;
overflow:visible;
border-radius:12px;
}

.vr-sidebar{
width:100% !important;
flex:0 0 auto !important;
padding:12px !important;
}

.vr-sidebar .vr-logo{
font-size:17px !important;
margin:0 0 10px !important;
}

.vr-sidebar .vr-menu{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px !important;
}

.vr-sidebar .vr-menu-item{
min-height:44px !important;
padding:10px !important;
font-size:13px !important;
border-radius:8px !important;
}

.vr-content{
padding:12px !important;
}

.vr-card{
padding:14px !important;
margin-bottom:12px !important;
}

.vr-streak-bar{
flex-wrap:wrap;
gap:8px;
padding:10px 12px;
font-size:13px;
}

#vr-streak-atual{
font-size:16px;
}

.vr-timer-buttons{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px;
}

.vr-timer-buttons button{
width:100%;
margin:0 !important;
}

#vr-timer-display{
font-size:34px;
}

.vr-chart-container{
min-width:280px;
height:280px;
}

.vr-chart-container canvas{
height:280px !important;
}

.vr-table{
font-size:12px;
}

.vr-table th,
.vr-table td{
padding:6px;
}
}

@media (max-width: 640px){
.vr-sidebar .vr-menu{
grid-template-columns:1fr !important;
}

.vr-content{
padding:10px !important;
}

.vr-card{
padding:12px !important;
}

#vr-timer-display{
font-size:30px;
}

.vr-streak-msg{
display:block;
width:100%;
}

#vr-heatmap-months{
gap:28px;
}

/* ====== Override final do sidebar (espacamento uniforme) ====== */
.vr-sidebar .vr-menu{
display:flex !important;
flex-direction:column !important;
gap:8px !important;
grid-template-columns:none !important;
}

#vr-heatmap-legend{
flex-wrap:wrap;
}

.dataTables_wrapper{
overflow-x:auto;
}

/* ====== Tabelas modernas (override DataTables) ====== */
.vr-table{
border-collapse:separate;
border-spacing:0;
background:#ffffff;
border:1px solid #e2e8f0;
border-radius:14px;
overflow:hidden;
box-shadow:0 8px 24px rgba(15,23,42,0.06);
}

.vr-table thead{
background:linear-gradient(180deg,#101826,#0f172a);
}

.vr-table th{
font-weight:700;
color:#f8fafc;
font-size:12px;
letter-spacing:0.6px;
text-transform:uppercase;
padding:14px 16px;
border-bottom:1px solid rgba(255,255,255,0.08);
}

.vr-table td{
padding:14px 16px;
border-bottom:1px solid #e5e7eb;
color:#0f172a;
}

.vr-table tbody tr:nth-child(even){
background:#f8fafc;
}

.vr-table tbody tr:hover{
background:#eef2ff;
}

.vr-table tfoot th{
padding:14px 16px;
background:#fff7ed;
border-top:1px solid #fed7aa;
color:#7c2d12;
}

.vr-table-total tfoot th{
background:#ffedd5;
font-weight:700;
}

.dataTables_wrapper{
font-size:13px;
}

.vr-table-header,
.vr-table-footer{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
flex-wrap:wrap;
margin:8px 0;
}

.dataTables_filter label{
font-size:12px;
color:#475569;
gap:6px;
}

.dataTables_filter input{
width:clamp(200px, 28vw, 320px);
padding:10px 12px 10px 34px;
border:1px solid #d1d5db;
border-radius:12px;
background:#ffffff;
box-shadow:0 6px 16px rgba(15,23,42,0.06);
transition:border-color .15s ease, box-shadow .15s ease;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='%239ca3af' d='M10.5 9h-.79l-.28-.27A5.471 5.471 0 0010 5.5 5.5 5.5 0 104.5 11c1.61 0 3.09-.66 4.18-1.73l.27.28v.79L14 15l1-1-4.5-4.5z'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:12px center;
}

.dataTables_filter input:focus{
outline:none;
border-color:#4D3900;
box-shadow:0 0 0 3px rgba(201,162,75,0.25);
}

.dataTables_length select{
padding:8px 30px 8px 12px;
border-radius:12px;
border:1px solid #d1d5db;
background:#ffffff;
font-size:12px;
box-shadow:0 6px 16px rgba(15,23,42,0.06);
}

.dataTables_info{
color:#64748b;
font-size:12px;
}

.dataTables_paginate{
display:flex;
gap:6px;
}

.dataTables_paginate .paginate_button{
padding:6px 10px;
border-radius:10px;
border:1px solid #d1d5db;
background:#ffffff;
color:#0f172a !important;
box-shadow:0 6px 16px rgba(15,23,42,0.06);
}

.dataTables_paginate .paginate_button:hover{
background:#f8fafc;
}

.dataTables_paginate .current{
background:#1e293b !important;
border-color:#1e293b !important;
color:#fff !important;
}

/* ====== Overrides finais para DataTables (garantir prioridade) ====== */
.vr-app .vr-table{
border-collapse:separate !important;
border-spacing:0 !important;
background:#ffffff !important;
border:1px solid #e6edf5 !important;
border-radius:12px !important;
overflow:hidden !important;
box-shadow:0 10px 24px rgba(15,23,42,0.06) !important;
}

.vr-app .vr-table thead{
background:#f4f7fb !important;
}

.vr-app .vr-table th{
font-weight:700 !important;
color:#1f2937 !important;
font-size:12px !important;
letter-spacing:0.3px !important;
text-transform:uppercase !important;
padding:12px 14px !important;
border-bottom:1px solid #e6edf5 !important;
}

.vr-app .vr-table td{
padding:12px 14px !important;
border-bottom:1px solid #eef2f7 !important;
color:#111827 !important;
}

.vr-app .vr-table tbody tr:nth-child(even){
background:#f9fbfd !important;
}

.vr-app .vr-table tbody tr:hover{
background:#eef6ff !important;
}

.vr-app .vr-table tfoot th{
padding:12px 14px !important;
background:#eef6ff !important;
border-top:1px solid #dbeafe !important;
color:#1e3a8a !important;
}

.vr-app .vr-table-total tfoot th{
background:#e8f1ff !important;
font-weight:700 !important;
}

.vr-app .dataTables_filter input{
width:clamp(200px, 28vw, 320px) !important;
padding:10px 12px 10px 34px !important;
border:1px solid #dbe4ee !important;
border-radius:10px !important;
background:#ffffff !important;
box-shadow:0 6px 16px rgba(15,23,42,0.06) !important;
}

.vr-app .dataTables_length select{
padding:8px 30px 8px 12px !important;
border-radius:10px !important;
border:1px solid #dbe4ee !important;
background:#ffffff !important;
font-size:12px !important;
box-shadow:0 6px 16px rgba(15,23,42,0.06) !important;
}

.vr-app .dataTables_paginate .paginate_button{
padding:6px 10px !important;
border-radius:10px !important;
border:1px solid #dbe4ee !important;
background:#ffffff !important;
color:#0f172a !important;
box-shadow:0 6px 16px rgba(15,23,42,0.06) !important;
}

.vr-app .dataTables_paginate .paginate_button:hover{
background:#eef6ff !important;
}

.vr-app .dataTables_paginate .current{
background:#4D3900 !important;
border-color:#4D3900 !important;
color:#fff !important;
}

/* Força estilo DataTables (caso CSS legado esteja sobrescrevendo) */
.vr-app table.dataTable,
.vr-app table.dataTable.no-footer{
border-collapse:separate !important;
border-spacing:0 !important;
background:#ffffff !important;
border:1px solid #e6edf5 !important;
border-radius:12px !important;
overflow:hidden !important;
box-shadow:0 10px 24px rgba(15,23,42,0.06) !important;
}

.vr-app table.dataTable thead th,
.vr-app table.dataTable thead td{
background:#f4f7fb !important;
color:#1f2937 !important;
font-weight:700 !important;
text-transform:uppercase !important;
font-size:12px !important;
letter-spacing:0.3px !important;
padding:12px 14px !important;
border-bottom:1px solid #e6edf5 !important;
}

.vr-app table.dataTable tbody th,
.vr-app table.dataTable tbody td{
padding:12px 14px !important;
border-bottom:1px solid #eef2f7 !important;
color:#111827 !important;
background:#ffffff !important;
}

.vr-app table.dataTable tbody tr:nth-child(even) td{
background:#f9fbfd !important;
}

.vr-app table.dataTable tbody tr:hover td{
background:#eef6ff !important;
}

.vr-app table.dataTable tfoot th{
padding:12px 14px !important;
background:#eef6ff !important;
border-top:1px solid #dbeafe !important;
color:#1e3a8a !important;
}

.vr-app table.dataTable tfoot td{
background:#eef6ff !important;
}

/* Neutraliza cores antigas por linha */
.vr-app table.dataTable .vr-row-good td,
.vr-app table.dataTable .vr-row-warn td,
.vr-app table.dataTable .vr-row-bad td{
border-left:none !important;
background:inherit !important;
}
}

@media (max-width: 420px){
.vr-sidebar{
padding:10px !important;
}

.vr-sidebar .vr-menu-item{
font-size:12px !important;
min-height:42px !important;
}

.vr-content{
padding:8px !important;
}

.vr-card{
padding:10px !important;
}

#vr-timer-display{
font-size:26px;
}
}
/* Monitor de Estudos: botoes simbolicos e modo Pomodoro */
.vr-timer-buttons{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:8px;
}

.vr-timer-buttons img{
width:18px;
height:18px;
display:block;
}

.vr-monitor-card{
display:grid;
gap:16px;
}

.vr-monitor-section{
padding:12px;
border:1px solid #e2e8f0;
border-radius:12px;
background:#f8fafc;
}

.vr-monitor-section h3{
margin:0 0 10px;
font-size:15px;
color:#0f172a;
}

@media (max-width:768px){
.vr-monitor-section{
padding:10px;
}
}

.vr-timer-buttons button{
width:44px;
height:44px;
display:inline-flex;
align-items:center;
justify-content:center;
font-size:20px;
margin:0;
border:none;
border-radius:10px;
cursor:pointer;
background:#4D3900;
color:white;
}

.vr-timer-buttons button:hover{
background:#5b4300;
}

.vr-timer-modo-switch{
display:flex;
align-items:center;
justify-content:flex-start;
gap:10px;
margin:10px 0 0;
}

.vr-timer-label{
font-size:13px;
font-weight:700;
color:#64748b;
cursor:pointer;
}

.vr-timer-label.active{
color:#0f172a;
}

.vr-timer-switch{
display:inline-flex;
align-items:center;
cursor:pointer;
}

.vr-timer-switch input{
position:absolute;
opacity:0;
pointer-events:none;
}

.vr-timer-switch-track{
width:46px;
height:26px;
border-radius:999px;
background:#cbd5e1;
position:relative;
transition:background .2s ease;
box-shadow:inset 0 0 0 1px rgba(15,23,42,.08);
}

.vr-timer-switch-track::after{
content:"";
position:absolute;
top:3px;
left:3px;
width:20px;
height:20px;
border-radius:50%;
background:#fff;
box-shadow:0 1px 2px rgba(0,0,0,.22);
transition:transform .2s ease;
}

.vr-timer-switch input:checked + .vr-timer-switch-track{
background:#4D3900;
}

.vr-timer-switch input:checked + .vr-timer-switch-track::after{
transform:translateX(20px);
}

.vr-pomodoro-config{
margin-top:10px;
padding:12px;
border:1px dashed #cbd5e1;
border-radius:8px;
background:#f8fafc;
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
}

#vr-pomodoro-fase{
display:block;
margin-top:8px;
font-weight:600;
color:#4D3900;
}

/* =============================================================
   Fase 2 - Modernizacao visual de campos (inputs/select/textarea)
   Observacao: este bloco fica no final para sobrescrever estilos antigos
   ============================================================ */
.vr-input,
.vr-select,
.vr-textarea,
.vr-number{
width:min(100%, 340px);
padding:10px 12px;
font-size:14px;
line-height:1.25;
border:1px solid #cbd5e1;
border-radius:10px;
background:#f8fafc;
color:#1f2937;
box-shadow:inset 0 1px 1px rgba(15,23,42,0.03);
transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
outline:none;
box-sizing:border-box;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
display:block;
}

.vr-select{
cursor:pointer;
padding-right:36px;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 20 20'%3E%3Cpath fill='%2364748b' d='M5.5 7.5 10 12l4.5-4.5 1.4 1.4L10 14.8 4.1 8.9z'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:right 12px center;
}

.vr-input,
.vr-select,
.vr-number{
min-height:40px;
}

.vr-number:focus,
.vr-input:focus,
.vr-select:focus,
.vr-textarea:focus{
border-color:#4D3900;
background:#ffffff;
box-shadow:0 0 0 3px rgba(201,162,75,0.25);
}

.vr-number:hover,
.vr-input:hover,
.vr-select:hover,
.vr-textarea:hover{
border-color:#94a3b8;
background:#ffffff;
}

.vr-number::placeholder,
.vr-input::placeholder,
.vr-textarea::placeholder{
color:#94a3b8;
}

.vr-textarea{
resize:vertical;
min-height:88px;
}

.vr-label{
font-size:13px;
font-weight:600;
color:#475569;
margin-bottom:6px;
display:block;
}

/* Utilitario opcional para forcar campo de largura total */
.vr-input.vr-input-full,
.vr-select.vr-select-full,
.vr-textarea.vr-textarea-full,
.vr-number.vr-number-full{
max-width:none;
width:100%;
}

/* Espacamento consistente entre pares label/campo */
.vr-card .vr-label + .vr-input,
.vr-card .vr-label + .vr-select,
.vr-card .vr-label + .vr-textarea,
.vr-card .vr-label + .vr-number{
margin-bottom:10px;
}

/* Busca da tabela com o mesmo padrao visual */
.dataTables_filter input{
margin-left:6px;
padding:10px 12px;
font-size:14px;
border:1px solid #cbd5e1;
border-radius:10px;
background:#f8fafc;
color:#1f2937;
outline:none;
transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
width:clamp(180px, 28vw, 280px);
min-height:40px;
}

.dataTables_filter input:focus{
border-color:#4D3900;
background:#fff;
box-shadow:0 0 0 3px rgba(37,99,235,0.18);
}

.dataTables_filter input:hover{
border-color:#94a3b8;
background:#fff;
}

/* Select de quantidade de linhas */
.dataTables_length select{
padding:8px 30px 8px 10px;
font-size:13px;
border:1px solid #cbd5e1;
border-radius:10px;
background:#f8fafc;
min-height:38px;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 20 20'%3E%3Cpath fill='%2364748b' d='M5.5 7.5 10 12l4.5-4.5 1.4 1.4L10 14.8 4.1 8.9z'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:right 10px center;
}

/* Mobile: campos ocupam toda a largura para legibilidade */
@media (max-width:768px){
.vr-input,
.vr-select,
.vr-textarea,
.vr-number{
width:100%;
max-width:none;
}

.dataTables_filter label{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:6px;
}

.dataTables_filter input{
margin-left:0;
width:100%;
max-width:none;
}
}

/* Ajuste de prioridade: garante visual moderno para inputs text/number no frontend publico */
.vr-app input.vr-input[type="text"],
.vr-app input.vr-input[type="number"],
.vr-app input.vr-number[type="number"]{
width:min(100%, 340px) !important;
min-height:40px !important;
padding:10px 12px !important;
font-size:14px !important;
line-height:1.25 !important;
border:1px solid #cbd5e1 !important;
border-radius:10px !important;
background:#f8fafc !important;
color:#1f2937 !important;
box-shadow:inset 0 1px 1px rgba(15,23,42,0.03) !important;
outline:none !important;
-webkit-appearance:none !important;
-moz-appearance:textfield !important;
appearance:none !important;
}

.vr-app input.vr-input[type="text"]:hover,
.vr-app input.vr-input[type="number"]:hover,
.vr-app input.vr-number[type="number"]:hover{
border-color:#94a3b8 !important;
background:#ffffff !important;
}

.vr-app input.vr-input[type="text"]:focus,
.vr-app input.vr-input[type="number"]:focus,
.vr-app input.vr-number[type="number"]:focus{
border-color:#4D3900 !important;
background:#ffffff !important;
box-shadow:0 0 0 3px rgba(37,99,235,0.18) !important;
}

.vr-app input.vr-input[type="text"]::placeholder,
.vr-app input.vr-input[type="number"]::placeholder,
.vr-app input.vr-number[type="number"]::placeholder{
color:#94a3b8 !important;
}

/* Utilitario full width para inputs text/number */
.vr-app input.vr-input.vr-input-full[type="text"],
.vr-app input.vr-input.vr-input-full[type="number"],
.vr-app input.vr-number.vr-number-full[type="number"]{
max-width:none !important;
width:100% !important;
}

@media (max-width:768px){
.vr-app input.vr-input[type="text"],
.vr-app input.vr-input[type="number"],
.vr-app input.vr-number[type="number"]{
width:100% !important;
max-width:none !important;
}
}

/* Correcoes do Monitor: alinhamento Pomodoro + modal de confirmacao de salvamento */
.vr-pomodoro-config{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
gap:6px;
}

.vr-pomodoro-config .vr-label,
.vr-pomodoro-config #vr-pomodoro-fase{
text-align:center;
width:100%;
}

.vr-pomodoro-config .vr-input[type="number"]{
width:min(100%, 220px) !important;
max-width:220px !important;
margin:0 auto;
text-align:center;
}

.vr-timer-feedback{
margin-top:10px;
font-size:13px;
font-weight:600;
color:#475569;
text-align:center;
min-height:20px;
}

.vr-timer-feedback.is-error{
color:#b91c1c;
}

.vr-timer-feedback.is-success{
color:#047857;
}

.vr-modal{
position:fixed;
inset:0;
display:flex;
align-items:center;
justify-content:center;
z-index:99999;
padding:16px;
}

.vr-modal__backdrop{
position:absolute;
inset:0;
background:rgba(15,23,42,0.55);
}

.vr-modal__dialog{
position:relative;
width:min(100%, 460px);
background:#ffffff;
border-radius:14px;
padding:18px;
box-shadow:0 20px 45px rgba(2,6,23,0.25);
display:flex;
flex-direction:column;
gap:10px;
}

.vr-modal__dialog h3{
margin:0;
font-size:18px;
color:#0f172a;
}

.vr-modal__tempo{
margin:0;
font-size:14px;
color:#334155;
}

.vr-modal__acoes{
display:flex;
justify-content:flex-end;
gap:8px;
margin-top:4px;
}

@media (max-width:768px){
.vr-modal__dialog{
padding:14px;
}

.vr-modal__acoes{
flex-direction:column;
}

.vr-modal__acoes .vr-button{
width:100%;
}
}
/* Destaque visual da fase do pomodoro */
#vr-pomodoro-fase{
display:inline-flex;
align-items:center;
justify-content:center;
margin-top:8px;
padding:6px 12px;
border-radius:999px;
font-weight:700;
font-size:12px;
line-height:1;
letter-spacing:.2px;
border:1px solid transparent;
}

#vr-pomodoro-fase.vr-fase-foco{
background:#dcfce7;
color:#166534;
border-color:#86efac;
}

#vr-pomodoro-fase.vr-fase-pausa{
background:#fef9c3;
color:#854d0e;
border-color:#fde047;
}
/* Ranking v2: filtros e podium dinamico */
.vr-ranking-filtros{
display:grid;
grid-template-columns:repeat(auto-fit, minmax(190px, 1fr));
gap:10px;
align-items: center;
margin:8px 0 14px;
}

.vr-ranking-filtro-item{
display:flex;
flex-direction:column;
}

#vr-ranking-filtrar{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:42px;
padding:0 16px;
border:1px solid #1d4ed8;
margin-top: 8px;
border-radius:10px;
background:linear-gradient(135deg, #634a01 0%, #4D3900 100%);
color:#ffffff;
font-weight:700;
letter-spacing:0.2px;
box-shadow:0 8px 20px rgba(37, 99, 235, 0.25);
transition:transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}

#vr-ranking-filtrar:hover{
filter:brightness(1.04);
box-shadow:0 10px 24px rgba(37, 99, 235, 0.35);
transform:translateY(-1px);
}

#vr-ranking-filtrar:active{
transform:translateY(0);
box-shadow:0 6px 14px rgba(37, 99, 235, 0.28);
}

#vr-ranking-filtrar:focus-visible{
outline:3px solid rgba(59, 130, 246, 0.35);
outline-offset:2px;
}

.vr-ranking-podio{
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:10px;
margin:4px 0 14px;
}

.vr-ranking-podio-card{
background:linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
border:1px solid #cbd5e1;
border-radius:12px;
padding:10px;
text-align:center;
}

.vr-ranking-podio-card small{
display:block;
font-size:12px;
font-weight:700;
color:#475569;
margin-bottom:6px;
}

.vr-ranking-podio-card strong{
display:block;
font-size:16px;
line-height:1.2;
color:#0f172a;
margin-bottom:4px;
}

.vr-ranking-podio-card span{
font-size:13px;
color:#334155;
}

.vr-ranking-podio-card[data-posicao="1"]{
border-color:#facc15;
background:linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%);
}

.vr-ranking-podio-card[data-posicao="2"]{
border-color:#cbd5e1;
background:linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%);
}

.vr-ranking-podio-card[data-posicao="3"]{
border-color:#fdba74;
background:linear-gradient(180deg, #fff7ed 0%, #fed7aa 100%);
}

@media (max-width:768px){
.vr-ranking-podio{
grid-template-columns:1fr;
}
.vr-ranking-filtros{
grid-template-columns:1fr;
}
#vr-ranking-filtrar{
width:100%;
min-height:38px;
margin-top:0;
}
}

/* Agenda: calendario mensal com FullCalendar */
.vr-agenda-card{
padding:14px;
}

.vr-agenda-topo{
display:flex;
align-items:center;
justify-content:space-between;
gap:8px;
margin-bottom:10px;
}

.vr-agenda-topo h3{
margin:0;
}

.vr-agenda-topo small{
color:#64748b;
font-weight:600;
}

.vr-agenda-calendario{
background:#ffffff;
border:1px solid #dbe4f0;
border-radius:12px;
padding:10px;
}

.vr-agenda-calendario .fc .fc-toolbar-title{
font-size:18px;
font-weight:800;
color:#0f172a;
}

.vr-agenda-calendario .fc .fc-button{
background:#4D3900;
border-color:#4D3900;
border-radius:8px;
font-weight:700;
text-transform:none;
}

.vr-agenda-calendario .fc .fc-button:hover{
background:#5e4600;
border-color:#5e4600;
}

.vr-agenda-calendario .fc .fc-button.fc-button-active{
background:#3a2b00;
border-color:#3a2b00;
}

/* Força cores do FullCalendar (caso CSS legado esteja sobrescrevendo) */
.vr-app .vr-agenda-calendario .fc .fc-button,
.vr-app .vr-agenda-calendario .fc .fc-button-primary{
background:#4D3900 !important;
border-color:#4D3900 !important;
color:#ffffff !important;
}

.vr-app .vr-agenda-calendario .fc .fc-button:hover,
.vr-app .vr-agenda-calendario .fc .fc-button-primary:hover{
background:#5e4600 !important;
border-color:#5e4600 !important;
}

.vr-app .vr-agenda-calendario .fc .fc-button.fc-button-active,
.vr-app .vr-agenda-calendario .fc .fc-button-primary:not(:disabled).fc-button-active{
background:#3a2b00 !important;
border-color:#3a2b00 !important;
color:#ffffff !important;
}

.vr-agenda-calendario .fc .fc-daygrid-day-number{
font-weight:700;
color:#1e293b;
}

.vr-agenda-calendario .fc .fc-event{
border-radius:8px;
padding:1px 3px;
font-weight:700;
font-size:11px;
line-height:1.15;
max-width:100%;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

.vr-agenda-calendario .fc .fc-daygrid-event .fc-event-title{
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

/* Agenda: padroniza eventos do calendario com a mesma paleta da legenda */
.vr-agenda-calendario .fc .vr-agenda-evento{
border-width:1px;
border-style:solid;
border-radius:999px !important;
padding:2px 8px !important;
font-weight:700 !important;
font-size:11px !important;
box-shadow:0 1px 0 rgba(15,23,42,0.05) !important;
}

.vr-agenda-calendario .fc .vr-agenda-evento .fc-event-title,
.vr-agenda-calendario .fc .vr-agenda-evento .fc-event-time{
color:inherit !important;
}

.vr-agenda-calendario .fc .fc-daygrid-event{
border-radius:999px !important;
}

.vr-agenda-calendario .fc .fc-daygrid-event-dot{
display:none !important;
}

.vr-agenda-calendario .fc .fc-h-event{
background:transparent !important;
}

.vr-agenda-calendario .fc .vr-agenda-evento.fc-daygrid-dot-event .fc-event-dot{
border-color:currentColor !important;
}

.vr-agenda-calendario .fc .vr-agenda-evento.vr-agenda-status-planejado{
background:#dbeafe !important;
border-color:#93c5fd !important;
color:#1d4ed8 !important;
}

.vr-agenda-calendario .fc .vr-agenda-evento.vr-agenda-status-feito{
background:#dcfce7 !important;
border-color:#86efac !important;
color:#166534 !important;
}

.vr-agenda-calendario .fc .vr-agenda-evento.vr-agenda-status-adiado{
background:#ffedd5 !important;
border-color:#fdba74 !important;
color:#9a3412 !important;
}

.vr-agenda-calendario .fc .vr-agenda-evento.vr-agenda-status-faltou{
background:#fee2e2 !important;
border-color:#fca5a5 !important;
color:#991b1b !important;
}

.vr-agenda-calendario .fc .vr-agenda-evento.vr-agenda-status-resumo{
background:#ccfbf1 !important;
border-color:#5eead4 !important;
color:#115e59 !important;
}

.vr-agenda-erro{
padding:12px;
border:1px solid #fecaca;
background:#fef2f2;
color:#b91c1c;
border-radius:8px;
font-weight:700;
}

@media (max-width: 768px){
.vr-agenda-topo{
flex-direction:column;
align-items:flex-start;
}

.vr-agenda-calendario{
padding:6px;
}

.vr-agenda-calendario .fc .fc-toolbar{
flex-direction:column;
align-items:flex-start;
gap:8px;
}
.vr-agenda-calendario .fc .fc-toolbar-title{
font-size:16px;
}
.vr-agenda-calendario .fc .fc-button{
font-size:12px;
padding:4px 8px;
}
.vr-agenda-calendario .fc .fc-toolbar-chunk{
display:flex;
flex-wrap:wrap;
gap:6px;
}
}

/* Agenda: modal unificado para CRUD e visualizacao */
.vr-agenda-modal__dialog{
width:min(980px, 94vw);
max-height:88vh;
overflow:auto;
}

.vr-agenda-modal-subtitulo{
font-size:13px;
font-weight:700;
color:#475569;
margin-bottom:10px;
}

.vr-agenda-modal-conteudo{
display:grid;
grid-template-columns:280px 1fr;
gap:12px;
}

.vr-agenda-modal-lista-wrap{
border:1px solid #dbe4f0;
border-radius:10px;
background:#f8fafc;
padding:10px;
}

.vr-agenda-modal-lista-topo{
font-weight:800;
font-size:13px;
color:#1e293b;
margin-bottom:8px;
}

.vr-agenda-eventos-dia{
display:flex;
flex-direction:column;
gap:8px;
max-height:420px;
overflow:auto;
}

.vr-agenda-item-dia{
text-align:left;
border:1px solid transparent;
border-radius:12px;
background:#f8fafc;
padding:8px;
cursor:pointer;
transition:background .15s ease, border-color .15s ease, box-shadow .15s ease;
appearance:none;
-webkit-appearance:none;
outline:none;
}

.vr-agenda-item-dia:hover{
background:#f1f5f9;
border-color:#cbd5e1;
}

.vr-agenda-item-dia.is-planejado:hover{
background:#cfe0fb;
border-color:#7aa7f7;
}

.vr-agenda-item-dia.is-feito:hover{
background:#c9f7dc;
border-color:#6ee7b7;
}

.vr-agenda-item-dia.is-adiado:hover{
background:#ffe0c2;
border-color:#f59e0b;
}

.vr-agenda-item-dia.is-faltou:hover{
background:#fecaca;
border-color:#f87171;
}

.vr-agenda-item-dia.is-resumo:hover{
background:#bff3e9;
border-color:#34d399;
}

.vr-agenda-item-dia:focus,
.vr-agenda-item-dia:active{
outline:none;
box-shadow:none;
}

.vr-agenda-item-dia strong{
display:block;
font-size:13px;
color:#0f172a;
margin-bottom:2px;
max-width:100%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.vr-agenda-item-dia span{
display:block;
font-size:12px;
color:#334155;
}

.vr-agenda-item-dia small{
display:inline-block;
margin-top:4px;
font-size:11px;
font-weight:700;
color:#475569;
background:#e2e8f0;
border-radius:999px;
padding:2px 8px;
}

.vr-agenda-item-dia.is-active{
border-color:#4D3900;
box-shadow:0 0 0 2px rgba(201,162,75,0.25);
}

.vr-agenda-item-dia.is-planejado{
background:#dbeafe;
border-color:#93c5fd;
}

.vr-agenda-item-dia.is-feito{
background:#dcfce7;
border-color:#86efac;
}

.vr-agenda-item-dia.is-adiado{
background:#ffedd5;
border-color:#fdba74;
}

.vr-agenda-item-dia.is-faltou{
background:#fee2e2;
border-color:#fca5a5;
}

.vr-agenda-item-dia.is-resumo{
background:#ccfbf1;
border-color:#5eead4;
border-style:solid;
}

.vr-agenda-item-vazio{
font-size:13px;
color:#64748b;
padding:10px;
border:1px dashed #cbd5e1;
border-radius:8px;
background:#ffffff;
}

.vr-agenda-form{
display:flex;
flex-direction:column;
gap:8px;
}

.vr-agenda-grid-2{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
}

.vr-agenda-modal-feedback{
margin-top:10px;
font-size:13px;
font-weight:700;
color:#334155;
min-height:18px;
}

.vr-agenda-modal-feedback.is-error{
color:#b91c1c;
}

.vr-agenda-modal-feedback.is-success{
color:#166534;
}

/* Botões do modal da agenda */
.vr-agenda-modal__acoes .vr-button.vr-button-primary{
background:#4D3900 !important;
border-color:#4D3900 !important;
color:#fff !important;
}

.vr-agenda-modal__acoes .vr-button.vr-button-primary:hover{
background:#5e4600 !important;
border-color:#5e4600 !important;
}

.vr-agenda-modal__acoes .vr-button.vr-button-secondary{
background:transparent !important;
border:1px solid #4D3900 !important;
color:#4D3900 !important;
}

.vr-agenda-modal__acoes .vr-button.vr-button-secondary:hover{
background:#f6ead2 !important;
border-color:#5e4600 !important;
color:#3a2b00 !important;
}

.vr-agenda-modal__acoes .vr-button.vr-button-danger{
background:#ef4444 !important;
border-color:#ef4444 !important;
color:#fff !important;
}

.vr-agenda-modal__acoes .vr-button.vr-button-danger:hover{
background:#dc2626 !important;
border-color:#dc2626 !important;
}

@media (max-width: 860px){
.vr-agenda-modal-conteudo{
grid-template-columns:1fr;
}

.vr-agenda-eventos-dia{
max-height:220px;
}

.vr-agenda-grid-2{
grid-template-columns:1fr;
}
}

.vr-agenda-filtros{
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:10px;
margin:4px 0 10px;
}

.vr-agenda-legenda{
display:flex;
flex-wrap:wrap;
gap:8px;
margin:0 0 10px;
}

.vr-legenda-item{
font-size:11px;
font-weight:700;
padding:3px 8px;
border-radius:999px;
color:#0f172a;
background:#e2e8f0;
}

.vr-legenda-item.is-planejado{ background:#dbeafe; color:#1d4ed8; }
.vr-legenda-item.is-feito{ background:#dcfce7; color:#166534; }
.vr-legenda-item.is-adiado{ background:#ffedd5; color:#9a3412; }
.vr-legenda-item.is-faltou{ background:#fee2e2; color:#991b1b; }
.vr-legenda-item.is-resumo{ background:#ccfbf1; color:#115e59; }

.vr-agenda-form .vr-input.is-invalid,
.vr-agenda-form .vr-select.is-invalid,
.vr-agenda-form textarea.is-invalid{
border-color:#dc2626 !important;
box-shadow:0 0 0 2px rgba(220, 38, 38, 0.12);
}

.vr-button.is-loading{
opacity:0.75;
pointer-events:none;
}

@media (max-width: 860px){
.vr-agenda-filtros{
grid-template-columns:1fr;
}
}






/* Blindagem final: evita quebra por wrappers extras dentro de .vr-app */
.vr-app > *:not(.vr-sidebar):not(.vr-content){
display:contents !important;
}

.vr-app .vr-sidebar{
grid-column:1 !important;
grid-row:1 !important;
}

.vr-app .vr-content{
grid-column:2 !important;
grid-row:1 !important;
margin:0 !important;
clear:none !important;
float:none !important;
min-width:0;
}

@media (max-width: 768px){
.vr-app .vr-sidebar,
.vr-app .vr-content{
grid-column:1 !important;
grid-row:auto !important;
}
.vr-sidebar{
min-height:auto !important;
align-self:auto;
}
}







/* Sala de Aula (MVP) */
.vr-salas-descricao{
margin:0 0 14px;
color:#475569;
font-size:14px;
}

.vr-salas-filtros{
display:grid;
grid-template-columns:repeat(2,minmax(180px,1fr));
gap:12px;
margin-bottom:12px;
}

.vr-salas-acoes{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-bottom:12px;
}

.vr-salas-status{
padding:10px 12px;
border:1px solid #dbeafe;
background:#eff6ff;
border-radius:10px;
margin-bottom:12px;
font-size:14px;
}

.vr-sala-conn{
display:inline-flex;
align-items:center;
gap:6px;
padding:2px 8px;
margin-left:6px;
border-radius:999px;
font-size:11px;
font-weight:700;
border:1px solid transparent;
}

.vr-sala-conn.is-on{
background:#dcfce7;
color:#166534;
border-color:#86efac;
}

.vr-sala-conn.is-off{
background:#fff7ed;
color:#9a3412;
border-color:#fdba74;
}

.vr-salas-lista{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:10px;
margin-bottom:14px;
}

.vr-salas-secao{
margin-top:8px;
}

.vr-sala-participantes-scroll{
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}

.vr-sala-participantes-scroll .vr-table{
    min-width:520px;
}

.vr-sala-card{
border:1px solid #dbe2ee;
border-radius:12px;
padding:12px;
background:#f8fafc;
}

.vr-sala-card.is-ativa{
border-color:#4D3900;
box-shadow:0 0 0 2px rgba(37,99,235,0.12);
background:#eef5ff;
}

.vr-sala-card__topo{
display:flex;
justify-content:space-between;
align-items:center;
gap:8px;
margin-bottom:10px;
}

.vr-sala-card__topo span{
font-size:12px;
font-weight:700;
color:#334155;
background:#e2e8f0;
padding:2px 8px;
border-radius:999px;
}

.vr-sala-card__rodape{
display:flex;
justify-content:space-between;
align-items:center;
gap:10px;
}

.vr-sala-entrar{
min-width:108px;
padding:8px 14px;
border-radius:10px;
font-weight:700;
}

.vr-salas-btn-atualizar{
min-width:160px;
padding:10px 16px;
border-radius:10px;
font-weight:700;
box-shadow:0 6px 18px rgba(37,99,235,.22);
}

.vr-salas-vazio{
padding:12px;
border:1px dashed #cbd5e1;
border-radius:10px;
color:#64748b;
background:#f8fafc;
}

@media (max-width: 768px){
.vr-salas-filtros{
grid-template-columns:1fr;
}
.vr-sala-card__rodape{
flex-direction:column;
align-items:flex-start;
}
}
/* Sala de Aula: botoes e chat */
.vr-sala-aula-card .vr-timer-buttons{
display:flex;
gap:8px;
flex-wrap:wrap;
justify-content:center;
}

.vr-sala-aula-card .vr-timer-buttons button{
width:44px;
height:44px;
border:none;
border-radius:10px;
background:#4D3900;
color:#fff;
font-weight:700;
cursor:pointer;
box-shadow:none;
transition:transform .14s ease, filter .14s ease;
}

.vr-sala-aula-card .vr-timer-buttons button:hover{
background:#5b4300;
}

.vr-sala-chat-card{
margin-top:12px;
}

.vr-sala-chat-topo{
display:flex;
justify-content:space-between;
align-items:center;
gap:10px;
}

.vr-sala-chat-acoes{
display:flex;
justify-content:flex-end;
margin:6px 0 8px;
}

#vr-sala-chat-anteriores{
min-height:34px;
font-size:12px;
padding:0 12px;
}

.vr-sala-chat-feedback{
position:absolute;
right:12px;
top:50%;
transform:translateY(-50%);
font-size:12px;
font-weight:700;
color:#b91c1c;
opacity:0.75;
pointer-events:none;
white-space:nowrap;
}

.vr-sala-chat-feedback.is-error{
color:#b91c1c;
}

/* Forca visual dos botoes da Sala para evitar estilo padrao do WordPress */
.vr-app .vr-sala-aula-card .vr-button{
appearance:none !important;
-webkit-appearance:none !important;
border:0 !important;
outline:0 !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
line-height:1 !important;
text-decoration:none !important;
box-shadow:none !important;
font-family:inherit !important;
}

.vr-app .vr-sala-aula-card .vr-button.vr-button-primary{
background:linear-gradient(135deg,#634a01,#4D3900) !important;
color:#fff !important;
}

.vr-app .vr-sala-aula-card .vr-button.vr-button-secondary{
background:#e2e8f0 !important;
color:#0f172a !important;
}

.vr-app .vr-sala-aula-card .vr-button.vr-button-success{
background:#16a34a !important;
color:#fff !important;
}

.vr-chat-switch{
display:inline-flex;
align-items:center;
gap:8px;
cursor:pointer;
user-select:none;
}

.vr-chat-switch input{
position:absolute;
opacity:0;
pointer-events:none;
}

.vr-chat-switch-trilha{
width:42px;
height:24px;
border-radius:999px;
background:#cbd5e1;
position:relative;
transition:background .2s ease;
box-shadow:inset 0 0 0 1px rgba(15,23,42,.08);
}

.vr-chat-switch-trilha::after{
content:"";
position:absolute;
top:3px;
left:3px;
width:18px;
height:18px;
border-radius:50%;
background:#fff;
box-shadow:0 1px 2px rgba(0,0,0,.22);
transition:transform .2s ease;
}

.vr-chat-switch input:checked + .vr-chat-switch-trilha{
background:#4D3900;
}

.vr-chat-switch input:checked + .vr-chat-switch-trilha::after{
transform:translateX(18px);
}

.vr-chat-switch-label{
font-size:12px;
font-weight:700;
color:#334155;
}

.vr-sala-chat-lista{
max-height:220px;
overflow:auto;
border:1px solid #dbe2ee;
border-radius:10px;
background:#f8fafc;
padding:10px;
margin:8px 0 10px;
}

.vr-sala-chat-item{
font-size:13px;
line-height:1.45;
padding:6px 8px;
border-radius:8px;
margin-bottom:6px;
max-width:88%;
}

.vr-sala-chat-item.is-minha{
margin-left:auto;
background:#dbeafe;
border:1px solid #93c5fd;
color:#1e3a8a;
}

.vr-sala-chat-item.is-outra{
margin-right:auto;
background:#ecfeff;
border:1px solid #99f6e4;
color:#0f172a;
}

.vr-sala-chat-cabecalho{
display:flex;
justify-content:space-between;
align-items:center;
gap:10px;
margin-bottom:2px;
}

.vr-sala-chat-data{
font-size:11px;
opacity:.72;
font-weight:600;
}

.vr-sala-chat-texto{
white-space:pre-wrap;
word-break:break-word;
}

.vr-sala-chat-item:last-child{
margin-bottom:0;
}

.vr-sala-chat-envio{
display:grid;
grid-template-columns:1fr auto;
gap:8px;
align-items:center;
}

.vr-sala-chat-input-wrap{
position:relative;
width:100%;
}

.vr-sala-chat-input-wrap .vr-input{
padding-right:120px;
}

.vr-sala-chat-envio .vr-input{
margin:0;
}

.vr-sala-chat-digitando{
min-height:18px;
margin:-2px 0 8px;
font-size:12px;
color:#64748b;
font-style:italic;
}

@media (max-width:768px){
.vr-sala-chat-envio{
grid-template-columns:1fr;
}
.vr-sala-chat-envio .vr-button{
width:100%;
}
.vr-sala-chat-item{
max-width:100%;
}
.vr-salas-filtros{
grid-template-columns:1fr;
}
.vr-sala-chat-topo{
align-items:flex-start;
flex-direction:column;
}
}

/* ====== Override final do sidebar (espacamento uniforme) ====== */
.vr-sidebar .vr-menu{
display:flex !important;
flex-direction:column !important;
gap:8px !important;
grid-template-columns:none !important;
}

/* ====== Override final do sidebar (espacamento uniforme) ====== */
.vr-sidebar .vr-menu{
display:flex !important;
flex-direction:column !important;
gap:8px !important;
grid-template-columns:none !important;
}
.vr-sidebar .vr-menu-item{
margin:0 !important;
}
.vr-sidebar .vr-menu > *{
margin:0 !important;
}

/* ====== Override final do sidebar (espacamento uniforme) ====== */
.vr-sidebar .vr-menu{
display:flex !important;
flex-direction:column !important;
row-gap:8px !important;
column-gap:0 !important;
}
.vr-sidebar .vr-menu > .vr-menu-item{
margin:0 0 8px 0 !important;
}
.vr-sidebar .vr-menu > .vr-menu-item:last-child{
margin-bottom:0 !important;
}
