/* Custom styles for docsdev */

/* ─── Search (Tailwind gère l'essentiel) ─── */
.search-item-active {
  background-color: #fef2f2 !important;
}
:root {
  --tn-red:       #E70013;
  --tn-red-dark:  #B8000F;
  --tn-red-light: #FF1A2E;
  --tn-white:     #FFFFFF;
}

* { box-sizing: border-box; }

body {
  font-family: 'Segoe UI', Tahoma, 'Noto Sans Arabic', sans-serif;
}

.doc-thumb {
  min-height: 140px;
}

.page-content {
  line-height: 1.9;
  font-size: 1.05rem;
}
.page-content h1, .page-content h2, .page-content h3 {
  color: var(--tn-red);
}

.role-badge {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.3px;
}
.role-admin {
  background: var(--tn-red);
  color: #fff;
}
.role-editor {
  background: #6c757d;
  color: #fff;
}

/* ─── Mobile: menu collapse (frontend) ─── */
@media (max-width: 767px) {
  /* Inline sub-menus inside mobile hamburger menu */
  #navbar-collapse .hs-dropdown {
    position: static !important;
  }
  #navbar-collapse .hs-dropdown > .hs-dropdown-toggle {
    width: 100%;
    justify-content: space-between;
  }
  #navbar-collapse .hs-dropdown-menu {
    display: block !important;
    position: static !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
    min-width: auto !important;
    border: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  #navbar-collapse .hs-dropdown-menu a {
    padding-right: 1.5rem !important;
    color: rgba(255,255,255,0.85) !important;
    font-size: 0.8125rem !important;
  }
  #navbar-collapse .hs-dropdown-menu .hs-dropdown-menu a {
    padding-right: 2.5rem !important;
  }

  /* Chevron rotation for sub-menu parents */
  #navbar-collapse .hs-dropdown > .hs-dropdown-toggle [data-lucide="chevron-down"],
  #navbar-collapse .hs-dropdown > .hs-dropdown-toggle [data-lucide="chevron-left"] {
    transition: transform 0.2s;
  }
  #navbar-collapse .hs-dropdown.open > .hs-dropdown-toggle [data-lucide="chevron-down"] {
    transform: rotate(180deg);
  }

  /* Admin mobile overlay backdrop */
  .hs-overlay-backdrop {
    background-color: rgba(0,0,0,0.5);
  }
}

/* ─── Ad containers ─── */
.ad-container {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  overflow: hidden;
  display: block;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.ad-container ins,
.ad-container iframe,
.ad-container img,
.ad-container video {
  max-width: 100%;
  height: auto;
}

/* ─── Responsive admin content ─── */
@media (max-width: 639px) {
  main#main {
    padding: 0.75rem !important;
  }
  #layout {
    max-width: 100% !important;
  }
  .admin-content {
    padding: 0.75rem !important;
  }
}