/* PTN Drift felles CSS */
:root {
  --ptn-blue: #01529B;
  --ptn-blue-dark: #003B73;
  --ptn-yellow: #FEB812;
  --ptn-yellow-dark: #D89A00;
  --ptn-text: #12324d;
  --ptn-bg: #F5F9FD;
  --ptn-border: #B9D0E6;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: #F5F9FD;
  color: var(--ptn-text);
}

.page {
  width: 100%;
  max-width: 100%;
  padding: 14px;
}

.card,
.card-wide {
  width: min(900px, 100%);
  margin: 0 auto;
  background: #ffffff;
  border: 1px solid var(--ptn-border);
  border-radius: 14px;
  padding: 16px;
  box-shadow: 0 10px 24px rgba(1, 82, 155, 0.10);
}

.top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--ptn-border);
  padding-bottom: 12px;
  margin-bottom: 14px;
}

h1,
h2,
h3 {
  color: var(--ptn-blue-dark);
}

.heart-logo {
  max-width: 90px;
  max-height: 70px;
  object-fit: contain;
}

.table-wrap {
  overflow-x: auto;
}

.data-table,
.route-table {
  width: 100%;
  border-collapse: collapse;
}

.data-table th,
.data-table td,
.route-table th,
.route-table td {
  padding: 8px;
  border: 1px solid var(--ptn-border);
  text-align: left;
}

.data-table th,
.route-table th {
  background: #FFF5CC;
  color: var(--ptn-blue-dark);
}

.btn,
.link-btn,
.start-video-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 10px;
  border: 1px solid var(--ptn-blue);
  background: linear-gradient(180deg, #0B66B8 0%, #01529B 100%);
  color: #ffffff;
  text-decoration: none;
  font-weight: 900;
}

.start-video-btn {
  width: 100%;
  border-color: var(--ptn-yellow-dark);
  background: linear-gradient(180deg, #FFD15B 0%, #FEB812 100%);
  color: #12324d;
}

@media (max-width: 600px) {
  .page {
    padding: 8px;
  }

  .card,
  .card-wide {
    padding: 12px;
  }

  .heart-logo {
    max-width: 68px;
    max-height: 54px;
  }
}


/* PTN v67: Servicelinjer og GPS-knapper */
.service-menu-btn,
.service-menu-btn:link,
.service-menu-btn:visited,
.service-menu-btn:hover,
.service-menu-btn:focus,
.service-menu-btn:active,
.servicelinje-btn,
.servicelinje-btn:link,
.servicelinje-btn:visited,
.servicelinje-btn:hover,
.servicelinje-btn:focus,
.servicelinje-btn:active,
.link-btn.service-menu-btn,
.link-btn.service-menu-btn:link,
.link-btn.service-menu-btn:visited,
.link-btn.service-menu-btn:hover,
.link-btn.service-menu-btn:focus,
.link-btn.service-menu-btn:active {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  text-decoration: none !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35) !important;
}

