*{box-sizing:border-box}:root{--green:#087333;--green-dark:#064922;--green-soft:#e7f6ec;--orange:#f47a1f;--ink:#121826;--muted:#667085;--line:#e8eaf0;--bg:#f5f7f3;--shadow:0 18px 45px rgba(16,24,40,.10);--radius:20px}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink)}a{color:inherit}.header{background:rgba(255,255,255,.96);color:var(--ink);padding:12px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;backdrop-filter:blur(10px)}.header-inner{max-width:1180px;margin:0 auto}.brand-row{display:flex;align-items:center;gap:14px}.brand-logo-link{display:inline-block;line-height:0}.brand-logo{width:86px;height:auto;border-radius:14px;background:#fff}.logo{font-size:32px;font-weight:900;letter-spacing:-1px;line-height:1}.tagline{margin-top:5px;color:var(--green);font-size:12px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase}.nav{background:#fff;color:var(--ink);border-bottom:1px solid var(--line);padding:10px 18px;position:sticky;top:94px;z-index:19}.nav-inner{max-width:1180px;margin:0 auto;display:flex;gap:10px;flex-wrap:wrap;align-items:center}.nav a{text-decoration:none;padding:10px 13px;border-radius:999px;font-weight:700;color:#1f2937}.nav a:hover{background:var(--green-soft);color:var(--green-dark)}.nav a[href="login.php"],.nav a[href="register.php"],.nav a[href="logout.php"]{border:1px solid var(--line);background:#fff}.container{max-width:1180px;margin:0 auto;padding:20px 18px 70px}.hero{position:relative;min-height:430px;background:linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.10)),url("assets/tokmaket-hero.png") center/cover no-repeat;border-radius:30px;padding:58px;margin:10px 0 22px;overflow:hidden;color:#fff;box-shadow:var(--shadow)}.hero-with-logo{text-align:left}.hero-logo{max-width:250px;width:100%;height:auto;display:block;margin:0 0 18px;background:rgba(255,255,255,.92);border-radius:18px;padding:8px}.hero h1{margin:0 0 10px;font-size:46px;line-height:1.05;max-width:650px;letter-spacing:-1.2px}.hero p{margin:0 0 20px;max-width:650px;line-height:1.55;font-size:18px;color:rgba(255,255,255,.92)}.button-row{display:flex;gap:10px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--green);color:#fff;padding:12px 16px;min-height:44px;border-radius:12px;text-decoration:none;border:none;font-weight:800;cursor:pointer;box-shadow:0 8px 18px rgba(8,115,51,.18)}.btn.secondary{background:#13251b}.search-box{background:#fff;border-radius:22px;padding:16px;margin:-58px 28px 24px;border:1px solid rgba(255,255,255,.65);box-shadow:var(--shadow);position:relative;z-index:4;display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end}.search-box label{margin-top:0}.search-box p{margin:0}.category-strip{background:#fff;border:1px solid var(--line);border-radius:22px;padding:16px;box-shadow:0 8px 25px rgba(16,24,40,.06);display:grid;grid-template-columns:repeat(8,1fr);gap:10px;margin-bottom:24px}.category-tile{text-align:center;padding:12px 8px;border-radius:16px;background:#fbfcfb;border:1px solid transparent;text-decoration:none;font-weight:700;font-size:13px}.category-tile:hover{border-color:var(--green);background:var(--green-soft)}.category-icon{font-size:26px;display:block;margin-bottom:6px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:26px 0 14px}.section-head h1,.section-head h2{margin:0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 8px 25px rgba(16,24,40,.06);transition:transform .18s ease,box-shadow .18s ease}.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.card-body{padding:16px}.card h2,.card h3{margin:0 0 8px;line-height:1.2}.card h2{font-size:18px}.meta{color:var(--muted);font-size:13px;margin-bottom:8px;line-height:1.35}.price{color:var(--green);font-size:22px;font-weight:900;margin:12px 0}.badge{display:inline-block;background:#e9f8ef;color:var(--green-dark);padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900;margin-bottom:10px}.wanted-badge{background:#fff2df;color:#a94600}.form-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:0 8px 25px rgba(16,24,40,.06)}label{font-weight:800;display:block;margin:14px 0 7px;color:#263238}input,select,textarea{width:100%;padding:13px 14px;border:1px solid #d8dde6;border-radius:13px;font-size:16px;background:#fff;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(8,115,51,.10)}textarea{min-height:130px}.notice{padding:14px;border-radius:14px;margin-bottom:14px;background:#fff7df;border:1px solid #f4d48a}.success{background:#e4f8ea;border-color:#99d9a9}.footer{text-align:center;padding:24px;color:#667085}.table-wrap{overflow-x:auto;background:#fff;border-radius:20px;border:1px solid var(--line);box-shadow:0 8px 25px rgba(16,24,40,.05);margin-bottom:22px}table{width:100%;border-collapse:collapse;min-width:780px}td,th{padding:13px;border-bottom:1px solid #eef0f4;text-align:left;vertical-align:top}th{color:#344054;font-size:13px;background:#f9fafb}.inline-form{display:flex;gap:6px;flex-wrap:wrap}.inline-form button{padding:7px 9px;border:1px solid #d8dde6;border-radius:9px;background:#fff;cursor:pointer;font-weight:700}hr{border:0;border-top:1px solid var(--line);margin:22px 0}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:18px 0}.photo-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;overflow:hidden;box-shadow:0 8px 25px rgba(16,24,40,.05)}.photo-card img{width:100%;height:210px;object-fit:cover;border-radius:13px;display:block;margin-bottom:8px}.rating-summary{font-weight:800;color:#8a4f08}.gps-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.feature-layout{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}.side-panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 8px 25px rgba(16,24,40,.06)}.compact-list{display:grid;gap:12px}.compact-item{border-bottom:1px solid var(--line);padding-bottom:10px}.compact-item:last-child{border-bottom:0}.mobile-bottom-nav{display:none}@media(max-width:1000px){.search-box{grid-template-columns:1fr 1fr;margin:-40px 14px 20px}.category-strip{grid-template-columns:repeat(4,1fr)}.grid{grid-template-columns:repeat(2,1fr)}.feature-layout{grid-template-columns:1fr}.nav{top:82px}}@media(max-width:700px){body{padding-bottom:72px}.header{padding:10px 12px}.brand-row{gap:10px}.brand-logo{width:62px}.logo{font-size:24px}.tagline{font-size:9px;letter-spacing:1.4px}.nav{display:none}.container{padding:12px 12px 70px}.hero{min-height:420px;padding:28px 20px;border-radius:22px}.hero-logo{max-width:180px}.hero h1{font-size:32px}.hero p{font-size:16px}.search-box{grid-template-columns:1fr;margin:-42px 10px 18px;border-radius:18px}.category-strip{grid-template-columns:repeat(4,1fr);padding:10px}.category-tile{font-size:11px;padding:10px 4px}.category-icon{font-size:21px}.grid{grid-template-columns:1fr}.photo-grid{grid-template-columns:1fr}.photo-card img{height:auto;max-height:360px}.gps-row{grid-template-columns:1fr}.form-card{padding:18px;border-radius:20px}.mobile-bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);z-index:50;box-shadow:0 -8px 25px rgba(16,24,40,.08)}.mobile-bottom-nav a{text-decoration:none;text-align:center;padding:9px 4px 8px;font-size:11px;color:#344054;font-weight:700}.mobile-bottom-nav span{display:block;font-size:19px;margin-bottom:2px}.mobile-bottom-nav a.post-float{color:#fff}.mobile-bottom-nav a.post-float span{background:var(--green);width:38px;height:30px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center}}

.cartoon-panel {
  overflow: hidden;
}

.cartoon-feature {
  margin-top: 22px;
}

.cartoon-feature .cartoon-image-wrap {
  width: 100%;
  aspect-ratio: 1 / 1;
}

.cartoon-head {
  margin-top: 0;
}

.cartoon-head a {
  color: var(--green);
  font-weight: 800;
  text-decoration: none;
}

.cartoon-image-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  max-width: 100%;
  aspect-ratio: 1 / 1;
}

.cartoon-image {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: #f9fafb;
}

.cartoon-watermark,
.cartoon-admin-thumb span {
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 5px 8px;
  border-radius: 8px;
  background: rgba(0, 0, 0, .48);
  color: rgba(255, 255, 255, .92);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .55);
}

.cartoon-admin-thumb {
  position: relative;
  display: block;
  width: 110px;
  height: 110px;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
}

a.cartoon-admin-thumb:hover,
a.cartoon-admin-thumb:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(8, 115, 51, .12);
}

.cartoon-admin-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cartoon-admin-thumb span {
  right: 6px;
  bottom: 6px;
  font-size: 10px;
}

.cartoon-rating-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.cartoon-rating-row span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #f7faf7;
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.cartoon-rating-row strong {
  color: var(--green-dark);
  margin-right: 4px;
}

.cartoon-copy {
  margin-top: 12px;
}

.cartoon-copy p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.cartoon-vote-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.cartoon-vote-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 110px;
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  font-weight: 900;
}

.cartoon-vote-btn:hover,
.cartoon-vote-btn.selected {
  border-color: var(--green);
  background: var(--green-soft);
  color: var(--green-dark);
}

.cartoon-vote-btn:disabled {
  cursor: default;
  opacity: .72;
}

.cartoon-vote-btn.selected:disabled {
  opacity: 1;
}

.cartoon-voted-note {
  margin-top: 8px;
}

.cartoon-share-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.cartoon-share-row .btn {
  min-height: 40px;
  padding: 10px 12px;
  font-size: 13px;
  box-shadow: none;
}

.cartoon-directory-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.cartoon-directory-card .card-body {
  display: grid;
  gap: 10px;
}

.cartoon-directory-card h2,
.cartoon-directory-card p {
  margin: 0;
}

.cartoon-directory-card p {
  color: var(--muted);
  line-height: 1.45;
}

.cartoon-directory-image {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #f9fafb;
}

.cartoon-directory-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cartoon-sort-row {
  margin-bottom: 20px;
}

@media(max-width:1000px) {
  .cartoon-directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:700px) {
  .cartoon-directory-grid {
    grid-template-columns: 1fr;
  }

  .cartoon-feature .cartoon-image-wrap,
  .cartoon-directory-image {
    width: min(100%, 320px);
    margin-left: auto;
    margin-right: auto;
  }

  .cartoon-directory-card .card-body {
    padding: 14px;
  }

  .cartoon-image-wrap {
    overflow: hidden;
    border: 1px solid var(--line);
    background: #fff;
  }

  .cartoon-image {
    width: 100%;
    height: 100%;
    max-width: 100%;
    border: 0;
    border-radius: 0;
  }

  .cartoon-watermark {
    position: absolute;
    left: auto;
    right: 10px;
  }
}

