/* ==========================================================================
   إصلاحات تصميم سطح المكتب الموحدة — PM TECH × معرض صحاري
   - تعمل حصرياً على الشاشات العريضة (769px فأكثر) ولا تمس شكل الهاتف إطلاقاً.
   - تُحمَّل بعد desktop.css لتحل محل نمط «اللوحة الجانبية الضيقة» القديم
     بشريط جانبي كامل ومحتوى عريض يستغل عرض الشاشة.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1) الشريط الجانبي الكامل (258px) بدل شريط الأيقونات الضيق (110px)
   -------------------------------------------------------------------------- */
@media (min-width: 769px) {
  body.dashboard-body .dash-sidebar,
  body.sales-mode .dash-sidebar {
    width: 258px !important;
    min-width: 258px !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    padding: 22px 14px 18px !important;
    background: linear-gradient(180deg, #FFFFFF 0%, #F7FBFF 100%) !important;
    border-left: 1px solid #E6EEF7 !important;
    box-shadow: -10px 0 28px rgba(22, 67, 116, .045) !important;
  }

  body.dashboard-body .dash-sidebar-brand,
  body.sales-mode .dash-sidebar-brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  body.dashboard-body .dash-nav-items,
  body.sales-mode .dash-nav-items {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 5px !important;
    width: 100% !important;
  }

  body.dashboard-body .dash-nav-caption {
    display: block !important;
    padding: 0 12px 7px !important;
    color: #92A4B7 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
  }

  body.dashboard-body .dash-nav-btn,
  body.sales-mode .dash-nav-btn {
    flex-direction: row !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 11px !important;
    min-height: 46px !important;
    width: 100% !important;
    padding: 10px 12px !important;
    border: 1px solid transparent !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: #516A84 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
  }

  body.dashboard-body .dash-nav-btn span,
  body.sales-mode .dash-nav-btn span { font-size: 13px !important; }

  body.dashboard-body .dash-nav-btn svg,
  body.sales-mode .dash-nav-btn svg {
    width: 19px !important;
    height: 19px !important;
    flex: 0 0 auto !important;
  }

  body.dashboard-body .dash-nav-btn:hover,
  body.sales-mode .dash-nav-btn:hover {
    background: #F2F8FF !important;
    color: #1E7AF0 !important;
  }

  body.dashboard-body .dash-nav-btn.active,
  body.sales-mode .dash-nav-btn.active {
    background: linear-gradient(135deg, #0B3978, #087AF1) !important;
    color: #FFFFFF !important;
    box-shadow: 0 8px 20px rgba(8, 104, 218, .2) !important;
  }

  body.dashboard-body .dash-sidebar-footer,
  body.sales-mode .dash-sidebar-footer {
    padding: 16px 10px 2px !important;
    text-align: right !important;
    font-size: 11px !important;
    color: #6D829A !important;
  }

  /* --------------------------------------------------------------------------
     2) جسم الصفحة: محتوى عريض ملاصق للشريط الجانبي الكامل
     -------------------------------------------------------------------------- */
  body.admin-dashboard-body .dash-main-content,
  body.dashboard-body:not(.sales-mode) .dash-main-content {
    width: calc(100% - 258px) !important;
    max-width: 1560px !important;
  }

  /* صفحة تأهيل الزائر السريع (/sales): تخلي عن عمود 620px الضيق */
  body.sales-mode:not(.admin-dashboard-body) .dash-main-content,
  body.sales-mode:not(.admin-dashboard-body) .sales-app-wrapper {
    width: calc(100% - 258px) !important;
    max-width: 1160px !important;
    flex: 1 1 auto !important;
    margin: 0 !important;
    padding: 24px clamp(24px, 3.5vw, 52px) 60px !important;
  }

  /* الشبكات الداخلية لصفحة التأهيل تستعيد أعمدتها العريضة (نفس أولوية القواعد القديمة وتحمَّل بعدها) */
  body.phone-shell.sales-mode .category-cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body.phone-shell.sales-mode .interests-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body.phone-shell.sales-mode .interests-choice-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body.phone-shell.sales-mode .stage-cards-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  body.phone-shell.sales-mode .form-grid-2cols { grid-template-columns: 1fr 1fr !important; }
  body.phone-shell.sales-mode .quick-gov-pills { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }

  /* --------------------------------------------------------------------------
     3) استوديو تشغيل العارض: عرض كامل على الشاشات الكبيرة
     -------------------------------------------------------------------------- */
  body.phone-shell.screen-admin-shell .screen-admin {
    width: min(1360px, calc(100% - 56px)) !important;
    max-width: 1360px !important;
    margin: 0 auto !important;
    padding: 28px clamp(20px, 3vw, 48px) 64px !important;
  }

  /* --------------------------------------------------------------------------
     4) القائمة العلوية: منع قطع آخر الروابط على الشاشات المزدحمة
     -------------------------------------------------------------------------- */
  .pm-dt-inner { gap: 10px !important; }
  .pm-dt-nav-links { gap: 0 !important; }
  .pm-dt-link {
    padding: 8px clamp(3px, 0.5vw, 8px) !important;
    font-size: clamp(12px, 0.76vw, 13px) !important;
    white-space: nowrap !important;
  }
  .pm-dt-link svg { flex: 0 0 auto; }
  .pm-dt-link .pm-dt-link-icon + * { margin-inline-start: 4px; }

  /* --------------------------------------------------------------------------
     5) مسابقة المعرفة — صفحة الانضمام واللعب بعرض مريح على سطح المكتب
     -------------------------------------------------------------------------- */
  .pm-app-screen { padding-bottom: 48px !important; }
  .pm-quiz-wrapper { max-width: 760px !important; }

  /* صفحة الانضمام: البطاقة التعريفية بجانب نموذج التسجيل بدل التكديس العمودي */
  .pm-quiz-wrapper:has(.pm-join-hero-card) {
    max-width: 1020px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) !important;
    gap: 22px !important;
    align-items: stretch !important;
  }
  .pm-quiz-wrapper:has(.pm-join-hero-card) > .pm-join-hero-card {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 34px 30px !important;
  }
  .pm-quiz-wrapper:has(.pm-join-hero-card) > .pm-join-form-card { grid-row: span 1; }
  .pm-quiz-wrapper:has(.pm-join-hero-card) > :not(.pm-join-hero-card):not(.pm-join-form-card) {
    grid-column: 1 / -1 !important;
  }
  .pm-quiz-wrapper:has(.pm-join-hero-card) .pm-join-title { font-size: clamp(24px, 1.8vw, 30px) !important; }
  .pm-quiz-wrapper:has(.pm-join-hero-card) .pm-join-subtitle { font-size: 14.5px !important; }

  /* --------------------------------------------------------------------------
     6) شاشة المسابقة الكبرى: محاذاة صف الفائزين (4-10) مع حدود منصة التتويج
     -------------------------------------------------------------------------- */
  .pm-center-arena:has(.pm-recent-vip-card:not(.is-layout-hidden)) .pm-ranks-seven-row {
    margin-inline-start: calc(clamp(220px, 30%, 262px) + 14px) !important;
  }

  /* --------------------------------------------------------------------------
     7) القوائم المنسدلة الأصلية: تنسيق موحد يطابق لغة التصميم
     -------------------------------------------------------------------------- */
  body.dashboard-body select:not([multiple]):not([size]),
  body.sales-mode select:not([multiple]):not([size]),
  .pm-quiz-wrapper select:not([multiple]):not([size]) {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235B7A96' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: left 12px center !important;
    padding-inline-start: 34px !important;
    cursor: pointer !important;
  }

  /* --------------------------------------------------------------------------
     8) لمسات عامة: منع القطع في عناوين رأس لوحات الإدارة
     -------------------------------------------------------------------------- */
  .dash-header-titles h1 { white-space: nowrap !important; }
  .dash-header-titles p {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 60ch !important;
  }
}