.gps-btn,
.gps-btn:link,
.gps-btn:visited {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  min-width: 120px !important;
  max-width: 100% !important;
  padding: 7px 12px !important;
  border-radius: 10px !important;
  border: 1px solid #D89A00 !important;
  background: linear-gradient(180deg, #FFD15B 0%, #FEB812 100%) !important;
  color: #12324d !important;
  -webkit-text-fill-color: #12324d !important;
  text-decoration: none !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  box-shadow: 0 4px 10px rgba(254, 184, 18, 0.24) !important;
  white-space: normal !important;
  word-break: normal !important;
}

.gps-btn:hover,
.gps-btn:focus,
.gps-btn:active {
  background: linear-gradient(180deg, #F4C441 0%, #E5A500 100%) !important;
  color: #12324d !important;
  -webkit-text-fill-color: #12324d !important;
  text-decoration: none !important;
  border-color: #B88500 !important;
  outline: none !important;
}



/* PTN v70: Like store menyknapper */
.main-menu-grid,
.service-grid,
.grid {
  align-items: stretch !important;
}

.main-menu-btn,
.main-menu-btn:link,
.main-menu-btn:visited,
.main-menu-btn:hover,
.main-menu-btn:focus,
.main-menu-btn:active,
.service-menu-btn,
.service-menu-btn:link,
.service-menu-btn:visited,
.service-menu-btn:hover,
.service-menu-btn:focus,
.service-menu-btn:active,
.servicelinje-btn,
.servicelinje-btn:link,
.servicelinje-btn:visited,
.servicelinje-btn:hover,
.servicelinje-btn:focus,
.servicelinje-btn:active {
  width: 100% !important;
  min-height: 54px !important;
  height: 54px !important;
  padding: 8px 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.12 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  text-decoration: none !important;
  overflow: hidden !important;
}

@media (max-width: 700px) {
  .main-menu-btn,
  .service-menu-btn,
  .servicelinje-btn {
    min-height: 50px !important;
    height: 50px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 420px) {
  .main-menu-btn,
  .service-menu-btn,
  .servicelinje-btn {
    min-height: 48px !important;
    height: 48px !important;
    font-size: 12px !important;
  }
}



/* PTN v73: Eksterne app-knapper i nytt vindu */
.external-app-btn,
.external-app-btn:link,
.external-app-btn:visited,
.external-app-btn:hover,
.external-app-btn:focus,
.external-app-btn:active,
.main-menu-btn,
.main-menu-btn:link,
.main-menu-btn:visited,
.main-menu-btn:hover,
.main-menu-btn:focus,
.main-menu-btn:active {
  width: 100% !important;
  min-height: 54px !important;
  height: 54px !important;
  padding: 8px 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.12 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  text-decoration: none !important;
  overflow: hidden !important;
}

@media (max-width: 700px) {
  .external-app-btn,
  .main-menu-btn {
    min-height: 50px !important;
    height: 50px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 420px) {
  .external-app-btn,
  .main-menu-btn {
    min-height: 48px !important;
    height: 48px !important;
    font-size: 12px !important;
  }
}



/* PTN v74: Gule knapper med blå tekst */
.btn-warning,
.btn-warning:link,
.btn-warning:visited,
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.start-video-btn,
.start-video-btn:link,
.start-video-btn:visited,
.start-video-btn:hover,
.start-video-btn:focus,
.start-video-btn:active,
.gps-btn,
.gps-btn:link,
.gps-btn:visited,
.gps-btn:hover,
.gps-btn:focus,
.gps-btn:active,
.logout-btn,
.logout-btn:link,
.logout-btn:visited,
.logout-btn:hover,
.logout-btn:focus,
.logout-btn:active {
  color: #01529B !important;
  -webkit-text-fill-color: #01529B !important;
  text-decoration: none !important;
}



/* PTN v76: Servicelinjer samme bredde som meny */
:root {
  --ptn-service-width: 900px;
}

body {
  overflow-x: hidden;
}

.page,
.service-page,
main.page {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.card,
.card-wide,
.service-card,
.route-card,
.route-wrapper,
.content,
.container,
.wrapper {
  width: min(var(--ptn-service-width), calc(100vw - 20px)) !important;
  max-width: min(var(--ptn-service-width), calc(100vw - 20px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.table-wrap,
.table-container,
.route-table-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  box-sizing: border-box !important;
}

table,
.data-table,
.route-table {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.service-grid,
.grid {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 600px) {
  .card,
  .card-wide,
  .service-card,
  .route-card,
  .route-wrapper,
  .content,
  .container,
  .wrapper {
    width: calc(100vw - 12px) !important;
    max-width: calc(100vw - 12px) !important;
  }
}



/* PTN v79: 2 px mellom knappene i hovedmenyen */
.main-menu-grid,
.index-menu-grid,
.menu-grid,
.quick-grid {
  gap: 2px !important;
  row-gap: 2px !important;
  column-gap: 2px !important;
}

.indexOK-menu .btn,
.main-menu-grid .btn,
.index-menu-grid .btn,
.menu-grid .btn,
.quick-grid .btn,
.main-menu-btn {
  margin: 0 !important;
}



/* PTN v81: Header rettet, AuthPro/start-frame 1 px, større knappetekst */
.btn,
.btn:link,
.btn:visited,
.btn:hover,
.btn:focus,
.btn:active,
.link-btn,
.link-btn:link,
.link-btn:visited,
.link-btn:hover,
.link-btn:focus,
.link-btn:active,
.main-menu-btn,
.main-menu-btn:link,
.main-menu-btn:visited,
.main-menu-btn:hover,
.main-menu-btn:focus,
.main-menu-btn:active,
.service-menu-btn,
.service-menu-btn:link,
.service-menu-btn:visited,
.service-menu-btn:hover,
.service-menu-btn:focus,
.service-menu-btn:active,
.servicelinje-btn,
.servicelinje-btn:link,
.servicelinje-btn:visited,
.servicelinje-btn:hover,
.servicelinje-btn:focus,
.servicelinje-btn:active,
.gps-btn,
.gps-btn:link,
.gps-btn:visited,
.gps-btn:hover,
.gps-btn:focus,
.gps-btn:active,
.start-video-btn,
.start-video-btn:link,
.start-video-btn:visited,
.start-video-btn:hover,
.start-video-btn:focus,
.start-video-btn:active,
.ptn-mainmenu-btn,
.ptn-back-btn,
.external-app-btn {
  font-size: 16px !important;
  line-height: 1.18 !important;
}

html,
body {
  box-sizing: border-box !important;
}

body.ptn-role-header,
body.ptn-role-header html {
  height: 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
  overflow: hidden !important;
}

.ptn-role-header .menu-line,
.menu-line {
  min-height: 52px !important;
  height: 52px !important;
  max-height: 52px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 6px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.ptn-role-header .left-header,
.ptn-role-header .right-header,
.ptn-role-header .menu-actions,
.left-header,
.right-header,
.menu-actions {
  min-height: 44px !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.ptn-role-header .brand,
.ptn-role-header .role-label,
.ptn-role-header .user-label,
.brand,
.role-label,
.user-label {
  min-height: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}

.ptn-role-header .brand {
  font-size: 14px !important;
  min-width: 90px !important;
  flex: 0 0 auto !important;
}

.ptn-role-header .role-label {
  font-size: 13px !important;
  max-width: 150px !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.ptn-role-header .user-label {
  font-size: 13px !important;
  max-width: 260px !important;
}

.ptn-role-header .menu-btn,
.ptn-role-header .menu-btn:link,
.ptn-role-header .menu-btn:visited,
.ptn-role-header .menu-btn:hover,
.ptn-role-header .menu-btn:focus,
.ptn-role-header .menu-btn:active,
.ptn-role-header button.menu-btn,
.header-btn,
.header-btn:link,
.header-btn:visited,
.header-btn:hover,
.header-btn:focus,
.header-btn:active {
  min-height: 44px !important;
  height: 44px !important;
  width: auto !important;
  min-width: 96px !important;
  max-width: 128px !important;
  flex: 0 0 auto !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  font-size: 16px !important;
  line-height: 1.15 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  box-sizing: border-box !important;
}

@media (max-width: 700px) {
  .ptn-role-header .menu-line,
  .menu-line {
    gap: 4px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  .ptn-role-header .menu-btn,
  .ptn-role-header button.menu-btn,
  .header-btn {
    min-width: 78px !important;
    max-width: 100px !important;
    font-size: 14px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .ptn-role-header .user-label {
    max-width: 150px !important;
    font-size: 12px !important;
  }

  .ptn-role-header .role-label {
    max-width: 100px !important;
    font-size: 12px !important;
  }
}



/* PTN v82: Header marger 0 */
html,
body,
body.ptn-role-header {
  margin: 0 !important;
}

body.ptn-role-header,
.ptn-role-header .menu-line,
.menu-line,
.ptn-role-header .left-header,
.ptn-role-header .right-header,
.ptn-role-header .menu-actions,
.left-header,
.right-header,
.menu-actions,
.ptn-role-header .brand,
.ptn-role-header .role-label,
.ptn-role-header .user-label,
.ptn-role-header .menu-btn,
.ptn-role-header .logout-btn,
.header-btn {
  margin: 0 !important;
}



/* PTN v83: Header-innhold samlet i midten */
body.ptn-role-header {
  margin: 0 !important;
  padding: 0 !important;
  height: 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ptn-role-header .menu-line,
.menu-line {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  min-height: 52px !important;
  height: 52px !important;
  max-height: 52px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-align: center !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.ptn-role-header .left-header,
.ptn-role-header .right-header,
.ptn-role-header .menu-actions,
.left-header,
.right-header,
.menu-actions {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 44px !important;
  height: 44px !important;
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.ptn-role-header .right-header,
.ptn-role-header .menu-actions,
.right-header,
.menu-actions {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.ptn-role-header .brand,
.ptn-role-header .role-label,
.ptn-role-header .user-label,
.brand,
.role-label,
.user-label {
  margin: 0 !important;
  min-height: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.ptn-role-header .menu-btn,
.ptn-role-header .logout-btn,
.ptn-role-header .header-btn,
.menu-btn.header-btn,
.logout-btn.header-btn,
.header-btn {
  margin: 0 !important;
  min-height: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

@media (max-width: 700px) {
  .ptn-role-header .menu-line,
  .menu-line {
    justify-content: center !important;
    gap: 4px !important;
  }

  .ptn-role-header .left-header,
  .ptn-role-header .right-header,
  .ptn-role-header .menu-actions,
  .left-header,
  .right-header,
  .menu-actions {
    justify-content: center !important;
    gap: 4px !important;
  }
}



/* PTN v84: Hovedside-meny 5 px mellom knapper i høyden */
body.ptn-hovedside-meny .main-menu-grid,
body.ptn-hovedside-meny .index-menu-grid,
body.ptn-hovedside-meny .menu-grid,
body.ptn-hovedside-meny .quick-grid {
  row-gap: 5px !important;
  column-gap: 2px !important;
  gap: 5px 2px !important;
}

body.ptn-hovedside-meny .main-menu-grid .btn,
body.ptn-hovedside-meny .index-menu-grid .btn,
body.ptn-hovedside-meny .menu-grid .btn,
body.ptn-hovedside-meny .quick-grid .btn,
body.ptn-hovedside-meny .main-menu-btn {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}



/* PTN v86: Alle knapper lik font og lik tekststørrelse */
.btn,
.btn:link,
.btn:visited,
.btn:hover,
.btn:focus,
.btn:active,
.link-btn,
.link-btn:link,
.link-btn:visited,
.link-btn:hover,
.link-btn:focus,
.link-btn:active,
.main-menu-btn,
.main-menu-btn:link,
.main-menu-btn:visited,
.main-menu-btn:hover,
.main-menu-btn:focus,
.main-menu-btn:active,
.service-menu-btn,
.service-menu-btn:link,
.service-menu-btn:visited,
.service-menu-btn:hover,
.service-menu-btn:focus,
.service-menu-btn:active,
.servicelinje-btn,
.servicelinje-btn:link,
.servicelinje-btn:visited,
.servicelinje-btn:hover,
.servicelinje-btn:focus,
.servicelinje-btn:active,
.gps-btn,
.gps-btn:link,
.gps-btn:visited,
.gps-btn:hover,
.gps-btn:focus,
.gps-btn:active,
.start-video-btn,
.start-video-btn:link,
.start-video-btn:visited,
.start-video-btn:hover,
.start-video-btn:focus,
.start-video-btn:active,
.ptn-mainmenu-btn,
.ptn-back-btn,
.external-app-btn,
.menu-btn,
.menu-btn:link,
.menu-btn:visited,
.menu-btn:hover,
.menu-btn:focus,
.menu-btn:active,
.logout-btn,
.logout-btn:link,
.logout-btn:visited,
.logout-btn:hover,
.logout-btn:focus,
.logout-btn:active,
.header-btn,
.header-btn:link,
.header-btn:visited,
.header-btn:hover,
.header-btn:focus,
.header-btn:active {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.10 !important;
  letter-spacing: 0 !important;
}

/* Behold fysisk knappestørrelse/dynamikk, men gjør tekst lik */
body.ptn-hovedside-meny .btn,
body.ptn-hovedside-meny .main-menu-btn,
body.ptn-hovedside-meny .start-video-btn,
body.ptn-hovedside-meny .external-app-btn,
.ptn-role-header .menu-btn,
.ptn-role-header .logout-btn,
.ptn-role-header .header-btn {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.10 !important;
  letter-spacing: 0 !important;
}



/* NY VERSJON 3I - profilside isolert, påvirker ikke banner/layout */
.ptn-profile-page {
  margin: 0;
  padding: 18px;
  background: #004B8D;
  color: #ffffff;
  font-family: Arial, Helvetica, sans-serif;
  min-height: 100vh;
  box-sizing: border-box;
}
.ptn-profile-wrap {
  width: min(1080px, calc(100vw - 36px));
  margin: 0 auto 30px auto;
  box-sizing: border-box;
}
.ptn-profile-card {
  background: #eef3f6;
  color: #003B73;
  border: 1px solid #b8cfe3;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
  padding: 16px;
  margin-bottom: 16px;
  box-sizing: border-box;
}
.ptn-profile-card h1,
.ptn-profile-card h2,
.ptn-profile-card h3 {
  color: #003B73;
  margin-top: 0;
}
.ptn-profile-frame {
  width: 100%;
  min-height: 620px;
  height: 720px;
  border: 1px solid #9db8d1;
  border-radius: 10px;
  background: #ffffff;
  box-sizing: border-box;
}
.ptn-profile-receipt {
  line-height: 1.55;
  font-size: 15px;
}
.ptn-profile-note {
  background: #ffffff;
  border-left: 6px solid #004B8D;
  padding: 12px;
  margin: 12px 0;
  border-radius: 8px;
}
/* SLUTT NY VERSJON 3I */