/* Meethaq Islamic Banking — storefront chrome */

:root {
  --meethaq-burgundy: #5C1520;
  --meethaq-burgundy-hover: #3D0E16;
  --meethaq-gold: #C4A35A;
  --meethaq-paper: #F7F4EF;
  --meethaq-ink: #1C1214;
  --meethaq-border: #E6DDD2;
  --meethaq-transition: 200ms ease;
}

body.page {
  color: var(--meethaq-ink);
  background-color: #fff;
  font-family: "IBM Plex Sans", "Lato", "Open Sans", sans-serif;
}

/* Arabic / RTL: Cairo everywhere (overrides Lato/Montserrat from main.css) */
html[dir="rtl"] body.page {
  font-family: "Cairo", sans-serif !important;
}

html[dir="rtl"] body.page h1,
html[dir="rtl"] body.page h2,
html[dir="rtl"] body.page h3,
html[dir="rtl"] body.page h4,
html[dir="rtl"] body.page h5,
html[dir="rtl"] body.page h6,
html[dir="rtl"] body.page p,
html[dir="rtl"] body.page a,
html[dir="rtl"] body.page span,
html[dir="rtl"] body.page li,
html[dir="rtl"] body.page label,
html[dir="rtl"] body.page button,
html[dir="rtl"] body.page input,
html[dir="rtl"] body.page select,
html[dir="rtl"] body.page textarea,
html[dir="rtl"] body.page .btn,
html[dir="rtl"] body.page .nav-link,
html[dir="rtl"] body.page .dropdown-item,
html[dir="rtl"] body.page .form-control,
html[dir="rtl"] body.page .bootstrap-select .filter-option,
html[dir="rtl"] body.page .bootstrap-select .dropdown-menu,
html[dir="rtl"] body.page .ui-title,
html[dir="rtl"] body.page .ui-title-sm,
html[dir="rtl"] body.page .ui-title-slogan,
html[dir="rtl"] body.page .main-slider__title,
html[dir="rtl"] body.page .main-slider__slogan,
html[dir="rtl"] body.page .main-slider__link,
html[dir="rtl"] body.page .b-find-nav__link,
html[dir="rtl"] body.page .b-find__label,
html[dir="rtl"] body.page .b-steps-list__title,
html[dir="rtl"] body.page .b-steps-list__info,
html[dir="rtl"] body.page .b-services-nav__info,
html[dir="rtl"] body.page .b-services-content__title,
html[dir="rtl"] body.page .b-goods-f__title,
html[dir="rtl"] body.page .b-goods-f__info,
html[dir="rtl"] body.page .b-goods-f__price,
html[dir="rtl"] body.page .b-progress-list__name,
html[dir="rtl"] body.page .b-bnr-3__title,
html[dir="rtl"] body.page .b-bnr-3__info,
html[dir="rtl"] body.page .footer,
html[dir="rtl"] body.page .footer-section__title,
html[dir="rtl"] body.page .footer-info,
html[dir="rtl"] body.page .footer-contacts__item,
html[dir="rtl"] body.page .footer-form__info,
html[dir="rtl"] body.page .footer-copyright,
html[dir="rtl"] body.page .top-bar,
html[dir="rtl"] body.page .top-bar__item,
html[dir="rtl"] body.page .header-contacts__inner,
html[dir="rtl"] body.page .section-title,
html[dir="rtl"] body.page .breadcrumb,
html[dir="rtl"] body.page .card,
html[dir="rtl"] body.page .table,
html[dir="rtl"] body.page .modal,
html[dir="rtl"] body.page .alert {
  font-family: "Cairo", sans-serif !important;
}

/* Logo sizing — height-driven for the wide wordmark */
.meethaq-logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}

.meethaq-logo--header {
  height: 52px;
  max-width: 180px;
  object-fit: contain;
}

.meethaq-logo--mobile {
  height: 44px;
  max-width: 160px;
  object-fit: contain;
  margin: 12px 16px;
}

.meethaq-logo--footer {
  height: 44px;
  max-width: 160px;
  object-fit: contain;
  margin: 0 auto;
}

.footer-logo {
  display: inline-block;
  background: #fff;
  border-radius: 8px;
  padding: 10px 16px;
  border: 1px solid var(--meethaq-gold);
}

.meethaq-logo--finance {
  height: 56px;
  max-width: 200px;
  object-fit: contain;
  margin: 0 auto;
}

.meethaq-finance__brand {
  display: inline-block;
  background: #fff;
  border-radius: 8px;
  padding: 12px 20px;
  margin: 0 auto 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
  border: 1px solid var(--meethaq-gold);
}

