/* ── Global ── */
:root {
  --green:   #8CC63F;
  --green-d: #6fa32e;
  --blue:    #23afc0;
  --blue-d:  #007e8f;
  --gray-bg: #f0f2f5;
  --border:  #dee2e6;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  background: var(--gray-bg);
  font-size: 14px;
  direction: rtl;
}

/* ── Logo badge ── */
/* White halo behind the logo so its turquoise ring reads against the
   matching-color header/sidebar gradient instead of blending into it. */
.logo-badge {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  line-height: 0;
  background: #fff;
  border-radius: 50%;
  padding: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,.2), 0 0 0 1px rgba(0,0,0,.04);
}
.logo-badge img { display: block; }

/* ── Header ── */
.shnaton-header {
  background: linear-gradient(135deg, var(--blue-d), var(--blue));
  border-bottom: 3px solid var(--green);
  padding: 0.6rem 1rem;
}
.shnaton-header .navbar-brand {
  color: #fff !important;
  font-size: 1.1rem;
  font-weight: bold;
  gap: 10px;
}
.shnaton-header .navbar-brand img { height: 44px; }
.shnaton-header .btn-mobile-search {
  background: rgba(255,255,255,0.15);
  border: 1px solid rgba(255,255,255,0.3);
  color: #fff;
  border-radius: 8px;
  font-size: 13px;
  padding: 5px 14px;
}
.shnaton-header .btn-mobile-search:hover { background: rgba(255,255,255,0.25); }
.shnaton-header .header-links { gap: 8px; align-items: center; }
.shnaton-header .header-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.3);
  color: #fff;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 500;
  padding: 6px 12px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
}
.shnaton-header .header-link-btn:hover,
.shnaton-header .header-link-btn:focus { background: rgba(255,255,255,0.25); color: #fff; }

/* Mobile header menu (hamburger dropdown) */
/* The toggle sits inside a plain .dropdown wrapper div (needed for Bootstrap's
   dropdown positioning), which stretches to match the search button's height,
   but the button itself doesn't inherit that — fill it explicitly so both
   mobile buttons end up the same height. */
.shnaton-header .dropdown { display: flex; }
.shnaton-header .header-menu-toggle {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  font-size: 15px;
}
.shnaton-header .header-menu-toggle::after { display: none; }
.header-mobile-menu {
  border: none;
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0,0,0,.18);
  padding: 6px;
  min-width: 200px;
}
.header-mobile-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 8px;
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 13.5px;
}
.header-mobile-menu .dropdown-item:hover,
.header-mobile-menu .dropdown-item:focus { background: var(--gray-bg); color: var(--blue-d); }

/* ── Main layout ── */
.main-wrapper {
  max-width: 1300px;
  margin: 0 auto;
  padding: 16px 12px;
  gap: 16px;
  display: flex;
  align-items: flex-start;
}

/* ── Sidebar ── */
.sidebar {
  width: 300px;
  flex-shrink: 0;
  background: #fff;
  border-radius: 12px;
  border: 1px solid var(--border);
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  overflow: hidden;
}
.sidebar-header {
  background: linear-gradient(135deg, var(--blue-d), var(--blue));
  color: #fff;
  padding: 12px 16px;
  font-weight: bold;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sidebar-body { padding: 12px; }

/* Search item */
.search-block { margin-bottom: 12px; }
.search-block label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: #555;
  margin-bottom: 4px;
}
.search-block select,
.search-block input[type=text] {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 6px 10px;
  font-size: 13px;
  background: #fafafa;
  transition: border-color .2s;
  direction: rtl;
}
.search-block select:focus,
.search-block input[type=text]:focus {
  outline: none;
  border-color: var(--green);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(140,198,63,.15);
}

/* Checkboxes row */
.checks-row { display: flex; flex-wrap: wrap; gap: 6px 12px; }
.checks-row label { font-size: 13px; display: flex; align-items: center; gap: 4px; cursor: pointer; font-weight: normal; }
.checks-row input[type=checkbox] { accent-color: var(--green); width: 15px; height: 15px; cursor: pointer; }

