/* OSA Directory v2 */

.osa-dir-v2 {
    margin: 0px auto;
    background: #fff;
    border-radius: 15px;
    padding: 10px;
}
.osa-site-link,
.osa-dir-desc b{
  color:#1f9ca7;
}
.osa-site-link:hover{
  color:#177f88;
}

.osa-dir-v2-head{
  text-align:center;
  margin-bottom:14px;
}
.osa-dir-title{
  margin:0 0 6px;
  font-size:28px;
}
.osa-dir-desc{
  margin:0;
  color:#313131;
  font-size:15px;
}

/* toolbar */
.osa-toolbar{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin:16px 0 10px;
}

.osa-toolbar input[type="search"]{
  flex: 1;
  min-width: 260px;
  height: 42px;
  padding: 0 14px;
  border: 1px solid #d9d9d9;
  border-radius: 12px;
  outline: none;
  background: #f2f2f2;
  font-size: 16px !important; /* هذا هو المهم */
}

.osa-toolbar select{
  height:42px;
  padding:0 12px;
  border:1px solid #d9d9d9;
  border-radius:12px;
  background:#fff;
  cursor:pointer;
}

.osa-toolbar button{
  height:42px;
  padding:0 18px;
  border:0;
  border-radius:12px;
  background:#8fbec3;
  color:#fff;
  cursor:pointer;
}
.osa-toolbar button:hover{ background:#78aeb4; }

/* note */
.osa-dir-note{
  margin:0 0 16px;
  color:#666;
  text-align:center;
  font-size:13px;
}

/* grid */
.osa-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr); /* كمبيوتر */
  gap:14px;
}

/* تابلت */
@media (max-width: 900px){
  .osa-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

/* جوال */
@media (max-width: 600px){
  .osa-grid{
    grid-template-columns: 1fr;
  }

  .osa-toolbar input[type="search"]{
    min-width: 100%;
    font-size: 16px !important; /* يمنع تكبير الشاشة في iPhone */
  }
}


/* card */
.osa-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#e8f3f5;
  border-radius:10px;
  padding:12px 12px;
  text-decoration:none;
}


.osa-name {
    font-weight: 600;
    font-size: 15px;
    color: #2a7b8a;
}
.osa-count {
    font-size: 13px;
    color: #09666f;
    white-space: nowrap;
    font-weight: 500;
}

/* highlight */
.osa-dir-v2 mark{
  background:#ffeaa7;
  padding:0 3px;
  border-radius:4px;
}

/* empty */
.osa-empty{
  grid-column:1/-1;
  text-align:center;
  color:#666;
  padding:20px 0;
}

/* footer */
.osa-dir-foot{
  margin-top:14px;
  text-align:center;
  color:#666;
  font-size:13px;
}

/* responsive */


/* إخفاء عنوان الصفحة الافتراضي (العنوان الأبيض) */
.section-title {
  display: none !important;
}

.osa-breadcrumbs {
  font-size: 13px;
  color: #777;
  margin-bottom: 10px;
}

.osa-breadcrumbs a {
  color: #6aa6ab;
  text-decoration: none;
}

.osa-breadcrumbs a:hover {
  text-decoration: underline;
}


/* ===============================
   Breadcrumbs داخل osa-dir-v2
================================ */

.osa-dir-v2 .osa-breadcrumbs {
  margin-bottom: 14px;
  text-align: center;
  font-size: 13px;
  line-height: 1.6;
  color: #7b8f93;
}

/* الروابط */
.osa-dir-v2 .osa-breadcrumbs a {
  color: #6aa6ab;
  text-decoration: none;
    font-weight: 500;
    font-size: 13px;
}

.osa-dir-v2 .osa-breadcrumbs a:hover {
  text-decoration: underline;
}

/* الفواصل */
.osa-dir-v2 .osa-breadcrumbs span,
.osa-dir-v2 .osa-breadcrumbs li {
  display: inline;
  font-weight: 500;
  font-size: 13px;
}

/* إلغاء الترقيم (1. 2.) */
.osa-dir-v2 .osa-breadcrumbs ol,
.osa-dir-v2 .osa-breadcrumbs ul {
  list-style: none !important;
  padding: 0;
  margin: 0;
  text-align: right;
}

/* إزالة أي محاذاة أو float من القالب */
.osa-dir-v2 .osa-breadcrumbs * {
  float: none !important;
}

.osa-dir-v2 .osa-breadcrumbs li:not(:last-child)::after {
  content: "›";
  margin: 0 6px;
  color: #b5c7cb;
}

#osaDirQ {
  font-size: 16px !important;
  -webkit-text-size-adjust: 100%;
}

.osa-dir-breadcrumbs {
    text-align: right;
    margin-bottom: 15px;
    font-size: 14px;
    color: #6b7c80;
}

.osa-dir-breadcrumbs a {
  text-decoration: none;
  color: #1f9ca7;
}

.osa-dir-breadcrumbs .osa-dir-sep {
  margin: 0 6px;
  color: #999;
}
span.osa-dir-current {
    font-weight: 400;
}








/* شكل الاسم */
.osa-name{
display:flex;
align-items:center;
gap:6px;
}
.osa-name svg{
fill:#20a8c4;
}

