/* ============================================================
   Demexios Platform — Responsive Styles
   Loaded after frontend.css (dependent stylesheet)
   Breakpoints: 1024px / 900px / 768px / 640px / 480px
   ============================================================ */

/* ── max-width: 1024px ─────────────────────────────────────── */
@media ( max-width: 1024px ) {

    /* Platform wrap padding reduction */
    body.dmx-platform-page .dmx-platform-wrap { padding: 0 20px 40px; }

    /* Admin nav links slightly smaller */
    body.dmx-platform-page .dmx-admin-nav__link { padding: 12px 14px; font-size: 13px; }

    /* Admin job card actions column slightly narrower */
    body.dmx-platform-page .dmx-ajc-actions { width: 120px; }

    /* Kanban: allow horizontal scroll on tight viewports */
    body.dmx-platform-page .dmx-kanban { overflow-x: auto; }
    body.dmx-platform-page .dmx-kanban-col { min-width: 160px; }

    /* Job single: reduce sidebar width */
    body.dmx-platform-page .dmx-job-single-grid    { grid-template-columns: 1fr 280px; gap: 24px; }
    body.dmx-platform-page .dmx-job-action-bar__inner { grid-template-columns: 1fr 280px; }
}

/* ── max-width: 900px ─────────────────────────────────────── */
@media ( max-width: 900px ) {

    /* Job single: sidebar drops below content */
    body.dmx-platform-page .dmx-job-single-grid        { grid-template-columns: 1fr; }
    body.dmx-platform-page .dmx-job-action-bar__inner  { grid-template-columns: 1fr; }
    /* Bottom CTA: reset calc width — sidebar is gone, button takes full row */
    body.dmx-platform-page .dmx-job-single-bottom-btn  { max-width: 100%; }

    /* Job hero: wrap logo + info + reward */
    body.dmx-platform-page .dmx-job-hero               { padding: 24px 0; }
    body.dmx-platform-page .dmx-job-hero__inner        { flex-wrap: wrap; gap: 16px; padding: 0 20px; }
    body.dmx-platform-page .dmx-job-hero__logo         { width: 72px; height: 72px; }
    body.dmx-platform-page .dmx-job-hero__info         { flex: 1 1 calc(100% - 96px); }
    body.dmx-platform-page .dmx-job-hero__meta-right   { text-align: left; align-items: flex-start; flex-direction: row; flex-wrap: wrap; gap: 8px; }
    body.dmx-platform-page .dmx-job-hero__reward       { width: 100%; flex-direction: row; align-items: center; gap: 8px; align-self: auto; border-top: 1px solid rgba(255,255,255,0.15); }

    /* Proposals page: job summary card stacks */
    body.dmx-platform-page .dmx-prop-job-card          { flex-wrap: wrap; gap: 12px; }
    body.dmx-platform-page .dmx-prop-job-logo          { width: 72px; height: 72px; }
    body.dmx-platform-page .dmx-prop-job-info          { flex: 1 1 calc(100% - 100px); }
    body.dmx-platform-page .dmx-prop-job-meta-right    { width: 100%; flex-direction: row; text-align: left; flex-wrap: wrap; gap: 8px; }
    body.dmx-platform-page .dmx-prop-job-title         { font-size: 26px; }
    body.dmx-platform-page .dmx-prop-reward            { width: 100%; flex-direction: row; justify-content: flex-start; gap: 8px; padding-top: 8px; border-top: 1px solid var(--dmx-border); }

    /* Welcome bar: stack back link + awards */
    body.dmx-platform-page .dmx-jobs-welcome-inner     { flex-wrap: wrap; gap: 10px; }
    body.dmx-platform-page .dmx-jobs-awards            { flex-wrap: wrap; gap: 6px; }
}

