/* KN MTB App UI v2.7.18
   Mobil-first PWA styling for iPhone + desktop fallback.
*/
:root{
  --kn-green:#007F79;
  --kn-green-dark:#045d59;
  --kn-green-soft:#e6f4f2;
  --kn-bg:#f3f7f6;
  --kn-surface:#ffffff;
  --kn-border:#dfe8e6;
  --kn-text:#172120;
  --kn-muted:#667572;
  --kn-shadow:0 14px 34px rgba(6, 54, 51, .10);
  --safe-top: env(safe-area-inset-top);
  --safe-bottom: env(safe-area-inset-bottom);
}

*{ box-sizing:border-box; }
html{ min-height:100%; background:var(--kn-bg); }
body{
  min-height:100%;
  margin:0;
  background:
    radial-gradient(circle at top left, rgba(0,127,121,.16), transparent 34rem),
    linear-gradient(180deg, #eef8f6 0%, var(--kn-bg) 14rem, var(--kn-bg) 100%);
  color:var(--kn-text);
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior-y:none;
}
body.has-mobile-actions{ padding-bottom:calc(84px + var(--safe-bottom)); }

.app-header{
  position:sticky;
  top:0;
  z-index:1035;
}

.ios-statusbar{
  height:var(--safe-top);
  background:linear-gradient(135deg, var(--kn-green), var(--kn-green-dark));
}

.app-navbar{
  position:relative;
  top:auto;
  z-index:1030;
  background:linear-gradient(135deg, var(--kn-green), var(--kn-green-dark));
  color:#fff;
  padding:.55rem .15rem;
  box-shadow:0 10px 22px rgba(0,0,0,.13);
}
.app-navbar-inner{ gap:.75rem; }
.app-brand{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  color:#fff !important;
  font-weight:800;
  letter-spacing:.01em;
  min-width:0;
}
.app-brand-icon{
  display:inline-grid;
  place-items:center;
  width:2.25rem;
  height:2.25rem;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}
.app-brand-text{ white-space:nowrap; }
.app-nav-actions{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-left:auto;
}
.app-navbar .btn{
  min-height:38px;
  border-radius:999px;
  padding:.45rem .8rem;
  font-weight:700;
}
.app-navbar .btn-light{
  color:var(--kn-green-dark);
  border-color:rgba(255,255,255,.8);
}
.app-navbar .btn-outline-light{
  color:#fff;
  border-color:rgba(255,255,255,.52);
}

.app-container{
  width:min(460px, 100%);
  padding:1rem .85rem;
}
.footer-bar{
  color:var(--kn-muted);
  padding:1rem 0 calc(1rem + var(--safe-bottom));
}
.footer-inner{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  font-size:.875rem;
}
.footer-inner a{ color:var(--kn-green-dark); }

h1,.h1,h2,.h2,h3,.h3{ letter-spacing:-.02em; }
a{ color:var(--kn-green-dark); }

.card{
  border:1px solid rgba(18, 83, 78, .10);
  border-radius:1.1rem;
  box-shadow:var(--kn-shadow);
  overflow:hidden;
}
.card-footer{
  background:#fbfdfc;
  border-top:1px solid var(--kn-border);
}
.bike-card .card-body{ padding:1.05rem; }
.bike-card h2 a{
  color:var(--kn-text);
  text-decoration:none;
}
.bike-card h2 a:after{ content:' ›'; color:var(--kn-green); }
.bike-card .card-footer{
  display:flex;
  gap:.55rem;
  flex-wrap:wrap;
}
.bike-card .card-footer .btn,
.bike-card .card-footer form{ flex:1 1 auto; }
.bike-card .card-footer form .btn{ width:100%; }

.btn{
  border-radius:.85rem;
  font-weight:700;
  touch-action:manipulation;
}
.btn-primary,
.btn-success{
  background:var(--kn-green);
  border-color:var(--kn-green);
}
.btn-primary:hover,
.btn-success:hover{
  background:var(--kn-green-dark);
  border-color:var(--kn-green-dark);
}
.btn-outline-primary,
.btn-outline-success{
  color:var(--kn-green-dark);
  border-color:rgba(0,127,121,.42);
}
.btn-outline-primary:hover,
.btn-outline-success:hover{
  background:var(--kn-green);
  border-color:var(--kn-green);
}
.form-control,.form-select{
  border-radius:.85rem;
  border-color:var(--kn-border);
}
.form-control:focus,.form-select:focus{
  border-color:rgba(0,127,121,.52);
  box-shadow:0 0 0 .2rem rgba(0,127,121,.12);
}

.page-header,
.bike-page-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:1rem;
}
.page-actions,
.bike-page-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.5rem;
}
.stat-line{
  color:var(--kn-muted);
}
.action-row{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-bottom:1rem;
}
.action-row .btn{ min-height:42px; }

.thumb{
  width:92px;
  height:92px;
  object-fit:cover;
  border-radius:1rem;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
  margin:0 .55rem .55rem 0;
}
.spec-list{ padding-left:1rem; margin-bottom:0; }
.table{ --bs-table-bg:transparent; }
.table thead th{
  background:#fff;
  color:var(--kn-muted);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.03em;
  border-bottom:1px solid var(--kn-border);
}
.table td,.table th{ vertical-align:middle; }
.table-responsive{
  border-radius:1rem;
}

.modal-content{ border-radius:1.1rem; border:0; overflow:hidden; }
.modal-header{
  background:#f7fbfa;
  border-bottom:1px solid var(--kn-border);
}
.modal-footer{
  background:#f7fbfa;
  border-top:1px solid var(--kn-border);
}
.modal-fullscreen .modal-content{ border-radius:0; }
#imgMain{ object-fit:contain; }

.mobile-actions{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:1040;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(16px);
  border-top:1px solid var(--kn-border);
  box-shadow:0 -12px 28px rgba(0,0,0,.09);
  padding:.55rem .75rem calc(.55rem + var(--safe-bottom));
}
.mobile-actions .d-flex{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:.45rem !important;
}
.mobile-actions .btn{
  min-width:0;
  min-height:40px;
  padding:.42rem .3rem;
  font-size:.82rem;
  white-space:nowrap;
}