@media(max-width:380px) {
  .cartoon-feature .cartoon-image-wrap,
  .cartoon-directory-image {
    width: min(100%, 280px);
  }
}

.admin-filter-card {
  margin-bottom: 24px;
}

.homepage-language-toggle {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 800;
  color: var(--muted);
  white-space: nowrap;
}

.homepage-language-toggle a {
  color: var(--green-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.homepage-language-toggle a.active {
  color: var(--ink);
  text-decoration: none;
}

.facebook-directory-feature {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 18px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
  margin: 32px 0 24px;
}

.member-count-strip.public-visitors-only + .facebook-directory-feature {
  margin-top: 24px;
}

.facebook-directory-thumb {
  display: block;
  position: relative;
  align-self: start;
  border-radius: 18px;
  overflow: hidden;
  background: #eef4ed;
  aspect-ratio: 16 / 9;
}

.facebook-directory-logo {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #1877f2;
  color: #fff;
  border: 2px solid rgba(255,255,255,.92);
  box-shadow: 0 8px 20px rgba(16,24,40,.25);
  font-size: 27px;
  line-height: 1;
  font-weight: 900;
  font-family: Arial, Helvetica, sans-serif;
}

.youtube-directory-feature {
  margin-top: 24px;
}

.youtube-directory-logo {
  background: #ff0000;
  font-size: 20px;
  padding-left: 2px;
}

.facebook-directory-thumb img {
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

.facebook-directory-copy h2 {
  margin: 0 0 8px;
}

.facebook-directory-copy p {
  color: var(--muted);
  line-height: 1.45;
  margin: 0 0 14px;
  max-width: none;
}

.state-origin-feed {
  margin: 22px 0;
  padding: 18px;
  border: 1px solid #b8d8ff;
  border-radius: 22px;
  background: linear-gradient(135deg, #f5fbff, #fff7f7);
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.state-origin-feed.state-origin-winner-nsw {
  border-color: #2498d8;
  background: linear-gradient(135deg, #e7f6ff, #ffffff);
  box-shadow: 0 10px 28px rgba(36,152,216,.18);
}

.state-origin-feed.state-origin-winner-qld {
  border-color: #7a1738;
  background: linear-gradient(135deg, #fff0f4, #ffffff);
  box-shadow: 0 10px 28px rgba(122,23,56,.18);
}

.state-origin-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 18px;
  align-items: start;
}

.state-origin-head h2 {
  margin: 0 0 8px;
}

.state-origin-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.state-origin-status {
  display: grid;
  gap: 5px;
  padding: 13px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--line);
}

.state-origin-status strong {
  color: #0b4aa2;
  font-size: 20px;
}

.state-origin-winner-nsw .state-origin-status strong {
  color: #0b66a8;
}

.state-origin-winner-qld .state-origin-status strong {
  color: #6b1234;
}

.state-origin-status span,
.state-origin-status small {
  color: var(--muted);
  font-weight: 800;
}

.state-origin-score {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 160px));
  gap: 10px;
  margin-top: 16px;
}

.state-origin-score div {
  padding: 12px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--line);
  text-align: center;
}

.state-origin-score .state-origin-team {
  border-width: 2px;
  box-shadow: 0 10px 22px rgba(16,24,40,.06);
}

.state-origin-score .state-origin-nsw {
  background: #e8f5ff;
  border-color: #5bb6e8;
}

.state-origin-score .state-origin-qld {
  background: #fff0f4;
  border-color: #7a1738;
}

.state-origin-score span,
.state-origin-score strong {
  display: block;
}

.state-origin-score span {
  color: var(--muted);
  font-weight: 900;
}

.state-origin-score .state-origin-nsw span,
.state-origin-score .state-origin-nsw strong {
  color: #0b66a8;
}

.state-origin-score .state-origin-qld span,
.state-origin-score .state-origin-qld strong {
  color: #6b1234;
}

.state-origin-score strong {
  color: var(--ink);
  font-size: 34px;
  line-height: 1.1;
}

.state-origin-updates {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.state-origin-updates div {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(184,216,255,.75);
  color: #344054;
  font-weight: 700;
}

.state-origin-foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 14px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.state-origin-foot a {
  color: #0b4aa2;
}

@media (max-width: 760px) {
  .facebook-directory-feature {
    grid-template-columns: minmax(132px, 38vw) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 12px;
    border-radius: 18px;
    margin: 18px 0;
  }

  .facebook-directory-thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    justify-self: start;
  }

  .facebook-directory-logo {
    top: 6px;
    right: 6px;
    width: 24px;
    height: 24px;
    font-size: 17px;
    border-width: 1px;
  }

  .youtube-directory-logo {
    font-size: 13px;
  }

  .facebook-directory-thumb img {
    height: 100%;
    aspect-ratio: 16 / 9;
  }

  .facebook-directory-copy .badge {
    margin-bottom: 6px;
  }

  .facebook-directory-copy h2 {
    font-size: 18px;
    line-height: 1.2;
  }

  .facebook-directory-copy p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 10px;
  }

  .facebook-directory-copy .button-row {
    gap: 8px;
  }

  .facebook-directory-copy .btn {
    min-height: 38px;
    padding: 9px 10px;
    font-size: 13px;
  }

  .state-origin-head,
  .state-origin-score {
    grid-template-columns: 1fr;
  }
}

.admin-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  align-items: end;
}

.admin-filter-grid p {
  margin: 0;
}

.share-tools {
  margin-top: 14px;
}

@media (max-width: 800px) {
  .admin-filter-grid {
    grid-template-columns: 1fr;
  }
}


.facebook-share {
  background: #1877f2;
}


.card-thumb-link {
  display: block;
  background: #eef4ed;
  overflow: hidden;
}

.card-thumb {
  width: 100%;
  height: 175px;
  object-fit: cover;
  display: block;
  transition: transform 0.18s ease;
}

.card:hover .card-thumb {
  transform: scale(1.035);
}

.listing-card .card-body {
  min-height: 250px;
}

@media (max-width: 700px) {
  .card-thumb {
    height: 210px;
  }
}


.listing-gallery {
  margin: 18px 0 24px;
}

.gallery-main {
  position: relative;
  background: #111;
  border-radius: 22px;
  overflow: hidden;
  min-height: 360px;
}

.gallery-image {
  display: none;
  width: 100%;
  height: 480px;
  object-fit: contain;
  background: #111;
}

.gallery-image.active {
  display: block;
}

.gallery-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 54px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,0.86);
  color: #111;
  font-size: 34px;
  cursor: pointer;
  line-height: 1;
}

.gallery-prev {
  left: 14px;
}

.gallery-next {
  right: 14px;
}

.gallery-thumbs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px 2px;
}

.gallery-thumb {
  border: 3px solid transparent;
  border-radius: 12px;
  padding: 0;
  background: white;
  cursor: pointer;
  overflow: hidden;
  flex: 0 0 86px;
  height: 66px;
}

.gallery-thumb.active {
  border-color: var(--green);
}

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

.selectable-photo {
  cursor: pointer;
}

.thumbnail-radio {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  font-weight: 800;
}

.thumbnail-radio input {
  width: auto;
}

.thumbnail-select-form {
  margin-bottom: 18px;
}

@media (max-width: 700px) {
  .gallery-main {
    min-height: 260px;
  }

  .gallery-image {
    height: 320px;
  }

  .gallery-button {
    width: 38px;
    height: 48px;
    font-size: 30px;
  }
}


/* TokMaket services and service messaging */
.service-rating-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

.messages-list {
  display: grid;
  gap: 12px;
  margin: 18px 0;
}

.message-bubble {
  padding: 14px;
  border-radius: 16px;
  max-width: 780px;
  border: 1px solid var(--line);
  background: #fff;
}

.message-bubble.mine {
  margin-left: auto;
  background: #e9f8ef;
  border-color: #bfe8ca;
}

.message-bubble.theirs {
  margin-right: auto;
  background: #f9fafb;
}

.message-meta {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  margin-bottom: 6px;
}

.message-form textarea {
  min-height: 130px;
}

/* TokMaket listing messaging */
.messages-list {
  display: grid;
  gap: 12px;
  margin: 18px 0;
}

.message-bubble {
  padding: 14px;
  border-radius: 16px;
  max-width: 780px;
  border: 1px solid var(--line);
  background: #fff;
}

.message-bubble.mine {
  margin-left: auto;
  background: #e9f8ef;
  border-color: #bfe8ca;
}

.message-bubble.theirs {
  margin-right: auto;
  background: #f9fafb;
}

.message-meta {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  margin-bottom: 6px;
}

.message-form textarea {
  min-height: 130px;
}


/* TokMaket transport section */
.transport-card .price {
  font-size: 18px;
}

.route-pill {
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--green-soft);
  color: var(--green-dark);
  font-weight: 800;
}

.transport-route-meta {
  display: grid;
  gap: 6px;
  margin: 12px 0;
}


/* TokMaket Starlink section */
.starlink-info-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 18px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.starlink-warning {
  background: #fff7df;
  border: 1px solid #f4d48a;
  border-radius: 14px;
  padding: 14px;
}


/* Dashboard action buttons */
.dashboard-actions {
  align-items: stretch;
}

.dashboard-actions .btn {
  margin-bottom: 8px;
}


/* Homepage main action wireframe */
.home-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 22px 0;
}

.home-action-card {
  display: block;
  text-decoration: none;
  color: inherit;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 18px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
  transition: transform .15s ease, box-shadow .15s ease;
}

.home-action-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(16,24,40,.10);
}

.home-action-icon {
  display: block;
  font-size: 30px;
  margin-bottom: 8px;
}

.home-action-card strong {
  display: block;
  font-size: 18px;
  margin-bottom: 4px;
}

.home-action-card em {
  display: block;
  font-style: normal;
  color: var(--muted);
  font-size: 13px;
}

@media (max-width: 900px) {
  .home-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .home-action-grid {
    grid-template-columns: 1fr;
  }
}


/* Homepage quick sections and overlap fix */
.quick-sections-panel {
  position: relative;
  z-index: 2;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 22px;
  margin: 22px 0 28px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.quick-sections-panel h2 {
  margin: 0 0 16px;
}

.quick-sections-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.quick-section-card {
  display: block !important;
  text-decoration: none !important;
  color: inherit !important;
  background: #f8faf9;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
}

.quick-section-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(16,24,40,.08);
}

.quick-section-icon {
  display: block;
  font-size: 28px;
  line-height: 1;
  margin-bottom: 10px;
}

.quick-section-title {
  display: block;
  font-weight: 800;
  font-size: 18px;
  margin-bottom: 4px;
}

.quick-section-sub {
  display: block;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.4;
}

.search-box {
  clear: both;
  position: relative;
  z-index: 1;
  margin-top: 0 !important;
}

