:root{
--kbk-bg:#f5f7fb;
--kbk-card:#ffffff;
--kbk-line:#d9e2ec;
--kbk-text:#172b4d;
--kbk-muted:#5e6c84;
--kbk-brand:#176080;
--kbk-brand-dark:#0f4c65;
--kbk-success:#2e7d32;
--kbk-danger:#c62828;
--kbk-shadow:0 14px 32px rgba(23,96,128,.08);
--kbk-radius:18px;
}
.kbk-admin-shell,
#repositorio,
#resultadopasta{
color:var(--kbk-text);
}
.kbk-admin-shell{
display:flex;
flex-direction:column;
gap:24px;
}
.kbk-admin-header,
.kbk-hero{
background:linear-gradient(135deg,#fff, #f0f7fb);
border:1px solid var(--kbk-line);
border-radius:var(--kbk-radius);
padding:24px 28px;
box-shadow:var(--kbk-shadow);
}
.kbk-admin-header h1,
.kbk-hero h2,
.aluno-cursos-container h2{
margin:0 0 8px;
line-height:1.15;
}
.kbk-admin-header p,
.kbk-hero p,
.aluno-cursos-container h3,
.kbk-admin-card__head p{
margin:0;
color:var(--kbk-muted);
}
.kbk-admin-grid{
display:grid;
grid-template-columns: minmax(320px, 1fr) minmax(360px, 1.2fr);
gap:24px;
}
.kbk-admin-card,
#cursos,
#google,
#listagem,
.aluno-cursos-container,
.container-modulos .modulo,
.etapa3 .modulo{
background:var(--kbk-card);
border:1px solid var(--kbk-line);
border-radius:var(--kbk-radius);
box-shadow:var(--kbk-shadow);
}
.kbk-admin-card,
#cursos,
#google,
#listagem{
padding:24px;
}
.kbk-admin-card__head{
margin-bottom:18px;
}
.kbk-admin-card__head h2{
margin:0 0 6px;
}
.kbk-input,
#searchCurso{
width:100%;
min-height:46px;
padding:0 14px;
border:1px solid var(--kbk-line);
border-radius:12px;
background:#fff;
}
.kbk-suggestions,
#suggestions{
margin:12px 0 0;
padding:0;
list-style:none;
display:grid;
gap:10px;
}
.kbk-suggestion-item button,
#suggestions li button{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
text-align:left;
padding:14px 16px;
border:1px solid var(--kbk-line);
background:#fff;
border-radius:12px;
cursor:pointer;
}
.kbk-suggestion-item button:hover,
#suggestions li button:hover{
border-color:var(--kbk-brand);
box-shadow:0 8px 20px rgba(23,96,128,.08);
}
.kbk-course-edit,
#cursoedit,
.kbk-drive-result,
#resultado{
margin-top:18px;
}
.kbk-breadcrumb,
ul#caminhosuave{
display:flex;
flex-wrap:wrap;
list-style:none;
margin:0 0 18px;
padding:0;
gap:8px;
}
.kbk-breadcrumb li,
ul#caminhosuave li{
margin:0;
padding:0;
}
.kbk-breadcrumb a,
ul#caminhosuave li a{
display:inline-flex;
align-items:center;
gap:8px;
padding:7px 12px;
border-radius:999px;
background:#eef5f9;
color:var(--kbk-brand);
text-decoration:none;
font-size:13px;
font-weight:600;
}
ul#caminhosuave li:before{display:none;}
ul.googlefolder{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
gap:12px;
width:100%;
margin:0;
padding:0;
list-style:none;
}
ul.googlefolder li{
display:flex;
align-items:stretch;
justify-content:center;
min-height:84px;
border:1px solid var(--kbk-line);
border-radius:14px;
background:#fff;
padding:0;
margin:0;
transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
ul.googlefolder li:hover,
ul.googlefolder li.cor{
transform:translateY(-2px);
border-color:var(--kbk-brand);
box-shadow:0 8px 22px rgba(23,96,128,.09);
}
ul.googlefolder li a,
ul.googlefolder li input[type='button']{
width:100%;
min-height:84px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
border:none;
border-radius:14px;
padding:14px;
background:#fff;
color:var(--kbk-text);
text-decoration:none;
font-size:13px;
font-weight:600;
cursor:pointer;
}
ul.googlefolder li input[type='button']{
background:var(--kbk-brand);
color:#fff;
}
.kbk-table-wrap{overflow:auto;}
#cursos table,
.table-listagem,
.kbk-report-table,
.widefat{
width:100%;
border-collapse:separate;
border-spacing:0;
overflow:hidden;
border-radius:16px;
}
#cursos table th,
#cursos table td,
.table-listagem th,
.table-listagem td,
.kbk-report-table th,
.kbk-report-table td,
.widefat th,
.widefat td{
padding:14px 12px;
border-bottom:1px solid #edf2f7;
}
#cursos table th,
.table-listagem th,
.kbk-report-table th,
.widefat thead th{
background:var(--kbk-brand);
color:#fff;
font-weight:600;
border:none;
}
#cursos table td.ativado{background:#eef8ee;color:var(--kbk-success);font-weight:600;}
#cursos table td.desativado{background:#fff5f5;color:var(--kbk-danger);font-weight:600;}
#cursos table td.apagado{background:#f7f7f7;color:#8a8a8a;}
.aluno-cursos-container{
padding:26px;
}
.aluno-cursos-container ul{
list-style:none;
padding:0;
margin:18px 0 0;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:14px;
}
.aluno-cursos-container ul li.curso-titulo,
.curso-titulo{
display:flex;
align-items:center;
min-height:80px;
padding:18px 20px;
border:1px solid var(--kbk-line);
border-radius:16px;
background:#fff;
cursor:pointer;
font-weight:600;
transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.aluno-cursos-container ul li.curso-titulo:hover,
.curso-titulo:hover{
transform:translateY(-2px);
border-color:var(--kbk-brand);
box-shadow:0 8px 22px rgba(23,96,128,.09);
}
.titulo-curso-individual,
.caminho-migalhas{
margin-bottom:8px;
font-size:14px;
color:var(--kbk-muted);
}
.container-modulos{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:16px;
margin-top:20px;
}
.container-modulos .modulo,
.etapa3 .modulo{
padding:18px;
}
.aula-titulo,
.titulo-certificado{
display:flex;
align-items:center;
gap:12px;
min-height:64px;
padding:14px 16px;
border-radius:14px;
background:#f8fbfd;
border:1px solid var(--kbk-line);
font-size:16px;
font-weight:700;
color:var(--kbk-text);
text-decoration:none;
cursor:pointer;
}
.video-material{
display:flex;
align-items:center;
gap:12px;
padding:14px 0 10px;
color:var(--kbk-muted);
font-size:14px;
}
.video-material img{width:28px;height:auto;object-fit:contain;}
.player-video{
position:relative;
margin-bottom:22px;
padding-bottom:56.25%;
border-radius:16px;
overflow:hidden;
background:#101820;
height:235px;
}
.player-video > div,
.player-video iframe,
ul.googlefile li iframe,
.video-frame{
position:relative;
inset:0;
width:100%;
height:235px;
border:none;
}
.html5-video-player .video-click-tracking, .html5-video-player .video-stream{
display: block !important;
height: 235px !important;
position: absolute;
top: 1px !important;
}
.player-video button,
ul.googlefile li button{
position:absolute;
inset:0;
width:100%;
height:100%;
opacity:0;
border:none;
background:transparent;
cursor:pointer;
}
.etapa3 .modulo a{
display:flex;
align-items:center;
gap:10px;
padding:12px 14px;
margin:10px 0 0;
border:1px solid var(--kbk-line);
border-radius:12px;
text-decoration:none;
color:var(--kbk-text);
}
.btnvoltar-area-aluno,
.voltar-etapa2,
#btetapa2,
#btetapa3{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
margin-top:18px;
padding:12px 18px;
border:none;
border-radius:999px;
background:var(--kbk-brand);
color:#fff;
font-weight:700;
cursor:pointer;
text-decoration:none;
}
.btnvoltar-area-aluno.is-hidden{display:none;}
#btetapa3{display:none;}
.kbk-loader-wrap{
display:flex;
align-items:center;
gap:12px;
padding:18px;
border:1px dashed var(--kbk-line);
border-radius:14px;
color:var(--kbk-muted);
background:#fff;
}
.kbk-loader{
width:18px;
height:18px;
border-radius:50%;
border:3px solid #d9e2ec;
border-top-color:var(--kbk-brand);
animation:kbkspin .75s linear infinite;
}
.kbk-inline-error,
.kbk-empty-state{
padding:16px 18px;
border-radius:14px;
background:#fff5f5;
border:1px solid #fed7d7;
color:#9b2c2c;
}
.kbk-empty-state{background:#fff;border-color:var(--kbk-line);color:var(--kbk-muted);}
.kbk-muted{color:var(--kbk-muted);}
.kbk-separator{margin:20px 0;border:none;border-top:1px solid var(--kbk-line);}
@keyframes kbkspin{to{transform:rotate(360deg);}}
@media (max-width: 980px){
.kbk-admin-grid{grid-template-columns:1fr;}
.aluno-cursos-container ul,
.container-modulos,
ul.googlefolder{grid-template-columns:1fr;}
}