/* Frontpage v2.6.4 – mobile-all garage view */
.home-page{
  display:block;
}
.home-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.85rem;
  margin:.15rem 0 1rem;
}
.home-title{
  margin:0;
  font-size:1.42rem;
  line-height:1.05;
  font-weight:850;
  letter-spacing:-.04em;
}
.home-subtitle{
  margin-top:.28rem;
  color:var(--kn-muted);
  font-size:.88rem;
}
.home-new-bike{
  flex:0 0 auto;
  min-width:4.8rem;
  min-height:2.75rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.34rem;
  border-radius:1rem;
  padding:.58rem .86rem;
  box-shadow:0 10px 22px rgba(0,127,121,.22);
}
.home-new-bike-icon{
  font-size:1.2rem;
  line-height:1;
  font-weight:900;
}
.bike-grid-home{
  display:grid;
  grid-template-columns:1fr;
  gap:.88rem;
}
.bike-home-card{
  overflow:hidden;
  border:1px solid rgba(18,83,78,.10);
  border-radius:1.35rem;
  background:rgba(255,255,255,.94);
  box-shadow:0 16px 36px rgba(6,54,51,.12);
}
.bike-home-link{
  display:block;
  color:var(--kn-text);
  text-decoration:none;
}
.bike-home-media{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg, #dcefeb, #f7fbfa);
  aspect-ratio:16/10;
}
.bike-home-image{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.bike-home-placeholder{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-size:4rem;
  background:
    radial-gradient(circle at 30% 25%, rgba(0,127,121,.18), transparent 34%),
    linear-gradient(135deg, #e6f4f2, #ffffff);
}
.bike-home-title{
  margin:0;
  padding:.9rem 1rem .85rem;
  font-size:1.18rem;
  line-height:1.18;
  font-weight:850;
  letter-spacing:-.035em;
}
.bike-card-actions{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:.5rem;
  padding:0 1rem 1rem;
}
.bike-card-actions .bike-delete-form{
  display:block;
  min-width:0;
}
.bike-action-btn{
  width:100%;
  min-height:2.85rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(0,127,121,.18);
  background:#f7fbfa;
  color:var(--kn-green-dark);
  border-radius:1rem;
  box-shadow:none;
}
.bike-action-btn:hover,
.bike-action-btn:focus{
  background:var(--kn-green-soft);
  border-color:rgba(0,127,121,.34);
  color:var(--kn-green-dark);
}
.bike-action-danger{
  color:#c51f3b;
  border-color:rgba(197,31,59,.24);
  background:#fff8fa;
}
.bike-action-danger:hover,
.bike-action-danger:focus{
  color:#a9142d;
  background:#fff0f3;
  border-color:rgba(197,31,59,.38);
}
.bike-action-icon{
  font-size:1.45rem;
  line-height:1;
  font-weight:850;
}
.empty-state-card{
  border:1px solid rgba(18,83,78,.10);
  border-radius:1.35rem;
  background:rgba(255,255,255,.94);
  box-shadow:0 16px 36px rgba(6,54,51,.12);
  padding:1.2rem;
  text-align:center;
}
.empty-state-icon{
  width:5.2rem;
  height:5.2rem;
  display:grid;
  place-items:center;
  margin:0 auto 1rem;
  border-radius:999px;
  background:var(--kn-green-soft);
  font-size:2.4rem;
}
.empty-state-card h2{
  margin:0 0 .35rem;
  font-size:1.25rem;
  font-weight:850;
}
.empty-state-card p{
  color:var(--kn-muted);
  margin:0 0 1rem;
}


/* Bike detail v2.6.4 */
.bike-detail-page{
  display:grid;
  gap:1rem;
}
.bike-summary-card,
.detail-gallery-card{
  border:1px solid rgba(18,83,78,.10);
  border-radius:1.35rem;
  background:rgba(255,255,255,.94);
  box-shadow:0 16px 36px rgba(6,54,51,.10);
  overflow:hidden;
}
.bike-summary-card{
  padding:1rem;
}
.bike-detail-title{
  margin:0 0 .85rem;
  font-size:1.45rem;
  line-height:1.06;
  font-weight:850;
  letter-spacing:-.04em;
}
.bike-summary-list{
  display:grid;
  gap:.7rem;
}
.bike-summary-row{
  display:flex;
  flex-direction:column;
  gap:.15rem;
  padding-bottom:.7rem;
  border-bottom:1px solid rgba(18,83,78,.10);
}
.bike-summary-row:last-child{
  padding-bottom:0;
  border-bottom:0;
}
.bike-summary-label{
  color:var(--kn-muted);
  font-size:.82rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.bike-summary-value{
  font-size:1.12rem;
  font-weight:780;
  line-height:1.25;
}
.detail-gallery-hero-wrap{
  position:relative;
  background:linear-gradient(135deg, #dcefeb, #f7fbfa);
}
.detail-gallery-hero{
  width:100%;
  display:block;
  aspect-ratio:4/3;
  object-fit:cover;
  cursor:pointer;
}
.detail-gallery-open-btn{
  position:absolute;
  right:.85rem;
  bottom:.85rem;
  min-height:2.4rem;
  padding:.45rem .9rem;
  border-radius:999px;
  border-color:rgba(255,255,255,.65);
  background:rgba(23,33,32,.56);
  color:#fff;
  backdrop-filter:blur(8px);
}
.detail-gallery-open-btn:hover,
.detail-gallery-open-btn:focus{
  background:rgba(23,33,32,.72);
  color:#fff;
}
.detail-gallery-track{
  display:flex;
  gap:.65rem;
  overflow-x:auto;
  padding:.85rem;
  scroll-snap-type:x proximity;
}
.detail-gallery-track::-webkit-scrollbar{ height:8px; }
.detail-gallery-track::-webkit-scrollbar-thumb{ background:rgba(0,127,121,.25); border-radius:999px; }
.detail-gallery-thumb{
  flex:0 0 6.2rem;
  width:6.2rem;
  border:1px solid rgba(18,83,78,.10);
  border-radius:1rem;
  background:#fff;
  padding:0;
  overflow:hidden;
  box-shadow:0 6px 18px rgba(6,54,51,.08);
  scroll-snap-align:start;
}
.detail-gallery-thumb img{
  display:block;
  width:100%;
  height:5.5rem;
  object-fit:cover;
}
.detail-gallery-thumb.is-active{
  border-color:rgba(0,127,121,.65);
  box-shadow:0 0 0 2px rgba(0,127,121,.18);
}
.detail-gallery-empty{
  padding:1rem;
  color:var(--kn-muted);
}
.detail-actions-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.65rem;
}
.detail-section-btn{
  min-height:3.4rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  padding:.8rem .95rem;
  border:1px solid rgba(0,127,121,.18);
  background:rgba(255,255,255,.94);
  color:var(--kn-green-dark);
  border-radius:1.1rem;
  box-shadow:0 10px 22px rgba(6,54,51,.06);
  text-align:left;
}
.detail-section-btn::after{
  content:'›';
  font-size:1.2rem;
  line-height:1;
  color:rgba(23,33,32,.64);
}
.detail-section-btn:hover,
.detail-section-btn:focus{
  background:var(--kn-green-soft);
  border-color:rgba(0,127,121,.34);
  color:var(--kn-green-dark);
}
.detail-section-btn[disabled]{
  color:#98a6a3;
  background:#f5f8f7;
  border-color:rgba(18,83,78,.10);
}
.detail-section-btn[disabled]::after{ color:#b6c0be; }

.modal-content{
  border-radius:1.2rem;
}
.modal-header .modal-title{
  font-weight:800;
  letter-spacing:-.02em;
}
.modal-footer .btn,
.modal-header .btn-close{
  box-shadow:none;
}

.mobile-actions .btn{
  min-width:0;
  min-height:40px;
  padding:.42rem .3rem;
  font-size:.82rem;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space:nowrap;
}
.mobile-actions .btn-outline-dark,
.mobile-actions .btn-outline-secondary,
.mobile-actions .btn-outline-success{
  background:#fff;
}


@media (max-width: 768px){
  .app-navbar{ padding:.55rem .25rem; }
  .app-navbar-inner{
    flex-wrap:nowrap;
    align-items:center;
  }
  .app-brand-text{ font-size:1.12rem; }
  .app-nav-actions{ gap:.4rem; }
  .app-navbar .btn{
    min-height:36px;
    padding:.42rem .65rem;
    font-size:.86rem;
  }
  .app-container{
    padding:.85rem .75rem;
    width:min(460px, 100%);
  }
  .page-header,
  .bike-page-header,
  .d-flex.align-items-center.justify-content-between.mb-2{
    display:block !important;
  }
  .page-actions,
  .bike-page-actions,
  .d-flex.align-items-center.justify-content-between.mb-2 > .d-flex.gap-2{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:.55rem !important;
    margin-top:.8rem;
  }
  .page-actions .btn,
  .bike-page-actions .btn,
  .d-flex.align-items-center.justify-content-between.mb-2 > .d-flex.gap-2 .btn{
    width:100%;
    min-height:46px;
  }
  .detail-actions-grid,
  .action-row,
  .mb-3.d-flex.flex-wrap.gap-2{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:.55rem !important;
  }
  .detail-actions-grid .btn,
  .action-row .btn,
  .mb-3.d-flex.flex-wrap.gap-2 .btn{
    width:100%;
    min-height:46px;
    padding:.55rem .55rem;
  }
  h1,.h4{ font-size:1.35rem; }
  .text-muted{ color:var(--kn-muted) !important; }
  .card{ border-radius:1rem; }
  .bike-card .card-footer{ display:grid; grid-template-columns:1fr 1fr; }
  .bike-card .card-footer .btn{ min-height:42px; }
  .thumb{
    width:31vw;
    height:31vw;
    max-width:126px;
    max-height:126px;
    margin:0 .35rem .5rem 0;
  }
  .form-control,.form-select,textarea.form-control{
    min-height:46px;
    font-size:16px; /* iOS: ingen zoom ved input */
  }
  textarea.form-control{ min-height:96px; }
  .btn{ min-height:44px; }

  .table-responsive{ overflow:visible; }
  table.table:not(.keep-table){ display:block; width:100%; }
  table.table:not(.keep-table) thead{ display:none; }
  table.table:not(.keep-table) tbody,
  table.table:not(.keep-table) tfoot{ display:block; width:100%; }
  table.table:not(.keep-table) tr{
    display:block;
    background:#fff;
    border:1px solid var(--kn-border);
    border-radius:1rem;
    box-shadow:0 8px 20px rgba(6,54,51,.06);
    padding:.75rem;
    margin-bottom:.75rem;
  }
  table.table:not(.keep-table) td,
  table.table:not(.keep-table) th{
    display:grid;
    grid-template-columns:minmax(7rem, 38%) 1fr;
    gap:.75rem;
    align-items:start;
    border:0 !important;
    padding:.35rem 0 !important;
    white-space:normal !important;
  }
  table.table:not(.keep-table) td::before,
  table.table:not(.keep-table) th::before{
    content:attr(data-label);
    color:var(--kn-muted);
    font-weight:800;
    font-size:.82rem;
  }
  table.table:not(.keep-table) td:last-child{
    display:flex;
    gap:.45rem;
    flex-wrap:wrap;
    justify-content:flex-start;
  }
  table.table:not(.keep-table) td:last-child::before{ flex:0 0 100%; }
  table.table:not(.keep-table) td:last-child .btn,
  table.table:not(.keep-table) td:last-child form{ flex:1 1 auto; }
  table.table:not(.keep-table) td:last-child form .btn{ width:100%; }
  .modal-dialog{ margin:.5rem; }
  .modal-body{ padding:.85rem; }
  .modal-footer .btn{ width:100%; }
  .footer-inner{ display:block; text-align:center; }
  .footer-inner a{ display:block; margin-top:.25rem; }
}

@media (max-width: 390px){
  .app-brand-icon{ width:2rem; height:2rem; }
  .app-navbar .btn{ font-size:.8rem; padding:.38rem .55rem; }
  .mobile-actions .btn{ font-size:.78rem; }
}

@media (min-width: 769px){
  .app-container{ width:min(560px, 100%); }
}

/* ===== v2.6.4 – sharper mockup-aligned UI ===== */
.app-header,
.app-container,
.footer-bar{
  max-width:480px;
  margin-left:auto;
  margin-right:auto;
}

body{
  background:#eef1f2;
}

.ios-statusbar,
.app-navbar{
  border-radius:0;
}

.app-header{
  padding-top:0;
}

.app-navbar{
  border-bottom-left-radius:1.4rem;
  border-bottom-right-radius:1.4rem;
  padding:.7rem .25rem .85rem;
  background:linear-gradient(135deg, #005f5b 0%, #007b76 55%, #006a66 100%);
  box-shadow:0 18px 36px rgba(6,54,51,.18);
}

.ios-statusbar{
  background:linear-gradient(135deg, #005f5b 0%, #007b76 55%, #006a66 100%);
}

.app-navbar .btn{
  min-height:34px;
  padding:.4rem .85rem;
  font-size:.8rem;
  font-weight:800;
}

.app-brand-icon{
  background:rgba(255,255,255,.14);
  width:2.55rem;
  height:2.55rem;
}

.app-brand-text{
  font-size:1.22rem;
  font-weight:900;
}

.home-page--sharp .home-top{
  margin:.15rem 0 .95rem;
}

.home-page--sharp .home-new-bike{
  border-radius:1rem;
  min-height:2.85rem;
  min-width:5rem;
  gap:.45rem;
  font-weight:800;
}

.bike-home-card--sharp{
  border-radius:1.4rem;
  box-shadow:0 16px 40px rgba(10,44,42,.10);
}

.bike-home-card--sharp .bike-home-media{
  aspect-ratio:16/9;
}

.bike-home-card--sharp .bike-home-title{
  padding:1rem 1rem .75rem;
  font-size:1.18rem;
}

.bike-card-actions--sharp{
  padding:0 1rem 1rem;
  gap:.55rem;
}

.bike-action-btn--home{
  min-height:2.9rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  background:#fff;
  border:1px solid rgba(10,44,42,.14);
  color:#1e5451;
  border-radius:1rem;
  font-weight:800;
}

.bike-action-btn--home i{
  font-size:1rem;
}

.bike-summary-card{
  padding:.45rem 0;
  border-radius:1.15rem;
  box-shadow:0 8px 24px rgba(9,38,36,.06);
}

.bike-detail-title{
  display:none;
}

.bike-summary-list{
  gap:0;
}

.bike-summary-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:.85rem;
  padding:.95rem 1rem;
  border-bottom:1px solid rgba(10,44,42,.10);
}

.bike-summary-meta{
  display:flex;
  align-items:center;
  gap:.7rem;
  min-width:0;
}

.bike-summary-icon{
  color:#0f7a74;
  font-size:1rem;
  flex:0 0 auto;
}

.bike-summary-label{
  margin:0;
  color:#2b4b49;
  text-transform:none;
  letter-spacing:0;
  font-size:.92rem;
  font-weight:700;
}

.bike-summary-value{
  font-size:.95rem;
  font-weight:800;
  text-align:right;
}

.detail-gallery-card{
  border-radius:1.15rem;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(9,38,36,.08);
}

.detail-gallery-hero{
  aspect-ratio:4/2.7;
}

.detail-gallery-track{
  gap:.45rem;
  padding:.55rem;
  background:#fff;
}

.detail-gallery-thumb{
  flex:0 0 4.9rem;
  width:4.9rem;
  border-radius:.78rem;
  border:1px solid rgba(10,44,42,.12);
  overflow:hidden;
  box-shadow:none;
}

.detail-gallery-thumb img{
  height:4rem;
}

.detail-gallery-thumb.is-active{
  border-color:#0f7a74;
  box-shadow:0 0 0 2px rgba(15,122,116,.18);
}

.detail-actions-grid{
  gap:.7rem;
}

.detail-section-btn{
  min-height:4rem;
  border-radius:1rem;
  justify-content:space-between;
  padding:.9rem 1rem;
  background:#fff;
  border:1px solid rgba(10,44,42,.08);
  box-shadow:0 10px 24px rgba(9,38,36,.05);
}

.detail-section-main{
  display:flex;
  align-items:center;
  gap:.8rem;
  color:#0e726d;
  font-weight:800;
}

.detail-section-main i{
  font-size:1.15rem;
}

.detail-section-chevron{
  color:#4e5d5c;
  font-size:1rem;
}

.detail-section-btn::after{
  display:none;
}

.kn-gallery-modal .modal-content{
  background:#0f1112;
  color:#fff;
}

.kn-gallery-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:calc(.8rem + var(--safe-top)) 1rem .8rem;
  background:linear-gradient(180deg, rgba(0,0,0,.7), rgba(0,0,0,.15));
}

.kn-gallery-meta{
  display:flex;
  flex-direction:column;
  gap:.1rem;
  min-width:0;
}

.kn-gallery-counter{
  font-size:.8rem;
  color:rgba(255,255,255,.78);
}

.kn-gallery-topbar .modal-title{
  font-size:1rem;
  color:#fff;
}

.kn-gallery-stage{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1rem;
  min-height:calc(100vh - 10rem);
}

.kn-gallery-image{
  max-width:100%;
  max-height:70vh;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
}

.kn-gallery-bottombar{
  padding:.65rem .8rem calc(.8rem + var(--safe-bottom));
  background:linear-gradient(0deg, rgba(0,0,0,.72), rgba(0,0,0,.35));
}

.kn-gallery-thumbs{
  display:flex;
  gap:.45rem;
  overflow-x:auto;
}

.kn-gallery-thumb{
  flex:0 0 3.7rem;
  width:3.7rem;
  padding:0;
  border:1px solid rgba(255,255,255,.25);
  border-radius:.65rem;
  overflow:hidden;
  background:transparent;
}

.kn-gallery-thumb img{
  width:100%;
  height:3.1rem;
  object-fit:cover;
  display:block;
}

.kn-gallery-thumb.is-active{
  border-color:#4ce0d5;
  box-shadow:0 0 0 2px rgba(76,224,213,.18);
}

.mobile-actions{
  max-width:480px;
  left:50%;
  right:auto;
  transform:translateX(-50%);
  width:100%;
  border-top-left-radius:1.2rem;
  border-top-right-radius:1.2rem;
  padding:.7rem .75rem calc(.72rem + var(--safe-bottom));
  box-shadow:0 -12px 30px rgba(0,0,0,.08);
}

.mobile-actions .d-flex{
  grid-template-columns:repeat(4, minmax(0, 1fr));
}

.mobile-actions .btn{
  min-height:2.95rem;
  border-radius:1rem;
  font-size:.78rem;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  border-width:1px;
}

.mobile-actions .btn i{
  font-size:.95rem;
}

.mobile-actions .btn-primary{
  box-shadow:0 10px 22px rgba(0,127,121,.18);
}

@media (max-width: 390px){
  .detail-gallery-thumb{
    flex-basis:4.4rem;
    width:4.4rem;
  }
  .detail-gallery-thumb img{
    height:3.7rem;
  }
  .detail-section-btn{
    min-height:3.8rem;
    padding:.85rem .9rem;
  }
  .detail-section-main{
    gap:.55rem;
    font-size:.88rem;
  }
  .mobile-actions .btn span{
    font-size:.72rem;
  }
}

/* ===== v2.6.4 – stramme rettelser ===== */
.app-navbar,
.ios-statusbar{
  border-radius:0 !important;
}

.mobile-actions{
  border-top-left-radius:0 !important;
  border-top-right-radius:0 !important;
}

.detail-section-main{
  white-space:nowrap;
}

/* Data-modals: label venstre, data højre på én linje */
.knd-data-table{
  width:100%;
  margin:0;
}
.knd-data-table tbody,
.knd-data-table tr{
  display:block;
}
.knd-data-table tr{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:1rem;
  align-items:center;
  padding:.82rem 0;
  border-bottom:1px solid rgba(10,44,42,.10);
  background:transparent !important;
  box-shadow:none !important;
  border-left:0 !important;
  border-right:0 !important;
  border-top:0 !important;
  border-radius:0 !important;
}
.knd-data-table tr:last-child{ border-bottom:0 !important; }
.knd-data-table th,
.knd-data-table td{
  display:block !important;
  border:0 !important;
  padding:0 !important;
  background:transparent !important;
  vertical-align:middle;
  white-space:normal;
}
.knd-data-table th{
  color:#2b4b49;
  font-weight:800;
  text-align:left;
}
.knd-data-table td{
  color:#101918;
  font-weight:650;
  text-align:right;
}
.knd-data-table th::before,
.knd-data-table td::before{ display:none !important; content:none !important; }

.knd-data-list{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  column-gap:1rem;
  row-gap:0;
}
.knd-data-list dt,
.knd-data-list dd{
  margin:0;
  padding:.82rem 0;
  border-bottom:1px solid rgba(10,44,42,.10);
}
.knd-data-list dt{
  color:#2b4b49;
  font-weight:800;
}
.knd-data-list dd{
  color:#101918;
  font-weight:650;
  text-align:right;
}
.knd-data-list dt:nth-last-child(2),
.knd-data-list dd:last-child{
  border-bottom:0;
}

/* Mobilgalleri: thumbnails skal altid være synlige, og billedet skal tilpasse portrait/landscape */
.kn-gallery-modal .modal-dialog{
  margin:0;
  width:100%;
  max-width:none;
  height:100dvh;
}
.kn-gallery-modal .modal-content{
  height:100dvh;
  min-height:100dvh;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr) auto;
  overflow:hidden;
  border-radius:0 !important;
}
.kn-gallery-topbar{
  padding:calc(.55rem + var(--safe-top)) .85rem .55rem;
  flex:0 0 auto;
}
.kn-gallery-stage{
  min-height:0 !important;
  height:auto;
  overflow:hidden;
  padding:.75rem;
}
.kn-gallery-image{
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}
.kn-gallery-bottombar{
  flex:0 0 auto;
  padding:.55rem .7rem calc(.65rem + var(--safe-bottom));
}
.kn-gallery-thumbs{
  min-height:3.2rem;
  max-height:4.2rem;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}
.kn-gallery-thumb{
  flex:0 0 4rem;
  width:4rem;
}
.kn-gallery-thumb img{
  height:3.2rem;
}

@media (orientation: landscape){
  .kn-gallery-topbar{
    padding:calc(.35rem + var(--safe-top)) .75rem .35rem;
  }
  .kn-gallery-stage{
    padding:.35rem .75rem;
  }
  .kn-gallery-bottombar{
    padding:.35rem .7rem calc(.4rem + var(--safe-bottom));
  }
  .kn-gallery-thumbs{
    min-height:2.7rem;
    max-height:3rem;
  }
  .kn-gallery-thumb{
    flex-basis:3.4rem;
    width:3.4rem;
  }
  .kn-gallery-thumb img{
    height:2.55rem;
  }
}

/* ===== v2.6.4 – mobile modaler, komponentkort og swipe-billeder ===== */
.modal-dialog{
  margin-top:calc(var(--safe-top) + 2.25rem);
}
@media (max-width:768px){
  .modal-dialog{
    margin:calc(var(--safe-top) + 2.25rem) .75rem .75rem !important;
  }
  .modal-fullscreen{
    margin:0 !important;
  }
  .modal-header{
    padding:.8rem .95rem;
  }
  .modal-body{
    padding:.95rem;
  }
}

.detail-gallery-card--swipe{
  position:relative;
}
.detail-gallery-card--swipe .detail-gallery-hero{
  aspect-ratio:4/3;
  object-fit:cover;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-drag:none;
}
.detail-gallery-card--swipe .detail-gallery-hero-wrap{
  width:100%;
  overflow:hidden;
}
.detail-gallery-card--swipe .detail-gallery-hero{
  width:100%;
  min-height:15rem;
  height:auto;
  display:block;
}
.detail-gallery-counter{
  position:absolute;
  right:.75rem;
  bottom:.75rem;
  z-index:2;
  padding:.28rem .62rem;
  border-radius:999px;
  background:rgba(16,25,24,.62);
  color:#fff;
  font-size:.78rem;
  font-weight:800;
  backdrop-filter:blur(8px);
}

.knd-data-list{
  display:block;
}
.knd-field-row,
.knd-data-list dt,
.knd-data-list dd{
  min-height:2.85rem;
}
.knd-field-row{
  display:grid;
  grid-template-columns:minmax(0, 48%) minmax(0, 52%);
  align-items:center;
  gap:.8rem;
  padding:.72rem 0;
  border-bottom:1px solid rgba(10,44,42,.10);
}
.knd-field-row:last-child{
  border-bottom:0;
}
.knd-field-label{
  color:#2b4b49;
  font-weight:850;
  line-height:1.2;
}
.knd-field-value{
  color:#101918;
  font-weight:650;
  text-align:right;
  overflow-wrap:anywhere;
}
.knd-field-row--stack{
  grid-template-columns:1fr;
  align-items:start;
  gap:.45rem;
}
.knd-field-row--stack .knd-field-value{
  text-align:left;
}
.knd-data-list dt,
.knd-data-list dd{
  display:none;
}

.knd-component-list{
  display:grid;
  gap:.75rem;
}
.knd-component-card{
  border:1px solid rgba(10,44,42,.10);
  border-radius:1rem;
  background:#fff;
  box-shadow:0 10px 24px rgba(9,38,36,.05);
  overflow:hidden;
}
.knd-component-card summary{
  display:grid;
  grid-template-columns:1fr;
  gap:.18rem;
  padding:.9rem 1rem;
  cursor:pointer;
  list-style:none;
}
.knd-component-card summary::-webkit-details-marker{
  display:none;
}
.knd-component-card summary::after{
  content:'›';
  position:absolute;
  right:1rem;
  margin-top:.15rem;
  color:#0e726d;
  font-weight:900;
  transform:rotate(90deg);
}
.knd-component-card[open] summary::after{
  transform:rotate(-90deg);
}
.knd-component-cat{
  padding-right:1.4rem;
  color:#0e726d;
  font-weight:900;
  line-height:1.15;
}
.knd-component-brand{
  color:#101918;
  font-weight:800;
}
.knd-component-model{
  color:#667572;
  font-weight:650;
}
.knd-component-dropdown{
  border-top:1px solid rgba(10,44,42,.10);
  padding:.15rem 1rem 1rem;
}
.knd-component-images{
  display:flex;
  gap:.5rem;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.knd-component-images img{
  flex:0 0 5rem;
  width:5rem;
  height:5rem;
  object-fit:cover;
  border-radius:.8rem;
  border:1px solid rgba(10,44,42,.10);
}
.knd-card-edit-btn{
  width:100%;
  margin-top:.85rem;
  min-height:2.9rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
.knd-shopping-total{
  border:1px solid rgba(10,44,42,.10);
  border-radius:1rem;
  background:#fff;
  padding:.9rem 1rem;
  box-shadow:0 10px 24px rgba(9,38,36,.05);
}

.component-edit-form > .col-12,
.component-edit-form > .col-md-4,
.component-edit-form > .col-md-6,
.component-edit-form > .col-md-12{
  width:100%;
  flex:0 0 100%;
  max-width:100%;
}
.knd-file-label{
  display:flex;
  width:100%;
  min-height:46px;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(0,127,121,.42);
  border-radius:.85rem;
  background:#fff;
  color:var(--kn-green-dark);
  font-weight:800;
  cursor:pointer;
}
.knd-file-label input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.mobile-actions{
  background:rgba(255,255,255,.96);
}
.mobile-actions .d-flex{
  gap:.55rem !important;
}
.mobile-actions .btn{
  min-height:3.4rem;
  border-radius:1rem;
  flex-direction:column;
  gap:.15rem;
  background:#fff;
  box-shadow:0 10px 22px rgba(6,54,51,.06);
}
.mobile-actions .btn-primary{
  background:var(--kn-green);
  color:#fff;
}
.mobile-actions .btn i{
  font-size:1.05rem;
  line-height:1;
}
.mobile-actions .btn span{
  line-height:1.05;
}

@media (orientation:landscape){
  .detail-gallery-card--swipe .detail-gallery-hero{
    width:100%;
    max-height:none;
    aspect-ratio:4/3;
    object-fit:cover;
    background:transparent;
  }
}

/* v2.6.4 – mobile editors and file administration */
.knd-mobile-form > [class*="col-"]{
  width:100%;
  flex:0 0 100%;
  max-width:100%;
}
.knd-link-row{
  display:grid;
  grid-template-columns:1fr;
  gap:.45rem;
  padding:.6rem;
  border:1px solid rgba(10,44,42,.08);
  border-radius:.9rem;
  background:#fff;
}
.knd-file-admin-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:.75rem;
}
.knd-file-admin-card{
  border:1px solid rgba(10,44,42,.08);
  border-radius:1rem;
  padding:.6rem;
  background:#fff;
  box-shadow:0 8px 18px rgba(9,38,36,.05);
}
.knd-file-admin-card img{
  width:100%;
  height:7rem;
  object-fit:cover;
  border-radius:.75rem;
  display:block;
  margin-bottom:.55rem;
}
.knd-file-admin-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.35rem;
}
.knd-file-admin-actions form:last-child{
  grid-column:1 / -1;
}
.knd-file-admin-actions .btn,
.knd-doc-admin-row .btn{
  width:100%;
  min-height:2.35rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
.knd-doc-admin-list{
  display:grid;
  gap:.6rem;
}
.knd-doc-admin-row{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:.35rem;
  align-items:center;
  padding:.6rem;
  border:1px solid rgba(10,44,42,.08);
  border-radius:.9rem;
  background:#fff;
}
.knd-doc-admin-row form:last-child{
  grid-column:1 / -1;
}
.knd-doc-admin-row > a{
  grid-column:1 / -1;
  justify-content:flex-start !important;
}
.knd-component-card summary{
  cursor:pointer;
}
@media (max-width:390px){
  .knd-file-admin-grid{ grid-template-columns:1fr; }
}

/* v2.6.4 – Komponenter modal header layout */
.knd-component-card summary{
  position:relative;
  display:grid;
  grid-template-columns:minmax(6.8rem, 38%) minmax(0, 1fr);
  align-items:start;
  gap:.85rem;
  padding:.95rem 1rem;
}
.knd-component-card summary::after{
  content:none !important;
  display:none !important;
}
.knd-component-cat{
  padding-right:0;
  color:#0e726d;
  font-weight:900;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.knd-component-current{
  display:flex;
  flex-direction:column;
  gap:.18rem;
  min-width:0;
  text-align:right;
}
.knd-component-brand,
.knd-component-model{
  display:block;
  overflow-wrap:anywhere;
}
.knd-component-brand{
  color:#101918;
  font-weight:850;
  line-height:1.2;
}
.knd-component-model{
  color:#667572;
  font-weight:650;
  line-height:1.25;
}
@media (max-width:390px){
  .knd-component-card summary{
    grid-template-columns:minmax(5.8rem, 36%) minmax(0, 1fr);
    gap:.65rem;
  }
}


/* v2.6.4 – bottom menu without Filer */
.mobile-actions .d-flex{
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}
.mobile-actions .btn{
  min-height:3rem;
}


/* v2.6.6 – Komponenter og Opgraderinger vises ens i modal */
.knd-component-card summary{
  grid-template-columns:1fr !important;
  gap:.16rem !important;
  align-items:start;
}
.knd-component-card summary .small.text-muted{
  display:block;
  text-align:left;
  margin-top:.1rem;
}
.knd-component-current{
  text-align:left;
}
.knd-component-cat,
.knd-component-brand,
.knd-component-model{
  display:block;
  text-align:left;
}
.knd-shopping-list .knd-component-card summary{
  grid-template-columns:1fr !important;
}

/* v2.6.14 – stramme editor-/viewer-tilføjelser */
.knd-editor-card{
  border:1px solid rgba(18,83,78,.10);
  border-radius:1.1rem;
  background:#fff;
  box-shadow:var(--kn-shadow);
  padding:1rem;
}
.knd-guide-list{display:flex;flex-direction:column;gap:.65rem;}
.knd-guide-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.75rem .85rem;
  border:1px solid var(--kn-border);
  border-radius:.9rem;
  background:#fbfdfc;
}
.knd-guide-label{font-weight:700;line-height:1.25;}
.knd-media-viewer-body{
  overflow:auto;
  background:#101615;
  padding:0;
  touch-action:pan-x pan-y pinch-zoom;
}
.knd-media-viewer-image{
  display:none;
  max-width:none;
  width:100%;
  height:auto;
  transform-origin:top left;
  transition:transform .12s ease;
  cursor:zoom-in;
}
.knd-media-viewer-frame{
  display:none;
  border:0;
  width:100%;
  min-height:calc(100vh - 122px);
  background:#fff;
}
.detail-gallery-hero{cursor:zoom-in;}


/* v2.6.15 – forside-bundmenu med Tips & tricks + Ny cykel */
.home-bottom-actions .d-flex{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}


.tips-list{
  display:grid;
  gap:.85rem;
}
.tips-row{
  border:1px solid rgba(10,44,42,.10);
  border-radius:1rem;
  background:#fff;
  padding:.85rem;
}

/* v2.6.16 – Tips & tricks stram mobil-UI */
.tips-list-card{
  padding:.85rem;
}
.knd-tip-list{
  display:flex;
  flex-direction:column;
  gap:.65rem;
}
.knd-tip-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:.7rem;
  padding:.85rem .85rem;
  border:1px solid var(--kn-border);
  border-radius:.95rem;
  background:#fbfdfc;
}
.knd-tip-link{
  color:#102321;
  font-weight:800;
  line-height:1.25;
  text-decoration:none;
  overflow-wrap:anywhere;
}
.knd-tip-link:hover,
.knd-tip-link:focus{
  color:#007f79;
  text-decoration:none;
}
.knd-tip-actions{
  display:flex;
  align-items:center;
  gap:.35rem;
}
.knd-icon-btn{
  width:2.35rem;
  height:2.35rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:.75rem;
  padding:0;
}
.knd-tip-viewer-body{
  padding:0;
  background:#fff;
}
.knd-tip-viewer-frame{
  display:block;
  border:0;
  width:100%;
  min-height:calc(100vh - 122px);
  background:#fff;
}
.tips-bottom-actions .d-flex{
  grid-template-columns:1fr !important;
}
.tips-bottom-actions .btn{
  min-height:3rem;
}

/* v2.6.17 – Tips & tricks: ekstern åbning, kompakte handlinger og bundmenu i app-stil */
.knd-tip-row{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:.45rem !important;
  align-items:start !important;
  padding:.9rem 1rem !important;
  border:1px solid rgba(10,44,42,.10) !important;
  border-radius:1rem !important;
  background:#fff !important;
  box-shadow:0 10px 24px rgba(9,38,36,.05);
}
.knd-tip-link{
  display:block;
  min-width:0;
  padding-right:0;
  color:#101918;
  font-weight:850;
  line-height:1.25;
}
.knd-tip-actions{
  justify-content:flex-end !important;
  gap:.28rem !important;
}
.knd-tip-actions form{
  display:inline-flex;
}
.knd-icon-btn{
  width:1.95rem !important;
  height:1.95rem !important;
  min-height:1.95rem !important;
  border-radius:.65rem !important;
  padding:0 !important;
  font-size:.82rem;
}
.tips-bottom-actions{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:0 !important;
  transform:translateX(-50%) !important;
  width:100% !important;
  max-width:480px !important;
  z-index:1040 !important;
}
.tips-bottom-actions .d-flex{
  grid-template-columns:1fr !important;
}
.tips-bottom-actions .btn{
  width:100%;
}


/* v2.6.19 – stram rettelse: Tips bundmenu + clean media modal */
.single-bottom-actions.mobile-actions,
.tips-bottom-actions.mobile-actions{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:0 !important;
  top:auto !important;
  transform:translateX(-50%) !important;
  width:100% !important;
  max-width:480px !important;
  z-index:1040 !important;
  background:rgba(255,255,255,.96) !important;
  border-top:1px solid var(--kn-border) !important;
  border-radius:0 !important;
  padding:.7rem .75rem calc(.72rem + var(--safe-bottom)) !important;
  box-shadow:0 -12px 30px rgba(0,0,0,.08) !important;
}
.single-bottom-actions .d-flex,
.tips-bottom-actions .d-flex{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:.55rem !important;
}
.single-bottom-actions .btn,
.tips-bottom-actions .btn{
  width:100% !important;
  min-height:3.4rem !important;
  border-radius:1rem !important;
  flex-direction:column !important;
  gap:.15rem !important;
}

.knd-clean-media-modal .modal-dialog{
  margin:0 !important;
  width:100% !important;
  max-width:none !important;
  height:100dvh !important;
}
.knd-clean-media-modal .modal-content{
  position:relative;
  height:100dvh !important;
  min-height:100dvh !important;
  border:0 !important;
  border-radius:0 !important;
  background:#050807 !important;
  overflow:hidden !important;
}
.knd-clean-media-modal .knd-media-close{
  position:fixed;
  top:calc(var(--safe-top) + .72rem);
  right:.72rem;
  z-index:1065;
  width:2.65rem;
  height:2.65rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#0b1514;
  box-shadow:0 10px 24px rgba(0,0,0,.22);
}
.knd-clean-media-modal .knd-media-viewer-body{
  height:100dvh;
  min-height:100dvh;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:calc(var(--safe-top) + 3.65rem) .75rem calc(var(--safe-bottom) + .85rem);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  background:#050807;
  touch-action:auto;
}
.knd-clean-media-modal .knd-media-viewer-image{
  display:none;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 4.8rem);
  object-fit:contain;
  transform:none !important;
  transition:none !important;
  cursor:zoom-in;
  touch-action:auto;
  user-select:none;
  -webkit-user-select:none;
}
.knd-clean-media-modal .knd-media-viewer-image.is-zoomed{
  max-width:none;
  max-height:none;
  width:auto;
  height:auto;
  cursor:zoom-out;
}
.knd-clean-media-modal .knd-media-viewer-frame{
  display:none;
  border:0;
  width:100%;
  height:100%;
  min-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 4.8rem);
  background:#fff;
  border-radius:.85rem;
}

/* v2.7.4 – GPS tracker pr. cykel */
.ride-page-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  margin:.15rem 0 1rem;
}
.ride-tracker-card,
.ride-history-card{
  padding:1rem;
}
.ride-status-line{
  display:flex;
  align-items:center;
  gap:.55rem;
  font-weight:850;
  margin-bottom:.85rem;
}
.ride-status-dot{
  width:.72rem;
  height:.72rem;
  border-radius:999px;
  background:#aebbb8;
  box-shadow:0 0 0 4px rgba(174,187,184,.14);
}
.ride-status-dot.is-active{
  background:var(--kn-green);
  box-shadow:0 0 0 4px rgba(0,127,121,.16), 0 0 18px rgba(0,127,121,.38);
}
.ride-live-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.7rem;
}
.ride-live-stat{
  min-width:0;
  border:1px solid rgba(10,44,42,.10);
  border-radius:1rem;
  background:linear-gradient(180deg,#fff,#f8fcfb);
  padding:.82rem .9rem;
  box-shadow:0 10px 24px rgba(9,38,36,.05);
}
.ride-live-stat span{
  display:block;
  color:var(--kn-muted);
  font-size:.78rem;
  font-weight:750;
  line-height:1.1;
  margin-bottom:.32rem;
}
.ride-live-stat strong{
  display:block;
  color:var(--kn-text);
  font-size:1.08rem;
  line-height:1.1;
  letter-spacing:-.02em;
  white-space:nowrap;
}
.ride-message{
  min-height:2.4rem;
  margin:.85rem 0 0;
}
.ride-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.65rem;
  margin-top:.9rem;
}
.ride-actions .btn{
  min-height:3.15rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
}
.ride-history-list{
  display:grid;
  gap:.65rem;
}
.ride-history-row{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:.75rem;
  border:1px solid rgba(10,44,42,.10);
  border-radius:1rem;
  background:#fff;
  padding:.85rem .9rem;
  box-shadow:0 10px 24px rgba(9,38,36,.05);
}
.ride-history-main{
  min-width:0;
  display:grid;
  gap:.12rem;
}
.ride-history-main strong{
  font-size:.98rem;
  line-height:1.2;
}
.ride-history-main span{
  color:var(--kn-muted);
  font-size:.84rem;
  line-height:1.25;
}
@media (max-width:380px){
  .ride-live-grid{ gap:.55rem; }
  .ride-live-stat{ padding:.72rem .72rem; }
  .ride-live-stat strong{ font-size:.98rem; }
  .ride-actions{ grid-template-columns:1fr; }
}