@media (max-width: 900px) {
  .quick-sections-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .quick-sections-grid {
    grid-template-columns: 1fr;
  }

  .quick-sections-panel {
    padding: 18px;
    margin: 18px 0 24px;
  }
}


/* Additional SEO/Kokoda styles from latest package */
*{box-sizing:border-box}:root{--green:#087333;--green-dark:#064922;--green-soft:#e7f6ec;--orange:#f47a1f;--ink:#121826;--muted:#667085;--line:#e8eaf0;--bg:#f5f7f3;--shadow:0 18px 45px rgba(16,24,40,.10);--radius:20px}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink)}a{color:inherit}.header{background:rgba(255,255,255,.96);color:var(--ink);padding:12px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;backdrop-filter:blur(10px)}.header-inner{max-width:1180px;margin:0 auto}.brand-row{display:flex;align-items:center;gap:14px}.brand-logo-link{display:inline-block;line-height:0}.brand-logo{width:86px;height:auto;border-radius:14px;background:#fff}.logo{font-size:32px;font-weight:900;letter-spacing:-1px;line-height:1}.tagline{margin-top:5px;color:var(--green);font-size:12px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase}.nav{background:#fff;color:var(--ink);border-bottom:1px solid var(--line);padding:10px 18px;position:sticky;top:94px;z-index:19}.nav-inner{max-width:1180px;margin:0 auto;display:flex;gap:10px;flex-wrap:wrap;align-items:center}.nav a{text-decoration:none;padding:10px 13px;border-radius:999px;font-weight:700;color:#1f2937}.nav a:hover{background:var(--green-soft);color:var(--green-dark)}.nav a[href="login.php"],.nav a[href="register.php"],.nav a[href="logout.php"]{border:1px solid var(--line);background:#fff}.container{max-width:1180px;margin:0 auto;padding:20px 18px 70px}.hero{position:relative;min-height:430px;background:linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.10)),url("assets/tokmaket-hero.png") center/cover no-repeat;border-radius:30px;padding:58px;margin:10px 0 22px;overflow:hidden;color:#fff;box-shadow:var(--shadow)}.hero-with-logo{text-align:left}.hero-logo{max-width:250px;width:100%;height:auto;display:block;margin:0 0 18px;background:rgba(255,255,255,.92);border-radius:18px;padding:8px}.hero h1{margin:0 0 10px;font-size:46px;line-height:1.05;max-width:650px;letter-spacing:-1.2px}.hero p{margin:0 0 20px;max-width:650px;line-height:1.55;font-size:18px;color:rgba(255,255,255,.92)}.button-row{display:flex;gap:10px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--green);color:#fff;padding:12px 16px;min-height:44px;border-radius:12px;text-decoration:none;border:none;font-weight:800;cursor:pointer;box-shadow:0 8px 18px rgba(8,115,51,.18)}.btn.secondary{background:#13251b}.search-box{background:#fff;border-radius:22px;padding:16px;margin:-58px 28px 24px;border:1px solid rgba(255,255,255,.65);box-shadow:var(--shadow);position:relative;z-index:4;display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end}.search-box label{margin-top:0}.search-box p{margin:0}.category-strip{background:#fff;border:1px solid var(--line);border-radius:22px;padding:16px;box-shadow:0 8px 25px rgba(16,24,40,.06);display:grid;grid-template-columns:repeat(8,1fr);gap:10px;margin-bottom:24px}.category-tile{text-align:center;padding:12px 8px;border-radius:16px;background:#fbfcfb;border:1px solid transparent;text-decoration:none;font-weight:700;font-size:13px}.category-tile:hover{border-color:var(--green);background:var(--green-soft)}.category-icon{font-size:26px;display:block;margin-bottom:6px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:26px 0 14px}.section-head h1,.section-head h2{margin:0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 8px 25px rgba(16,24,40,.06);transition:transform .18s ease,box-shadow .18s ease}.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.card-body{padding:16px}.card h2,.card h3{margin:0 0 8px;line-height:1.2}.card h2{font-size:18px}.meta{color:var(--muted);font-size:13px;margin-bottom:8px;line-height:1.35}.price{color:var(--green);font-size:22px;font-weight:900;margin:12px 0}.badge{display:inline-block;background:#e9f8ef;color:var(--green-dark);padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900;margin-bottom:10px}.wanted-badge{background:#fff2df;color:#a94600}.form-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:0 8px 25px rgba(16,24,40,.06)}label{font-weight:800;display:block;margin:14px 0 7px;color:#263238}input,select,textarea{width:100%;padding:13px 14px;border:1px solid #d8dde6;border-radius:13px;font-size:16px;background:#fff;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(8,115,51,.10)}textarea{min-height:130px}.notice{padding:14px;border-radius:14px;margin-bottom:14px;background:#fff7df;border:1px solid #f4d48a}.success{background:#e4f8ea;border-color:#99d9a9}.footer{text-align:center;padding:24px;color:#667085}.table-wrap{overflow-x:auto;background:#fff;border-radius:20px;border:1px solid var(--line);box-shadow:0 8px 25px rgba(16,24,40,.05);margin-bottom:22px}table{width:100%;border-collapse:collapse;min-width:780px}td,th{padding:13px;border-bottom:1px solid #eef0f4;text-align:left;vertical-align:top}th{color:#344054;font-size:13px;background:#f9fafb}.inline-form{display:flex;gap:6px;flex-wrap:wrap}.inline-form button{padding:7px 9px;border:1px solid #d8dde6;border-radius:9px;background:#fff;cursor:pointer;font-weight:700}hr{border:0;border-top:1px solid var(--line);margin:22px 0}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:18px 0}.photo-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;overflow:hidden;box-shadow:0 8px 25px rgba(16,24,40,.05)}.photo-card img{width:100%;height:210px;object-fit:cover;border-radius:13px;display:block;margin-bottom:8px}.rating-summary{font-weight:800;color:#8a4f08}.gps-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.feature-layout{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}.side-panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 8px 25px rgba(16,24,40,.06)}.compact-list{display:grid;gap:12px}.compact-item{border-bottom:1px solid var(--line);padding-bottom:10px}.compact-item:last-child{border-bottom:0}.mobile-bottom-nav{display:none}@media(max-width:1000px){.search-box{grid-template-columns:1fr 1fr;margin:-40px 14px 20px}.category-strip{grid-template-columns:repeat(4,1fr)}.grid{grid-template-columns:repeat(2,1fr)}.feature-layout{grid-template-columns:1fr}.nav{top:82px}}@media(max-width:700px){body{padding-bottom:72px}.header{padding:10px 12px}.brand-row{gap:10px}.brand-logo{width:62px}.logo{font-size:24px}.tagline{font-size:9px;letter-spacing:1.4px}.nav{display:none}.container{padding:12px 12px 70px}.hero{min-height:420px;padding:28px 20px;border-radius:22px}.hero-logo{max-width:180px}.hero h1{font-size:32px}.hero p{font-size:16px}.search-box{grid-template-columns:1fr;margin:-42px 10px 18px;border-radius:18px}.category-strip{grid-template-columns:repeat(4,1fr);padding:10px}.category-tile{font-size:11px;padding:10px 4px}.category-icon{font-size:21px}.grid{grid-template-columns:1fr}.photo-grid{grid-template-columns:1fr}.photo-card img{height:auto;max-height:360px}.gps-row{grid-template-columns:1fr}.form-card{padding:18px;border-radius:20px}.mobile-bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);z-index:50;box-shadow:0 -8px 25px rgba(16,24,40,.08)}.mobile-bottom-nav a{text-decoration:none;text-align:center;padding:9px 4px 8px;font-size:11px;color:#344054;font-weight:700}.mobile-bottom-nav span{display:block;font-size:19px;margin-bottom:2px}.mobile-bottom-nav a.post-float{color:#fff}.mobile-bottom-nav a.post-float span{background:var(--green);width:38px;height:30px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center}}

.admin-filter-card {
  margin-bottom: 24px;
}

.admin-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  align-items: end;
}

.admin-filter-grid p {
  margin: 0;
}

.share-tools {
  margin-top: 14px;
}

@media (max-width: 800px) {
  .admin-filter-grid {
    grid-template-columns: 1fr;
  }
}


.facebook-share {
  background: #1877f2;
}


.card-thumb-link {
  display: block;
  background: #eef4ed;
  overflow: hidden;
}

.card-thumb {
  width: 100%;
  height: 175px;
  object-fit: cover;
  display: block;
  transition: transform 0.18s ease;
}

.card:hover .card-thumb {
  transform: scale(1.035);
}

.listing-card .card-body {
  min-height: 250px;
}

@media (max-width: 700px) {
  .card-thumb {
    height: 210px;
  }
}


.listing-gallery {
  margin: 18px 0 24px;
}

.gallery-main {
  position: relative;
  background: #111;
  border-radius: 22px;
  overflow: hidden;
  min-height: 360px;
}

.gallery-image {
  display: none;
  width: 100%;
  height: 480px;
  object-fit: contain;
  background: #111;
}

.gallery-image.active {
  display: block;
}

.gallery-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 54px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,0.86);
  color: #111;
  font-size: 34px;
  cursor: pointer;
  line-height: 1;
}

.gallery-prev {
  left: 14px;
}

.gallery-next {
  right: 14px;
}

.gallery-thumbs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px 2px;
}

.gallery-thumb {
  border: 3px solid transparent;
  border-radius: 12px;
  padding: 0;
  background: white;
  cursor: pointer;
  overflow: hidden;
  flex: 0 0 86px;
  height: 66px;
}

.gallery-thumb.active {
  border-color: var(--green);
}

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

.selectable-photo {
  cursor: pointer;
}

.thumbnail-radio {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  font-weight: 800;
}

.thumbnail-radio input {
  width: auto;
}

.thumbnail-select-form {
  margin-bottom: 18px;
}

@media (max-width: 700px) {
  .gallery-main {
    min-height: 260px;
  }

  .gallery-image {
    height: 320px;
  }

  .gallery-button {
    width: 38px;
    height: 48px;
    font-size: 30px;
  }
}


/* TokMaket services and service messaging */
.service-rating-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

.messages-list {
  display: grid;
  gap: 12px;
  margin: 18px 0;
}

.message-bubble {
  padding: 14px;
  border-radius: 16px;
  max-width: 780px;
  border: 1px solid var(--line);
  background: #fff;
}

.message-bubble.mine {
  margin-left: auto;
  background: #e9f8ef;
  border-color: #bfe8ca;
}

.message-bubble.theirs {
  margin-right: auto;
  background: #f9fafb;
}

.message-meta {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  margin-bottom: 6px;
}

.message-form textarea {
  min-height: 130px;
}

/* TokMaket listing messaging */
.messages-list {
  display: grid;
  gap: 12px;
  margin: 18px 0;
}

.message-bubble {
  padding: 14px;
  border-radius: 16px;
  max-width: 780px;
  border: 1px solid var(--line);
  background: #fff;
}