/* ── max-width: 768px ─────────────────────────────────────── */
@media ( max-width: 768px ) {

    body.dmx-platform-page .dmx-platform-wrap          { padding: 0 16px 32px; margin-top: 20px; }

    /* Admin nav: smaller text, allow wrapping */
    body.dmx-platform-page .dmx-admin-nav__link        { padding: 10px 10px; font-size: 12px; gap: 4px; }
    body.dmx-platform-page .dmx-admin-nav__link svg    { display: none; }

    /* Admin job card: stacks vertically */
    body.dmx-platform-page .dmx-admin-job-card         { flex-direction: column; align-items: stretch; }
    body.dmx-platform-page .dmx-ajc-info               { flex-direction: row; }
    body.dmx-platform-page .dmx-ajc-logo               { width: 80px; align-self: stretch; }
    body.dmx-platform-page .dmx-ajc-reward             { min-width: auto; flex-direction: row; justify-content: center; gap: 6px; padding: 10px 16px; align-self: auto; }
    body.dmx-platform-page .dmx-ajc-stats-row          { flex-wrap: wrap; }
    body.dmx-platform-page .dmx-ajc-stat-group         { border-right: none; border-bottom: 1px solid var(--dmx-border); padding: 12px 16px; }
    body.dmx-platform-page .dmx-ajc-stat-group:last-child { border-bottom: none; }
    body.dmx-platform-page .dmx-ajc-actions            { width: 100%; flex-direction: row; border-left: none; }
    body.dmx-platform-page .dmx-ajc-btn                { flex: 1; }

    /* Admin jobs filters: stack vertically */
    body.dmx-platform-page #dmx-admin-jobs .dmx-jobs-filters,
    body.dmx-platform-page #dmx-jobs       .dmx-jobs-filters       { flex-direction: column; gap: 8px; }
    body.dmx-platform-page #dmx-admin-jobs .dmx-jobs-filter-field,
    body.dmx-platform-page #dmx-jobs       .dmx-jobs-filter-field,
    body.dmx-platform-page #dmx-admin-jobs .dmx-jobs-filter-select-wrap,
    body.dmx-platform-page #dmx-jobs       .dmx-jobs-filter-select-wrap { max-width: 100%; width: 100%; }

    /* Add job form grids: single column */
    body.dmx-platform-page #dmx-admin-add-job .dmx-ajg-2col,
    body.dmx-platform-page #dmx-admin-add-job .dmx-ajg-3col        { grid-template-columns: 1fr; }

    /* Account form grids: single column */
    body.dmx-platform-page #dmx-account .dmx-account-row--3col,
    body.dmx-platform-page #dmx-account .dmx-account-row--2col     { grid-template-columns: 1fr; }

    /* Recruiter job card (job listing): stack vertically */
    body.dmx-platform-page .dmx-rjc                    { flex-direction: column; }
    body.dmx-platform-page .dmx-rjc-cta                { width: 100%; flex-direction: row; border-left: none; border-top: 1px solid var(--dmx-border); }
    body.dmx-platform-page .dmx-rjc-btn                { flex: 1; flex-direction: row; gap: 8px; padding: 12px; }
    body.dmx-platform-page .dmx-rjc-approved-row       { flex-direction: column; gap: 10px; }
    body.dmx-platform-page .dmx-rjc-approved-actions   { flex-wrap: wrap; width: 100%; }
    body.dmx-platform-page .dmx-rjc-approved-actions .dmx-platform-btn { flex: 1; justify-content: center; }

    /* Tabs on admin pages: wrap + smaller */
    body.dmx-platform-page .dmx-req-tab                { padding: 10px 12px; font-size: 12px; }

    /* Modal boxes: full-width with padding reduction */
    body.dmx-platform-page .dmx-modal-box              { padding: 24px 20px; border-radius: 12px; max-height: 88vh; }
    body.dmx-platform-page .dmx-modal-box--wide        { max-width: 100%; }
    body.dmx-platform-page .dmx-modal-box--readmore    { max-width: 100%; }
    body.dmx-platform-page #dmx-r3-modal .dmx-modal-box { padding: 28px 20px; max-width: 100%; }

    /* Submit candidate modal grid: single column */
    body.dmx-platform-page .dmx-r4-form-grid           { grid-template-columns: 1fr; }
    body.dmx-platform-page .dmx-r4-full                { grid-column: 1; }
}

