/* Grid */
.gppl-grid{display:grid;gap:16px;margin-top:16px}
@media(min-width:960px){.gppl-grid{grid-template-columns:repeat(12,minmax(0,1fr))}}
.gppl-grid--kpis>.gppl-card{grid-column:span 12}
@media(min-width:960px){.gppl-grid--kpis>.gppl-card{grid-column:span 4}}
.gppl-col-4{grid-column:span 12}@media(min-width:960px){.gppl-col-4{grid-column:span 4}}
.gppl-col-6{grid-column:span 12}@media(min-width:960px){.gppl-col-6{grid-column:span 6}}
.gppl-col-8{grid-column:span 12}@media(min-width:960px){.gppl-col-8{grid-column:span 8}}

/* Cards */
.gppl-card{background:#fff;border:1px solid #e0e0e0;border-radius:6px;padding:16px;box-shadow:0 1px 0 rgba(0,0,0,.02)}
.gppl-card__title{font-size:12px;color:#1e1e1e;opacity:.75;margin-bottom:6px}
.gppl-card__value{font-weight:700;font-size:22px;color:#101517}
.gppl-card__sub{font-size:11px;color:#6b6b6b}

/* Panels */
.gppl-panel{background:#fff;border:1px solid #e0e0e0;border-radius:6px;box-shadow:0 1px 0 rgba(0,0,0,.02);padding:12px}
.gppl-panel__head{font-size:13px;font-weight:600;margin:4px 0 10px}
.gppl-chart-wrap{position:relative;width:100%;height:320px}
.gppl-chart-wrap--donut{height:280px}

/* Tables */
.gppl-table{width:100%;border-collapse:collapse}
.gppl-table thead th{font-weight:600;font-size:12px;text-align:left;border-bottom:2px solid #e6e6e6;padding:10px 8px;color:#2c3338}
.gppl-table tbody td{border-bottom:1px solid #f0f0f0;padding:10px 8px;font-size:12px;color:#2c3338}

/* Badges */
.gppl-badge{display:inline-block;border-radius:4px;padding:2px 6px;font-size:11px;line-height:1.4;color:#fff;background:#007cba}
.gppl-badge.is-warn{background:#ffc107;color:#1e1e1e}
.gppl-badge.is-danger{background:#dc3545}

/* Responsive */
@media(max-width:782px){
  .gppl-chart-wrap{height:260px}
  .gppl-chart-wrap--donut{height:240px}
}