.message-bubble.mine {
  margin-left: auto;
  background: #e9f8ef;
  border-color: #bfe8ca;
}

.message-bubble.theirs {
  margin-right: auto;
  background: #f9fafb;
}

.message-meta {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  margin-bottom: 6px;
}

.message-form textarea {
  min-height: 130px;
}


/* TokMaket transport section */
.transport-card .price {
  font-size: 18px;
}

.route-pill {
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--green-soft);
  color: var(--green-dark);
  font-weight: 800;
}

.transport-route-meta {
  display: grid;
  gap: 6px;
  margin: 12px 0;
}


/* TokMaket Starlink section */
.starlink-info-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 18px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.starlink-warning {
  background: #fff7df;
  border: 1px solid #f4d48a;
  border-radius: 14px;
  padding: 14px;
}


/* Dashboard action buttons */
.dashboard-actions {
  align-items: stretch;
}

.dashboard-actions .btn {
  margin-bottom: 8px;
}

.listing-type-choice {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 8px 0 16px;
}

.listing-type-choice label {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
}

.listing-type-choice label:has(input:checked) {
  border-color: var(--green);
  background: var(--green-soft);
  box-shadow: 0 0 0 4px rgba(8,115,51,.10);
}

.listing-type-choice input {
  width: auto;
  margin-top: 3px;
  accent-color: var(--green);
}

.listing-type-choice span {
  display: grid;
  gap: 4px;
}

.listing-type-choice strong {
  color: var(--ink);
  font-size: 16px;
}

.listing-type-choice small {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

@media(max-width:700px) {
  .listing-type-choice {
    grid-template-columns: 1fr;
  }
}

/* Harvest Forecasts */
.harvest-hero {
  background: linear-gradient(90deg, rgba(5, 35, 19, .72), rgba(5, 35, 19, .22)), url("assets/tokmaket-hero.png") center/cover no-repeat;
}

.harvest-intro-card {
  margin-bottom: 20px;
}

.harvest-search-box {
  grid-template-columns: minmax(240px, 2fr) minmax(160px, 1fr) minmax(180px, 1fr) auto;
  margin: 20px 28px 24px;
}

.harvest-card .price {
  font-size: 18px;
  color: var(--green-dark);
}

/* Town Buyer Directory */
.buyer-directory-hero {
  background: linear-gradient(90deg, rgba(5, 35, 19, .72), rgba(5, 35, 19, .20)), url("assets/tokmaket-hero.png") center/cover no-repeat;
}

.buyer-directory-intro-card {
  margin-bottom: 20px;
}

.buyer-search-box {
  grid-template-columns: minmax(240px, 2fr) minmax(160px, 1fr) minmax(180px, 1fr) auto;
  margin: 20px 28px 24px;
}

.buyer-card .price {
  font-size: 18px;
  color: var(--green-dark);
}

@media(max-width:1000px) {
  .harvest-search-box {
    grid-template-columns: 1fr 1fr;
    margin: 20px 14px 20px;
  }

  .buyer-search-box {
    grid-template-columns: 1fr 1fr;
    margin: 20px 14px 20px;
  }
}

@media(max-width:700px) {
  .harvest-search-box {
    grid-template-columns: 1fr;
    margin: 18px 10px 18px;
  }

  .buyer-search-box {
    grid-template-columns: 1fr;
    margin: 18px 10px 18px;
  }
}


/* Kokoda Trekking section */
.kokoda-card .price {
  font-size: 18px;
}

.kokoda-search-box {
  grid-template-columns: minmax(260px, 2fr) repeat(4, minmax(150px, 1fr));
  margin: 30px 28px 34px;
  gap: 14px;
  align-items: end;
}

.kokoda-search-box > div:nth-of-type(6) {
  grid-column: 1 / 3;
  max-width: 420px;
}

.kokoda-search-box p {
  grid-column: 3 / 4;
  justify-self: start;
  align-self: end;
  width: 220px;
  max-width: 100%;
}

.kokoda-search-box > div,
.kokoda-search-box > p {
  min-width: 0;
}

.kokoda-search-box label {
  line-height: 1.2;
}

.kokoda-search-box input,
.kokoda-search-box select {
  min-width: 0;
}

.kokoda-search-box .btn {
  width: 100%;
  min-height: 50px;
  white-space: nowrap;
}

.kokoda-empty-state p {
  margin: 0 0 12px;
}

.badge-soft {
  background: #eef2ff;
  color: #3730a3;
  margin-left: 6px;
}

.kokoda-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0;
}

.kokoda-detail-grid > div {
  background: #f8faf9;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

.kokoda-detail-grid p {
  margin: 8px 0 0;
}

.kokoda-video-section {
  margin: 22px 0;
}

.kokoda-video-section video {
  display: block;
  width: 100%;
  max-height: 560px;
  background: #111827;
  border: 1px solid var(--line);
  border-radius: 18px;
}

.feedback-list {
  display: grid;
  gap: 12px;
  margin: 12px 0 20px;
}

.feedback-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

.feedback-card p {
  margin-bottom: 0;
}

@media (max-width: 1180px) {
  .kokoda-search-box {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 24px 14px 24px;
  }

  .kokoda-search-box > div:nth-of-type(6) {
    grid-column: auto;
    max-width: none;
  }

  .kokoda-search-box p {
    grid-column: span 3;
    justify-self: stretch;
    max-width: none;
    width: 100%;
  }
}

@media (max-width: 700px) {
  .kokoda-search-box,
  .kokoda-detail-grid {
    grid-template-columns: 1fr;
  }

  .kokoda-search-box {
    margin: 18px 10px 18px;
  }

  .kokoda-search-box p {
    grid-column: auto;
  }
}

.kokoda-staff-search-box {
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr auto;
  margin: 0 28px 24px;
}

.kokoda-staff-intro-card {
  margin-bottom: 34px;
}

.kokoda-staff-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.kokoda-staff-card {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
}

.kokoda-staff-card-media,
.kokoda-staff-resume-photo {
  background: #eef4ed;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--green-dark);
  font-weight: 900;
}

.kokoda-staff-card-media {
  min-height: 100%;
  font-size: 38px;
}

.kokoda-staff-card-media img,
.kokoda-staff-resume-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.kokoda-staff-resume {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.kokoda-staff-resume-head {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  margin-bottom: 24px;
}

.kokoda-staff-resume-photo {
  width: 220px;
  height: 220px;
  border-radius: 24px;
  overflow: hidden;
  font-size: 54px;
  border: 1px solid var(--line);
}

.kokoda-staff-current-photo {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-bottom: 10px;
}

.kokoda-staff-current-photo img,
.admin-staff-photo {
  width: 84px;
  height: 84px;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid var(--line);
}

.checkbox-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
  margin: 8px 0 14px;
}

.checkbox-grid label {
  margin: 0;
  display: flex;
  gap: 8px;
  align-items: center;
  font-weight: 700;
}

.checkbox-grid input {
  width: auto;
}

.checkbox-grid.compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
}

@media (max-width: 1000px) {
  .kokoda-staff-search-box {
    grid-template-columns: 1fr 1fr;
    margin: 0 14px 20px;
  }

  .kokoda-staff-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .kokoda-staff-search-box,
  .checkbox-grid,
  .checkbox-grid.compact {
    grid-template-columns: 1fr;
  }

  .kokoda-staff-search-box {
    margin: 0 10px 18px;
  }

  .kokoda-staff-intro-card {
    margin-bottom: 24px;
  }

  .kokoda-staff-card,
  .kokoda-staff-resume-head {
    grid-template-columns: 1fr;
  }

  .kokoda-staff-card-media {
    aspect-ratio: 1 / 1;
    min-height: 0;
  }

  .kokoda-staff-resume-photo {
    width: 100%;
    max-width: 260px;
    height: auto;
    aspect-ratio: 1 / 1;
  }
}


