/* Minimal, non-breaking visual improvements aligned with current design */

:root {
  /* Brand colors (from logo) - can be fine-tuned */
  --color-primary: #6A1E45; /* purple */
  --color-secondary: #C6A549; /* gold */
  --color-fg: #1B1B1B;
  --color-muted: #6B7280;
  --color-bg: #FFFFFF;
  --space-1: .25rem; --space-2: .5rem; --space-3: 1rem; --space-4: 1.5rem; --space-5: 2rem;
  --radius-md: 10px; --radius-lg: 14px;
  --shadow-1: 0 6px 18px rgba(0,0,0,.08);
}

html { scroll-behavior: smooth; }

body { color: var(--color-fg); background: var(--color-bg); }

/* Typography (keep existing ge-ss-two-medium, add modern fallbacks if present on system) */
body, h1, h2, h3, h4, h5, h6, p, li, input, td, th, .heading {
  font-family: "ge-ss-two-medium", "Tajawal", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Header logo sizing: centered and slightly larger */
#header { height: auto; line-height: normal; }
#header .logo img { max-height: 64px; height: auto; width: auto; }
@media (max-width: 992px) { #header .logo img { max-height: 56px; } }
@media (max-width: 576px) { #header .logo img { max-height: 48px; } }

/* Navigation improvements (RTL friendly without structural change) */
#menu .links li a {
  padding: 12px 14px; /* larger touch area */
  color: var(--color-fg);
}
#menu .links li a:hover,
#menu .links li a:focus { color: var(--color-primary); text-decoration: none; }

/* Active link helper if a class exists (non-breaking) */
#menu .links li.active > a { color: var(--color-secondary); font-weight: 600; }

/* Buttons (generic) - apply only if such classes already used */
.btn,
button,
input[type="submit"],
input[type="button"] {
  border-radius: var(--radius-md);
}
.btn-primary { background: var(--color-primary); border-color: var(--color-primary); }
.btn-primary:hover { background: #7A2A55; border-color: #7A2A55; }
.btn-secondary { background: var(--color-secondary); border-color: var(--color-secondary); color: #1B1B1B; }

/* Cards/sections subtle elevation */
.wrapper.style3, .card, .panel, .box {
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-1);
}

/* Footer refinement */
#footer { border-top: 4px solid var(--color-secondary); }
#footer a:hover { color: var(--color-primary); }

/* Links */
a { color: var(--color-primary); }
a:hover { color: #7A2A55; }

/* Focus visibility for accessibility */
:focus-visible { outline: 2px solid var(--color-secondary); outline-offset: 2px; }
.menu-toggle:focus { outline: none; }

/* Hide the close button until the menu is visible */
#menu:not(.visible) .close { display: none !important; }

/* Images scaling inside nav section preview image */
#menu img { max-width: 100%; height: auto; border-radius: var(--radius-md); }

/* Subtle spacing on sections without changing structure */
section, .inner { scroll-margin-top: 80px; }

/* ==== Migrated from Views/Shared/_Layout_New.cshtml <style> block ==== */
[type="date"]::-webkit-calendar-picker-indicator {
  display: none;
}

.inner>header>h3 {
  font-size: 22px;
}

.popup {
  position: fixed;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #000000;
  padding: 20px;
  border: 1px solid #000000c9;
  opacity: 1;
  text-align: center;
  z-index: 9999;
  width: 100%;
  max-width: 100%;
  height: 129vh;
}

.close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
}

.popup img {
  max-width: 35%;
  height: auto;
}

.popup p {
  font-size: 40px;
  color: #fff;
  text-align: center;
  font-family: "ge-ss-two-medium" !important;
}

.logo {
  display: block;
  width: auto;
  height: auto;
  position: static;
  text-align: center;
}

/* Header layout: center logo, keep toggle accessible */
#header { display: flex; align-items: center; justify-content: center; position: relative; padding: 10px 16px; }
#header { text-align: initial; }
#header { height: 100px; min-height: 100px; z-index: 10000; }
#header .logo { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; margin: 0 !important; }
#header .logo img { display: block; height: auto; max-height: 80px; }

/* Visible hamburger (menu toggle) */
.menu-toggle { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 8px; color: var(--color-fg); background: rgba(0,0,0,0.04); text-decoration: none; z-index: 12000; }
.menu-toggle:hover, .menu-toggle:focus { background: rgba(0,0,0,0.08); color: var(--color-primary); }
.menu-toggle .fa { font-size: 20px; }
/* Remove any pseudo-icon that may render as a square */
.menu-toggle:before, .menu-toggle:after { content: none !important; }
/* Use SVG background for the hamburger to avoid font dependency */
.menu-toggle { 
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cline x1='3' y1='12' x2='21' y2='12'/%3E%3Cline x1='3' y1='18' x2='21' y2='18'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 22px 22px;
}
/* Hide inner <span class="fas fa-bars"> to prevent duplicate */
.menu-toggle .fas { display: none !important; }

@media (max-width: 576px) {
  #header { padding: 8px 12px; }
  .menu-toggle { right: 12px; width: 40px; height: 40px; }
}

/* Font Awesome 5 compatibility for icons generated by the theme */
.menu-toggle .fas { font-family: "Font Awesome 5 Free"; font-weight: 900; }
#menu .close:before { font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f00d"; }

/* Ensure menu panel and its close button are above header */
#menu { z-index: 11000; }
#menu .close { z-index: 12001; position: absolute; }