:root {
  --brand-primary: #FACC15;
  --brand-slate: #0f172a;
  --safe-top: env(safe-area-inset-top, 0);
  --safe-bottom: env(safe-area-inset-bottom, 0);
  --safe-left: env(safe-area-inset-left, 0);
  --safe-right: env(safe-area-inset-right, 0);
}

body {
  font-family: 'Inter', sans-serif;
  background-color: #ffffff;
  color: var(--brand-slate);
  overflow-x: hidden;
  scroll-behavior: smooth;
}

/* App shell: mobile full-height, prevent pull-to-refresh overflow */
.app-shell {
  min-height: 100vh;
  min-height: 100dvh;
}
@supports (min-height: -webkit-fill-available) {
  .app-shell {
    min-height: -webkit-fill-available;
  }
}

/* Safe area insets for notched devices */
.safe-top {
  padding-top: var(--safe-top);
}
.safe-bottom {
  padding-bottom: var(--safe-bottom);
}
.safe-left {
  padding-left: var(--safe-left);
}
.safe-right {
  padding-right: var(--safe-right);
}

/* Mobile: prevent overscroll bounce (app-like) */
@media (max-width: 767px) {
  body {
    overscroll-behavior-y: none;
  }
  .main-content {
    padding-left: var(--safe-left);
    padding-right: var(--safe-right);
  }
}

/* Burger panel: RTL opens from left */
body[dir="rtl"] #burger-panel {
  right: auto;
  left: 0;
  transform: translateX(-100%);
}
body[dir="rtl"] #burger-panel.burger-open {
  transform: translateX(0);
}
#burger-panel.burger-open {
  transform: translateX(0);
}
body[dir="rtl"] .burger-nav-link.border-l-2 {
  border-left: 0;
  border-right: 2px solid #eab308;
}

/* Touch-friendly: remove tap highlight, add active state */
@media (hover: none) and (pointer: coarse) {
  button, a, [role="button"] {
    -webkit-tap-highlight-color: transparent;
    tap-highlight-color: transparent;
  }
}

body[dir="rtl"] {
  font-family: 'IBM Plex Sans Arabic', sans-serif;
}

h1, h2, h3, .font-heading {
  font-family: 'Plus Jakarta Sans', sans-serif;
}

body[dir="rtl"] h1,
body[dir="rtl"] h2,
body[dir="rtl"] h3 {
  font-family: 'IBM Plex Sans Arabic', sans-serif;
}

.background-image-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -4;
  background-image: url('https://images.unsplash.com/photo-1541888946425-d81bb19480c5?q=80&w=2070&auto=format&fit=crop');
  background-size: cover;
  background-position: center;
  filter: grayscale(100%) brightness(0.9);
}

.mesh-gradient {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -3;
  background-color: rgba(255, 255, 255, 0.88);
  background-image:
    radial-gradient(at 100% 0%, hsla(45, 100%, 94%, 0.8) 0, transparent 40%),
    radial-gradient(at 0% 100%, hsla(215, 25%, 92%, 0.7) 0, transparent 50%);
  backdrop-filter: blur(8px);
}

.card-blur {
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  10%, 30%, 50%, 70%, 90% { transform: translateX(-4px); }
  20%, 40%, 60%, 80% { transform: translateX(4px); }
}

.animate-shake {
  animation: shake 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

[data-page] {
  display: none;
}

[data-page].active {
  display: block;
}

.lang-only {
  display: none !important;
}

body.lang-en .lang-only.lang-en {
  display: inline-flex !important;
}

body.lang-ar .lang-only.lang-ar {
  display: inline-flex !important;
}

body[dir="rtl"] #form-msg {
  left: auto;
  right: 1rem;
}

/* ===== Admin shared styles (centralized) ===== */
@media (max-width: 767px) {
  body.sidebar-open { overflow: hidden; }
}
.sidebar-backdrop { transition: opacity 0.2s; }
.safe-area-inset {
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
}
header.safe-area-inset { padding-top: env(safe-area-inset-top, 0); }
main.safe-area-inset { padding-bottom: env(safe-area-inset-bottom, 0); }

