/* Admin panel refresh (galil-school.org). Loaded after the Flatkit theme; only restyles, no layout logic.
   Same type and colours as the public site: IBM Plex Sans Arabic/Hebrew, deep cypress green, ochre accent. */
@font-face { font-family: APlex; font-weight: 400; font-display: swap; src: url(../../../site/fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F; }
@font-face { font-family: APlex; font-weight: 600; font-display: swap; src: url(../../../site/fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format('woff2'); unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F; }
@font-face { font-family: APlex; font-weight: 400; font-display: swap; src: url(../../../site/fonts/ibm-plex-sans-arabic-latin-400-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F; }
@font-face { font-family: APlex; font-weight: 600; font-display: swap; src: url(../../../site/fonts/ibm-plex-sans-arabic-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F; }
@font-face { font-family: APlex; font-weight: 400; font-display: swap; src: url(../../../site/fonts/ibm-plex-sans-hebrew-hebrew-400-normal.woff2) format('woff2'); unicode-range: U+0590-05FF, U+FB1D-FB4F; }
@font-face { font-family: APlex; font-weight: 600; font-display: swap; src: url(../../../site/fonts/ibm-plex-sans-hebrew-hebrew-600-normal.woff2) format('woff2'); unicode-range: U+0590-05FF, U+FB1D-FB4F; }

:root {
  --a-bg: #f3f5f2;
  --a-card: #fff;
  --a-line: #e1e6df;
  --a-ink: #1a231e;
  --a-ink2: #5d6a62;
  --a-side: #0f2a1f;
  --a-side2: #16362a;
  --a-green: #1c6b4a;
  --a-green-d: #145238;
  --a-wash: #e8f1ec;
  --a-ochre: #e2ad2f;
  --a-red: #b8402d;
  --a-r: 12px;
}

/* ---------- base */
body, .app, .app-body, h1, h2, h3, h4, h5, h6, .btn, input, select, textarea, .form-control, .nav, .navbar, table {
  font-family: APlex, 'Segoe UI', Tahoma, Arial, sans-serif !important;
}
body, .app-body, #content, .app-content { background: var(--a-bg) !important; color: var(--a-ink); }
body { font-size: 15px; }
a { color: var(--a-green); }
a:hover, a:focus { color: var(--a-green-d); }
:focus-visible { outline: 3px solid var(--a-ochre) !important; outline-offset: 2px; }
.text-primary { color: var(--a-green) !important; }

/* ---------- sidebar */
.app-aside .navside, .app-aside .left, .app-aside .navside.dark { background: var(--a-side) !important; min-height: 100vh; }
.app-aside .navbar-brand { color: #fff !important; font-weight: 600; }
.app-aside .navbar-brand img { filter: none; }
.app-aside .nav-header small { color: rgba(255, 255, 255, .45) !important; font-size: 12px; letter-spacing: 0; }
.app-aside .nav > li > a { color: rgba(255, 255, 255, .82) !important; border-radius: 8px; margin: 1px 10px; padding-inline: 12px !important; transition: background .15s; }
.app-aside .nav > li > a:hover { background: var(--a-side2) !important; color: #fff !important; }
.app-aside .nav > li.active > a, .app-aside .nav-active-primary .nav > li.active > a { background: var(--a-side2) !important; color: #fff !important; box-shadow: inset -3px 0 0 var(--a-ochre); }
[dir="ltr"] .app-aside .nav > li.active > a { box-shadow: inset 3px 0 0 var(--a-ochre); }
.app-aside .nav-icon i { color: rgba(255, 255, 255, .6); }
.app-aside li.active > a .nav-icon i, .app-aside .nav > li > a:hover .nav-icon i { color: var(--a-ochre); }
.app-aside .nav-sub { background: transparent !important; }
.app-aside .nav-sub > li > a { color: rgba(255, 255, 255, .7) !important; margin: 0 10px; border-radius: 6px; }
.app-aside .nav-sub > li.active > a, .app-aside .nav-sub > li > a:hover { color: #fff !important; background: rgba(255, 255, 255, .06) !important; }
.app-aside .label.warn { background: var(--a-ochre) !important; color: #231a00 !important; }

/* ---------- top bar */
.app-header { background: var(--a-card) !important; box-shadow: none !important; border-bottom: 1px solid var(--a-line); }
.app-header .btn.info { background: var(--a-wash) !important; color: var(--a-green-d) !important; border: 0; border-radius: 20px; padding-inline: 14px; }
.app-header .btn.info:hover { background: #d8e9df !important; }
.app-header .label.warn, .label.warn { background: var(--a-ochre) !important; color: #231a00 !important; }
.app-header .navbar { min-height: 60px; }

/* ---------- boxes / page heads */
.padding { padding: 24px !important; }
.box { background: var(--a-card); border-radius: var(--a-r); border: 1px solid var(--a-line); box-shadow: none !important; overflow: hidden; }
.box-header, .box-header.dker, .dker { background: var(--a-card) !important; border-bottom: 1px solid var(--a-line); padding: 18px 22px !important; }
.box-header h3, .box-header h2 { font-size: 20px !important; font-weight: 600 !important; margin: 0 0 4px !important; color: var(--a-ink); }
.box-header small, .box-header small a { color: var(--a-ink2) !important; }
.box-tool .nav-link, .box-header .box-tool a { color: var(--a-ink2); }
.box-divider { background: var(--a-line) !important; }

/* tabs inside topic edit */
.nav-tabs, .nav-active-border .nav { border-bottom: 1px solid var(--a-line) !important; }
.nav-active-border .nav-link.active, .nav-active-border .nav-link.active:hover, .nav-tabs .nav-link.active { border-color: var(--a-green) !important; color: var(--a-green-d) !important; }
.nav-link { color: var(--a-ink2); }

/* ---------- buttons */
.btn { border-radius: 8px !important; font-weight: 600; box-shadow: none !important; }
.btn.primary, .btn-primary, .btn.success, .btn-success, .btn.accent { background: var(--a-green) !important; border-color: var(--a-green) !important; color: #fff !important; }
.btn.primary:hover, .btn-primary:hover, .btn.success:hover, .btn-success:hover { background: var(--a-green-d) !important; border-color: var(--a-green-d) !important; }
.btn.danger, .btn-danger { background: #fff !important; color: var(--a-red) !important; border: 1px solid #efc7bf !important; }
.btn.danger:hover, .btn-danger:hover { background: #fbeae6 !important; }
.btn.white, .btn-default, .btn.default { background: #fff !important; border: 1px solid var(--a-line) !important; color: var(--a-ink) !important; }
.btn.white:hover, .btn-default:hover { border-color: var(--a-green) !important; color: var(--a-green-d) !important; }
.btn.info { background: var(--a-wash) !important; color: var(--a-green-d) !important; border-color: transparent !important; }
.btn.warn { background: var(--a-ochre) !important; border-color: var(--a-ochre) !important; color: #231a00 !important; }
/* in SmartEnd "warning" is the delete button */
.btn.warning { background: #fff !important; color: var(--a-red) !important; border: 1px solid #efc7bf !important; }
.btn.warning:hover { background: #fbeae6 !important; }
.btn.dark-white { background: #fff !important; border: 1px solid var(--a-line) !important; color: var(--a-ink) !important; }
.btn-xs, .btn-sm { padding: 4px 12px; }
.btn-fw { min-width: 0; padding: 10px 18px; }

/* ---------- forms */
.form-control, select.form-control, .input-group-addon, .select2-container--default .select2-selection--single {
  border: 1px solid #cfd8d2 !important; border-radius: 8px !important; min-height: 40px; background-color: #fff;
}
.input-group > .form-control { border-radius: 8px !important; }
.form-control:focus { border-color: var(--a-green) !important; box-shadow: 0 0 0 3px rgba(28, 107, 74, .15) !important; }
.form-control-label, .control-label, label { color: var(--a-ink); font-weight: 600; }
.form-group { margin-bottom: 18px; }
.note-editor.note-frame, .note-editor { border: 1px solid #cfd8d2 !important; border-radius: 8px !important; overflow: hidden; }
.note-toolbar { background: #f7f8f6 !important; border-bottom: 1px solid var(--a-line) !important; }
.ui-check > i { border-color: #b7c3bb !important; border-radius: 4px; }
.ui-check > input:checked + i { background-color: var(--a-green) !important; border-color: var(--a-green) !important; }

/* ---------- tables */
.table { color: var(--a-ink); }
.table > thead > tr > th { background: #f7f8f6; color: var(--a-ink2); font-weight: 600; font-size: 13.5px; border-bottom: 1px solid var(--a-line) !important; border-top: 0 !important; padding: 12px !important; white-space: nowrap; }
.table > tbody > tr > td { border-top: 1px solid #edf0ec !important; padding: 12px !important; vertical-align: middle !important; }
.table-striped > tbody > tr:nth-of-type(odd) { background: transparent !important; }
.table > tbody > tr:hover { background: #f7faf8 !important; }
.table img.img-responsive, .table td img { border-radius: 6px; }
.table .form-control.row_no { width: 54px !important; min-height: 32px; text-align: center; padding: 2px; }
.table .text-success, .table .fa-check { color: var(--a-green) !important; }
.table td .btn { margin: 2px; }
.pagination > li > a, .pagination > li > span { border-radius: 8px !important; margin: 0 2px; border-color: var(--a-line); color: var(--a-ink); }
.pagination > .active > a, .pagination > .active > span { background: var(--a-green) !important; border-color: var(--a-green) !important; }
.dker.b-t, .box-footer, .p-a.dker { background: #f7f8f6 !important; }

/* alerts */
.alert { border-radius: 10px; border: 0; }
.alert-success { background: var(--a-wash); color: var(--a-green-d); }
.alert-danger { background: #fbeae6; color: #8a2a1b; }

/* the theme switcher cog (Flatkit demo setting) is not useful to school staff */
.app-content > .switcher, #switcher, .switcher { display: none !important; }

/* ---------- dashboard */
.dash { padding: 28px clamp(16px, 3vw, 36px) 40px; max-width: 1320px; }
.dash-hello { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 26px; flex-wrap: wrap; }
.dash-hello h1 { font-size: 26px; font-weight: 600; margin: 0; color: var(--a-ink); }
.dash-hello p { margin: 4px 0 0; color: var(--a-ink2); }
.dash-btn { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 20px; background: var(--a-wash); color: var(--a-green-d) !important; font-weight: 600; text-decoration: none !important; }
.dash-btn:hover { background: #d8e9df; }
.dash-h { font-size: 16px !important; font-weight: 600 !important; margin: 0 0 12px !important; color: var(--a-ink); }

.dash-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 26px; }
.dash-actions a { position: relative; display: flex; align-items: center; gap: 14px; padding: 16px 18px; background: var(--a-card); border: 1px solid var(--a-line); border-radius: var(--a-r); color: var(--a-ink) !important; text-decoration: none !important; transition: border-color .15s, background .15s; }
.dash-actions a:hover { border-color: var(--a-green); background: #fbfdfc; }
.dash-actions a .fa { width: 42px; height: 42px; flex: none; border-radius: 10px; background: var(--a-wash); color: var(--a-green); display: flex; align-items: center; justify-content: center; font-size: 19px; }
.dash-actions a span { display: flex; flex-direction: column; font-weight: 600; line-height: 1.35; min-width: 0; }
.dash-actions a small { font-weight: 400; color: var(--a-ink2); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-actions a.primary { background: var(--a-green); border-color: var(--a-green); color: #fff !important; }
.dash-actions a.primary:hover { background: var(--a-green-d); }
.dash-actions a.primary .fa { background: rgba(255, 255, 255, .16); color: #fff; }
.dash-actions a.primary small { color: rgba(255, 255, 255, .8); }
@media (max-width: 900px) { .dash-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dash-count { position: absolute; top: 10px; inset-inline-end: 12px; min-width: 22px; height: 22px; border-radius: 11px; background: var(--a-ochre); color: #231a00; font-size: 12px; display: flex; align-items: center; justify-content: center; padding: 0 6px; }

.dash-cols { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 18px; margin-bottom: 18px; align-items: start; }
.dash-cols.even { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
@media (max-width: 1100px) { .dash-cols { grid-template-columns: minmax(0, 1fr); } }
.dash-panel { background: var(--a-card); border: 1px solid var(--a-line); border-radius: var(--a-r); padding: 18px 20px; }
.dash-panel-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.dash-panel-head a { font-size: 13.5px; font-weight: 600; }
.dash-empty { color: var(--a-ink2); margin: 6px 0 4px; }

.dash-posts { list-style: none; margin: 0; padding: 0; }
.dash-posts li { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 10px 0; border-top: 1px solid #edf0ec; }
.dash-posts li:first-child { border-top: 0; }
.dash-posts .th { width: 64px; height: 48px; border-radius: 8px; background: var(--a-wash); overflow: hidden; display: flex; align-items: center; justify-content: center; position: relative; color: var(--a-green); }
.dash-posts .th img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dash-posts .t { display: block; font-weight: 600; color: var(--a-ink) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-posts .t:hover { color: var(--a-green) !important; }
.dash-posts .meta { display: flex; gap: 8px; align-items: center; font-size: 12.5px; color: var(--a-ink2); margin-top: 2px; flex-wrap: wrap; }
.chip { background: #eef1ed; color: var(--a-ink2); border-radius: 20px; padding: 1px 9px; font-size: 12px; }
.chip.off { background: #fbeae6; color: #8a2a1b; }
.dash-posts .acts { display: flex; gap: 6px; align-items: center; }
.dash-posts .acts a { padding: 5px 12px; border-radius: 8px; border: 1px solid var(--a-line); color: var(--a-ink) !important; font-size: 13px; font-weight: 600; text-decoration: none !important; }
.dash-posts .acts a:hover { border-color: var(--a-green); color: var(--a-green-d) !important; }

.dash-secs { list-style: none; margin: 0; padding: 0; }
.dash-secs li { display: flex; align-items: center; gap: 8px; border-top: 1px solid #edf0ec; }
.dash-secs li:first-child { border-top: 0; }
.dash-secs .nm { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 10px 0; color: var(--a-ink) !important; text-decoration: none !important; font-weight: 600; }
.dash-secs .nm:hover span { color: var(--a-green); }
.dash-secs .nm .fa { width: 34px; height: 34px; border-radius: 8px; background: var(--a-wash); color: var(--a-green); display: flex; align-items: center; justify-content: center; flex: none; }
.dash-secs .nm span { display: flex; flex-direction: column; line-height: 1.35; min-width: 0; }
.dash-secs small { font-weight: 400; color: var(--a-ink2); font-size: 12.5px; }
.dash-secs li.empty .nm { opacity: .6; }
.dash-secs .add { width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--a-line); display: flex; align-items: center; justify-content: center; color: var(--a-green) !important; flex: none; }
.dash-secs .add:hover { background: var(--a-wash); border-color: var(--a-green); }
.dash-links { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--a-line); }
.dash-links a { padding: 6px 12px; border-radius: 8px; background: #f3f5f2; color: var(--a-ink) !important; font-size: 13.5px; text-decoration: none !important; }
.dash-links a:hover { background: var(--a-wash); color: var(--a-green-d) !important; }

.dash-mini { list-style: none; margin: 0; padding: 0; }
.dash-mini li { border-top: 1px solid #edf0ec; }
.dash-mini li:first-child { border-top: 0; }
.dash-mini a { display: flex; flex-direction: column; padding: 10px 0; color: var(--a-ink) !important; text-decoration: none !important; }
.dash-mini b { font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-mini li.new b { font-weight: 600; }
.dash-mini small { color: var(--a-ink2); font-size: 12.5px; }

@media (max-width: 520px) {
  .dash { padding-top: 18px; }
  .dash-actions { gap: 8px; }
  .dash-actions a { flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px; }
  .dash-actions a small { white-space: normal; }
  .dash-posts li { grid-template-columns: 56px minmax(0, 1fr); }
  .dash-posts .th { width: 56px; }
  .dash-posts .t { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .dash-posts .acts { grid-column: 2; }
  .dash-panel { padding: 16px; }
}
