@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;600;800&display=swap');

* { box-sizing: border-box; }

.skema {
  width: 210mm;
  height: 148mm;
  font-family: 'Baloo 2', 'Comic Sans MS', sans-serif;
  background: #FFF8E7;
  overflow: hidden;
  position: relative;
}

.side-panel {
  position: absolute; top: 0; left: 0; width: 56mm; height: 148mm;
  background: #4A90D9;
  border-radius: 0 22mm 22mm 0;
}

.logo-corner {
  position: absolute; top: 6mm; left: 8mm;
  width: 30mm;
}
.logo-corner img { width: 100%; display: block; }

.sun-badge {
  position: absolute; top: 22mm; left: 13mm;
  width: 28mm;
}

.side-title {
  position: absolute; top: 54mm; left: 0; width: 56mm;
  text-align: center; color: #fff;
}

.side-title h1 {
  font-size: 23pt;
  margin: 0;
  font-weight: 800;
  color: #2B4C84;
  text-shadow: 1.5px 1.5px 0 #fff,
               -1.5px -1.5px 0 #fff,
               1.5px -1.5px 0 #fff,
               -1.5px 1.5px 0 #fff;
}

.name-field {
  position: absolute; top: 80mm; left: 8mm;
  width: 40mm;
  background: #fff;
  border: 1.2mm dashed #F6DC34;
  border-radius: 5mm;
  padding: 2mm;
  text-align: center;
}

.side-animal {
  position: absolute; bottom: 6mm; left: 8mm;
  width: 24mm;
}

.side-flower1 {
  position: absolute; bottom: 5mm; left: 37mm;
  width: 10mm;
}

.side-flower2 {
  position: absolute; bottom: 12mm; left: 44mm;
  width: 8mm;
}

.main-area {
  position: absolute; top: 0; left: 56mm;
  width: calc(210mm - 56mm);
  height: 148mm;
  padding: 6mm;
}

.schedule-wrap {
  background: #fff;
  border-radius: 6mm;
  border: 2mm solid #F6DC34;
  padding: 4mm;
  height: 100%;
  box-shadow: 0 3px 10px rgba(43,76,132,0.18);
}

.skema table {
  width: 100%;
  height: 100%;
  border-collapse: separate;
  border-spacing: 4px;
}

.skema th {
  background: #FF8C5A;
  color: #fff;
  border-radius: 4mm;
  padding: 4px;
}

.skema td {
  background: #FFF3CC;
  border-radius: 4mm;
  text-align: center;
  padding: 4px;
  color: #2B4C84;
  font-weight: 600;
}

.skema td.timecol {
  background: #4A90D9;
  color: #fff;
  font-weight: bold;
}

.skema table tr:nth-child(1) td {
  background: #FFF8E7;
  color: #2B4C84;
  font-weight: 600;
}

.skema table tr:nth-child(1) td.timecol {
  background: #4A90D9;
  color: #fff;
}