/* SEO content blocks */
.seo-services-panel,
.seo-content-page {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 22px;
  margin: 22px 0;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.seo-services-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.seo-services-grid div {
  background: #f8faf9;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

.seo-services-actions {
  clear: both;
  margin-top: 20px;
  padding-top: 4px;
}

.seo-services-actions .btn {
  margin-top: 0;
  margin-bottom: 0;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 8px;
  font-size: 13px;
  font-weight: 700;
}

.legal-page h2 {
  margin-top: 24px;
}

.help-page {
  margin-bottom: 24px;
}

.help-grid {
  align-items: start;
  gap: 22px;
  margin: 24px 0 30px;
}

.help-grid .card {
  display: flex;
  height: auto;
}

.help-grid .card-body {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 10px;
}

.help-grid .card-body .btn {
  align-self: flex-start;
  margin-top: 4px;
  max-width: 100%;
  white-space: normal;
  text-align: center;
}

.help-grid .card-body .btn + .btn {
  margin-top: 0;
}

.help-grid .card h2 {
  margin-bottom: 2px;
}

.help-grid .card p {
  margin: 0;
}

.help-grid .card .meta {
  margin-bottom: 0;
}

.help-section {
  clear: both;
  margin: 30px 0;
}

.help-section + .help-section,
.help-grid + .help-section {
  margin-top: 36px;
}

@media (max-width: 1000px) {
  .help-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .help-grid {
    grid-template-columns: 1fr;
    gap: 14px;
    margin: 18px 0 24px;
  }

  .help-section {
    margin: 24px 0;
  }
}


@media (max-width: 700px) {
  .seo-services-grid {
    grid-template-columns: 1fr;
  }
}


/* Resort packages section */
.resort-card .price {
  font-size: 18px;
}

.resort-card .badge {
  background: #e9f8ef;
}

.resorts-hero {
  min-height: 380px;
  padding-top: 42px;
  padding-bottom: 48px;
}

.resorts-hero .hero-logo {
  max-width: 180px;
  margin-bottom: 18px;
}

.resorts-hero h1 {
  max-width: 820px;
}

.resorts-hero p {
  max-width: 860px;
}

.resort-search-box {
  grid-template-columns: minmax(280px, 2fr) minmax(190px, 1fr) minmax(190px, 1fr) auto;
  margin-top: 38px;
}

.resort-package-note {
  background: #f8faf9;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

@media(max-width:1000px) {
  .resort-search-box {
    grid-template-columns: 1fr 1fr;
  }
}

@media(max-width:700px) {
  .resorts-hero {
    min-height: auto;
    padding: 26px 20px 32px;
  }

  .resorts-hero .hero-logo {
    max-width: 150px;
  }

  .resort-search-box {
    grid-template-columns: 1fr;
  }
}


/* Global search */
.search-results-list {
  display: grid;
  gap: 14px;
  margin: 18px 0;
}

.search-result-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.search-result-card h2 {
  margin: 8px 0;
}

.search-result-card h2 a {
  color: inherit;
  text-decoration: none;
}

.search-result-card h2 a:hover {
  text-decoration: underline;
}

.global-search-box {
  margin-top: 22px;
}

/* Search panels overlap only when they sit directly under a hero. */
.search-box {
  margin: 22px 28px 24px;
}

.hero + .search-box {
  margin: -58px 28px 24px;
}

.form-card + .search-box:not(.kokoda-search-box):not(.kokoda-staff-search-box),
.seo-services-panel + .search-box,
.seo-content-page + .search-box {
  margin-top: 24px;
}

@media(max-width:1000px) {
  .search-box {
    margin: 20px 14px 20px;
  }

  .hero + .search-box {
    margin: -40px 14px 20px;
  }
}

@media(max-width:700px) {
  .search-box {
    margin: 18px 10px 18px;
  }

  .hero + .search-box {
    margin: -42px 10px 18px;
  }
}


/* Shared photo carousel for services, transport, Starlink, Kokoda, resort packages and guest houses */
.area-photo-section {
  margin: 22px 0;
}

.area-photo-carousel {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
}

.area-photo-track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  padding: 4px 2px 12px;
}

.area-photo-slide {
  flex: 0 0 min(86vw, 720px);
  scroll-snap-align: start;
  margin: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.area-photo-slide img {
  display: block;
  width: 100%;
  height: min(58vw, 430px);
  object-fit: cover;
  background: #f3f4f6;
}

.area-photo-slide figcaption {
  padding: 10px 14px;
  color: var(--muted);
  font-size: 14px;
}

.area-photo-arrow {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  cursor: pointer;
  font-size: 30px;
  line-height: 1;
  box-shadow: 0 8px 20px rgba(16,24,40,.08);
}

.area-photo-arrow:hover {
  transform: translateY(-1px);
}

.area-photo-admin-grid {
  display: grid;
  gap: 16px;
  margin-top: 18px;
}

.area-photo-admin-card {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.area-photo-admin-card img {
  width: 220px;
  height: 150px;
  object-fit: cover;
  border-radius: 12px;
  background: #f3f4f6;
}

@media (max-width: 700px) {
  .area-photo-carousel {
    grid-template-columns: 1fr;
  }

  .area-photo-arrow {
    display: none;
  }

  .area-photo-slide {
    flex-basis: 88vw;
  }

  .area-photo-admin-card {
    grid-template-columns: 1fr;
  }

  .area-photo-admin-card img {
    width: 100%;
    height: 220px;
  }
}


/* Admin hub */
.admin-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0 28px;
}

.admin-hub-card {
  position: relative;
  display: block;
  text-decoration: none;
  color: inherit;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 18px;
  min-height: 132px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.admin-hub-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(16,24,40,.10);
}

.admin-hub-card.disabled {
  opacity: .55;
  cursor: not-allowed;
}

.admin-hub-icon {
  display: block;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 10px;
}

.admin-hub-title {
  display: block;
  font-weight: 900;
  font-size: 18px;
  margin-bottom: 6px;
}

.admin-hub-desc {
  display: block;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.35;
  padding-right: 44px;
}

.admin-hub-count {
  position: absolute;
  top: 14px;
  right: 14px;
  min-width: 32px;
  height: 32px;
  padding: 0 8px;
  border-radius: 999px;
  background: #b42318;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 14px;
}

@media (max-width: 900px) {
  .admin-hub-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .admin-hub-grid {
    grid-template-columns: 1fr;
  }
}


/* Visible admin navigation */
.admin-nav-link {
  font-weight: 900 !important;
  background: #1f2937;
  color: #fff !important;
  border-radius: 999px;
  padding: 8px 14px !important;
}

.admin-dashboard-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}


.admin-json-preview {
  white-space: pre-wrap;
  max-width: 420px;
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
  font-size: 12px;
  overflow-x: auto;
}





/* Simple reliable navigation fix */
.nav,
.nav-inner,
.nav-row,
.nav-primary,
.nav-secondary,
.nav-menu,
.nav-menu-panel {
  all: unset;
}

.nav {
  display: none !important;
}

.tk-nav {
  display: block;
  background: #fff;
  border-bottom: 1px solid var(--line);
  padding: 10px 18px;
  position: sticky;
  top: 94px;
  z-index: 19;
}

.tk-nav-scroll {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  overflow-y: visible;
  white-space: nowrap;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.tk-nav-link {
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 13px !important;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent !important;
  color: #1f2937 !important;
  text-decoration: none !important;
  font-weight: 800;
  line-height: 1;
}

.tk-nav-link:hover {
  background: var(--green-soft) !important;
  color: var(--green-dark) !important;
}

.tk-nav-link.active {
  background: var(--green) !important;
  color: #fff !important;
  border-color: var(--green) !important;
}

.tk-nav-link.admin-nav-link {
  background: #1f2937 !important;
  color: #fff !important;
  border-color: #1f2937 !important;
}

.tk-nav-link.admin-nav-link.active {
  background: var(--green) !important;
  border-color: var(--green) !important;
}

.tk-nav-link.nav-auth {
  border-color: var(--line) !important;
  background: #fff !important;
}

.tk-nav-link.nav-auth.active {
  background: var(--green) !important;
  color: #fff !important;
  border-color: var(--green) !important;
}

@media(max-width:1000px) {
  .tk-nav {
    top: 82px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .tk-nav-scroll {
    max-width: none;
  }
}

@media(max-width:700px) {
  .tk-nav {
    display: none;
  }
}


/* Bottom previous/next item navigation */
.item-bottom-nav {
  position: sticky;
  bottom: 0;
  z-index: 30;
  margin-top: 28px;
  padding: 12px 0 0;
}

.item-bottom-nav-inner {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items: center;
  background: rgba(255,255,255,.96);
  border: 1px solid var(--line);
  border-radius: 22px 22px 0 0;
  padding: 12px;
  box-shadow: 0 -10px 30px rgba(16,24,40,.10);
  backdrop-filter: blur(10px);
}

.item-bottom-nav-btn {
  min-height: 58px;
  border-radius: 16px;
  padding: 10px 14px;
  background: var(--green);
  color: #fff !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(8,115,51,.18);
}

.item-bottom-nav-btn.next {
  justify-content: flex-end;
  text-align: right;
}

.item-bottom-nav-btn small {
  display: block;
  font-size: 12px;
  opacity: .9;
  margin-top: 2px;
}

.item-bottom-nav-btn.disabled {
  background: #eef2f1;
  color: #94a3b8 !important;
  box-shadow: none;
}

.item-nav-arrow {
  font-size: 24px;
  line-height: 1;
}

.item-bottom-nav-position {
  min-width: 110px;
  text-align: center;
  padding: 9px 14px;
  border-radius: 16px;
  background: #f8faf9;
  border: 1px solid var(--line);
}

.item-bottom-nav-position span {
  display: block;
  font-size: 12px;
  color: var(--muted);
  font-weight: 800;
}

.item-bottom-nav-position strong {
  display: block;
  margin-top: 2px;
  font-size: 18px;
  color: var(--ink);
}

@media(max-width:700px) {
  .item-bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 58px;
    padding: 0 8px;
    z-index: 49;
  }

  .item-bottom-nav-inner {
    grid-template-columns: 1fr 82px 1fr;
    border-radius: 18px;
    padding: 8px;
    gap: 6px;
  }

  .item-bottom-nav-btn {
    min-height: 50px;
    padding: 8px 9px;
    border-radius: 13px;
    font-size: 13px;
  }

  .item-bottom-nav-btn small {
    font-size: 10px;
  }

  .item-nav-arrow {
    font-size: 18px;
  }

  .item-bottom-nav-position {
    min-width: 0;
    padding: 7px 5px;
    border-radius: 12px;
  }

  .item-bottom-nav-position span {
    font-size: 10px;
  }

  .item-bottom-nav-position strong {
    font-size: 14px;
  }

  body {
    padding-bottom: 132px;
  }
}


/* Category-aware item navigation centre link */
.item-bottom-nav-position a {
  display: inline-block;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 900;
  color: var(--green);
  text-decoration: none;
}

.item-bottom-nav-position a:hover {
  text-decoration: underline;
}

@media(max-width:700px) {
  .item-bottom-nav-position a {
    font-size: 10px;
  }
}


/* Always-visible item navigation state */
.item-bottom-nav.single-item .item-bottom-nav-position {
  background: #fff7df;
  border-color: #f4d48a;
}

.item-bottom-nav.single-item .item-bottom-nav-position span::after {
  content: " — only item in this group";
}


/* Explore/category count badges */
.quick-section-card {
  position: relative;
}

.quick-section-count {
  position: absolute;
  top: 14px;
  right: 14px;
  min-width: 34px;
  height: 34px;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--green);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 14px;
  box-shadow: 0 8px 18px rgba(8,115,51,.18);
}

.category-tile {
  position: relative;
  display: grid;
  gap: 5px;
  align-content: center;
  min-width: 0;
  min-height: 92px;
  overflow-wrap: anywhere;
  word-break: normal;
}

.category-strip {
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  align-items: stretch;
}

.category-count {
  justify-self: center;
  min-width: 28px;
  height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef7f1;
  color: var(--green-dark);
  border: 1px solid #cae8d3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 12px;
}

.category-tile:hover .category-count {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
}

@media(max-width:700px) {
  .quick-section-count {
    top: 10px;
    right: 10px;
    min-width: 30px;
    height: 30px;
    font-size: 13px;
  }

  .category-count {
    height: 22px;
    font-size: 11px;
  }
}


/* Admin statistics */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin: 20px 0 28px;
}

.stats-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 8px 25px rgba(16,24,40,.06);
}

.stats-card span {
  display: block;
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 8px;
}

.stats-card strong {
  display: block;
  font-size: 30px;
  line-height: 1;
  color: var(--green-dark);
}

@media(max-width:900px) {
  .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:560px) {
  .stats-grid {
    grid-template-columns: 1fr;
  }
}


/* Item view counts on category/list cards */
.view-count-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: fit-content;
  margin: 4px 0 8px;
  padding: 5px 9px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  font-weight: 900;
}





/* Horizontal page scroll fix */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.tk-nav {
  overflow: hidden;
}

.tk-nav-scroll {
  max-width: min(1180px, calc(100vw - 36px));
  overflow-x: auto !important;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0;
}

.tk-nav-scroll::-webkit-scrollbar {
  display: none;
}

.tk-nav-link {
  white-space: nowrap;
}

@media(min-width:1001px) {
  .tk-nav-scroll {
    justify-content: flex-start;
  }

  .tk-nav-link {
    padding-left: 11px !important;
    padding-right: 11px !important;
  }
}

@media(max-width:1000px) {
  .tk-nav-scroll {
    max-width: calc(100vw - 24px);
    scrollbar-width: none;
  }
}


