/* Theme */
:root { --mx: 1100px; --accent: #1a9e2c; }
* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; margin:0; background:#f6f8f6; color:#222; }
header, main, footer { max-width: var(--mx); margin: 0 auto; padding: 16px; }
header nav a { margin-right: 12px; }
a { text-decoration: none; color: #0b57d0; }
.container { background:#fff; border:1px solid #e5e5e5; border-radius:16px; padding:16px; }
h1,h2,h3 { margin: 8px 0 12px; }
label { font-weight: 600; display:block; margin-top: 8px; }
input, select, textarea { width:100%; padding:10px; border:1px solid #dcdcdc; border-radius:10px; margin-top:6px; }
button, .btn { display:inline-block; padding:10px 14px; border:1px solid #dcdcdc; border-radius:10px; background:#f2f4f2; cursor:pointer; }
button.primary, .btn.primary { background: var(--accent); border-color: var(--accent); color:#fff; }
.badge { display:inline-block; padding:2px 8px; border-radius:999px; background:#eaf7ec; color:#0d652d; font-size:12px; }
.row { display:flex; gap:16px; flex-wrap:wrap; }
.col { flex:1 1 280px; }
.table { width:100%; border-collapse: collapse; }
.table th, .table td { border-bottom:1px solid #eee; padding:10px; text-align:left; }
.card { background:#fff; border:1px solid #ececec; border-radius:12px; padding:12px; }
.grid { display:grid; gap:16px; }
.grid.two { grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); }
.grid.three { grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); }

/* Стили для карточек студентов */
.student-card {
    display: flex;
    align-items: center;
}
.student-card-photo {
    width: 64px;
    margin-right: 12px;
}
.student-card-photo-inner {
    width: 64px;
    height: 64px;
    border-radius: 10px;
    background: #eaeaea;
    overflow: hidden;
}
.student-card-content {
    flex: 1;
}
.student-card-name {
    display: block;
    margin-bottom: 8px;
}
.student-card-info {
    margin-bottom: 8px;
}
.student-card-direction {
    margin-right: 24px;
}
.student-card-info .bi {
    margin-right: 4px;
    font-size: 14px;
}
.badge .bi {
    margin-right: 4px;
}
.student-card-actions {
    margin-left: auto;
}
.student-card-actions .btn:not(:last-child) {
    margin-right: 8px;
}
.flash { padding:10px; border-radius:8px; margin:8px 0; }
.flash-success { background:#e6f4ea; border:1px solid #b7e1cd; color:#196a3b; }
.flash-error { background:#fce8e6; border:1px solid #f4bab6; color:#aa1808; }
footer { color:#6b6b6b; font-size:14px; }
hr { border:0; border-bottom:1px solid #eee; margin:16px 0; }
.nav-admin a { margin-right: 10px; }
input[type="checkbox"] { width: auto; }
.small { font-size: 12px; color:#666; }

/* Утилиты для размеров */
.w-100 { width: 100% !important; }
.h-100 { height: 100% !important; }

/* Отступы и поля */
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.me-2 { margin-right: 0.5rem !important; }
.me-3 { margin-right: 1rem !important; }
.py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }

/* Flexbox утилиты */
.d-flex { display: flex !important; }
.flex-column { flex-direction: column !important; }
.align-items-center { align-items: center !important; }

/* Text utilities */
.text-center { text-align: center !important; }
.text-primary { color: var(--accent) !important; }
.text-muted { color: #6c757d !important; }
.fw-bold { font-weight: bold !important; }
.lead { font-size: 1.25rem !important; }
.lh-lg { line-height: 1.8 !important; }

/* Bootstrap-like компоненты */
.shadow-sm { box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important; }
.btn-outline-secondary { 
    background-color: transparent;
    border-color: #6c757d;
    color: #6c757d;
}
.btn-outline-secondary:hover {
    background-color: #6c757d;
    color: #fff;
}
.btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

/* Alert styles */
.alert {
    position: relative;
    padding: 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.375rem;
}
.alert-light {
    background-color: #fafafa;
    border-color: #e3e3e3;
}

/* Стили для информационных секций */
.info-section {
    position: relative;
}

.icon-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 1rem;
}

.bg-primary-soft {
    background-color: rgba(26, 158, 44, 0.1);
}

.text-secondary {
    color: #4a5568 !important;
}

.section-content {
    padding-left: 2.75rem;
}

/* Стили иконок */
.bi {
    font-size: 0.875rem;
}

/* Notifications bell */
.notif-bell {
  position: relative;
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  background: #fff;
}
.notif-dot {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #e53935;
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
  padding: 3px 6px;
  border: 2px solid #fff;
}


/* Home */
.section { margin-top: 28px; }
.section-title { font-size: 22px; margin-bottom: 12px; }
.lead { margin: 6px 0 14px; font-size: 16px; color:#333; }

.hero {
  border:1px solid #e6e6e6; border-radius:16px; padding:0;
  overflow:hidden; position:relative; background: linear-gradient(180deg,#f7fbf7 0%, #ffffff 40%);
}
.hero::after {
  content:'';
  position:absolute; inset:0;
  background-image: url('/assets/bg_wheat.svg');
  background-repeat: repeat;
  background-size: 320px auto;
  opacity: .08;
  pointer-events: none;
  z-index: 0;
}
.hero-inner { position: relative; z-index: 1; padding: 20px; display:grid; grid-template-columns: 1.1fr 1fr; gap: 20px; align-items: center; }
.hero-content h1 { font-size: 28px; margin-bottom: 6px; }
.hero-media { display:grid; gap:12px; }
.hero-main { width:100%; height:300px; object-fit: cover; border-radius: 14px; border:1px solid #e6e6e6; }
.hero-thumb { width:100%; height:120px; object-fit: cover; border-radius: 12px; border:1px solid #e6e6e6; }

.cta { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin: 8px 0 10px; }

.metrics { display:grid; grid-template-columns: repeat(4, minmax(120px,1fr)); gap:10px; margin-top: 8px; }
.metric { background:#fff; border:1px solid #ececec; border-radius:12px; padding:12px; text-align:center; }
.metric .num { font-size:22px; font-weight:700; color: var(--accent); }
.metric .cap { font-size:12px; color:#555; }

.banner-img { width:100%; height:180px; object-fit: cover; border-radius: 12px; border:1px solid #eee; margin-bottom:8px; }
.card-info h3 { margin-bottom: 6px; }
.list { margin: 0 0 0 18px; padding: 0; }
.list li { margin: 4px 0; }

.steps { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:12px; }
.step { background:#fff; border:1px solid #ececec; border-radius:12px; padding:12px; }
.step-num { width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:#eaf7ec; color:#0d652d; font-weight:700; margin-bottom:6px; }

.college-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:12px; }
.college-card { background:#fff; border:1px solid #ececec; border-radius:12px; padding:12px; }

.map-embed { border:1px solid #ececec; border-radius:12px; padding:12px; background:#fff; }

@media (max-width: 920px){
  .hero-inner{ grid-template-columns: 1fr; }
  .hero-media{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .hero-main, .hero-thumb { height: auto; }
}
@media (max-width: 600px){
  .hero-media{ grid-template-columns: 1fr; }
  .hero-main, .hero-thumb { height: auto; }
}

.card-link { display:block; text-decoration:none; color:inherit; transition:transform .08s ease, box-shadow .12s ease, border-color .12s ease; }
.card-link:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.06); border-color:#bfe2c4; }
.card-link:active { transform: translateY(0); box-shadow: 0 2px 8px rgba(0,0,0,.05); }
.card-link h3 { display:flex; align-items:center; gap:.4em; }
.card-link h3::after { content:"→"; font-weight:600; opacity:.7; }

html, body { max-width:100%; overflow-x:hidden; }

/* Map */
#raions-map { width:100%; height:420px; border:1px solid #e6e6e6; border-radius:12px; overflow:hidden; }
.map-caption { font-size:12px; color:#666; margin-top:6px; }
.leaflet-container a { color:#0b57d0; }

/* Header/Nav */
.site-nav{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.site-logo img{height:45px;width:auto;display:block;}
.site-logo{flex:0 0 auto;}
.site-right{margin-left:auto;display:flex;align-items:center;gap:8px;}
.nav-toggle{
  appearance:none;background:#fff;border:1px solid #ddd;border-radius:8px;
  padding:6px 10px;font-size:20px;line-height:1;cursor:pointer;display:none;
}
.site-menu{display:flex;align-items:center;gap:14px;margin-left:0;flex:1 1 100%;justify-content:flex-start;}
.site-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.site-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.site-actions .btn{padding:6px 10px;border:1px solid #ddd;border-radius:8px;text-decoration:none;}
.notif-bell{position:relative;display:inline-block;padding:6px 10px;border:1px solid #e0e0e0;border-radius:10px;background:#fff;}
.notif-dot{position:absolute;top:-6px;right:-6px;background:#e53935;color:#fff;border-radius:999px;font-size:11px;line-height:1;padding:3px 6px;border:2px solid #fff;}

@media (min-width: 921px){
  .site-menu{order:2;flex:0 1 auto;margin-left:auto;justify-content:flex-end;}
}

@media (max-width: 920px){
  .nav-toggle{display:inline-flex;align-items:center;justify-content:center;}
  .site-menu{display:none;width:100%;order:3;flex-direction:column;align-items:flex-start;gap:10px;padding-top:10px;border-top:1px solid #eee;}
  .site-menu.open{display:flex;}
  .site-links, .site-actions{width:100%;gap:10px;}
  .site-actions .btn{width:auto;}
}

/* HERO responsive fixes */
.hero{overflow:hidden;}
.hero-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;align-items:center;}
.hero-content *{max-width:100%;}
.hero-media{display:grid;gap:12px;}
.hero-main,.hero-thumb{width:100%;height:auto;object-fit:cover;display:block;max-width:100%;}
.hero-main{max-height:320px;}
.hero-thumb{max-height:180px;}
@media (max-width: 920px){
  .hero-inner{grid-template-columns:1fr !important;}
  .hero-content{order:1;}
  .hero-media{order:2;grid-template-columns:1fr !important;}
  .hero-main,.hero-thumb{height:auto !important;max-height:none;}
  .metrics{grid-template-columns:repeat(2,minmax(120px,1fr)) !important;}
  .cta{display:flex;flex-wrap:wrap;gap:8px;}
  .cta .btn{flex:1 1 auto;}
}
@media (max-width: 520px){
  .metrics{grid-template-columns:1fr 1fr !important;}
  .cta{flex-direction:column;}
  .cta .btn{width:100%;text-align:center;}
}

/* === Responsive tables === */
.table-wrap{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table{ width:100%; border-collapse: collapse; }
.table th, .table td { border-bottom:1px solid #eee; padding:10px; text-align:left; vertical-align: top; }
.table--wide { min-width: 920px; }
.nowrap { white-space: nowrap; }
.btn.small { padding:6px 10px; font-size:14px; }

/* Optional scrollbar styling (webkit) */
.table-wrap::-webkit-scrollbar { height: 10px; }
.table-wrap::-webkit-scrollbar-thumb { background: #c9d9cc; border-radius: 6px; }
.table-wrap::-webkit-scrollbar-track { background: #f2f4f2; }