/* KRAZYFI MOBILE FOUNDATION V1
   Loaded after legacy CSS. Stabilizes shared public/admin layouts without changing PHP data logic. */
:root{--kmf-header-h:72px;--kmf-gutter:clamp(12px,3.5vw,24px);--kmf-touch:44px;--kmf-player-space:92px}
*,*::before,*::after{box-sizing:border-box}
html{width:100%;max-width:100%;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{width:100%;max-width:100%;overflow-x:hidden}
img,picture,video,canvas,svg,iframe{max-width:100%}
img,picture,video,canvas,svg{height:auto}
iframe{border:0}
pre,code{max-width:100%;overflow-wrap:anywhere}
input,select,textarea,button{font:inherit}
input,select,textarea{min-width:0}
button,a,[role="button"]{-webkit-tap-highlight-color:transparent}
.wrap,.container,.container-fluid,.page,.page-content,.main-content,.content,.dashboard-wrap{min-width:0;max-width:100%}
.kmf-mobile-toggle,.kmf-nav-backdrop{display:none}
.kmf-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.table-responsive,.kmf-table-scroll{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.card,.panel,.box,.modal-content,.popup-content{min-width:0;max-width:100%}

@media (max-width:900px){
  :root{--kmf-header-h:64px;--kmf-player-space:88px}
  body{padding-bottom:env(safe-area-inset-bottom,0)}
  body.kmf-nav-open{overflow:hidden;touch-action:none}
  .top{position:sticky!important;top:0!important;z-index:10020!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;width:100%!important;min-height:var(--kmf-header-h)!important;padding:10px var(--kmf-gutter)!important;background:rgba(8,9,14,.96)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.09)}
  .top .brand{min-width:0!important;max-width:calc(100% - 58px)!important;display:inline-flex!important;align-items:center!important;gap:9px!important;z-index:2}
  .top .brand>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .top .brand-img{max-height:40px!important;width:auto!important;object-fit:contain!important}
  .kmf-mobile-toggle{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 var(--kmf-touch);width:var(--kmf-touch);height:var(--kmf-touch);border:1px solid rgba(255,255,255,.12);border-radius:13px;background:rgba(255,255,255,.06);color:inherit;cursor:pointer;z-index:10023}
  .kmf-mobile-toggle span,.kmf-mobile-toggle::before,.kmf-mobile-toggle::after{content:"";display:block;position:absolute;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .22s ease,opacity .22s ease}
  .kmf-mobile-toggle::before{transform:translateY(-6px)}
  .kmf-mobile-toggle::after{transform:translateY(6px)}
  body.kmf-nav-open .kmf-mobile-toggle span{opacity:0}
  body.kmf-nav-open .kmf-mobile-toggle::before{transform:rotate(45deg)}
  body.kmf-nav-open .kmf-mobile-toggle::after{transform:rotate(-45deg)}
  .top .kf-main-nav{position:fixed!important;inset:0 0 0 auto!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:5px!important;width:min(88vw,360px)!important;height:100dvh!important;padding:calc(var(--kmf-header-h) + 18px) 16px calc(24px + env(safe-area-inset-bottom,0))!important;background:linear-gradient(180deg,#11131b,#090a0f)!important;border-left:1px solid rgba(255,255,255,.10)!important;box-shadow:-24px 0 70px rgba(0,0,0,.55)!important;overflow-y:auto!important;overscroll-behavior:contain;transform:translateX(105%);visibility:hidden;transition:transform .24s ease,visibility .24s ease;z-index:10021!important}
  body.kmf-nav-open .top .kf-main-nav{transform:translateX(0);visibility:visible}
  .kmf-nav-backdrop{position:fixed;inset:0;display:block;background:rgba(0,0,0,.62);opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s ease;z-index:10019}
  body.kmf-nav-open .kmf-nav-backdrop{opacity:1;visibility:visible}
  .top .kf-main-nav>a,.top .kf-main-nav>.kf-nav-dd,.top .kf-main-nav .kf-nav-dd-btn{width:100%!important;min-height:var(--kmf-touch)!important}
  .top .kf-main-nav>a,.top .kf-main-nav .kf-nav-dd-btn{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:12px 13px!important;border-radius:12px!important;text-decoration:none!important}
  .top .kf-main-nav>a:hover,.top .kf-main-nav .kf-nav-dd-btn:hover,.top .kf-main-nav>a:focus-visible,.top .kf-main-nav .kf-nav-dd-btn:focus-visible{background:rgba(255,255,255,.08)!important}
  .top .kf-nav-dd{display:block!important;position:relative!important}
  .top .kf-nav-dd-menu{position:static!important;inset:auto!important;display:none!important;width:100%!important;min-width:0!important;margin:4px 0 8px!important;padding:5px!important;border-radius:13px!important;box-shadow:none!important;background:rgba(255,255,255,.035)!important}
  .top .kf-nav-dd.kmf-expanded>.kf-nav-dd-menu{display:grid!important;gap:3px!important}
  .top .kf-nav-dd:hover>.kf-nav-dd-menu{display:none!important}
  .top .kf-nav-dd.kmf-expanded:hover>.kf-nav-dd-menu{display:grid!important}
  .top .kf-nav-dd-menu a{white-space:normal!important;min-height:42px!important;padding:10px 12px!important}
  .krazyfi-global-search-wrap,.top-ad,.krazyfi-live-ad-top,.krazyfi-live-ad-footer,.addon-top-ads{max-width:100%!important;padding-left:var(--kmf-gutter)!important;padding-right:var(--kmf-gutter)!important}
  .krazyfi-global-search,.krazyfi-global-search input{width:100%!important;max-width:100%!important;min-width:0!important}
  .wrap,.container,.container-fluid,.page,.page-content,.main-content,.content,.dashboard-wrap{width:100%!important;max-width:100%!important;margin-left:auto!important;margin-right:auto!important;padding-left:var(--kmf-gutter)!important;padding-right:var(--kmf-gutter)!important}
  .row,.grid,.cards-grid,.artist-grid,.event-grid,.service-grid,.dashboard-grid,.profile-layout,.epk-layout,.song-layout,.service-detail,.event-detail,.two-column,.three-column{min-width:0!important;max-width:100%!important}
  .two-column,.three-column,.dashboard-grid,.profile-layout,.epk-layout,.song-layout,.service-detail,.event-detail{grid-template-columns:minmax(0,1fr)!important}
  .sidebar,.left-sidebar,.right-sidebar,.desktop-sidebar{max-width:100%}
  h1{font-size:clamp(1.75rem,7.5vw,2.5rem)!important;line-height:1.08!important;overflow-wrap:anywhere}
  h2{font-size:clamp(1.35rem,5.6vw,2rem)!important;line-height:1.15!important;overflow-wrap:anywhere}
  h3{overflow-wrap:anywhere}
  p,li,td,th,label,.muted{overflow-wrap:anywhere}
  .btn,button,input[type="button"],input[type="submit"],input[type="reset"],[role="button"]{min-height:var(--kmf-touch)}
  input:not([type="checkbox"]):not([type="radio"]),select,textarea{width:100%;max-width:100%;min-height:46px;font-size:16px!important}
  textarea{min-height:120px}
  .form-row,.form-grid,.checkout-grid,.filters,.filter-grid{grid-template-columns:minmax(0,1fr)!important}
  table{width:max-content;min-width:100%;border-collapse:collapse}
  table input,table select{min-width:140px}
  .modal,.popup,.dialog-overlay{padding:12px!important}
  .modal-content,.popup-content,[role="dialog"]{width:min(100%,680px)!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;margin:auto!important}
  .tabs,.nav-tabs,.category-nav,.kepk-site-nav{display:flex!important;flex-wrap:nowrap!important;max-width:100%!important;overflow-x:auto!important;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tabs::-webkit-scrollbar,.nav-tabs::-webkit-scrollbar,.category-nav::-webkit-scrollbar,.kepk-site-nav::-webkit-scrollbar{display:none}
  .tabs>*,.nav-tabs>*,.category-nav>*,.kepk-site-nav>*{flex:0 0 auto!important;scroll-snap-align:start}
  .music-player,.audio-player,.player-footer,.persistent-player,.kf-player{max-width:100vw!important}
  body:has(.music-player),body:has(.audio-player),body:has(.player-footer),body:has(.persistent-player),body:has(.kf-player){padding-bottom:calc(var(--kmf-player-space) + env(safe-area-inset-bottom,0))!important}
  .ku-footer{padding-left:var(--kmf-gutter)!important;padding-right:var(--kmf-gutter)!important}
}

@media (max-width:640px){
  :root{--kmf-gutter:12px}
  .cards-grid,.artist-grid,.event-grid,.service-grid,.music-grid,.grid3,.grid4{grid-template-columns:minmax(0,1fr)!important}
  .button-row,.actions,.kepk-actions,.form-actions{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:9px!important}
  .button-row>.btn,.actions>.btn,.kepk-actions>.btn,.form-actions>.btn{width:100%!important;justify-content:center!important}
  .card,.panel,.box{border-radius:16px!important}
  .hide-on-mobile,.desktop-only{display:none!important}
}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}