/* Advanced section */
.advanced-toggle {
  background: none;
  border: none;
  padding: 0;
  color: var(--blue);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.advanced-toggle svg { transition: transform .2s; }
.advanced-toggle.open svg { transform: rotate(180deg); }
.advanced-panel { display: none; }
.advanced-panel.open { display: block; }

/* Action buttons */
.search-actions { display: flex; gap: 8px; margin-top: 4px; }
.btn-search {
  flex: 1;
  background: var(--green);
  border: none;
  color: #fff;
  border-radius: 8px;
  padding: 8px;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  transition: background .2s;
}
.btn-search:hover { background: var(--green-d); }
.btn-reset {
  background: #e9ecef;
  border: none;
  color: #555;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  cursor: pointer;
  transition: background .2s;
}
.btn-reset:hover { background: #dee2e6; }

/* Loader overlay */
#main-loader {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
}
#main-loader.active { display: flex; }
.loader-box {
  background: #fff;
  border-radius: 12px;
  padding: 24px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.2);
  font-size: 14px;
  color: #555;
}
.spinner {
  width: 36px; height: 36px;
  border: 3px solid var(--border);
  border-top-color: var(--green);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Results area ── */
.results-area {
  flex: 1;
  min-width: 0;
}

.results-header {
  background: #fff;
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: 14px 18px;
  margin-bottom: 12px;
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.results-header.visible { display: flex; }
.results-title { font-size: 16px; font-weight: bold; color: var(--blue); }
.export-btns { display: flex; gap: 8px; }
.export-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #fff;
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  color: #444;
  transition: all .2s;
}
.export-btn:hover { background: var(--gray-bg); border-color: #aaa; color: #222; }
.export-btn img { width: 20px; height: 20px; object-fit: contain; }

.results-content {
  background: #fff;
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: 16px;
  min-height: 200px;
}

/* ── Results: section headers ── */
.sub-titles, .sub-titles2 {
  background: linear-gradient(135deg, var(--blue-d), var(--blue));
  border: none;
  border-right: 5px solid var(--green);
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 10px;
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  width: auto !important;
  box-shadow: 0 2px 6px rgba(54,98,145,.25);
}
.sub-titles2 {
  background: linear-gradient(135deg, #1a4a3a, #2d7a5e);
  border-right-color: var(--green);
}
.sub-titles h2, .sub-titles2 h2 {
  display: inline;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,.75);
  margin: 0;
}
.sub-titles h3, .sub-titles2 h3 {
  display: inline;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  margin: 0 4px 0 0;
}

/* ── PDF buttons inside result headers ── */
.pdf-links-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
  width: 100%;
}
.result-pdf-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.35);
  color: #fff;
  border-radius: 6px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s;
  white-space: nowrap;
}
.result-pdf-btn:hover { background: rgba(255,255,255,.3); color: #fff; }
.result-pdf-btn img { width: 14px; height: 14px; object-fit: contain; }

/* ── PDF-only list (maslul 9991) ── */
.pdf-list-9991 {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 0;
}
.pdf-list-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  color: var(--blue-d);
  font-weight: 600;
  text-decoration: none;
  font-size: 15px;
  transition: box-shadow .15s, border-color .15s;
}
.pdf-list-item:hover { border-color: var(--blue); box-shadow: 0 2px 8px rgba(54,98,145,.15); }
.pdf-list-item img { width: 28px; height: 28px; object-fit: contain; }

/* ── Course items (generated by global.php) ── */
.course-item {
  width: auto !important;
  background: #f8f9fa !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  overflow: visible !important;
  transition: box-shadow .2s, border-color .2s;
}
.course-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,.08); border-color: #c8d8e8 !important; }

.course-item-main { padding: 10px 14px !important; }

/* Course field labels and values inline */
.course-item-title {
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #666 !important;
  margin-left: 2px !important;
  vertical-align: middle;
}
.course-item-title[id="course"] { margin-left: 6px !important; }

