/* RTL + app-specific overrides for the Bootstrap 4 template (style.css). */

html[dir="rtl"] body {
  direction: rtl;
}

/* Arabic-friendly font (icons keep their own Font Awesome family) */
body,
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.btn,
.navbar-light .navbar-nav .nav-link,
input, textarea, select, button {
  font-family: "Cairo", "Segoe UI", Tahoma, sans-serif;
}

/* Flip helpers used by the template */
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.ml-lg-3 { margin-right: 1rem !important; margin-left: 0 !important; }
.mr-3 { margin-left: 1rem !important; margin-right: 0 !important; }
.pl-2 { padding-right: .5rem !important; padding-left: 0 !important; }
.pr-2 { padding-left: .5rem !important; padding-right: 0 !important; }

/* Navbar */
.navbar .navbar-brand { float: right; }
.navbar-nav .nav-item { text-align: right; }
.navbar-nav .nav-link { padding-right: 15px; padding-left: 30px; }
.navbar-brand img { height: 48px; width: auto; }

/* Page headers */
.jumbotron, .page-header { text-align: right; }

/* Accessibility: visible keyboard focus */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 3px solid #F6B93B;
  outline-offset: 2px;
}

/* Course cards */
.courses-list-item img,
.courses-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

/* Home course slider */
.courses-swiper { direction: rtl; padding-bottom: 8px; }

/* PDF viewer */
.pdf-viewer canvas { max-width: 100%; height: auto !important; box-shadow: 0 2px 12px rgba(0, 0, 0, .15); }

/* ---- Design refresh ---- */

/* Hero */
.hero-content { padding: 4.5rem 0 5rem; }
.hero-search { max-width: 640px; }
.hero-search .form-control,
.hero-search .btn { border-radius: 0; height: 64px; font-size: 1.1rem; }
.hero-search .form-control { padding: 0 1.5rem !important; }

/* Section titles: consistent rhythm */
.section-title h2 { font-weight: 700; }

/* Cards */
.courses-item,
.courses-list-item {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .12);
  transition: transform .2s ease, box-shadow .2s ease;
}
.courses-item:hover,
.courses-list-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
}
.courses-item .courses-text h4,
.courses-list-item .courses-text h4 { font-size: 1.15rem; line-height: 1.6; text-shadow: 0 1px 6px rgba(0, 0, 0, .35); }
.courses-swiper { padding: 8px 12px 16px !important; }
.courses-swiper .swiper-button-next,
.courses-swiper .swiper-button-prev { color: #fff; background: rgba(0, 0, 0, .45); width: 40px; height: 40px; border-radius: 50%; }
.courses-swiper .swiper-button-next::after,
.courses-swiper .swiper-button-prev::after { font-size: 16px; font-weight: 700; }

/* Forms */
.contact-form .form-control {
  background: #f7f3f0;
  border: 1px solid #e4dbd5;
  border-radius: 8px;
  padding: .85rem 1rem;
  height: auto;
  font-size: 1rem;
}
.contact-form .form-control:focus { background: #fff; border-color: #2878EB; box-shadow: 0 0 0 3px rgba(40, 120, 235, .15); }
.contact-form .btn { border-radius: 8px; }

/* Contact info panel */
.bg-light.px-5.py-5 { border-radius: 12px; }

/* Generic buttons */
.btn { border-radius: 6px; }

/* Mobile */
@media (max-width: 575.98px) {
  .hero-content { padding: 3rem 0; }
  .hero-content h1 { font-size: 2rem; }
  .hero-search .form-control, .hero-search .btn { height: 54px; }
  .display-4 { font-size: 2rem; }
  .display-1 { font-size: 3rem; }
}

/* Tighter vertical rhythm on phones */
@media (max-width: 767.98px) {
  .container-fluid.py-5, .container.py-5 { padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
  .hero-search { padding: 0 4px; }
}