/* Desktop navigation wrap fix */
@media(min-width:1001px) {
  .tk-nav {
    overflow: visible;
  }

  .tk-nav-scroll {
    max-width: 1180px;
    overflow-x: visible !important;
    overflow-y: visible;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 8px;
    column-gap: 8px;
  }

  .tk-nav-link {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

@media(max-width:1000px) {
  .tk-nav {
    overflow: hidden;
  }

  .tk-nav-scroll {
    flex-wrap: nowrap;
    overflow-x: auto !important;
    overflow-y: hidden;
    max-width: calc(100vw - 24px);
  }
}





/* Homepage member count */
.member-count-strip {
  max-width: 1180px;
  margin: 28px auto 18px;
  padding: 0 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  clear: both;
}

.member-count-strip.public-visitors-only {
  grid-template-columns: minmax(220px, 360px);
  justify-content: center;
  margin: 16px auto 12px;
}

.member-count-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 5px 16px rgba(16,24,40,.04);
  text-align: center;
}

.member-count-card.online {
  background: #f7fcf8;
  border-color: #d8efde;
}

.member-count-card.visitors {
  background: #f8fafc;
  border-color: #dbe3ef;
}

.member-count-card strong {
  color: var(--green-dark);
  font-size: 22px;
  line-height: 1;
}

.member-count-card span {
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
}

.member-count-card.online-list {
  grid-column: 1 / -1;
  align-items: stretch;
  flex-direction: column;
  gap: 10px;
  min-height: 82px;
}

.member-count-card-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.member-count-card-heading span {
  font-size: 12px;
}

.online-member-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
}

.online-member-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
}

.online-member-row > span:last-child {
  min-width: 0;
}

.online-member-row small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.online-member-dot {
  width: 9px;
  height: 9px;
  margin-top: 3px;
  border-radius: 999px;
  background: var(--green);
  box-shadow: 0 0 0 3px rgba(8,115,51,.12);
  flex: 0 0 9px;
}

@media(max-width:700px) {
  .member-count-strip {
    max-width: none;
    margin-top: 14px;
    padding: 0 12px;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .member-count-card {
    padding: 10px 12px;
  }

  .member-count-card strong {
    font-size: 20px;
  }

  .member-count-card span {
    font-size: 12px;
  }

  .online-member-list {
    grid-template-columns: 1fr;
  }
}


/* Multi member types */
.member-type-checkboxes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 8px 0 14px;
  width: 100%;
  max-width: 100%;
}

.member-type-checkboxes label {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 9px 10px;
  font-weight: 800;
  line-height: 1.25;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  width: 100%;
}

.member-type-checkboxes input[type="checkbox"] {
  flex: 0 0 22px;
  margin: 0;
  max-width: 22px;
  min-width: 22px;
  width: 22px !important;
}

.member-type-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.member-type-admin-form {
  margin: 16px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fbfdfb;
}

@media(max-width:900px) {
  .member-type-checkboxes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:560px) {
  .member-type-checkboxes {
    grid-template-columns: 1fr;
  }

  .member-type-checkboxes label {
    min-height: 58px;
    padding: 12px 14px;
  }
}


/* Change requests */
.status-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0 18px;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #f1f5f9;
  color: var(--ink) !important;
  text-decoration: none;
  font-weight: 900;
  border: 1px solid var(--line);
}

.status-pill.active {
  background: var(--green);
  color: #fff !important;
  border-color: var(--green);
}

.change-request-card {
  margin-bottom: 16px;
}

.change-request-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.request-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  background: #e2e8f0;
  color: #334155;
}

.status-new {
  background: #dbeafe;
  color: #1e40af;
}

.status-pass {
  background: #fee2e2;
  color: #991b1b;
}

.status-todo {
  background: #fef3c7;
  color: #92400e;
}

.status-done {
  background: #dcfce7;
  color: #166534;
}

.change-request-update-form {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.footer-links {
  text-align: center;
  margin: 14px 0 4px;
}

.footer-links a {
  color: var(--muted);
  font-weight: 800;
  text-decoration: none;
}

.footer-links a:hover {
  text-decoration: underline;
}

.index-footer {
  display: block;
  clear: both;
  margin: 32px auto 0;
  padding: 24px 18px 34px;
  color: var(--muted);
  text-align: center;
}

.index-footer .footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  margin-top: 18px;
}

.index-footer .footer-links a {
  color: var(--muted);
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
}

.index-footer .footer-links span {
  color: var(--muted);
  margin: 0 12px;
  font-weight: 900;
}

.index-footer .footer-links a:hover {
  text-decoration: underline;
}

.admin-stats-legal-links {
  color: var(--muted);
  font-weight: 700;
  margin-top: 14px;
  padding: 14px 12px 2px;
  border-top: 1px solid var(--line);
  text-align: center;
}

.admin-stats-legal-links .footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  margin-top: 14px;
}

.admin-stats-legal-links .footer-links a {
  color: var(--muted);
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
}

.admin-stats-legal-links .footer-links span {
  color: var(--muted);
  margin: 0 12px;
  font-weight: 900;
}

.admin-stats-legal-links .footer-links a:hover {
  text-decoration: underline;
}

.index-bottom-legal {
  color: var(--muted);
  margin: 22px auto 0;
  padding: 18px 18px 34px;
  text-align: center;
  font-size: 16px;
  line-height: 1.45;
}

.index-change-request-link {
  margin-bottom: 24px;
}

.index-bottom-legal .index-change-request-link a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 12px 18px;
  border-radius: 12px;
  background: var(--green);
  color: #ffffff;
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(8,115,51,.18);
  transition: background-color .16s ease, box-shadow .16s ease, transform .08s ease;
}

.index-bottom-legal .index-change-request-link a:hover {
  background: #0a9a49;
  color: #ffffff;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(8, 125, 59, .28);
  transform: translateY(-1px);
}

.index-bottom-legal nav {
  padding-top: 8px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 0;
  row-gap: 8px;
  margin-bottom: 8px;
}

.index-bottom-legal a {
  color: var(--muted);
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
}

.index-bottom-legal span {
  color: var(--muted);
  margin: 0 12px;
  font-weight: 900;
}

.index-bottom-legal a:hover {
  text-decoration: underline;
}

.jobs-hero {
  background: linear-gradient(90deg, rgba(4, 38, 29, .72), rgba(4, 38, 29, .28)), url("assets/images/tokmaket-hero-selected-1920.webp") center/cover no-repeat;
}

.jobs-intro-card {
  margin-bottom: 18px;
}

.jobs-search-box {
  margin: 18px 28px 24px;
  grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(150px, 1fr)) auto;
}

.jobs-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.job-card {
  display: grid;
  grid-template-columns: 96px 1fr;
  min-height: 220px;
}

.job-logo {
  width: 76px;
  height: 76px;
  margin: 18px 0 0 18px;
  border-radius: 18px;
  background: var(--green-soft);
  border: 1px solid var(--line);
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--green-dark);
  font-weight: 900;
  font-size: 22px;
}

.job-logo.large {
  width: 128px;
  height: 128px;
  margin: 0;
}

.job-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.job-detail-head {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 18px;
  align-items: center;
  margin-bottom: 18px;
}

.job-feature-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.jobs-action-panel {
  margin-top: 22px;
  display: grid;
  gap: 18px;
}

.job-message-item {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

.jobs-reply-form textarea {
  min-height: 90px;
}

@media(max-width:1000px) {
  .jobs-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jobs-search-box {
    grid-template-columns: 1fr 1fr;
  }
}

@media(max-width:700px) {
  .jobs-grid,
  .job-card,
  .job-detail-head,
  .jobs-search-box {
    grid-template-columns: 1fr;
  }

  .job-logo,
  .job-logo.large {
    width: 108px;
    height: 108px;
    margin: 16px 0 0 16px;
  }
}

@media(max-width:700px) {
  .change-request-head {
    flex-direction: column;
  }
}


/* Admin member role management */
.member-role-admin-form {
  margin: 16px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f8fbff;
}

.member-role-admin-form select {
  max-width: 340px;
}


/* Account management */
.account-actions { margin-top: 18px; }


/* Logout button visibility */
.btn.danger,
a.btn.danger {
  background: #b42318 !important;
  color: #fff !important;
}

.btn.danger:hover,
a.btn.danger:hover {
  filter: brightness(.95);
}


/* Always-visible header account/logout actions */
.header-inner {
  position: relative;
}

.header-account-actions {
  position: absolute;
  right: 18px;
  top: 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  z-index: 5;
}

.header-account-link,
.header-register-link,
.header-logout-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 13px;
  text-decoration: none;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  box-shadow: 0 4px 14px rgba(16,24,40,.08);
}

.header-logout-link {
  background: #b42318;
  border-color: #b42318;
  color: #fff;
}

.header-register-link {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}

@media(max-width:760px) {
  .header-inner {
    padding-bottom: 54px;
  }

  .header-account-actions {
    left: 12px;
    right: 12px;
    top: auto;
    bottom: 10px;
    justify-content: center;
  }

  .header-account-link,
  .header-register-link,
  .header-logout-link {
    flex: 1;
    max-width: 150px;
  }
}


/* Always visible Login/Register/Logout links */
.header-inner-with-auth {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.visible-auth-links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-shrink: 0;
  margin-left: auto;
}

.visible-auth-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 9px 15px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  box-shadow: 0 4px 14px rgba(16,24,40,.08);
  white-space: nowrap;
}

.visible-auth-link.register,
.visible-auth-link.account {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}

.visible-auth-link.logout {
  background: #b42318;
  border-color: #b42318;
  color: #fff;
}

@media(max-width:900px) {
  .header-inner-with-auth {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .visible-auth-links {
    width: 100%;
    justify-content: flex-start;
    margin-left: 0;
  }
}

@media(max-width:560px) {
  .visible-auth-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .visible-auth-link {
    width: 100%;
  }
}

/* Auth links live in the header only, not the main nav */
.tk-nav .nav-auth {
  display: none !important;
}


/* Final visible header auth buttons */
.header-inner-auth-final {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
}

.top-auth-buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: static !important;
  z-index: 10 !important;
}

.top-auth-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  padding: 10px 18px !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
  font-size: 15px !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border: 1px solid #d8dee8 !important;
  background: #fff !important;
  color: #111827 !important;
  box-shadow: 0 6px 18px rgba(16,24,40,.10) !important;
}

.top-auth-btn.register,
.top-auth-btn.account {
  background: #087d3b !important;
  border-color: #087d3b !important;
  color: #fff !important;
}

.top-auth-btn.logout {
  background: #b42318 !important;
  border-color: #b42318 !important;
  color: #fff !important;
}

/* Never show auth links in the internal section nav */
.tk-nav .nav-auth {
  display: none !important;
}

