/* ===============================
   iPad-only overrides (Portrait & Landscape)
   Target: 768px–1366px (all modern iPads)
   Put this file after your main StyleSheet.css
   =============================== */

@media screen and (min-width: 768px) and (max-width: 1366px) {

    /* ---- Basics & scrolling ---- */
    html, body { overflow-x: hidden; }
    :where(h1,h2,h3,h4,h5,h6,p,li) { line-height: 1.6; }

    /* ---- Container gutters ---- */
    .container, .container-fluid, .wrap, .wrapper, .page, main { max-width: 100% !important; padding-inline: 16px !important; }

    /* ---- Header / topbar / nav ---- */
    header, .header, .site-header { position: sticky; top: 0; z-index: 1000; /* stays visible while scrolling */ }
    /* make menus wrap nicely on iPad */
    nav ul, .nav, .menu, .main-menu { display: flex; gap: 10px !important; flex-wrap: wrap; align-items: center; }
    nav li, .nav > li, .menu > li { margin-inline: 0 !important; }
    .nav a, .menu a { padding: 10px 12px; display: inline-block; }

    /* hamburger / toggler hit-area */
    .nav-toggle, .menu-toggle, .hamburger, .navbar-toggler { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; touch-action: manipulation; }

    /* ---- RTL friendliness (site is Kurdish/RTL) ---- */
    html[dir="rtl"], body[dir="rtl"] { text-align: right; }
    .dropdown-menu { inset-inline-start: auto !important; inset-inline-end: 0 !important; }

    /* ---- Hero / Slider / Carousel ---- */
    .hero, .slider, .carousel, .swiper, .slick-slider { overflow: hidden; }
    .hero img, .slider img, .carousel img, .swiper img, .slick-slide img { width: 100%; height: 320px; /* adjust if needed */ object-fit: cover; }
    .hero .caption, .slider .caption { padding: 12px 14px; font-size: 0.95rem; }

    /* If using Swiper/Slick, avoid oversized slides on iPad */
    .swiper, .slick-slider { width: 100% !important; }
    .swiper-wrapper, .slick-track { align-items: stretch; }
    .swiper-slide, .slick-slide { height: auto; }

    /* ---- Cards / News grids → 2 columns on iPad ---- */
    .grid, .cards, .news-grid, .posts, .post-grid, .latest-posts, .home-cards { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; }

    /* flex-based lists fallback */
    .card-list, .post-list, .media-list { display: flex; flex-wrap: wrap; gap: 16px; }
    .card, .post-card, .media-item { flex: 0 0 calc(50% - 8px); max-width: calc(50% - 8px); }

    /* Single article readability */
    .article, .post, .single, .content { font-size: 1rem; line-height: 1.85; }
    .article img, .post img, .content img { max-width: 100%; height: auto; }

    /* Force very-wide images to stay inside content width */
    .content img[style*="width"], .post img[style*="width"] { height: auto !important; max-width: 100% !important; }

    /* ---- Layouts with sidebars → stack vertically ---- */
    .content-with-sidebar, .has-sidebar, .layout-sidebar, .row.has-sidebar { display: grid; grid-template-columns: 1fr; gap: 20px; }
    .sidebar, .aside { order: 2; }
    /* below the main content on iPad */

    /* ---- Footer widgets → 2 columns ---- */
    footer .widgets, .footer-widgets, .footer-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

    /* ---- Buttons & inputs: better touch targets ---- */
    button, .btn, input[type="button"], input[type="submit"] { min-height: 44px; padding: 10px 14px; }
    .search input[type="search"], input[type="text"], textarea, select { min-height: 44px; }

    /* ---- Embeds / media ---- */
    iframe, video { max-width: 100%; height: auto; aspect-ratio: 16 / 9; }

    /* ---- Tables (reports/interviews) ---- */
    table { width: 100%; display: block; overflow-x: auto; border-collapse: collapse; }
    th, td { padding: 10px; }
    .bannerdv1full { width: 100% !important; height: auto !important }
    .bannerdv1full img { width: 100% !important; height: auto !important }
    .bignewsdvRx { width: 100%; height: auto !important; }
    .bignewsdvLx { width: 100%; height: auto; float: right; }
    .bignewsdvLx2 { width: 100%; height: auto; margin-top: 10px !important; margin-left: 0; background-color: #0f2335; padding: 10px 10px 0 10px; }
    .hawalisaraki { overflow: hidden; width: 100%; height: 415px !important; position: relative; }
    .hawalisaraki h1 { color: #fff; right: 0; bottom: 0; margin-top: -50px !important; position: absolute; padding: 0 20px; width: 100%; right: 0; left: 0%; box-sizing: border-box; margin: 0; font-weight: 300; background: rgba(25,31,80,.8); text-align: right }
    .videolist { width: 100%; box-sizing: border-box; padding: 0; text-align: right; float: right; direction: rtl; margin-bottom: 0; border-bottom: 1px solid #272626; padding-bottom: 15px }
    .videolist:last-child { border-bottom: 0; padding-bottom: 0 }
    .reklambbbds { width: 100%; height: auto; margin: 0 auto !important; background: none !important; margin-top: 10px !important; }
    .mainvideo { width: 100%; height: auto !important; background: #0f2335; padding: 20px 0 0 0; margin: 0 0 0 }
    .hide1 { display: none !important }
    .babatakanlist { width: 100%; float: right; margin: 25px 0 }
    .babatakanlist li { width: 100% !important; float: right; padding-bottom: 18px; padding-left: 2%; height: 290px }
    .kurdistani02 { width: 100%!important   ;  height: auto; float: right; box-sizing: border-box; padding: 0; margin: 0; direction: rtl; margin: 0 .1% }


}

/* Optional: landscape iPad Pro toolbar space */
@media screen and (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape) {
    .hero img, .slider img { height: 380px; }
    .header .search, .nav .search { min-width: 260px; }
}