/* v2.7.4 – Ren mørk tracking-skærm under aktiv GPS-tur */
body.ride-tracking-active{
  background:#030807 !important;
  padding-bottom:0 !important;
  overflow:hidden;
  touch-action:manipulation;
}
body.ride-tracking-active .app-header,
body.ride-tracking-active .footer-bar,
body.ride-tracking-active .ride-page-head,
body.ride-tracking-active .ride-history-card,
body.ride-tracking-active .mobile-actions,
body.ride-tracking-active .ride-status-line,
body.ride-tracking-active .ride-message{
  display:none !important;
}
body.ride-tracking-active .app-container{
  width:100%;
  max-width:none;
  min-height:100dvh;
  padding:0;
  margin:0;
}
body.ride-tracking-active .ride-page{
  min-height:100dvh;
  margin:0;
  padding:0;
}
body.ride-tracking-active .ride-tracker-card{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  flex-direction:column;
  min-height:100dvh;
  margin:0;
  padding:calc(var(--safe-top) + 1.15rem) 1.05rem calc(var(--safe-bottom) + 1rem);
  border:0;
  border-radius:0;
  color:#fff;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 4%, rgba(0,127,121,.55), transparent 17rem),
    radial-gradient(circle at 88% 15%, rgba(32,216,198,.22), transparent 14rem),
    linear-gradient(180deg, #061412 0%, #020707 100%);
  box-shadow:none;
}
body.ride-tracking-active .ride-tracker-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.06), transparent 24%, rgba(0,0,0,.28));
}
body.ride-tracking-active .ride-live-grid{
  position:relative;
  z-index:1;
  flex:1;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.85rem;
  align-content:center;
  padding:0 0 5.7rem;
}
body.ride-tracking-active .ride-live-stat{
  min-width:0;
  border:1px solid rgba(255,255,255,.13);
  border-radius:1.3rem;
  background:rgba(255,255,255,.075);
  box-shadow:0 18px 34px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.08);
  padding:1rem .95rem;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
