/* =========================================================
   KKF Partner Dashboard
   Mobile Overview / Inner Page UI V1.2
   Append AFTER the existing kkf-partner-dash.css
   ========================================================= */

@media (max-width:1080px) {

  html {
    scroll-padding-top: calc(var(--kkf-pd-mobile-header-offset,72px) + 92px);
  }

  body.kkf-pd-mobile-menu-open-v12 {
    overflow:hidden;
  }

  .kkf-pd {
    max-width:none;
    margin:0;
    padding:0;
    background:#fff;
    overflow:visible;
  }

  /* ---------------------------------------------------------
     Original nav hidden only on mobile.
     --------------------------------------------------------- */

  .kkf-pd .kkf-pd-nav {
    display:none !important;
  }

  /* ---------------------------------------------------------
     HOTEL COVER:
     Only visible on Overview.
     It stays behind while the white sheet scrolls over it.
     --------------------------------------------------------- */

  .kkf-pd .kkf-pd-hero {
    position:sticky;
    top:var(--kkf-pd-mobile-header-offset,72px);
    z-index:1;
    min-height:250px;
    margin:0 12px;
    padding:30px 24px 54px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-end;
    border-radius:22px;
    color:#fff;
    background:
      linear-gradient(180deg,rgba(255,92,0,.64) 0%,rgba(255,92,0,.22) 42%,rgba(0,0,0,.84) 100%),
      var(--kkf-pd-mobile-cover,linear-gradient(145deg,#ff6a1b,#34130a));
    background-size:cover;
    background-position:center;
    box-shadow:none;
    isolation:isolate;
  }

  .kkf-pd .kkf-pd-hero::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:linear-gradient(
      180deg,
      rgba(255,92,0,.24) 0%,
      rgba(255,92,0,.04) 44%,
      rgba(0,0,0,.58) 75%,
      rgba(0,0,0,.83) 100%
    );
  }

  .kkf-pd .kkf-pd-hero-copy {
    position:relative;
    z-index:2;
    width:min(86%,480px);
  }

  .kkf-pd .kkf-pd-hero .kkf-eyebrow {
    margin:0 0 6px;
    color:#fff;
    font-size:10px;
    font-weight:600;
    letter-spacing:.05em;
  }

  .kkf-pd .kkf-pd-hero h2 {
    margin:0;
    color:#fff;
    font-size:clamp(28px,8vw,40px);
    line-height:1.02;
    text-shadow:0 2px 14px rgba(0,0,0,.22);
  }

  .kkf-pd .kkf-pd-hero p {
    margin:6px 0 0;
    color:rgba(255,255,255,.94);
    font-size:12px;
  }

  .kkf-pd .kkf-pd-hero-stats {
    display:none;
  }

  .kkf-pd-traveller-switch-v12 {
    position:absolute;
    top:15px;
    right:15px;
    z-index:3;
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:6px 10px;
    border:1px solid rgba(255,255,255,.5);
    border-radius:999px;
    background:rgba(0,0,0,.20);
    color:#fff !important;
    font-size:9.5px;
    font-weight:600;
    text-decoration:none !important;
    -webkit-backdrop-filter:blur(7px);
    backdrop-filter:blur(7px);
  }

  /* Hide hotel cover completely once user enters another pane. */
  .kkf-pd.kkf-pd-mobile-inner-v12 .kkf-pd-hero {
    display:none !important;
  }

  /* ---------------------------------------------------------
     WHITE CONTENT SHEET
     --------------------------------------------------------- */

  .kkf-pd .kkf-pd-body {
    position:relative;
    z-index:5;
    display:block;
    grid-template-columns:none;
    width:100%;
    margin:-30px 0 0;
    padding:0 0 72px;
    border-radius:28px 28px 0 0;
    background:#fff;
  }

  .kkf-pd.kkf-pd-mobile-inner-v12 .kkf-pd-body {
    margin:0;
    border-radius:0;
    min-height:calc(100vh - var(--kkf-pd-mobile-header-offset,72px));
  }

  .kkf-pd .kkf-pd-work {
    min-width:0;
    width:100%;
    padding:12px 12px 0;
    background:#fff;
  }

  /* Ensure Overview is fully white. */
  .kkf-pd .kkf-pd-pane[data-pane="overview"] {
    background:#fff;
  }

  /* ---------------------------------------------------------
     STICKY 4-BUTTON MOBILE NAV
     It sticks BELOW the real mobile site header.
     --------------------------------------------------------- */

  .kkf-pd-mobile-nav-v12 {
    position:sticky;
    top:var(--kkf-pd-mobile-header-offset,72px);
    z-index:50;
    width:100%;
    padding:12px 6px 8px;
    border-radius:28px 28px 0 0;
    background:rgba(255,255,255,.985);
    box-shadow:0 8px 24px -22px rgba(0,0,0,.48);
    -webkit-backdrop-filter:blur(14px);
    backdrop-filter:blur(14px);
  }

  .kkf-pd-mobile-handle-v12 {
    display:block;
    width:34px;
    height:5px;
    margin:0 auto 9px;
    border-radius:999px;
    background:#ff5c00;
  }

  .kkf-pd.kkf-pd-mobile-inner-v12 .kkf-pd-mobile-handle-v12 {
    display:none;
  }

  .kkf-pd-mobile-mainnav-v12 {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:2px;
  }

  .kkf-pd-mobile-main-v12 {
    display:flex !important;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:4px;
    min-width:0;
    min-height:68px;
    padding:7px 2px 4px !important;
    border:0 !important;
    border-radius:20px !important;
    outline:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#1d2321 !important;
    font-family:inherit;
    font-size:10.5px;
    font-weight:500;
    line-height:1.15;
    text-align:center;
    cursor:pointer;
    -webkit-appearance:none;
    appearance:none;
  }

  .kkf-pd-mobile-main-v12:hover,
  .kkf-pd-mobile-main-v12:focus,
  .kkf-pd-mobile-main-v12:active {
    background:transparent !important;
    box-shadow:none !important;
  }

  .kkf-pd-mobile-icon-v12 {
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border-radius:50%;
    color:#202624;
    background:transparent;
  }

  .kkf-pd-mobile-icon-v12 svg {
    width:25px;
    height:25px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.65;
    stroke-linecap:round;
    stroke-linejoin:round;
  }

  .kkf-pd-mobile-main-v12.is-active .kkf-pd-mobile-icon-v12,
  .kkf-pd-mobile-main-v12.is-menu-open .kkf-pd-mobile-icon-v12 {
    background:#ff5c00;
    color:#fff;
  }

  /* ---------------------------------------------------------
     NON-OVERVIEW CONTEXT BAR WITH BACK BUTTON
     --------------------------------------------------------- */

  .kkf-pd-mobile-context-v12 {
    position:sticky;
    top:calc(var(--kkf-pd-mobile-header-offset,72px) + 82px);
    z-index:45;
    display:flex;
    align-items:center;
    gap:12px;
    min-height:54px;
    margin:0 -12px 12px;
    padding:8px 14px;
    border-bottom:1px solid #eee9e5;
    background:#fff;
  }

  .kkf-pd-mobile-context-v12[hidden] {
    display:none !important;
  }

  .kkf-pd-mobile-back-v12 {
    display:inline-flex !important;
    align-items:center;
    gap:5px;
    min-height:36px;
    padding:6px 9px !important;
    border:0 !important;
    border-radius:999px !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#202624 !important;
    font-family:inherit;
    font-size:11px;
    font-weight:600;
    cursor:pointer;
  }

  .kkf-pd-mobile-back-v12 svg {
    width:21px;
    height:21px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
  }

  .kkf-pd-mobile-context-title-v12 {
    min-width:0;
    overflow:hidden;
    font-size:14px;
    font-weight:700;
    color:#1d2421;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* ---------------------------------------------------------
     OVERVIEW CARDS / CONTENT QUALITY
     --------------------------------------------------------- */

  .kkf-pd .kkf-pd-cards {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:0 0 12px;
  }

  .kkf-pd .kkf-pd-card {
    min-height:112px;
    padding:14px 13px;
    border:1px solid #ece8e4;
    border-radius:15px;
    background:#fff;
    box-shadow:0 6px 16px -15px rgba(0,0,0,.38);
  }

  .kkf-pd .kkf-pd-card-label {
    font-size:8.8px;
    letter-spacing:.08em;
    color:#606965;
  }

  .kkf-pd .kkf-pd-card-value {
    margin:8px 0 4px;
    font-size:27px;
  }

  .kkf-pd .kkf-pd-card-note {
    font-size:9.5px;
    line-height:1.35;
    color:#818985;
  }

  .kkf-pd .kkf-pd-panel {
    padding:16px 14px;
    border:1px solid #ece8e4;
    border-radius:15px;
    background:#fff;
    box-shadow:0 6px 16px -15px rgba(0,0,0,.38);
  }

  .kkf-pd .kkf-pd-checklist li {
    gap:8px;
    min-height:39px;
    padding:8px 0;
    font-size:10.5px;
  }

  .kkf-pd .kkf-pd-checklist li::before {
    width:18px;
    height:18px;
    border-width:1.5px;
  }

  /* ---------------------------------------------------------
     PREVIEW
     --------------------------------------------------------- */

  .kkf-pd-preview-open.kkf-pd-hide-preview-v12 {
    display:none !important;
  }

  /* ---------------------------------------------------------
     PROPERTY / FINANCE SUBMENU
     --------------------------------------------------------- */

  .kkf-pd-mobile-backdrop-v12 {
    position:fixed;
    inset:0;
    z-index:9990;
    background:rgba(18,21,20,.48);
    -webkit-backdrop-filter:blur(1.5px);
    backdrop-filter:blur(1.5px);
  }

  .kkf-pd-mobile-backdrop-v12[hidden] {
    display:none !important;
  }

  .kkf-pd-mobile-menu-v12 {
    position:fixed;
    z-index:9991;
    padding:13px 11px;
    border:1.5px solid #ff5c00;
    border-radius:23px;
    background:#fff;
    box-shadow:0 26px 70px -30px rgba(0,0,0,.64);
  }

  .kkf-pd-mobile-menu-arrow-v12 {
    position:absolute;
    top:-10px;
    left:var(--kkf-pd-arrow-x,50%);
    width:19px;
    height:19px;
    transform:translateX(-50%) rotate(45deg);
    border-top:1.5px solid #ff5c00;
    border-left:1.5px solid #ff5c00;
    background:#fff;
  }

  .kkf-pd-mobile-menu-list-v12 {
    position:relative;
    z-index:2;
  }

  .kkf-pd-mobile-subitem-v12 {
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr);
    align-items:center;
    gap:8px;
    width:100%;
    min-height:54px;
    padding:8px 10px !important;
    border:0 !important;
    border-radius:13px !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#171c1a !important;
    font-family:inherit;
    text-align:left;
    cursor:pointer;
  }

  .kkf-pd-mobile-subitem-v12:hover,
  .kkf-pd-mobile-subitem-v12:focus {
    background:#fff6f0 !important;
  }

  .kkf-pd-mobile-subicon-v12 {
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .kkf-pd-mobile-subicon-v12 svg {
    width:28px;
    height:28px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
  }

  .kkf-pd-mobile-subitem-v12 strong {
    font-size:17px;
    font-weight:500;
  }

  /* Existing fullscreen preview must remain above the mobile navigation. */
  .kkf-pd-preview {
    z-index:10010;
  }
}

@media (max-width:620px) {

  .kkf-pd .kkf-pd-hero {
    min-height:224px;
    margin:0 6px;
    padding:26px 20px 48px;
    border-radius:18px;
  }

  .kkf-pd .kkf-pd-body {
    margin-top:-27px;
  }

  .kkf-pd.kkf-pd-mobile-inner-v12 .kkf-pd-body {
    margin-top:0;
  }

  .kkf-pd-mobile-nav-v12 {
    padding-left:4px;
    padding-right:4px;
  }

  .kkf-pd .kkf-pd-work {
    padding-left:8px;
    padding-right:8px;
  }

  .kkf-pd-mobile-context-v12 {
    margin-left:-8px;
    margin-right:-8px;
  }
}

@media (min-width:1081px) {
  .kkf-pd-mobile-nav-v12,
  .kkf-pd-mobile-context-v12,
  .kkf-pd-mobile-backdrop-v12,
  .kkf-pd-traveller-switch-v12 {
    display:none !important;
  }
}
