/*
Theme Name: Lanal Banyuwangi
Theme URI: https://lanal-banyuwangi.mil.id
Author: Pangkalan TNI Angkatan Laut Banyuwangi
Author URI: https://lanal-banyuwangi.mil.id
Description: Tema resmi Pangkalan TNI Angkatan Laut (Lanal) Banyuwangi versi 2.3.0. Menampilkan antarmuka modern yang dapat disesuaikan lewat Editor Berkas Tema (header.php, footer.php) maupun menu Tampilan -> Sesuaikan (Customizer). Dilengkapi fitur Visi Misi, Sapta Marga, Doktrin, Sistem Pelaporan Operasi (Sipelop), Radar & Dashboard Danlanal, Layanan PPID, dan Lanal TV.
Version: 2.3.0
Requires at least: 5.8
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lanal-banyuwangi
Tags: military, navy, maritime, two-columns, full-width-template, custom-header, custom-menu, custom-logo, translation-ready
*/

:root {
  --bg-dark: #060c1d;
  --bg-card: #0a1532;
  --bg-header: #081226;
  --gold-primary: #f59e0b;
  --gold-hover: #d97706;
  --cyan-accent: #06b6d4;
  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --border-color: #1e3a8a;
}

html, body {
  margin: 0;
  padding: 0;
  background-color: var(--bg-dark);
  color: var(--text-main);
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  min-height: 100vh;
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
}

#root {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
}

/* Hindari gambar meluap ke luar lebar layar HP */
img, svg, video {
  max-width: 100%;
}

/* Reset gaya default WordPress agar tidak menggeser atau menumpuk teks header/elemen */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
  box-sizing: border-box !important;
  -webkit-text-size-adjust: 100% !important;
}

#root {
  min-height: 100vh !important;
  max-width: 100vw !important;
  width: 100% !important;
  overflow-x: hidden !important;
}

#root * {
  box-sizing: border-box !important;
}

#root h1, #root h2, #root h3, #root h4, #root p, #root ul, #root ol {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Sembunyikan semua editor & download dari pengunjung website */
.lanal-visitor-mode .lanal-admin-only,
.lanal-visitor-mode .lanal-editor-trigger,
.lanal-visitor-mode .lanal-download-trigger,
.lanal-visitor-mode #header-btn-live-editor,
.lanal-visitor-mode #header-btn-download-theme,
.lanal-visitor-mode #header-btn-toggle-admin,
.lanal-visitor-mode #header-btn-toggle-visitor,
.lanal-visitor-mode .floating-live-editor-btn,
.lanal-visitor-mode .wp-plugin-showcase-section,
.lanal-visitor-mode .elementor-builder-quick-btn {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ==========================================================================
   KUSTOMISASI UKURAN FOTO DANLANAL (KOMANDAN) DI HALAMAN BERANDA
   (Edit di sini lewat WordPress: Tampilan -> Editor Berkas Tema -> style.css)
   ========================================================================== */

/* Frame bingkai foto Danlanal Beranda */
.danlanal-portrait-frame,
div.danlanal-portrait-frame,
div:has(> .danlanal-portrait-img) {
  aspect-ratio: 4 / 5 !important; /* Ganti ke 4/5 (Resmi TNI AL), 3/4, atau 1/1 */
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 0.75rem !important;
  overflow: hidden !important;
}

/* Gambar foto Danlanal Beranda */
.danlanal-portrait-img,
div.danlanal-portrait-frame img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important; /* Fokus kepala & pet perwira */
}

/* Foto Riwayat Komandan Dari Masa Ke Masa (Profil) - Proporsional & Rapi di sebelah kiri teks */
.danlanal-history-thumb,
div.danlanal-history-thumb {
  width: 100px !important;
  min-width: 100px !important;
  max-width: 100px !important;
  height: 125px !important;
  min-height: 125px !important;
  max-height: 125px !important;
  aspect-ratio: 4 / 5 !important;
  flex-shrink: 0 !important;
  border-radius: 0.75rem !important;
  overflow: hidden !important;
}

@media (min-width: 640px) {
  .danlanal-history-thumb,
  div.danlanal-history-thumb {
    width: 110px !important;
    min-width: 110px !important;
    max-width: 110px !important;
    height: 138px !important;
    min-height: 138px !important;
    max-height: 138px !important;
  }
}