body.ride-tracking-active .ride-live-stat span{
  color:rgba(255,255,255,.68);
  font-size:.78rem;
  font-weight:850;
  letter-spacing:.02em;
  text-transform:uppercase;
  margin-bottom:.45rem;
}
body.ride-tracking-active .ride-live-stat strong{
  color:#fff;
  font-size:clamp(1.25rem, 6vw, 2.05rem);
  line-height:1;
  letter-spacing:-.045em;
  text-shadow:0 8px 22px rgba(0,0,0,.35);
}
body.ride-tracking-active .ride-live-stat:nth-child(1),
body.ride-tracking-active .ride-live-stat:nth-child(2){
  padding:1.15rem 1rem;
}
body.ride-tracking-active .ride-live-stat:nth-child(1) strong,
body.ride-tracking-active .ride-live-stat:nth-child(2) strong{
  font-size:clamp(1.75rem, 8vw, 3rem);
}
body.ride-tracking-active .ride-actions{
  position:fixed;
  z-index:10000;
  left:1.05rem;
  right:1.05rem;
  bottom:calc(var(--safe-bottom) + 1rem);
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  margin:0;
}
body.ride-tracking-active #rideStartBtn{
  display:none !important;
}
body.ride-tracking-active #rideStopBtn{
  display:inline-flex !important;
  width:100%;
  min-height:4rem;
  border:0;
  border-radius:1.35rem;
  font-size:1.05rem;
  font-weight:900;
  color:#fff;
  background:linear-gradient(135deg, #ef6b7b, #c83248);
  box-shadow:0 16px 34px rgba(200,50,72,.32);
}
body.ride-tracking-active #rideStopBtn:disabled{
  opacity:.72;
}
@media (max-height:680px){
  body.ride-tracking-active .ride-live-grid{
    gap:.65rem;
    padding-bottom:5rem;
  }
  body.ride-tracking-active .ride-live-stat{
    padding:.78rem .78rem;
    border-radius:1rem;
  }
  body.ride-tracking-active .ride-live-stat:nth-child(1),
  body.ride-tracking-active .ride-live-stat:nth-child(2){
    padding:.9rem .78rem;
  }
}