/* campaigns.php */
.font-heading-hy { font-family: 'Noto Serif Armenian', 'Inter', serif; }
.campaign-card-glow { box-shadow: 0 4px 24px rgba(15, 23, 42, 0.06), 0 0 0 1px rgba(15, 23, 42, 0.04); }
.campaign-hero-glow {
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(250, 204, 21, 0.14) 0%, transparent 55%),
    radial-gradient(100% 90% at 0% 100%, rgba(20, 184, 166, 0.12) 0%, transparent 50%),
    #fff;
}
.cc-platform.is-selected {
  box-shadow: 0 0 0 2px #0f172a;
  border-color: #0f172a;
  background: #fff;
}
.cc-date-wrap { position: relative; }
.cc-date-wrap input[type="date"] { color-scheme: light; }
.cc-date-wrap input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 2.75rem;
  height: 100%;
  cursor: pointer;
}

/* statistics.php */
.chart-point:hover .chart-tooltip { opacity: 1; }

.acq-chart-card {
  border-radius: 2rem;
  border: 1px solid #e3ebf7;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.045);
}
.acq-hero-icon {
  display: inline-flex;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: #f7f2cf;
  align-items: center;
  justify-content: center;
}
.acq-hero-icon-ring {
  display: inline-flex;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 2px solid #102955;
  align-items: center;
  justify-content: center;
  color: #102955;
  background: #eef3fb;
}
.acq-scroll-track {
  height: 6px;
  border-radius: 999px;
  background: #d7e1ef;
  position: relative;
}
.acq-scroll-thumb {
  position: absolute;
  left: 8%;
  width: 42%;
  top: 0;
  bottom: 0;
  border-radius: 999px;
  background: #b4c5dd;
}

/* sendemail.css (merged) */
.sendemail-tabs-wrap { margin-bottom: 0; }
.sendemail-tabs {
  display: flex;
  gap: 0;
  background: #fff;
  border-radius: 12px;
  padding: 4px;
  box-shadow: 0 1px 3px rgb(0 0 0 / 8%);
  border: 1px solid #e5e7eb;
  overflow: hidden;
}
.sendemail-tab {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 600;
  color: #6b7280;
  background: transparent;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  transition: color 0.2s, background 0.2s;
}
.sendemail-tab i { font-size: 18px; opacity: 0.9; }
.sendemail-tab:hover { color: #374151; background: #f9fafb; }
.sendemail-tab.active {
  color: #000;
  background: #f8c905;
  box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}
.sendemail-tab.active i { color: #000; }
.sendemail-panel-sms,
.sendemail-panel-email { flex: 1; min-width: 200px; }
.sendemail-content-wrap {
  flex: 1;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.sendemail-content-wrap .sendemail-panel { width: 100%; }
.sendemail-field-sms-full { flex: 1; min-width: 100%; max-width: 100%; }
.sendemail-sms-textarea {
  width: 100%;
  min-height: 120px;
  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.5;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  resize: vertical;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.sendemail-sms-textarea:focus {
  outline: none;
  border-color: #f8c905;
  box-shadow: 0 0 0 3px rgb(248 201 5 / 20%);
}
.sendemail-sms-textarea::placeholder { color: #9ca3af; }
.sendemail-sms-charcount {
  margin-top: 8px;
  font-size: 12px;
  font-weight: 600;
  color: #9ca3af;
  text-align: right;
}
.sendemail-sms-charcount span { color: #4b5563; }
.sendemail-pagination-wrap {
  padding: 16px 20px;
  border-top: 1px solid #e5e7eb;
  background: #f9fafb;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}
.sendemail-pagination { margin: 0; }
.sendemail-pagination-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.sendemail-pagination-list .page-item { margin: 0; }
.sendemail-pagination-list .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 600;
  color: #374151;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  text-decoration: none;
  transition: color 0.2s, background 0.2s, border-color 0.2s;
}
.sendemail-pagination-list .page-link:hover {
  background: #f3f4f6;
  border-color: #d1d5db;
  color: #111;
}
.sendemail-pagination-list .page-item.active .page-link {
  background: #f8c905;
  border-color: #f8c905;
  color: #000;
}
.sendemail-perpage-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 14px;
}
.sendemail-perpage-text { color: #6b7280; font-weight: 500; white-space: nowrap; }
.sendemail-perpage-select {
  min-width: 90px;
  padding: 6px 28px 6px 12px;
  font-size: 14px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #fff;
  color: #374151;
  cursor: pointer;
}
.sendemail-perpage-select:focus {
  outline: none;
  border-color: #f8c905;
  box-shadow: 0 0 0 2px rgb(248 201 5 / 25%);
}
