/* Tra Cứu Khu Vực — ISL Education */

.sic-area-header { background: linear-gradient(135deg, #c41230, #8b0000); color: white; text-align: center; padding: 36px 20px; }
.sic-area-header h2 { font-size: 26px; margin: 0 0 6px; font-weight: 700; }
.sic-area-header p { font-size: 14px; opacity: .9; margin: 0; }

.sic-area-wrap { max-width: 1100px; margin: 0 auto; padding: 24px 16px 40px; }

.sic-area-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px;
  margin-bottom: 30px;
}
.sic-area-card {
  background: white; border: 1px solid #eee; border-radius: 10px; padding: 16px;
  cursor: pointer; transition: all .2s; text-align: center;
}
.sic-area-card:hover { border-color: #c41230; box-shadow: 0 4px 12px rgba(196,18,48,.1); }
.sic-area-card.active { border-color: #c41230; background: #fff3f5; box-shadow: 0 4px 12px rgba(196,18,48,.15); }
.sic-area-name { font-size: 15px; font-weight: 700; color: #1a1a1a; margin-bottom: 4px; }
.sic-area-meta { font-size: 11px; color: #888; }

/* Detail */
.sic-area-detail { margin-top: 10px; }
.sic-area-detail h3 { font-size: 18px; font-weight: 700; color: #1a1a1a; margin: 0 0 16px; padding-bottom: 10px; border-bottom: 2px solid #c41230; }

.sic-area-school {
  display: block; text-decoration: none; color: inherit;
  padding: 12px 16px; border: 1px solid #eee; border-radius: 8px; margin-bottom: 8px;
  transition: all .2s;
}
.sic-area-school:hover { border-color: #c41230; background: #fff9fa; text-decoration: none; color: inherit; }
.sic-area-school-name { font-size: 14px; font-weight: 600; color: #1a1a1a; display: flex; align-items: center; gap: 8px; }
.sic-area-school-meta { font-size: 12px; color: #888; margin-top: 3px; }

.sic-badge { padding: 2px 7px; border-radius: 4px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.sic-badge-rank { background: #fff3cd; color: #856404; }
.sic-muted { color: #aaa; font-size: 13px; text-align: center; padding: 30px 0; }

@media (max-width: 640px) {
  .sic-area-header h2 { font-size: 20px; }
  .sic-area-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
}