/* Logo Kabupaten Cirebon di Header - Mobile & Desktop */

/* Samakan ukuran dan posisi logo kiri (JDIH) */
.navbar-header .navbar-brand.logo {
  padding: 8px 0 8px 10px !important;
}

.navbar-brand.logo img {
  height: 50px;
  width: auto;
}

.navbar-brand.logo-right {
  position: absolute;
  right: 65px;
  top: 8px;
  padding: 0;
  margin: 0;
  transition: none !important;
}

.navbar-brand.logo-right img {
  height: 50px;
  width: auto;
}

/* Tablet/iPad - ukuran logo lebih besar */
@media (min-width: 768px) and (max-width: 1024px) {
  .navbar-brand.logo-right {
    display: none;
  }

  /* Logo kiri - sesuaikan padding untuk sejajar */
  .navbar-header .navbar-brand.logo {
    padding: 10px 0 10px 10px !important;
  }

  .navbar-brand.logo img {
    height: 65px !important;
  }

  /* Logo kanan - perbesar untuk tablet dan sejajarkan */
  .float-right {
    display: block !important;
    padding-top: 10px; /* Sama dengan logo kiri */
    padding-bottom: 10px;
  }

  .float-right img {
    height: 65px !important;
    width: auto;
    display: block;
  }

  /* Saat scroll/affix di tablet */
  .navbar-default.affix .navbar-brand.logo {
    padding: 13px 0 13px 10px !important;
  }

  .navbar-default.affix .navbar-brand.logo img,
  .navbar-default.affix .float-right img {
    height: 50px !important;
  }

  .navbar-default.affix .float-right {
    padding-top: 13px;
    padding-bottom: 13px;
  }
}

/* Desktop - hide logo-right karena sudah ada di float-right */
@media (min-width: 1025px) {
  .navbar-brand.logo-right {
    display: none;
  }

  /* Turunkan logo kiri agar sejajar */
  .navbar-header .navbar-brand.logo {
    padding: 19px 0 19px 10px !important;
  }

  /* Samakan ukuran logo desktop kanan dengan logo kiri */
  .float-right img {
    height: 50px;
    width: auto;
    vertical-align: middle;
  }

  .float-right {
    display: flex !important;
    align-items: center;
    height: 100%;
  }
}

/* Mobile - tampilkan logo-right */
@media (max-width: 767px) {
  .navbar-brand.logo-right {
    display: block;
    right: 65px !important;
    top: 8px !important;
  }

  .navbar-brand.logo img,
  .navbar-brand.logo-right img {
    height: 40px;
  }

  .navbar-default.affix .navbar-header .navbar-brand.logo {
    padding: 10px 0 10px 10px !important;
  }

  .navbar-default.affix .navbar-brand.logo img,
  .navbar-default.affix .navbar-brand.logo-right img {
    height: 40px;
  }

  .navbar-default.affix .navbar-brand.logo-right {
    top: 7px !important;
    right: 65px !important;
  }
}

/* Affix state - sama untuk semua logo */
.navbar-default.affix .navbar-header .navbar-brand.logo {
  padding: 10px 0 10px 10px !important;
}

.navbar-default.affix .navbar-brand.logo img,
.navbar-default.affix .navbar-brand.logo-right img,
.navbar-default.affix .float-right img {
  height: 40px;
}

/* Fix posisi logo kanan saat affix agar sejajar */
.navbar-default.affix .navbar-brand.logo-right {
  top: 7px !important;
  right: 65px !important;
}

@media (max-width: 640px) {
  .navbar-header .navbar-brand.logo {
    padding: 12px 0 12px 10px !important;
  }

  .navbar-brand.logo img,
  .navbar-brand.logo-right img {
    height: 35px;
  }

  .navbar-default.affix .navbar-header .navbar-brand.logo {
    padding: 10px 0 10px 10px !important;
  }

  .navbar-default.affix .navbar-brand.logo img,
  .navbar-default.affix .navbar-brand.logo-right img {
    height: 35px;
  }

  .navbar-brand.logo-right {
    top: 12px !important;
    right: 65px !important;
  }

  .navbar-default.affix .navbar-brand.logo-right {
    top: 7px !important;
    right: 65px !important;
  }
}

@media (min-width: 320px) and (max-width: 480px) {
  .navbar-header .navbar-brand.logo {
    padding: 15px 0 15px 10px !important;
  }

  .navbar-brand.logo img,
  .navbar-brand.logo-right img {
    height: 30px;
  }

  .navbar-default.affix .navbar-header .navbar-brand.logo {
    padding: 10px 0 10px 10px !important;
  }

  .navbar-default.affix .navbar-brand.logo img,
  .navbar-default.affix .navbar-brand.logo-right img {
    height: 30px;
  }

  .navbar-brand.logo-right {
    top: 15px !important;
    right: 65px !important;
  }

  .navbar-default.affix .navbar-brand.logo-right {
    top: 7px !important;
    right: 65px !important;
  }
}