@media(max-width:800px) {
  .header-inner-auth-final {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  .top-auth-buttons {
    width: 100% !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }
}

@media(max-width:520px) {
  .top-auth-buttons {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .top-auth-btn {
    width: 100% !important;
  }
}


/* Standalone homepage auth buttons */
.index-auth-buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
}

.index-auth-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  padding: 10px 18px !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
  font-size: 15px !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border: 1px solid #d8dee8 !important;
  background: #fff !important;
  color: #111827 !important;
  box-shadow: 0 6px 18px rgba(16,24,40,.10) !important;
}

.index-auth-btn.register,
.index-auth-btn.account {
  background: #087d3b !important;
  border-color: #087d3b !important;
  color: #fff !important;
}

.index-auth-btn.logout {
  background: #b42318 !important;
  border-color: #b42318 !important;
  color: #fff !important;
}

.header-inner:has(.index-auth-buttons) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

@media(max-width:800px) {
  .header-inner:has(.index-auth-buttons) {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .index-auth-buttons {
    width: 100% !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }
}

@media(max-width:520px) {
  .index-auth-buttons {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .index-auth-btn {
    width: 100% !important;
  }
}


/* Unified messages */
.message-filter-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.message-filter-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid var(--line);
  color: var(--ink);
  font-weight: 900;
  text-decoration: none;
}

.message-filter-tabs a.active {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
}

.message-filter-tabs span {
  display: inline-flex;
  min-width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}

.message-filter-tabs b {
  display: inline-flex;
  min-width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #b42318;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.message-type-badge {
  display: inline-flex;
  padding: 5px 9px;
  border-radius: 999px;
  background: #eaf7ee;
  color: var(--green-dark);
  font-weight: 900;
  font-size: 12px;
  white-space: nowrap;
}


/* GPS maps */
.map-card {
  margin: 18px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #f8fafc;
}

.map-card h2 {
  margin: 0 0 10px;
  font-size: 20px;
}

.map-frame-wrap {
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: #e5e7eb;
}

.map-frame {
  display: block;
  width: 100%;
  min-height: 320px;
  border: 0;
}

.map-links {
  margin: 10px 0 0;
  font-weight: 900;
}

.map-links a {
  color: var(--green);
  text-decoration: none;
}

.map-links a:hover {
  text-decoration: underline;
}

@media(max-width:640px) {
  .map-frame {
    min-height: 240px;
  }
}


/* Homepage hero action buttons */
.hero-top-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 16px;
  max-width: 1120px;
  margin: 0 0 18px;
}

.hero-top-row .hero-logo {
  flex: 0 0 auto;
  margin: 0;
}

.exchange-rate-card,
.weather-card {
  width: min(360px, 100%);
  margin-top: 6px;
  padding: 13px 14px;
  border: 1px solid rgba(255, 255, 255, .36);
  border-radius: 18px;
  background: rgba(255, 255, 255, .9);
  color: var(--ink);
  box-shadow: 0 14px 30px rgba(2, 10, 8, .18);
  backdrop-filter: blur(10px);
}

.exchange-rate-head,
.exchange-rate-list,
.weather-head {
  display: grid;
  gap: 8px;
}

.exchange-rate-head,
.weather-head {
  grid-template-columns: 1fr auto;
  align-items: baseline;
  margin-bottom: 10px;
}

.exchange-rate-head span,
.weather-head span {
  color: var(--green-dark);
  font-size: 14px;
  font-weight: 900;
  text-transform: uppercase;
}

.exchange-rate-head small,
.exchange-rate-source,
.weather-head small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.exchange-rate-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.exchange-rate-list div {
  min-width: 0;
  padding: 9px 8px;
  border: 1px solid #dce8df;
  border-radius: 12px;
  background: #f8fbf8;
  text-align: center;
}

.exchange-rate-list span,
.exchange-rate-list strong {
  display: block;
}

.exchange-rate-list span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}

.exchange-rate-list strong {
  color: var(--green-dark);
  font-size: 17px;
  font-weight: 900;
  line-height: 1.25;
}

.exchange-rate-source {
  display: block;
  margin-top: 8px;
}

.weather-card {
  width: min(250px, 100%);
}

.weather-current {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid #dce8df;
  border-radius: 12px;
  background: #f8fbf8;
}

.weather-current strong {
  color: var(--green-dark);
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
}

.weather-current span {
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.25;
}

.weather-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.weather-meta span {
  padding: 5px 7px;
  border-radius: 999px;
  background: #edf5ef;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}

.facebook-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  margin: 0 0 16px;
  padding: 9px 13px 9px 10px;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 999px;
  background: rgba(24, 119, 242, .96);
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(24, 119, 242, .22);
  transition: background-color .16s ease, box-shadow .16s ease, transform .08s ease;
}

.facebook-badge:hover,
.facebook-badge:focus-visible {
  background: #0f66d0;
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(24, 119, 242, .32);
  transform: translateY(-1px);
}

.facebook-badge:focus-visible {
  outline: 3px solid rgba(255, 255, 255, .75);
  outline-offset: 3px;
}

.facebook-badge-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #ffffff;
  color: #1877f2;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 21px;
  font-weight: 900;
  line-height: 1;
}

.hero-action-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}

.hero-action-row .btn {
  margin: 0 !important;
  white-space: nowrap !important;
}

@media(max-width:700px) {
  .hero-top-row {
    display: grid;
    gap: 12px;
    max-width: none;
  }

  .exchange-rate-card,
  .weather-card {
    width: 100%;
    margin-top: 0;
  }

  .exchange-rate-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .exchange-rate-list div {
    padding: 8px 5px;
  }

  .exchange-rate-list strong {
    font-size: 15px;
  }

  .facebook-badge {
    width: 100%;
    justify-content: center;
    margin-bottom: 12px;
  }

  .hero-action-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .hero-action-row .btn {
    width: 100% !important;
    justify-content: center !important;
  }
}


/* Button hover and click effects */
.btn,
a.btn,
button.btn,
.hero-action-row .btn,
.button-row .btn {
  transition:
    background-color .16s ease,
    color .16s ease,
    border-color .16s ease,
    box-shadow .16s ease,
    transform .08s ease,
    filter .16s ease !important;
}

.btn:hover,
a.btn:hover,
button.btn:hover,
.hero-action-row .btn:hover,
.button-row .btn:hover {
  background: #0a9a49 !important;
  border-color: #0a9a49 !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(8, 125, 59, .28) !important;
  transform: translateY(-1px);
  filter: brightness(1.03);
}

.btn.secondary:hover,
a.btn.secondary:hover,
button.btn.secondary:hover,
.hero-action-row .btn.secondary:hover,
.button-row .btn.secondary:hover {
  background: #087d3b !important;
  border-color: #087d3b !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(8, 125, 59, .24) !important;
}

.btn.danger:hover,
a.btn.danger:hover,
button.btn.danger:hover {
  background: #d92d20 !important;
  border-color: #d92d20 !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(180, 35, 24, .28) !important;
}

.btn:active,
a.btn:active,
button.btn:active,
.hero-action-row .btn:active,
.button-row .btn:active {
  transform: translateY(1px) scale(.985);
  box-shadow: 0 3px 10px rgba(16, 24, 40, .18) !important;
  filter: brightness(.94);
}

.btn:focus-visible,
a.btn:focus-visible,
button.btn:focus-visible,
.hero-action-row .btn:focus-visible,
.button-row .btn:focus-visible {
  outline: 3px solid rgba(8, 125, 59, .28);
  outline-offset: 3px;
}

.index-auth-btn:hover,
.top-auth-btn:hover,
.visible-auth-link:hover,
.fixed-auth-button:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
}

.index-auth-btn:active,
.top-auth-btn:active,
.visible-auth-link:active,
.fixed-auth-button:active {
  transform: translateY(1px) scale(.985);
  filter: brightness(.94);
}

.nav a:hover,
.tk-nav a:hover {
  background: #eaf7ee !important;
  color: #065f2d !important;
}

.nav a:active,
.tk-nav a:active {
  transform: translateY(1px) scale(.985);
}


/* Mobile header and auth button layout fix */
.brand-row {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  min-width: 0 !important;
}

.brand-row > div:last-child {
  min-width: 0 !important;
}

.brand-logo-link,
.brand-logo {
  flex-shrink: 0 !important;
}

.brand-logo {
  width: 64px !important;
  height: 64px !important;
  object-fit: contain;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none;
}

@media(max-width:760px) {
  .header-inner-auth-final {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  .brand-row {
    width: 100% !important;
    align-items: center !important;
  }

  .brand-row .logo {
    font-size: 28px !important;
    line-height: 1.05 !important;
    margin-bottom: 6px !important;
  }

  .brand-row .tagline {
    font-size: 12px !important;
    line-height: 1.3 !important;
    letter-spacing: .14em !important;
    white-space: normal !important;
    word-break: normal !important;
  }

  .top-auth-buttons {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-left: 0 !important;
  }

  .top-auth-btn {
    width: 100% !important;
    min-width: 0 !important;
    padding: 10px 14px !important;
    font-size: 16px !important;
  }
}

@media(max-width:520px) {
  .header {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .header-inner-auth-final {
    gap: 10px !important;
  }

  .brand-row {
    gap: 12px !important;
  }

  .brand-logo {
    width: 58px !important;
    height: auto !important;
  }

  .brand-row .logo {
    font-size: 24px !important;
  }

  .brand-row .tagline {
    font-size: 11px !important;
    letter-spacing: .12em !important;
  }

  .top-auth-buttons {
    grid-template-columns: 1fr 1fr !important;
  }

  .top-auth-btn {
    min-height: 42px !important;
    border-radius: 16px !important;
    font-size: 15px !important;
    padding: 10px 12px !important;
  }
}


/* Mobile visible auth row final fix */
@media(max-width:760px) {
  /*
    Mobile still needs visible Login/Register because browser bottom bars can hide
    the bottom navigation. Keep auth visible, but place it below the logo row.
  */
  .top-auth-buttons,
  .index-auth-buttons {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 10px 0 0 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    z-index: 2 !important;
  }

  .header-account-actions,
  .visible-auth-links {
    display: none !important;
  }

  .header-inner-auth-final,
  .header-inner:has(.index-auth-buttons) {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .brand-row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .brand-row > a,
  .brand-row > div:not(.top-auth-buttons):not(.index-auth-buttons) {
    flex: 0 1 auto !important;
  }

  .brand-logo {
    width: 58px !important;
    max-width: 58px !important;
    flex: 0 0 58px !important;
  }

  .brand-row .logo {
    font-size: 26px !important;
    line-height: 1.05 !important;
    letter-spacing: -.5px !important;
  }

  .brand-row .tagline {
    font-size: 11px !important;
    line-height: 1.35 !important;
    letter-spacing: .12em !important;
    white-space: normal !important;
    max-width: 245px !important;
  }

  .top-auth-btn,
  .index-auth-btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 38px !important;
    padding: 8px 10px !important;
    border-radius: 14px !important;
    font-size: 14px !important;
    box-shadow: 0 4px 12px rgba(16,24,40,.10) !important;
  }
}

@media(max-width:390px) {
  .brand-logo {
    width: 52px !important;
    max-width: 52px !important;
    flex-basis: 52px !important;
  }

  .brand-row .logo {
    font-size: 24px !important;
  }

  .brand-row .tagline {
    font-size: 10px !important;
    letter-spacing: .10em !important;
    max-width: 220px !important;
  }

  .top-auth-btn,
  .index-auth-btn {
    font-size: 13px !important;
    min-height: 36px !important;
    padding: 8px 9px !important;
  }
}


/* Homepage hero category action buttons */
.hero-action-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}

.hero-action-row .btn {
  margin: 0 !important;
  white-space: nowrap !important;
}

@media(max-width:700px) {
  .hero-action-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .hero-action-row .btn {
    width: 100% !important;
    justify-content: center !important;
  }
}


/* TokMaket homepage hero image */
.tokmaket-selected-hero,
.hero.tokmaket-selected-hero,
.hero.hero-with-logo.tokmaket-selected-hero {
  background-image:
    linear-gradient(90deg, rgba(2, 10, 8, .56), rgba(2, 10, 8, .16)),
    url("assets/images/tokmaket-hero-selected-1920.webp") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

@media(max-width:900px) {
  .tokmaket-selected-hero,
  .hero.tokmaket-selected-hero,
  .hero.hero-with-logo.tokmaket-selected-hero {
    background-image:
      linear-gradient(180deg, rgba(2, 10, 8, .38), rgba(2, 10, 8, .64)),
      url("assets/images/tokmaket-hero-selected-1280.webp") !important;
    background-position: center center !important;
  }
}

@media(max-width:540px) {
  .tokmaket-selected-hero,
  .hero.tokmaket-selected-hero,
  .hero.hero-with-logo.tokmaket-selected-hero {
    background-image:
      linear-gradient(180deg, rgba(2, 10, 8, .34), rgba(2, 10, 8, .68)),
      url("assets/images/tokmaket-hero-selected-768.webp") !important;
    background-position: center center !important;
  }
}
/* Trust and verification badges */
.trust-badges {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  vertical-align: middle;
  margin: 4px 0;
}

.trust-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 5px 8px;
  border-radius: 999px;
  background: #e8f6ef;
  color: #075b36;
  border: 1px solid #b8dfca;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  white-space: normal;
}

.trust-badge span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #087333;
  color: #fff;
  font-size: 11px;
  line-height: 1;
}