body.ride-tracking-active .ride-save-panel[hidden]{
  display:none !important;
}
body.ride-tracking-active .ride-page.is-saving-ride .ride-actions{
  display:none !important;
}
body.ride-tracking-active .ride-save-panel{
  position:fixed;
  z-index:10001;
  left:1.05rem;
  right:1.05rem;
  bottom:calc(var(--safe-bottom) + 1rem);
}
body.ride-tracking-active .ride-save-panel-inner{
  border:1px solid rgba(255,255,255,.14);
  border-radius:1.35rem;
  padding:1rem;
  background:rgba(2,12,11,.88);
  box-shadow:0 22px 48px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
body.ride-tracking-active .ride-save-title{
  color:#fff;
  font-size:1.05rem;
  font-weight:850;
  letter-spacing:-.025em;
  margin-bottom:.65rem;
}
body.ride-tracking-active .ride-save-label{
  display:block;
  color:rgba(255,255,255,.74);
  font-size:.82rem;
  font-weight:760;
  margin-bottom:.35rem;
}
body.ride-tracking-active .ride-save-panel .form-control{
  min-height:3rem;
  border-color:rgba(255,255,255,.18);
  color:#fff;
  background:rgba(255,255,255,.08);
}
body.ride-tracking-active .ride-save-panel .form-control::placeholder{
  color:rgba(255,255,255,.46);
}
body.ride-tracking-active .ride-save-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.65rem;
  margin-top:.85rem;
}
body.ride-tracking-active .ride-save-actions .btn{
  min-height:3.15rem;
  border-radius:1rem;
  font-weight:850;
}
body.ride-tracking-active .ride-save-actions .btn-primary{
  border:0;
  background:linear-gradient(135deg, var(--kn-green), #009b8f);
  box-shadow:0 14px 28px rgba(0,127,121,.26);
}
body.ride-tracking-active .ride-save-actions .btn-outline-light{
  color:#fff;
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.04);
}
body.ride-tracking-active .ride-page.is-saving-ride .ride-live-grid{
  padding-bottom:12.7rem;
}
@media (max-height:680px){
  body.ride-tracking-active .ride-page.is-saving-ride .ride-live-grid{
    align-content:start;
    padding-top:calc(var(--safe-top) + .5rem);
    padding-bottom:11.5rem;
  }
  body.ride-tracking-active .ride-save-panel-inner{
    padding:.82rem;
  }
  body.ride-tracking-active .ride-save-actions .btn{
    min-height:2.75rem;
  }
}