/* ── max-width: 640px ─────────────────────────────────────── */
@media ( max-width: 640px ) {

    /* Auth forms */
    body.dmx-platform-page #dmx-register .dmx-register-wrap    { padding: 24px 16px; }
    body.dmx-platform-page #dmx-register .dmx-form-grid        { grid-template-columns: 1fr; }
    body.dmx-platform-page #dmx-register .dmx-field--full      { grid-column: 1; }
    body.dmx-platform-page #dmx-register .dmx-input,
    body.dmx-platform-page #dmx-login    .dmx-input            { font-size: 16px; }
    body.dmx-platform-page #dmx-login .dmx-login-panel form    { padding: 24px 16px; }

    /* Platform wrap: minimal padding */
    body.dmx-platform-page .dmx-platform-wrap                  { padding: 0 12px 24px; }

    /* Admin nav: icon only or very compact */
    body.dmx-platform-page .dmx-admin-nav__link                { padding: 10px 8px; font-size: 11px; }

    /* Hero count */
    body.dmx-platform-page .dmx-jobs-hero-count                { font-size: 18px; }
    body.dmx-platform-page .dmx-jobs-hero-badge                { font-size: 18px; width: 36px; height: 36px; }

    /* Welcome bar: stack back + awards on separate lines */
    body.dmx-platform-page .dmx-jobs-welcome-inner             { flex-direction: column; align-items: flex-start; gap: 10px; padding: 12px 16px; }

    /* Admin job card: tighter */
    body.dmx-platform-page .dmx-ajc-logo                       { width: 64px; }
    body.dmx-platform-page .dmx-ajc-info                       { flex-wrap: wrap; }
    body.dmx-platform-page .dmx-ajc-info-text                  { flex: 1 1 calc(100% - 80px); }
    body.dmx-platform-page .dmx-ajc-reward                     { width: 100%; flex-direction: row; justify-content: flex-start; gap: 6px; padding: 8px 12px; border-top: 1px solid var(--dmx-border); align-self: auto; }
    body.dmx-platform-page .dmx-ajc-title                      { font-size: 15px; }
    body.dmx-platform-page .dmx-ajc-meta                       { flex-wrap: wrap; gap: 6px; }
    body.dmx-platform-page .dmx-ajc-details-row                { flex-direction: column; gap: 4px; }
    body.dmx-platform-page .dmx-ajc-actions                    { flex-wrap: wrap; }
    body.dmx-platform-page .dmx-ajc-btn                        { font-size: 12px; padding: 8px 10px; }

    /* Stat pills: wrap freely */
    body.dmx-platform-page .dmx-stat-pill                      { font-size: 11px; }

    /* Job hero: compact */
    body.dmx-platform-page .dmx-job-hero__inner                { padding: 0 16px; gap: 12px; }
    body.dmx-platform-page .dmx-job-hero__logo                 { width: 56px; height: 56px; }
    body.dmx-platform-page .dmx-job-hero__title                { font-size: 20px; }
    body.dmx-platform-page .dmx-job-hero__meta-right           { width: 100%; flex-direction: row; flex-wrap: wrap; gap: 6px; }

    /* Proposals: job summary title smaller */
    body.dmx-platform-page .dmx-prop-job-title                 { font-size: 20px; }

    /* Kanban: horizontal scroll, compact cards */
    body.dmx-platform-page .dmx-kanban                         { gap: 8px; }
    body.dmx-platform-page .dmx-kanban-col                     { min-width: 140px; }
    body.dmx-platform-page .dmx-kanban-card                    { padding: 8px; }
    body.dmx-platform-page .dmx-kanban-card-actions            { gap: 3px; }
    body.dmx-platform-page .dmx-card-btn                       { font-size: 10px; padding: 3px 7px; }

    /* Modal: full screen feel */
    body.dmx-platform-page .dmx-modal-overlay.is-open          { align-items: center; padding: 24px 16px; }
    body.dmx-platform-page .dmx-modal-box                      { border-radius: 12px; max-height: 85vh; padding: 20px 16px; }

    /* File rows in modals */
    body.dmx-platform-page .dmx-ae-file-row                    { flex-direction: column; align-items: flex-start; }

    /* Recruiter job card */
    body.dmx-platform-page .dmx-rjc-stats-row                  { gap: 4px; }

    /* Account page */
    body.dmx-platform-page #dmx-account .dmx-account-save-btn,
    body.dmx-platform-page #dmx-account .dmx-account-delete-btn { width: 100%; justify-content: center; }

    /* Award badges: stack */
    body.dmx-platform-page .dmx-jobs-awards                    { flex-direction: column; align-items: flex-start; gap: 6px; }
}