.header-main .navbar-brand {
  top: -12px;
}

.header-main .navbar-brand .meethaq-logo--header {
  margin: 0;
}

@media (max-width: 991.98px) {
  .header-main .navbar-brand {
    top: 0;
  }

  .meethaq-logo--header {
    height: 44px;
    max-width: 140px;
  }
}

/* Top bar — burgundy chrome with gold accent */
.top-bar {
  background-color: var(--meethaq-burgundy);
}

.top-bar__inner:after {
  border-color: var(--meethaq-burgundy) var(--meethaq-burgundy) transparent transparent;
}

.top-bar__item {
  border-color: rgba(255, 255, 255, 0.25);
}

.top-bar__link:hover {
  color: var(--meethaq-gold) !important;
}

.top-bar .btn.btn-primary {
  background-color: var(--meethaq-gold) !important;
  border-color: var(--meethaq-gold) !important;
  color: var(--meethaq-ink) !important;
}

.top-bar .btn.btn-primary:hover,
.top-bar .btn.btn-primary:focus {
  background-color: #b08f48 !important;
  border-color: #b08f48 !important;
  color: var(--meethaq-ink) !important;
}

/* Header */
.header {
  background: #fff;
  border-bottom: 1px solid var(--meethaq-border);
}

.header.navbar-scrolling {
  box-shadow: 0 1px 8px rgba(92, 21, 32, 0.12);
  opacity: 1;
}

.main-menu .nav-link {
  transition: color var(--meethaq-transition);
}

.navbar-nav .nav-link:hover,
.main-menu .nav-link:hover {
  color: var(--meethaq-burgundy) !important;
}

.nav-link.active:after,
.widget-title:after {
  border-top-color: var(--meethaq-gold);
  border-left-color: var(--meethaq-gold);
}

/* Buttons — stable press (color/shadow only) */
.btn-primary {
  background-color: var(--meethaq-burgundy) !important;
  border-color: var(--meethaq-burgundy) !important;
  color: #fff !important;
  transition: background-color var(--meethaq-transition),
    border-color var(--meethaq-transition),
    box-shadow var(--meethaq-transition),
    color var(--meethaq-transition);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--meethaq-burgundy-hover) !important;
  border-color: var(--meethaq-burgundy-hover) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(92, 21, 32, 0.28);
}

.btn-primary:active {
  background-color: var(--meethaq-burgundy-hover) !important;
  box-shadow: 0 2px 6px rgba(92, 21, 32, 0.22);
  transform: none;
}

.btn-default:hover,
.btn-border:hover {
  background-color: var(--meethaq-burgundy) !important;
  border-color: var(--meethaq-burgundy) !important;
  color: #fff !important;
}

/* Focus ring */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
.page-link:focus-visible,
.selectpicker:focus-visible {
  outline: 2px solid var(--meethaq-gold);
  outline-offset: 2px;
}

/* Footer */
.footer {
  background-color: var(--meethaq-ink);
  border-top: 3px solid var(--meethaq-gold);
}

.footer a:hover {
  color: var(--meethaq-gold) !important;
}

.footer-soc__link:hover {
  color: var(--meethaq-gold);
}

.footer__btn-up:hover .ic {
  color: var(--meethaq-gold) !important;
}

/* Finance band */
.meethaq-finance,
.b-bnr-3.meethaq-finance {
  background-color: var(--meethaq-burgundy) !important;
  background-image: linear-gradient(135deg, #5C1520 0%, #3D0E16 55%, #2a0a10 100%) !important;
  border-top: 2px solid var(--meethaq-gold);
  border-bottom: 2px solid var(--meethaq-gold);
}

.meethaq-finance .container > .row > .col-12 {
  text-align: center;
}

.meethaq-finance .b-bnr-3__title,
.meethaq-finance .b-bnr-3__info {
  color: #fff;
}

.meethaq-finance .btn-primary {
  background-color: var(--meethaq-gold) !important;
  border-color: var(--meethaq-gold) !important;
  color: var(--meethaq-ink) !important;
}

.meethaq-finance .btn-primary:hover,
.meethaq-finance .btn-primary:focus {
  background-color: #b08f48 !important;
  border-color: #b08f48 !important;
  color: var(--meethaq-ink) !important;
}

/* Search / find tabs accent */
.b-find-nav__link.active,
.b-find-nav__link:hover {
  color: var(--meethaq-burgundy);
}

/* Soft paper surfaces */
.bg-light,
.section-area.bg-light {
  background-color: var(--meethaq-paper) !important;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}