.course-item-value {
  display: inline-block !important;
  font-weight: bold !important;
  font-size: 13px !important;
  color: var(--blue) !important;
  margin-left: 14px !important;
  vertical-align: middle;
}
/* Course name/code — larger and prominent */
.course-item-value.v1 {
  color: #1a2e4a !important;
  font-size: 14px !important;
}
/* Semester, lecturer, day, year */
.course-item-value.v2 { color: #8CC63F !important; }
.course-item-value.v3 { color: #23afc0 !important; }
.course-item-value.v4, .course-item-value.v5 { color: #555 !important; }

/* ── Expand tabs row ── */
.expand-container {
  position: static !important;
  border-top: 1px solid #e2e8f0;
  padding: 6px 10px;
  display: flex !important;
  flex-wrap: wrap;
  gap: 4px;
  background: #fff;
  border-radius: 0;
  overflow: visible !important;
}

.course-expand {
  display: inline-flex !important;
  align-items: center;
  padding: 4px 12px !important;
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  background: #f0f4f8 !important;
  border: 1px solid #d0dce8 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  color: var(--blue) !important;
  transition: all .15s !important;
  white-space: nowrap;
  flex-shrink: 0;
}
.course-expand:hover {
  background: var(--green) !important;
  color: #fff !important;
  border-color: var(--green) !important;
}
.course-expand.tab-selected {
  background: var(--green) !important;
  color: #fff !important;
  border-color: var(--green-d) !important;
}

/* Shared panel below the tabs row — created by JS */
.tab-panel {
  border-top: 2px solid var(--green);
  border-radius: 0 0 10px 10px;
  background: #f8fafb;
  overflow-x: auto;
}

/* Info panel inside the shared panel */
.expand-info-container {
  position: static !important;
  display: none;
  width: auto !important;
  padding: 12px !important;
  background: transparent !important;
  border: none !important;
  margin: 0 !important;
  overflow-x: auto;
}

.expand-info-container table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  direction: rtl;
}
.expand-info-container td { padding: 6px 10px; border-bottom: 1px solid #e9ecef; }
.expand-info-container .title1 { font-weight: 700; color: #444; width: 120px; }
.expand-info-container .value1 { color: #222; }

/* ── Maslul items ── */
.maslul-item {
  width: auto !important;
  background: #e8f0ed !important;
  border: 1px solid #c8d8d4 !important;
  border-radius: 10px !important;
  margin-top: 16px !important;
  overflow: visible !important;
}
.maslul-item-main { padding: 10px 14px !important; }
.maslul-item-value { color: var(--blue) !important; font-size: 15px !important; }
.maslul-expand {
  display: inline-flex !important;
  align-items: center;
  padding: 4px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  background: #f0f4f8 !important;
  border: 1px solid #d0dce8 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  color: var(--blue) !important;
  transition: all .15s !important;
}
.maslul-expand:hover { background: var(--green) !important; color: #fff !important; }
.expand-maslul-container {
  position: static !important;
  display: none;
  padding: 12px !important;
  background: #f8fafb !important;
  border-top: 1px solid #c8d8d4;
  width: auto !important;
}

/* ── Note expand ── */
.note-expand {
  cursor: pointer;
  height: auto !important;
  position: static !important;
  top: auto !important;
  width: auto !important;
  margin-bottom: 0 !important;
  overflow: visible !important;
  background: #fffbea;
  border: 1px solid #f0d060;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 12px;
  display: inline-block;
}
.expand-info-note { display: none; margin-top: 6px; padding: 8px; background: #fffbea; border-radius: 6px; font-size: 13px; }

/* Loading placeholder inside expand panel */
.expand-info-container:empty::after { content: 'טוען...'; color: #aaa; font-size: 12px; }

/* Error messages in results */
.error-msg { color: #c00 !important; font-size: 14px !important; padding: 12px; background: #fff3f3; border-radius: 8px; }

/* ── Hoog menu ── */
#hoog {
  cursor: pointer;
  padding: 8px 12px;
  background: #fafafa;
  border: 1px solid var(--border);
  border-radius: 7px;
  color: #555;
  font-size: 13px;
  transition: border-color .2s;
}
#hoog:hover { border-color: var(--green); }
#hoog-container {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
}
#hoog-container.opened { max-height: 400px; overflow-y: auto; }

.hoog-accordion .accordion-item { border: none; border-bottom: 1px solid var(--border); }
.hoog-accordion .accordion-button {
  font-size: 13px;
  padding: 8px 12px;
  background: #f8f9fa;
  color: #333;
  box-shadow: none;
}
.hoog-accordion .accordion-button:not(.collapsed) { background: #eef4e3; color: var(--green-d); }
.hoog-accordion .accordion-button::after { margin-right: auto; margin-left: 0; }
.hoog-accordion .accordion-body { padding: 8px 12px; }
.hoog-sub-title { font-size: 12px; font-weight: 600; color: #555; margin: 6px 0 4px; }
.hekefeem-subs { list-style: none; padding: 0; margin: 0; }
.hekefeem-items {
  padding: 5px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  color: #444;
  transition: background .15s;
  display: flex;
  align-items: center;
}
.hekefeem-items::before {
  content: '▸';
  margin-left: 8px; /* RTL: left = after text direction */
  color: var(--green);
  font-size: 11px;
}
.hekefeem-items:hover { background: #eef4e3; color: var(--green-d); }

/* Selected hoogs */
#selected-hoogem { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.selected-hoog-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #eef4e3;
  border: 1px solid var(--green);
  border-radius: 20px;
  padding: 4px 10px 4px 6px;
  font-size: 12px;
  color: var(--green-d);
}
.remove-hoog-tag {
  background: none;
  border: none;
  padding: 0;
  font-size: 16px;
  cursor: pointer;
  color: var(--green-d);
  line-height: 1;
}
.remove-hoog-tag:hover { color: #c00; }

/* Hativot checkboxes */
#hativot { }
#hativot label { display: flex; align-items: center; gap: 6px; margin-bottom: 5px; font-size: 13px; cursor: pointer; }
#hativot input[type=checkbox] { accent-color: var(--green); width: 15px; height: 15px; }

/* Hours range */
.hours-range { display: flex; gap: 8px; align-items: center; }
.hours-range select { flex: 1; }
.hours-range span { color: #888; font-size: 12px; }

/* ── Visibility classes (show/hide logic) ── */
.visible1, .visible2, .visible3, .visible4, .visible5, .visible6 { }
.fieldcontainer.hidden-field { display: none !important; }

/* ── Offcanvas sidebar (mobile) ── */
.offcanvas-header { background: linear-gradient(135deg, var(--blue-d), var(--blue)); color: #fff; }
.offcanvas-header .btn-close { filter: invert(1); }
.offcanvas-body { padding: 12px; }
#searchOffcanvas { max-width: 320px; }

/* ── Responsive ── */
@media (max-width: 991px) {
  .main-wrapper { padding: 10px 8px; flex-direction: column; }
  .sidebar { width: 100%; border-radius: 0 0 12px 12px; }
  .results-area { width: 100%; }
  /* Bootstrap collapse: sidebar hidden by default on mobile */
  .sidebar.collapse:not(.show) { display: none !important; }
  .sidebar.collapse.show { display: block !important; }
}
@media (max-width: 767px) {
  .results-content { padding: 10px; }
  .course-expand { padding: 10px 12px; }
  .course-expand-title { font-size: 13px; }
  .results-header { flex-wrap: wrap; }
  .results-title { font-size: 14px; }
}
@media (min-width: 992px) {
  .btn-mobile-search { display: none !important; }
}

/* ── Admin / Login ── */
.admin-login-page {
  min-height: 100vh;
  background: linear-gradient(135deg, var(--blue-d), var(--blue));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.login-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0,0,0,.25);
  padding: 40px 36px;
  width: 100%;
  max-width: 380px;
  text-align: center;
}
.login-card .logo { height: 48px; }
.login-card .logo-badge { margin-bottom: 20px; }
.login-card h2 { font-size: 18px; color: var(--blue); margin-bottom: 24px; font-weight: bold; }
.login-card .form-control {
  border-radius: 9px;
  border-color: var(--border);
  font-size: 14px;
  padding: 10px 14px;
  direction: rtl;
  text-align: right;
}
.login-card .form-control:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(140,198,63,.15); }
.login-card .btn-login {
  background: var(--green);
  border: none;
  border-radius: 9px;
  color: #fff;
  padding: 10px;
  font-size: 15px;
  font-weight: bold;
  width: 100%;
  cursor: pointer;
  transition: background .2s;
}
.login-card .btn-login:hover { background: var(--green-d); }
.login-card .error-msg { background: #fff3f3; border: 1px solid #fcc; border-radius: 8px; padding: 10px; font-size: 13px; color: #c00; margin-bottom: 16px; display: none; }
.login-card .error-msg.show { display: block; }

/* Admin dashboard */
.admin-nav { background: var(--blue); }
.admin-nav .navbar-brand { color: #fff !important; font-weight: bold; font-size: 1rem; }
.admin-nav .nav-link { color: rgba(255,255,255,.85) !important; font-size: 14px; padding: 10px 16px !important; border-radius: 0; }
.admin-nav .nav-link:hover, .admin-nav .nav-link.active { background: rgba(255,255,255,.15) !important; color: #fff !important; }
.admin-nav .nav-link-logout { color: #fcc !important; }
.admin-content { padding: 24px; background: var(--gray-bg); min-height: calc(100vh - 56px); }
.editor-card { background: #fff; border-radius: 12px; border: 1px solid var(--border); padding: 24px; }
.editor-card h5 { color: var(--blue); font-size: 16px; font-weight: bold; margin-bottom: 20px; border-bottom: 2px solid var(--green); padding-bottom: 10px; }
.btn-save { background: var(--green); border: none; color: #fff; border-radius: 8px; padding: 9px 24px; font-size: 14px; cursor: pointer; font-weight: bold; }
.btn-save:hover { background: var(--green-d); }

/* TinyMCE container */
.tinymce-wrap { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }

/* Rational toggle button */
.rational-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.4);
  color: #fff;
  border-radius: 6px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  margin-right: 6px;
  transition: background .15s;
  vertical-align: middle;
}
.rational-toggle-btn:hover { background: rgba(255,255,255,.32); }
.rat-arrow { font-size: 10px; transition: transform .2s; display: inline-block; }
.rat-arrow.open { transform: rotate(90deg); }

/* Rational content panel */
.rational-panel {
  display: none;
  background: #f0f7ff;
  border: 1px solid #bdd6f0;
  border-radius: 0 0 10px 10px;
  padding: 16px 20px;
  margin-bottom: 10px;
  direction: rtl;
  text-align: right;
  line-height: 1.75;
  font-size: 14px;
  color: #1a2e4a;
}
.rational-panel.show { display: block; }
.rational-text-content h1,.rational-text-content h2,.rational-text-content h3 {
  color: var(--blue-d); font-size: 1em; margin: 8px 0 4px;
}
.rational-text-content p { margin: 0 0 8px; }
.rational-text-content ul, .rational-text-content ol { margin: 0 0 8px; padding-inline-start: 24px; }
/* Tables pasted via the admin rich-text editor arrive as bare <table> markup
   with no styling of their own — the editor's own stylesheet (which makes
   them look fine in admin) never reaches this page. */
.rational-text-content { overflow-x: auto; }
.rational-text-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0;
  font-size: 13.5px;
}
.rational-text-content th, .rational-text-content td {
  border: 1px solid #bdd6f0;
  padding: 6px 10px;
  text-align: right;
}
.rational-text-content th {
  background: rgba(54,98,145,.1);
  color: var(--blue-d);
  font-weight: 700;
}
.rational-text-content tr:nth-child(even) td { background: rgba(0,0,0,.02); }
.rational-pdf-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--blue-d);
  color: #fff;
  border-radius: 8px;
  padding: 8px 18px;
  font-weight: 700;
  text-decoration: none;
  font-size: 14px;
  transition: opacity .15s;
}
.rational-pdf-link:hover { opacity: .85; color: #fff; }