/* ── max-width: 480px ─────────────────────────────────────── */
@media ( max-width: 480px ) {

    /* Platform wrap: near-zero padding */
    body.dmx-platform-page .dmx-platform-wrap                  { padding: 0 10px 20px; }

    /* Admin nav: hide labels, show icons only — or force scroll */
    body.dmx-platform-page .dmx-admin-nav__list                { flex-wrap: nowrap; overflow-x: auto; }
    body.dmx-platform-page .dmx-admin-nav__link                { white-space: nowrap; font-size: 11px; padding: 10px 8px; }

    /* Auth forms: minimal */
    body.dmx-platform-page #dmx-register .dmx-register-wrap    { padding: 20px 12px; }

    /* Job hero: minimal */
    body.dmx-platform-page .dmx-job-hero                       { padding: 20px 0; }
    body.dmx-platform-page .dmx-job-hero__title                { font-size: 18px; }
    body.dmx-platform-page .dmx-job-hero__logo                 { width: 44px; height: 44px; }
    body.dmx-platform-page .dmx-job-hero__meta-right           { flex-direction: column; gap: 2px; }

    /* Kanban: very compact */
    body.dmx-platform-page .dmx-kanban-col                     { min-width: 130px; }
    body.dmx-platform-page .dmx-kanban-col-header              { font-size: 11px; padding: 8px; }
    body.dmx-platform-page .dmx-kanban-card-name strong        { font-size: 12px; }

    /* Modal: full width */
    body.dmx-platform-page .dmx-modal-box                      { padding: 18px 14px; max-height: 85vh; }
    body.dmx-platform-page .dmx-modal-title                    { font-size: 20px; }

    /* Recruiter job card: compact actions */
    body.dmx-platform-page .dmx-rjc-cta                        { flex-direction: column; }
    body.dmx-platform-page .dmx-rjc-btn                        { flex-direction: column; padding: 10px; }

    /* Tabs: force scroll */
    body.dmx-platform-page .dmx-dense-tabs                   { overflow-x: auto; flex-wrap: nowrap; }
    body.dmx-platform-page .dmx-req-tab                        { white-space: nowrap; font-size: 11px; padding: 9px 10px; }

    /* Stat pills: minimal */
    body.dmx-platform-page .dmx-stat-pill                      { font-size: 10px; padding: 3px 7px; }

    /* Prop job title */
    body.dmx-platform-page .dmx-prop-job-title                 { font-size: 18px; }
    body.dmx-platform-page .dmx-prop-job-logo                  { width: 56px; height: 56px; }
}

/* ── max-height: 680px — short laptop screens ──────────────── */
@media ( max-height: 680px ) {

    /* Reduce overlay padding and box height so modal never clips top/bottom */
    body.dmx-platform-page .dmx-modal-overlay                  { padding: 12px; }
    body.dmx-platform-page .dmx-modal-box                      { max-height: 78vh; padding: 20px 24px; }
    body.dmx-platform-page .dmx-modal-title                    { font-size: 20px; margin-bottom: 4px; }
    body.dmx-platform-page .dmx-r3-job-title                   { font-size: 16px; }
    body.dmx-platform-page .dmx-r3-job-id                      { margin-bottom: 16px; }
}