/*
Theme Name: Konsultan Perizinan Medan
Theme URI: https://konsultanperizinanmedan.com
Author: Marketoopia Team
Author URI: https://marketoopia.com
Description: Custom, high-performance, Elementor-compatible WordPress theme developed by Marketoopia Team for Konsultan Perizinan Medan. Features signature header with vibrant lime accents, deep forest green surfaces, responsive layouts, fail-safe logo scaling, and 100% editable contact details via WP Customizer.
Version: 1.0.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: konsultan-perizinan-medan
Tags: custom-header, custom-menu, custom-logo, theme-options, elementor-ready, responsive-layout, footer-widgets, translation-ready
*/

/* Enqueue main theme design system */
@import url('assets/css/theme.css');

/* ==========================================================================
   MEDAN DESIGN SYSTEM TOKENS (100% MATCH WITH REACT APP)
   Defined with sRGB HEX fallbacks alongside modern OKLCH color definitions
   ========================================================================== */

:root {
  /* Primary Lime Accent */
  --primary: #9be42f;
  --primary: oklch(0.84 0.205 130);
  --primary-hover: #88ce23;
  --primary-hover: oklch(0.78 0.20 130);
  --primary-foreground: #082119;
  --primary-foreground: oklch(0.18 0.052 164);

  /* Deep Forest Green Surfaces */
  --deep: #0a261e;
  --deep: oklch(0.205 0.055 167);
  --deep-soft: #133b30;
  --deep-soft: oklch(0.27 0.06 166);
  --on-deep: #f4f7f2;
  --on-deep: oklch(0.97 0.012 105);

  /* Neutral Background & Canvas Surfaces */
  --background: #faf9f7;
  --background: oklch(0.99 0.004 95);
  --foreground: #0f2820;
  --foreground: oklch(0.205 0.045 166);
  --card: #ffffff;
  --card-foreground: #0f2820;
  --card-foreground: oklch(0.205 0.045 166);

  /* Secondary Soft Tones */
  --secondary: #eef4e8;
  --secondary: oklch(0.935 0.027 110);
  --secondary-foreground: #0f2820;
  --secondary-foreground: oklch(0.205 0.045 166);

  /* Muted Text & Borders */
  --muted: #f1f4ee;
  --muted: oklch(0.955 0.012 110);
  --muted-foreground: #546a60;
  --muted-foreground: oklch(0.42 0.035 160);

  /* Accent Lime */
  --accent: #9be42f;
  --accent: oklch(0.84 0.205 130);
  --accent-foreground: #082119;
  --accent-foreground: oklch(0.18 0.052 164);

  /* Lines, Inputs & Borders */
  --border: #dbe3d8;
  --border: oklch(0.875 0.02 105);
  --input: #dbe3d8;
  --ring: #9be42f;

  /* Accent Warm & Gold */
  --warm: #f7f5f0;
  --warm: oklch(0.982 0.008 95);
  --gold: #eab308;
  --gold: oklch(0.76 0.15 78);
  --whatsapp: #25d366;
}

/* ==========================================================================
   FAILSAFE LOGO & NAVBAR CONSTRAINTS
   Guarantees that uploaded logos never exceed standard navbar height
   ========================================================================== */

.medan-navbar-main {
  display: flex !important;
  align-items: center !important;
  min-height: 58px !important;
  max-height: 72px !important;
}

.medan-brand .custom-logo-link,
.medan-header-wrapper .custom-logo-link,
.custom-logo-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 0 !important;
  max-height: 44px !important;
}

.medan-header-wrapper .custom-logo,
.medan-brand .custom-logo,
.medan-brand img,
.medan-brand-logo,
.medan-navbar-main img.custom-logo,
.medan-brand a img {
  height: 40px !important;
  width: auto !important;
  max-height: 40px !important;
  max-width: 220px !important;
  object-fit: contain !important;
  display: block !important;
  flex-shrink: 0 !important;
}

.medan-footer-logo-badge img,
.medan-footer-logo-badge .custom-logo {
  max-height: 38px !important;
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}

@media (max-width: 768px) {
  .medan-navbar-main {
    min-height: 52px !important;
    max-height: 60px !important;
  }

  .medan-header-wrapper .custom-logo,
  .medan-brand .custom-logo,
  .medan-brand img,
  .medan-brand-logo,
  .medan-navbar-main img.custom-logo {
    height: 32px !important;
    max-height: 32px !important;
    max-width: 160px !important;
  }
}