/* ===== v2.7.4 – Oprydning, ture og mere læsbar typografi ===== */
html, body{
  font-family:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Arial, sans-serif;
  font-size:15px;
  line-height:1.45;
  font-weight:400;
  text-rendering:optimizeLegibility;
}
body{ letter-spacing:-.006em; }
.modal-content{
  font-size:.94rem;
  line-height:1.48;
}
.modal-header .modal-title{
  font-weight:760;
  letter-spacing:-.018em;
}
.knd-field-label{
  font-weight:720;
  color:#294844;
}
.knd-field-value{
  font-weight:520;
  color:#172120;
  line-height:1.42;
}
.knd-field-row--note{
  align-items:start;
  padding:.85rem 0;
}
.knd-field-row--note .knd-field-label{
  font-size:.92rem;
}
.knd-note-text{
  width:100%;
  white-space:normal;
  text-align:left !important;
  line-height:1.52;
  font-weight:480;
}
.detail-actions-grid--bike{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
.detail-actions-grid--bike .detail-section-btn--wide{
  grid-column:1 / -1;
  min-height:3.65rem;
}
.mobile-actions--three .d-flex{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
.knd-modal-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.6rem;
}
.knd-modal-actions .btn{ width:100%; }
.knd-modal-subtitle{
  margin:.2rem 0 .6rem;
  color:#294844;
  font-size:.92rem;
  font-weight:760;
}
.knd-ride-list{
  display:grid;
  gap:.65rem;
}
.knd-ride-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:.65rem;
  padding:.72rem .78rem;
  border:1px solid rgba(10,44,42,.10);
  border-radius:1rem;
  background:#fff;
  box-shadow:0 10px 24px rgba(9,38,36,.045);
}
.knd-ride-open{
  min-width:0;
  display:grid;
  gap:.12rem;
  padding:0;
  border:0;
  background:transparent;
  text-align:left;
  color:inherit;
}
.knd-ride-title{
  display:block;
  color:#172120;
  font-size:.98rem;
  font-weight:720;
  line-height:1.2;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.knd-ride-date{
  display:block;
  color:var(--kn-muted);
  font-size:.82rem;
  font-weight:480;
}
.knd-ride-route{
  width:100%;
  min-height:14rem;
  border-radius:1.05rem;
  overflow:hidden;
  background:#071513;
  border:1px solid rgba(10,44,42,.10);
}
.knd-route-map{
  position:relative;
  width:100%;
  min-height:14rem;
  overflow:hidden;
  background:#071513;
  isolation:isolate;
}
.knd-route-tiles,
.knd-route-svg--map{
  position:absolute;
  inset:0;
}
.knd-route-tiles{
  z-index:1;
  filter:saturate(.9) contrast(.96) brightness(.94);
}
.knd-route-tile{
  position:absolute;
  width:256px;
  height:256px;
  max-width:none;
  user-select:none;
  -webkit-user-drag:none;
}
.knd-route-svg{
  display:block;
  width:100%;
  height:100%;
  min-height:14rem;
}
.knd-route-svg--map{
  z-index:2;
  pointer-events:none;
}
.knd-route-bg{ fill:#071513; }
.knd-route-line{
  fill:none;
  stroke:#26e0d0;
  stroke-width:5;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:
    drop-shadow(0 0 2px rgba(0,20,18,.85))
    drop-shadow(0 0 10px rgba(38,224,208,.42));
}
.knd-route-start{ fill:#86efac; stroke:#07201d; stroke-width:2; }
.knd-route-end{ fill:#f87171; stroke:#07201d; stroke-width:2; }
.knd-route-attribution{
  position:absolute;
  right:.45rem;
  bottom:.35rem;
  z-index:3;
  padding:.12rem .35rem;
  border-radius:.45rem;
  background:rgba(255,255,255,.82);
  color:#263231;
  font-size:.64rem;
  font-weight:600;
  line-height:1.2;
}
.knd-route-empty{
  min-height:14rem;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.74);
  font-size:.9rem;
  padding:1rem;
  text-align:center;
}
@media (max-width:390px){
  html,body{ font-size:14.5px; }
  .modal-content{ font-size:.92rem; }
  .detail-section-main{ font-size:.84rem; }
}


/* ===== v2.7.10 – Stram rettelse: cykeltop + tracking actions ===== */
.bike-detail-hero-card{
  overflow:hidden;
}
.bike-detail-card-title{
  margin:0;
  padding:1rem 1rem .95rem;
  font-size:1.2rem;
  line-height:1.18;
  font-weight:820;
  letter-spacing:-.035em;
}
body.ride-tracking-active .ride-tracker-card{
  display:flex;
  flex-direction:column;
}
body.ride-tracking-active .ride-live-grid{
  flex:1 1 auto;
  min-height:0;
  align-content:center;
  padding:0 0 .85rem;
}
body.ride-tracking-active .ride-actions{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  z-index:2;
  flex:0 0 auto;
  margin-top:auto;
  padding:0;
}
body.ride-tracking-active .ride-save-panel{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  z-index:2;
  flex:0 0 auto;
  margin-top:auto;
}
body.ride-tracking-active .ride-page.is-saving-ride .ride-live-grid{
  padding-bottom:.85rem;
}
@media (max-height:680px){
  body.ride-tracking-active .ride-live-grid{
    align-content:center;
    padding-bottom:.6rem;
  }
  body.ride-tracking-active .ride-page.is-saving-ride .ride-live-grid{
    padding-top:0;
    padding-bottom:.6rem;
  }
}


/* ===== v2.7.10 – tracking-visning og samlet distance ===== */
.detail-section-text{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.08rem;
  line-height:1.05;
}
.detail-section-text small{
  color:var(--kn-muted);
  font-size:.76rem;
  font-weight:620;
  letter-spacing:-.01em;
}
.knd-ride-total{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.85rem 1rem;
  border:1px solid rgba(10,44,42,.10);
  border-radius:1rem;
  background:linear-gradient(180deg,#fff,#f5fbfa);
}
.knd-ride-total span{
  color:var(--kn-muted);
  font-size:.86rem;
  font-weight:650;
}
.knd-ride-total strong{
  color:var(--kn-text);
  font-size:1.05rem;
  font-weight:760;
  letter-spacing:-.03em;
}
body.ride-tracking-active .ride-live-grid{
  grid-template-columns:1fr;
  gap:.95rem;
  align-content:center;
  padding:calc(var(--safe-top) + .4rem) .1rem 5.8rem;
}
body.ride-tracking-active .ride-live-stat{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:calc((100dvh - var(--safe-top) - var(--safe-bottom) - 8.5rem) / 4);
  padding:1.05rem 1.15rem;
  border-radius:1.45rem;
}
body.ride-tracking-active .ride-live-stat span{
  font-size:clamp(.9rem, 3.7vw, 1.08rem);
  font-weight:720;
  letter-spacing:.015em;
  margin-bottom:.5rem;
}
body.ride-tracking-active .ride-live-stat strong,
body.ride-tracking-active .ride-live-stat:nth-child(1) strong,
body.ride-tracking-active .ride-live-stat:nth-child(2) strong{
  font-size:clamp(2.85rem, 15vw, 5.2rem);
  font-weight:780;
  letter-spacing:-.07em;
  line-height:.92;
}
@media (orientation:landscape) and (max-height:520px){
  body.ride-tracking-active .ride-live-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    padding:calc(var(--safe-top) + .35rem) .1rem 5rem;
  }
  body.ride-tracking-active .ride-live-stat{
    min-height:7.2rem;
  }
  body.ride-tracking-active .ride-live-stat strong,
  body.ride-tracking-active .ride-live-stat:nth-child(1) strong,
  body.ride-tracking-active .ride-live-stat:nth-child(2) strong{
    font-size:clamp(2rem, 9vw, 3.6rem);
  }
}
@media (max-height:680px){
  body.ride-tracking-active .ride-live-grid{
    gap:.65rem;
    padding-top:calc(var(--safe-top) + .25rem);
    padding-bottom:5.3rem;
  }
  body.ride-tracking-active .ride-live-stat{
    min-height:calc((100dvh - var(--safe-top) - var(--safe-bottom) - 7.2rem) / 4);
    padding:.8rem .9rem;
  }
  body.ride-tracking-active .ride-live-stat strong,
  body.ride-tracking-active .ride-live-stat:nth-child(1) strong,
  body.ride-tracking-active .ride-live-stat:nth-child(2) strong{
    font-size:clamp(2.2rem, 13vw, 4.2rem);
  }
}
body.ride-tracking-active .ride-page.is-saving-ride .ride-live-grid{
  padding-bottom:12.7rem;
}


/* ===== v2.7.10 – kompakt GPX-import under Ture ===== */
.knd-ride-modal-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem;
}
.knd-gpx-import-form{
  margin:0;
}
.knd-gpx-import-btn{
  display:inline-flex;
  align-items:center;
  gap:.38rem;
  border-radius:.9rem;
  font-weight:720;
  white-space:nowrap;
}
.ride-history-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  margin-bottom:.9rem;
}
@media (max-width:390px){
  .knd-gpx-import-btn span{ display:none; }
  .knd-gpx-import-btn{ min-width:2.75rem; justify-content:center; }
}

/* v2.7.15 GPS status line */
.ride-gps-line{
  display:flex;
  justify-content:center;
  gap:.75rem;
  color:rgba(255,255,255,.72);
  font-size:.78rem;
  margin-top:.35rem;
}
.ride-gps-line strong{
  color:#9cffb2;
  font-weight:600;
}
body:not(.ride-tracking-active) .ride-gps-line{
  color:var(--knd-muted, #6c757d);
}
body:not(.ride-tracking-active) .ride-gps-line strong{
  color:var(--knd-green, #148a42);
}

/* ===== v2.7.15 – Touch-lock til tracking i lommen ===== */
body.ride-tracking-active .ride-lock-btn{
  position:fixed;
  z-index:10002;
  top:calc(var(--safe-top) + .85rem);
  right:1rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.42rem;
  min-height:2.65rem;
  padding:.62rem .9rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  color:#fff;
  font-size:.84rem;
  font-weight:760;
  letter-spacing:-.01em;
  background:rgba(2,12,11,.56);
  box-shadow:0 16px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
body:not(.ride-tracking-active) .ride-lock-btn,
body.ride-touch-locked .ride-lock-btn,
.ride-lock-btn[hidden]{
  display:none !important;
}
.ride-touch-lock-overlay[hidden]{
  display:none !important;
}
body.ride-touch-locked{
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}
body.ride-touch-locked .ride-actions,
body.ride-touch-locked .ride-save-panel{
  display:none !important;
}
body.ride-touch-locked .ride-live-grid{
  padding-bottom:9rem !important;
}
body.ride-touch-locked .ride-touch-lock-overlay{
  position:fixed;
  inset:0;
  z-index:10050;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:1rem 1rem calc(var(--safe-bottom) + 1rem);
  background:linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.12) 55%, rgba(0,0,0,.68));
  pointer-events:auto;
  touch-action:none;
}
.ride-touch-lock-card{
  width:min(100%, 26rem);
  border:1px solid rgba(255,255,255,.14);
  border-radius:1.35rem;
  padding:1rem;
  color:#fff;
  text-align:center;
  background:rgba(2,12,11,.88);
  box-shadow:0 24px 54px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}
.ride-touch-lock-title{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  font-size:1.05rem;
  font-weight:850;
  letter-spacing:-.025em;
  margin-bottom:.35rem;
}
.ride-touch-lock-text{
  color:rgba(255,255,255,.72);
  font-size:.86rem;
  line-height:1.35;
  margin-bottom:.85rem;
}
.ride-unlock-hold-btn{
  width:100%;
  min-height:3.35rem;
  border:0;
  border-radius:1.05rem;
  color:#fff;
  font-weight:850;
  background:linear-gradient(135deg, var(--kn-green), #009b8f);
  box-shadow:0 16px 32px rgba(0,127,121,.28);
  position:relative;
  overflow:hidden;
}
.ride-unlock-hold-btn::before{
  content:"";
  position:absolute;
  inset:0;
  width:0;
  background:rgba(255,255,255,.18);
  transition:none;
}
.ride-unlock-hold-btn.is-holding::before{
  width:100%;
  transition:width 2s linear;
}
@media (max-height:680px){
  body.ride-tracking-active .ride-lock-btn{
    top:calc(var(--safe-top) + .55rem);
    min-height:2.35rem;
    padding:.48rem .75rem;
  }
  .ride-touch-lock-card{
    padding:.82rem;
  }
  .ride-unlock-hold-btn{
    min-height:2.9rem;
  }
}

/* ===== v2.7.18 – Stram rettelse: låst tracking uden overlap ===== */
body.ride-touch-locked .ride-live-grid{
  /* Hold de fire tællere fri af den faste lås-op knap i bunden.
     v2.7.15 fjernede bund-reserven for hårdt, så nederste tæller kunne ryge ind under knappen. */
  padding-bottom:calc(5.6rem + var(--safe-bottom)) !important;
  align-content:center !important;
}
body.ride-touch-locked .ride-touch-lock-overlay{
  inset:auto 0 0 0 !important;
  z-index:10050;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  height:auto !important;
  min-height:0 !important;
  padding:.55rem 1.05rem calc(var(--safe-bottom) + .75rem) !important;
  background:linear-gradient(180deg, transparent, rgba(0,0,0,.42)) !important;
  pointer-events:auto;
}
body.ride-touch-locked .ride-touch-lock-card{
  width:100%;
  max-width:none;
  min-height:4rem;
  border-radius:1.35rem;
  padding:0 !important;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
body.ride-touch-locked .ride-touch-lock-title,
body.ride-touch-locked .ride-touch-lock-text{
  display:none !important;
}
body.ride-touch-locked .ride-unlock-hold-btn{
  width:100%;
  min-height:4rem;
  border-radius:1.35rem;
  font-size:1.02rem;
  font-weight:900;
  box-shadow:0 16px 34px rgba(0,127,121,.32);
}

@media (max-height:720px){
  body.ride-touch-locked .ride-live-grid{
    gap:.62rem !important;
    padding-bottom:calc(5.15rem + var(--safe-bottom)) !important;
  }
  body.ride-touch-locked .ride-live-stat{
    padding:.82rem .78rem !important;
    border-radius:1.1rem;
  }
  body.ride-touch-locked .ride-live-stat span{
    margin-bottom:.32rem;
  }
}

@media (max-height:680px){
  body.ride-touch-locked .ride-unlock-hold-btn{
    min-height:3.65rem;
  }
  body.ride-touch-locked .ride-touch-lock-overlay{
    padding:.45rem 1.05rem calc(var(--safe-bottom) + .65rem) !important;
  }
}

/* ===== v2.7.18 – Stram rettelse: låst tracking uden layout-hop ===== */
body.ride-tracking-active.ride-touch-locked{
  overflow:hidden !important;
  position:fixed;
  inset:0;
  width:100%;
  height:100dvh;
  overscroll-behavior:none;
  touch-action:none;
}
body.ride-tracking-active.ride-touch-locked .ride-live-grid{
  /* Samme grid-geometri som ulåst tracking, så tællerne ikke flytter sig ved lås. */
  grid-template-columns:1fr !important;
  gap:.95rem !important;
  align-content:center !important;
  padding:calc(var(--safe-top) + .4rem) .1rem 5.8rem !important;
}
body.ride-tracking-active.ride-touch-locked .ride-live-stat{
  min-height:calc((100dvh - var(--safe-top) - var(--safe-bottom) - 8.5rem) / 4) !important;
}
body.ride-tracking-active.ride-touch-locked .ride-touch-lock-overlay{
  position:fixed !important;
  inset:0 !important;
  z-index:10050;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  height:auto !important;
  min-height:0 !important;
  padding:0 1.05rem calc(var(--safe-bottom) + 1rem) !important;
  background:transparent !important;
  pointer-events:auto;
  touch-action:none !important;
  overscroll-behavior:none;
}
body.ride-tracking-active.ride-touch-locked .ride-touch-lock-card{
  width:100%;
  max-width:none;
  padding:0 !important;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
body.ride-tracking-active.ride-touch-locked .ride-unlock-hold-btn{
  min-height:4rem !important;
  border-radius:1.35rem;
}
@media (max-height:680px){
  body.ride-tracking-active.ride-touch-locked .ride-live-grid{
    gap:.65rem !important;
    padding-top:calc(var(--safe-top) + .25rem) !important;
    padding-bottom:5.3rem !important;
  }
  body.ride-tracking-active.ride-touch-locked .ride-live-stat{
    min-height:calc((100dvh - var(--safe-top) - var(--safe-bottom) - 7.2rem) / 4) !important;
    padding:.8rem .9rem !important;
  }
  body.ride-tracking-active.ride-touch-locked .ride-unlock-hold-btn{
    min-height:3.65rem !important;
  }
  body.ride-tracking-active.ride-touch-locked .ride-touch-lock-overlay{
    padding:0 1.05rem calc(var(--safe-bottom) + .65rem) !important;
  }
}


/* ===== v2.7.18 – Stram rettelse: wake-status + låst tracking uden layout-hop ===== */
body.ride-tracking-active .ride-gps-line{
  position:relative;
  z-index:2;
  flex-wrap:wrap;
  gap:.35rem .7rem;
  justify-content:center;
  margin:.35rem auto 0;
  padding:0 .35rem;
  line-height:1.2;
}
body.ride-tracking-active.ride-touch-locked .ride-gps-line{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
}
body.ride-tracking-active .ride-touch-lock-overlay,
body.ride-tracking-active.ride-touch-locked .ride-touch-lock-overlay{
  inset:auto 0 0 0 !important;
  height:calc(4.05rem + var(--safe-bottom)) !important;
  min-height:calc(4.05rem + var(--safe-bottom)) !important;
  padding:0 1.05rem calc(var(--safe-bottom) + .28rem) !important;
  align-items:flex-end !important;
  background:transparent !important;
  pointer-events:none;
}
body.ride-tracking-active.ride-touch-locked .ride-touch-lock-card{
  pointer-events:none;
}
body.ride-tracking-active.ride-touch-locked .ride-unlock-hold-btn{
  pointer-events:auto;
  min-height:3.65rem !important;
  border-radius:1.25rem;
}
body.ride-tracking-active.ride-touch-locked .ride-live-grid{
  /* Skal matche ulåst tracking nøjagtigt, så tællerne ikke rykker ved lås. */
  padding:0 0 5.7rem !important;
  gap:.85rem !important;
  align-content:center !important;
}
body.ride-tracking-active.ride-touch-locked .ride-live-stat{
  min-height:0 !important;
  padding:1rem .95rem !important;
}
body.ride-tracking-active.ride-touch-locked .ride-live-stat:nth-child(1),
body.ride-tracking-active.ride-touch-locked .ride-live-stat:nth-child(2){
  padding:1.15rem 1rem !important;
}
@media (max-height:680px){
  body.ride-tracking-active.ride-touch-locked .ride-live-grid{
    gap:.65rem !important;
    padding-bottom:5rem !important;
  }
  body.ride-tracking-active.ride-touch-locked .ride-live-stat{
    padding:.78rem .78rem !important;
    border-radius:1rem;
  }
  body.ride-tracking-active.ride-touch-locked .ride-live-stat:nth-child(1),
  body.ride-tracking-active.ride-touch-locked .ride-live-stat:nth-child(2){
    padding:.9rem .78rem !important;
  }
  body.ride-tracking-active.ride-touch-locked .ride-unlock-hold-btn{
    min-height:3.45rem !important;
  }
  body.ride-tracking-active .ride-touch-lock-overlay,
  body.ride-tracking-active.ride-touch-locked .ride-touch-lock-overlay{
    height:calc(3.8rem + var(--safe-bottom)) !important;
    min-height:calc(3.8rem + var(--safe-bottom)) !important;
    padding-bottom:calc(var(--safe-bottom) + .22rem) !important;
  }
}