.trust-badges-empty {
  color: var(--muted);
  font-size: 13px;
}

.verification-checkboxes label {
  align-items: flex-start;
}

.verification-checkboxes small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  margin-top: 3px;
}

.trust-education {
  margin-top: 14px;
}

.admin-empty-notice {
  margin-top: 18px;
}

.inline-form .admin-delete-button {
  border-color: #b42318;
  background: #fff1f0;
  color: #912018;
}

.backload-badge {
  background: #e8f1ff;
  color: #174ea6;
}

.backload-hero {
  background-image:
    linear-gradient(90deg, rgba(2, 10, 8, .62), rgba(2, 10, 8, .18)),
    url("assets/images/tokmaket-hero-selected-1920.webp") !important;
}

.bring-town-hero {
  background-image:
    linear-gradient(90deg, rgba(2, 10, 8, .66), rgba(2, 10, 8, .2)),
    url("assets/tokmaket-hero.png") !important;
}

.bring-town-badge {
  background: #eef2ff;
  color: #3730a3;
}

.inline-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: auto;
}

.inline-checkbox input[type="checkbox"] {
  width: auto;
  flex: 0 0 auto;
}

.offer-panel {
  margin: 20px 0;
  padding: 18px;
  border: 1px solid #d8eadf;
  border-radius: 18px;
  background: #f5fbf7;
}

.offer-panel h2 {
  margin-top: 0;
}

.offer-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0 14px;
}

.offer-grid label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-height: 58px;
  margin: 0;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.offer-grid input[type="radio"] {
  width: auto;
  flex: 0 0 auto;
  margin-top: 2px;
}

.offer-grid span {
  font-weight: 900;
  line-height: 1.25;
}

.group-buy-hero {
  background-image:
    linear-gradient(90deg, rgba(2, 10, 8, .66), rgba(2, 10, 8, .2)),
    url("assets/tokmaket-hero.png") !important;
}

.group-buy-search-box {
  grid-template-columns: minmax(260px, 2fr) minmax(180px, 1fr) minmax(180px, 1fr) minmax(180px, 1fr) auto;
}

.group-buy-card .price,
.group-buy-detail .price {
  color: var(--green-dark);
  font-size: 18px;
  margin: 8px 0;
}

.group-buy-progress {
  margin: 14px 0;
}

.group-buy-progress.large {
  margin: 22px 0;
}

.group-buy-progress-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  color: var(--ink);
  font-size: 14px;
}

.progress-track {
  height: 11px;
  overflow: hidden;
  border-radius: 999px;
  background: #e2e8f0;
  margin-top: 8px;
}

.progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), #f5b544);
}

.group-buy-pledge-card textarea {
  min-height: 96px;
}

@media(max-width:700px) {
  .offer-grid {
    grid-template-columns: 1fr;
  }

  .group-buy-search-box {
    grid-template-columns: 1fr;
  }

  .group-buy-progress-row {
    align-items: flex-start;
    flex-direction: column;
  }
}
.hero-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;margin:0 0 22px;box-shadow:var(--shadow)}
.hero-card h1{margin-top:0}
.cards-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:16px 0 24px}
.listing-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:0 8px 25px rgba(16,24,40,.06)}
.listing-card h3{margin-top:0}

/* Keep pale warning panels readable when placed inside image heroes. */
.hero .notice {
  color: #102016;
  background: #fff7df;
  border-color: #f4d48a;
  text-shadow: none;
}

.hero .notice strong {
  color: #102016;
}

.share-actions {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 14px;
}

.facebook-share-btn {
  background: #1877f2 !important;
  border-color: #1877f2 !important;
  box-shadow: 0 8px 18px rgba(24, 119, 242, .18) !important;
}

.facebook-share-btn:hover {
  background: #0f5fca !important;
  border-color: #0f5fca !important;
}

@media(max-width:700px) {
  .share-actions {
    justify-content: stretch;
  }

  .share-actions .btn {
    width: 100%;
  }
}
.search-grid{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:12px;align-items:end}
.search-grid p{margin:0}
@media(max-width:900px){.cards-grid{grid-template-columns:1fr 1fr}.search-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.cards-grid,.search-grid{grid-template-columns:1fr}}
.captcha-box {
  margin: 18px 0;
  min-height: 86px;
}

.captcha-box-local {
  min-height: 0;
}

.cf-turnstile,
.g-recaptcha,
.h-captcha {
  display: block;
  min-height: 65px;
  margin-top: 8px;
}

.captcha-status {
  margin-top: 6px;
}

.adsense-slot {
  clear: both;
  display: block;
  margin: 28px 0;
  min-height: 0;
  overflow: hidden;
}

.adsense-slot-footer {
  margin-top: 36px;
}

.adsense-slot-home-footer {
  margin: 28px 0 18px;
}

/* Homepage sidebar compaction */
.homepage-quick-links .compact-list {
  gap: 0;
}

.homepage-quick-links .compact-item {
  padding: 8px 0;
}

.homepage-quick-links .compact-item .meta {
  display: none;
}

.dictionary-translate-form {
  display: grid;
  gap: 12px;
}

.dictionary-result {
  margin-top: 16px;
}

.dictionary-result p {
  margin: 8px 0 0;
  font-size: 20px;
  font-weight: 900;
}

.dictionary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.dictionary-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f8faf9;
}

.dictionary-card h3 {
  margin: 0 0 8px;
}

.dictionary-word {
  color: var(--green-dark);
  font-size: 24px;
  font-weight: 900;
}

.dictionary-card p {
  color: var(--muted);
  line-height: 1.45;
  margin-bottom: 0;
}

@media(max-width:900px) {
  .dictionary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:620px) {
  .dictionary-grid {
    grid-template-columns: 1fr;
  }
}

/* Final mobile overflow guard */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

img,
video,
iframe {
  max-width: 100%;
}

.container,
.form-card,
.side-panel,
.card,
.hero,
.quick-sections-panel,
.feature-layout,
.cartoon-panel,
.cartoon-feature,
.cartoon-directory-card {
  max-width: 100%;
}

.cartoon-image-wrap,
.cartoon-directory-image {
  width: 100%;
  max-width: 100%;
}

.cartoon-image,
.cartoon-directory-image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* Force homepage cartoon images to stay inside their card on every viewport. */
.cartoon-image-wrap {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  overflow: hidden !important;
}

.cartoon-image-wrap .cartoon-image,
.cartoon-image-wrap > img {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}

@media(max-width:700px) {
  .container {
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
    overflow-x: hidden;
  }

  .section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .feature-layout,
  .quick-sections-grid,
  .grid,
  .cards-grid,
  .photo-grid,
  .gps-row,
  .search-box,
  .search-grid,
  .seo-services-grid,
  .recipe-photo-grid {
    grid-template-columns: 1fr !important;
  }

  .form-card,
  .side-panel,
  .quick-sections-panel,
  .cartoon-panel,
  .cartoon-feature,
  .hero {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    overflow-x: hidden;
  }

  .cartoon-panel {
    padding: 14px;
  }

  .category-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px;
    padding: 10px;
  }

  .category-tile {
    min-height: 78px;
    padding: 10px 8px;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 5px;
  }

  .category-icon {
    margin-bottom: 0;
  }

  .quick-section-card {
    min-height: 0;
    padding: 12px 14px;
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
  }

  .quick-section-icon {
    margin-bottom: 0;
    font-size: 24px;
    text-align: center;
  }

  .quick-section-title {
    margin-bottom: 0;
    font-size: 16px;
  }

  .quick-section-sub {
    display: none;
  }

  .quick-section-count {
    position: static !important;
    justify-self: end;
  }

  .cartoon-feature .cartoon-image-wrap,
  .cartoon-directory-image {
    width: 100% !important;
    max-width: min(100%, 340px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .cartoon-image-wrap {
    aspect-ratio: auto !important;
  }

  .cartoon-image,
  .cartoon-directory-image img {
    height: auto !important;
  }

  .cartoon-rating-row,
  .cartoon-vote-row,
  .cartoon-share-row,
  .button-row {
    max-width: 100%;
  }

  .button-row .btn,
  .cartoon-share-row .btn {
    white-space: normal;
  }
}

@media(max-width:380px) {
  .cartoon-feature .cartoon-image-wrap,
  .cartoon-directory-image {
    max-width: min(100%, 300px) !important;
  }
}