/*
Theme Name: Khazzanha
Theme URI: https://khazzanha.com
Author: Khaled
Author URI: https://khazzanha.com
Description: ثيم ووردبريس احترافي لشركة "خزّنها" لخدمات تخزين ونقل العفش بالرياض. تصميم كوربوريت عصري RTL بألوان الكحلي والذهبي/البرتقالي، خط IBM Plex Sans Arabic، ومبني على Tailwind. Professional RTL WordPress theme for Khazzanha storage & moving company.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: khazzanha
Tags: rtl-language-support, custom-logo, custom-menu, featured-images, translation-ready, e-commerce
*/

/* ==========================================================================
   Tailwind (CDN) handles the bulk of styling. The rules below cover the few
   things the CDN config can't, plus WordPress-specific output and RTL polish.
   ========================================================================== */

html { scroll-behavior: smooth; }

body {
  font-family: "IBM Plex Sans Arabic", system-ui, sans-serif;
}

/* Material Symbols defaults (mirror the Stitch export) */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}
.icon-fill { font-variation-settings: 'FILL' 1; }

/* Keep numerals & latin runs LTR inside an RTL document */
[dir="ltr"] { unicode-bidi: isolate; }

/* WordPress core alignment / caption classes so the editor behaves */
.alignleft  { float: left;  margin: 0 0 1rem 1.5rem; }
.alignright { float: right; margin: 0 1.5rem 1rem 0; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 0.85rem; color: #44474d; text-align: center; }
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute !important; word-wrap: normal !important;
}

/* Sticky-header offset for in-page anchors */
:target { scroll-margin-top: 90px; }

/* Mobile menu (toggled by assets/js/main.js) */
.khz-mobile-menu { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.khz-mobile-menu.is-open { max-height: 520px; }

/* Generic WP content (single posts / pages without a custom template) */
.khz-prose h2 { font-size: 32px; line-height: 40px; font-weight: 600; color: #00030a; margin: 2rem 0 1rem; }
.khz-prose h3 { font-size: 24px; line-height: 32px; font-weight: 600; color: #00030a; margin: 1.5rem 0 .75rem; }
.khz-prose p  { font-size: 16px; line-height: 28px; color: #191c1d; margin-bottom: 1rem; }
.khz-prose a  { color: #8a5100; text-decoration: underline; }
.khz-prose ul, .khz-prose ol { margin: 0 1.5rem 1rem 0; }
.khz-prose ul { list-style: disc; }
.khz-prose ol { list-style: decimal; }
.khz-prose img { border-radius: .5rem; }
.khz-prose blockquote {
  border-right: 4px solid #fc9910; background: #f3f4f5;
  padding: 1rem 1.25rem; margin: 1.5rem 0; border-radius: .25rem;
}

/* FAQ accordion (native details/summary) */
.khz-faq details {
  background: #ffffff;
  border: 1px solid #c5c6ce;
  border-radius: .5rem;
  margin-bottom: 12px;
  overflow: hidden;
}
.khz-faq summary {
  list-style: none;
  cursor: pointer;
  padding: 18px 20px;
  font-weight: 600;
  color: #00030a;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
}
.khz-faq summary::-webkit-details-marker { display: none; }
.khz-faq summary .khz-chevron { transition: transform .25s ease; color: #8a5100; }
.khz-faq details[open] summary .khz-chevron { transform: rotate(180deg); }
.khz-faq .khz-answer {
  padding: 0 20px 18px;
  color: #44474d;
  font-size: 15px;
  line-height: 26px;
}

/* Vertical moving timeline */
.khz-timeline { position: relative; }
@media (min-width: 768px) {
  .khz-timeline::before {
    content: ""; position: absolute; top: 0; bottom: 0; right: 50%;
    width: 2px; background: #c5c6ce; transform: translateX(50%);
  }
}