/* ===== Orto.ir Global Styles ===== */

html, body{
  margin:0;
  padding:0;
}

body{
  font-family: 'Vazirmatn', Tahoma, Arial, sans-serif;
  background:#f8f9fa;
  color:#333;
  direction: rtl;
  text-align: right;
  line-height:2.2;
}

/* ✅ Permanent Justify for all long texts */
p, li{
  text-align: justify;
  text-justify: inter-word;
}

/* Headings */
h1,h2,h3{
  font-weight:900;
}

/* Main Sections */
section{
  max-width:900px;
  margin:30px auto;
  padding:0 20px;
}

/* Cards */
.card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:14px;
  box-shadow:0 0 10px rgba(0,0,0,.06);
}
/* ✅ Permanent RTL + Right align + Justify for Persian multi-line text */
html, body { direction: rtl !important; }
body { text-align: right !important; }
p, li, .content-text { text-align: justify !important; text-justify: inter-word; direction: rtl !important; }

/* ===== Unified Dropdown Nav (GLOBAL) ===== */
.main-nav{
  background:#eee;
  text-align:center;
  padding:12px 0;
  position:sticky;
  top:0;
  z-index:99;
}
.main-nav a{
  display:inline-block;
  margin:6px 6px;
  padding:8px 14px;
  background:#eaff00;
  color:#000;
  font-weight:900;
  font-size:14px;
  border-radius:10px;
  box-shadow:0 2px 6px rgba(0,0,0,0.08);
  text-decoration:none;
  vertical-align:middle;
}
.main-nav a:hover{background:#d4f200}

.main-nav .nav-logo{
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
}
.main-nav .nav-logo:hover{background:transparent !important}
.main-nav .nav-logo img{
  height:56px;
  width:auto;
  display:inline-block;
}

.main-nav .dropdown{display:inline-block;position:relative;margin:6px 6px}
.main-nav .dropbtn{
  border:none;cursor:pointer;font-family:inherit;
  font-weight:900;font-size:14px;padding:8px 14px;border-radius:10px;
  background:#eaff00;color:#000;box-shadow:0 2px 6px rgba(0,0,0,0.08);
}
.main-nav .dropbtn:hover{background:#d4f200}

.main-nav .dropdown-content{
  display:none;
  position:absolute;right:0;min-width:220px;
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;
  box-shadow:0 10px 25px rgba(0,0,0,0.12);
  padding:8px;margin-top:8px;text-align:right;z-index:1000;
}
.main-nav .dropdown-content a{
  display:block !important;
  margin:6px 0 !important;
  padding:10px 12px !important;
  border-radius:10px !important;
  background:#f6f7fb !important;
  color:#111 !important;
  box-shadow:none !important;
  text-decoration:none !important;
  font-weight:900 !important;
}
.main-nav .dropdown-content a:hover{background:#eef2ff !important}

.main-nav .dropdown:hover .dropdown-content{display:block}

@media (max-width:768px){
  .main-nav{padding:10px 8px}
  .main-nav .dropdown-content{position:static;min-width:unset;box-shadow:none}
  .main-nav .nav-logo img{height:48px}
}

/* ===== Force RTL + Right align + Justify for Persian multi-line text ===== */
html, body { direction: rtl !important; }
body { text-align: right !important; }
p, li { direction: rtl !important; text-align: justify !important; text-justify: inter-word; }

/* ===== Dropdown stability (mobile-friendly) ===== */
/* Disable hover-open (unstable on touch devices) */
.main-nav .dropdown:hover .dropdown-content { display: none !important; }
/* Open only when JS adds .open */
.main-nav .dropdown.open .dropdown-content { display: block !important; }

/* ===== Top bar logo (left) ===== */
.top-bar{ position: relative; }
.topbar-logo{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  height: 58px;
  width: auto;
}
@media (max-width:768px){
  .topbar-logo{ height: 46px; left: 10px; }
}

/* ===== Unified Nav (global) ===== */
.main-nav{
  background:#eee;
  text-align:center;
  padding:12px 0;
  position:sticky;
  top:0;
  z-index:99;
}
.main-nav a{
  display:inline-block;
  margin:6px 6px;
  padding:8px 14px;
  background:#eaff00;
  color:#000;
  font-weight:900;
  font-size:14px;
  border-radius:10px;
  box-shadow:0 2px 6px rgba(0,0,0,0.08);
  text-decoration:none;
}
.main-nav a:hover{background:#d4f200}

.main-nav .dropdown{display:inline-block;position:relative;margin:6px 6px}
.main-nav .dropbtn{
  border:none;cursor:pointer;font-family:inherit;
  font-weight:900;font-size:14px;padding:8px 14px;border-radius:10px;
  background:#eaff00;color:#000;box-shadow:0 2px 6px rgba(0,0,0,0.08);
}
.main-nav .dropbtn:hover{background:#d4f200}

.main-nav .dropdown-content{
  display:none;
  position:absolute;right:0;min-width:220px;
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;
  box-shadow:0 10px 25px rgba(0,0,0,0.12);
  padding:8px;margin-top:8px;text-align:right;z-index:1000;
}
.main-nav .dropdown-content a{
  display:block !important;
  margin:6px 0 !important;
  padding:10px 12px !important;
  border-radius:10px !important;
  background:#f6f7fb !important;
  color:#111 !important;
  box-shadow:none !important;
  text-decoration:none !important;
  font-weight:900 !important;
}
.main-nav .dropdown-content a:hover{background:#eef2ff !important}

/* ✅ Stable dropdown: only via .open (JS), no hover */
.main-nav .dropdown:hover .dropdown-content{display:none !important;}
.main-nav .dropdown.open .dropdown-content{display:block !important;}

@media (max-width:768px){
  .main-nav .dropdown-content{position:static;min-width:unset;box-shadow:none}
}

/* ===== Top bar logo inside yellow bar (left, no overlap) ===== */
.top-bar{ position:relative; padding-left:95px; } /* space for logo */
.topbar-logo{
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  height:70px;
  width:auto;
}
@media (max-width:768px){
  .top-bar{ padding-left:75px; }
  .topbar-logo{ height:56px; left:10px; }
}