/* KAHAVA SIMPLE UI 2.0.0
 * Unified publishing layer for customer, admin and rider screens.
 */
:root{
  --kh-bg:#f5f6f7;
  --kh-surface:#ffffff;
  --kh-surface-soft:#f8f9fa;
  --kh-text:#1f2933;
  --kh-muted:#6b7280;
  --kh-line:#dfe3e7;
  --kh-brand:#255c4c;
  --kh-brand-hover:#1f4c40;
  --kh-brand-soft:#edf5f2;
  --kh-danger:#b4232e;
  --kh-warning:#9a6700;
  --kh-success:#24734f;
  --kh-info:#315f91;
  --kh-radius:8px;
  --kh-radius-sm:6px;
  --kh-control-h:44px;
  --kh-content:1180px;
  --kh-mobile:560px;
  --kh-nav-h:68px;
  --primary:var(--kh-brand);
  --primary-soft:var(--kh-brand-soft);
  --bg:var(--kh-bg);
  --surface:var(--kh-surface);
  --text:var(--kh-text);
  --muted:var(--kh-muted);
  --line:var(--kh-line);
  --success:var(--kh-success);
  --danger:var(--kh-danger);
  --admin-bg:var(--kh-bg);
  --admin-panel:var(--kh-surface);
  --admin-line:var(--kh-line);
  --admin-text:var(--kh-text);
  --admin-muted:var(--kh-muted);
  --admin-brown:var(--kh-brand);
  --admin-dark:#202826;
  --admin-radius:var(--kh-radius);
  --admin-shadow:none;
}

*{box-sizing:border-box}
html{min-width:320px;overflow-x:hidden;color-scheme:light;background:var(--kh-bg)}
body,body.kh-publishing-v2{margin:0!important;min-width:320px;overflow-x:hidden;background:var(--kh-bg)!important;color:var(--kh-text)!important;font-family:Pretendard,"Noto Sans KR",Arial,sans-serif!important;font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,svg,video{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p{margin-top:0;overflow-wrap:anywhere}
h1{font-size:28px;line-height:1.25}h2{font-size:21px;line-height:1.3}h3{font-size:17px;line-height:1.4}
small,.muted,.helper,.text-slate-500{color:var(--kh-muted)!important}

/* Visibility always wins */
[hidden],.hidden,.is-hidden,.u-hidden,.d-none,[data-visible="false"],[aria-hidden="true"]{display:none!important}
.is-invisible{visibility:hidden!important}.is-visible{visibility:visible!important}
.modal:not(.is-open),.dialog:not(.is-open),.drawer:not(.is-open),.bottom-sheet:not(.is-open),[data-modal]:not(.is-open),[data-drawer]:not(.is-open){display:none!important}
.modal.is-open,.dialog.is-open,.drawer.is-open,.bottom-sheet.is-open,[data-modal].is-open,[data-drawer].is-open{display:flex!important}

/* Application shells */
.app,.page-shell,.admin-shell{width:100%!important;min-height:100dvh;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:var(--kh-bg)!important;overflow:visible!important}
.app{max-width:var(--kh-mobile)!important;margin-inline:auto!important;background:var(--kh-surface)!important;padding-bottom:calc(var(--kh-nav-h) + env(safe-area-inset-bottom))!important}
.container,.page-content,main{width:100%;max-width:100%;padding:18px!important}
.wrap{width:min(100%,var(--kh-content));margin-inline:auto;padding-inline:18px}

/* Headers */
.header,.topbar,.admin-header,.kh-ui-appbar{display:flex!important;align-items:center!important;gap:12px!important;min-height:58px!important;padding:0 18px!important;background:var(--kh-surface)!important;border-bottom:1px solid var(--kh-line)!important;box-shadow:none!important;backdrop-filter:none!important}
.header__title,.admin-header h1{margin:0!important;font-size:18px!important;font-weight:700!important}
.brand{padding:34px 20px 24px!important;text-align:center;background:var(--kh-surface)!important}
.brand__mark{display:grid!important;place-items:center!important;width:42px;height:42px;margin:0 auto 10px!important;color:var(--kh-text)}
.brand small{display:block;margin-bottom:4px;font-size:12px;letter-spacing:.18em;color:var(--kh-muted)}
.brand__name{margin:0!important;font-size:26px!important;letter-spacing:-.03em;font-weight:700!important}
.brand__sub{margin:8px 0 20px!important;color:var(--kh-muted)!important;font-size:15px;line-height:1.65}

/* Buttons */
button,.btn,.kh-button,.admin-btn,[role="button"]{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px;min-height:var(--kh-control-h)!important;max-width:100%;padding:0 15px!important;border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius-sm)!important;background:var(--kh-surface)!important;color:var(--kh-text)!important;font-weight:650!important;line-height:1.2!important;text-align:center;text-decoration:none;white-space:normal;box-shadow:none!important;cursor:pointer;transition:background-color .12s ease,border-color .12s ease,color .12s ease}
button:hover,.btn:hover,.kh-button:hover,.admin-btn:hover{background:var(--kh-surface-soft)!important}
.btn--primary,.kh-button--primary,.admin-btn--primary,.primary,button[type="submit"],input[type="submit"]{background:var(--kh-brand)!important;border-color:var(--kh-brand)!important;color:#fff!important}
.btn--primary:hover,.kh-button--primary:hover,.admin-btn--primary:hover,.primary:hover,button[type="submit"]:hover{background:var(--kh-brand-hover)!important}
.btn--soft,.kh-button--secondary,.secondary{background:var(--kh-brand-soft)!important;border-color:#d7e5e0!important;color:var(--kh-brand)!important}
.btn--danger,.admin-btn--danger,.danger{background:#fff4f4!important;border-color:#efc9cd!important;color:var(--kh-danger)!important}
.btn--full,.w-full{width:100%!important}
button:disabled,.btn:disabled,.admin-btn:disabled,[aria-disabled="true"]{opacity:.45!important;pointer-events:none!important;cursor:not-allowed!important}
.icon-btn,.kahawa-icon-button{width:var(--kh-control-h)!important;min-width:var(--kh-control-h)!important;padding:0!important;border-radius:var(--kh-radius-sm)!important}
.btn-group,.actions,.form-actions,.card-actions,.toolbar,.admin-header__actions,.drawer__actions{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important}

/* Forms */
.field,.field-group{display:grid!important;gap:7px!important;min-width:0}
.field label,.field-group label,label{font-size:13px;font-weight:650;color:#374151}
.input,.textarea,.select,input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),textarea,select,[data-app-ui-select-button],[data-calendar-trigger]{width:100%!important;min-width:0!important;min-height:var(--kh-control-h)!important;padding:10px 12px!important;border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius-sm)!important;background:#fff!important;color:var(--kh-text)!important;box-shadow:none!important;outline:none!important}
textarea{min-height:112px!important;resize:vertical}
.input:focus,input:focus,textarea:focus,select:focus,[data-app-ui-select-button]:focus,[data-calendar-trigger]:focus{border-color:var(--kh-brand)!important;box-shadow:0 0 0 3px rgba(37,92,76,.11)!important}
input[type="checkbox"],input[type="radio"]{accent-color:var(--kh-brand)}
.field-row,.form-grid,.phase12-form{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px!important}
.form-section{padding:18px!important}
.form-title{margin-bottom:14px!important;font-size:18px!important}

/* Panels and cards */
.card,.panel,.info-card,.summary-card,.order-info,.form-section,.notice-card,.kh-card,.kh-ui-card,.admin-panel,.status-card,.metric,.menu-card,.menu-item,.kh-ui-menu-card,.kh-ui-order-card,.kh-ui-rider-job,.kh-ui-filter-panel,.kh-ui-empty,.kh-ui-skeleton-card,.login-card,.radio-card{border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius)!important;background:var(--kh-surface)!important;box-shadow:none!important}
.card,.panel,.kh-card,.kh-ui-card,.admin-panel__body,.login-card{padding:18px!important}
.card+.card,.panel+.panel,.admin-panel+.admin-panel,.form-section+.form-section{margin-top:12px}
.admin-panel__head,.panel__head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;min-height:52px;padding:12px 18px!important;border-bottom:1px solid var(--kh-line)!important;background:#fff!important}
.admin-panel__head h2,.admin-panel__head h3{margin:0!important;font-size:16px!important}
.section{margin-top:26px!important}.section__head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:12px!important}.section__title{margin:0!important;font-size:17px!important;font-weight:700!important}

/* Customer home */
.order-types{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;width:100%;max-width:430px;margin:0 auto!important}
.order-types .btn{width:100%!important;white-space:nowrap!important}
[data-home-banners]:empty{display:none!important}
.info-card{padding:4px 16px!important;margin:0!important}
.info-row{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;min-height:42px!important;padding:9px 0!important;border-bottom:1px solid var(--kh-line)!important}
.info-row:last-child{border-bottom:0!important}.info-row>span{flex:0 0 auto;color:var(--kh-muted)!important}.info-row>strong{min-width:0;text-align:right;font-weight:700;overflow-wrap:anywhere}
.menu-scroll{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:minmax(155px,42%)!important;gap:10px!important;overflow-x:auto!important;padding:0 0 5px!important;scroll-snap-type:x proximity}
.menu-scroll>*{scroll-snap-align:start}.menu-scroll:empty::before{content:"표시할 메뉴가 없습니다.";display:block;color:var(--kh-muted);font-size:14px;padding:5px 0}
.menu-card{padding:10px!important}.menu-card__image,.menu-item__image,.kh-ui-menu-card img{border-radius:6px!important;object-fit:cover}
.menu-item,.kh-ui-menu-card{display:grid!important;grid-template-columns:76px minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;padding:12px!important}
.kh-ui-menu-card img{width:76px!important;height:76px!important}

/* Navigation */
.bottom-nav{position:fixed!important;left:50%!important;bottom:0!important;z-index:900!important;display:grid!important;grid-auto-flow:column!important;grid-auto-columns:1fr!important;width:min(100%,var(--kh-mobile))!important;height:calc(var(--kh-nav-h) + env(safe-area-inset-bottom))!important;min-height:var(--kh-nav-h)!important;padding:0 6px env(safe-area-inset-bottom)!important;transform:translateX(-50%)!important;background:#fff!important;border-top:1px solid var(--kh-line)!important;box-shadow:none!important;overflow:hidden!important}
.bottom-nav a{display:flex!important;min-width:0!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;padding:7px 2px 5px!important;color:var(--kh-muted)!important;font-size:11px!important;line-height:1.1!important;overflow:hidden!important}
.bottom-nav a.is-active{color:var(--kh-brand)!important;font-weight:700!important}.bottom-nav a>span:last-child{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bottom-nav svg,.bottom-nav [data-material-icon]{width:23px!important;height:23px!important;min-width:23px!important;overflow:hidden!important}
.purchase-bar,.sticky-submit{position:sticky!important;bottom:0!important;padding:12px 16px calc(12px + env(safe-area-inset-bottom))!important;background:#fff!important;border-top:1px solid var(--kh-line)!important;box-shadow:none!important}

/* Segments, tabs, chips */
.tabs,.segment,.kh-segment{display:flex!important;gap:3px!important;padding:3px!important;border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius)!important;background:var(--kh-surface-soft)!important;overflow-x:auto!important}
.tab,.segment button,.kh-segment>*{flex:0 0 auto!important;min-height:38px!important;padding:0 13px!important;border:0!important;border-radius:5px!important;background:transparent!important;color:var(--kh-muted)!important}
.tab.is-active,.segment .is-active,.kh-segment>.is-active{background:#fff!important;color:var(--kh-text)!important;border:1px solid var(--kh-line)!important}
.badge,.status-badge,.kh-badge,.type-chip,.state-chip{display:inline-flex!important;align-items:center!important;min-height:26px;padding:3px 9px!important;border:1px solid var(--kh-line)!important;border-radius:999px!important;background:var(--kh-surface-soft)!important;font-size:12px!important;font-weight:650!important}

/* Tables */
.table-wrap,.table-scroll,.kh-ui-table-shell,.overflow-auto{width:100%;max-width:100%;overflow:auto!important;border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius)!important;background:#fff!important}
table,.admin-table{width:100%!important;min-width:680px!important;border-collapse:collapse!important;background:#fff!important}
th,td,.admin-table th,.admin-table td{padding:11px 12px!important;border-bottom:1px solid var(--kh-line)!important;text-align:left!important;vertical-align:middle!important}
th,.admin-table th{background:var(--kh-surface-soft)!important;color:var(--kh-muted)!important;font-size:12px!important;font-weight:700!important;white-space:nowrap}
tr:last-child td{border-bottom:0!important}

/* Admin */
body.admin-body{background:var(--kh-bg)!important}.admin-layout{display:grid!important;grid-template-columns:230px minmax(0,1fr)!important;min-height:100dvh!important}.admin-sidebar{position:sticky!important;top:0!important;height:100dvh!important;padding:18px 14px!important;background:var(--admin-dark)!important;color:#eef4f1!important;overflow-y:auto!important}.admin-brand{padding:2px 7px 18px!important}.admin-brand__mark{border-radius:6px!important}.admin-nav{display:grid!important;gap:4px!important}.admin-nav a{display:flex!important;align-items:center!important;gap:9px!important;min-height:40px!important;padding:0 11px!important;border-radius:6px!important;color:#cbd6d2!important;font-size:14px!important}.admin-nav a:hover,.admin-nav a.is-active{background:rgba(255,255,255,.1)!important;color:#fff!important}.admin-main{min-width:0!important;background:var(--kh-bg)!important}.admin-header{position:sticky!important;top:0!important;z-index:50!important;justify-content:space-between!important}.admin-content{width:100%!important;max-width:var(--kh-content)!important;margin:0 auto!important;padding:20px!important}.status-grid,.cards,.kh-ui-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px!important}.status-card,.metric{padding:16px!important}.status-card__label{color:var(--kh-muted)!important;font-size:12px!important}.status-card strong,.metric strong{font-size:24px!important}.menu-admin-grid{display:grid!important;grid-template-columns:minmax(0,1fr) 340px!important;gap:16px!important}

/* Rider and map */
.rider-shell,.rider-page{background:var(--kh-bg)!important}.rider-card,.delivery-card,.pickup-card{border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius)!important;background:#fff!important;box-shadow:none!important}.map-card,.map-wrap{overflow:hidden!important;border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius)!important;background:#e9edef!important}

/* Dialogs and feedback */
.kh-ui-overlay,.modal,.dialog,.drawer,.bottom-sheet{position:fixed!important;inset:0!important;z-index:1200!important;align-items:center!important;justify-content:center!important;padding:18px!important;background:rgba(20,29,27,.42)!important;backdrop-filter:none!important}
.kh-ui-dialog,.modal__panel,.dialog__panel,.drawer__panel,.kh-ui-sheet,.bottom-sheet__panel{width:min(100%,520px)!important;max-height:90dvh!important;overflow:auto!important;border:1px solid var(--kh-line)!important;border-radius:10px!important;background:#fff!important;box-shadow:none!important}
.drawer{justify-content:flex-end!important;padding:0!important}.drawer__panel{height:100%!important;max-height:none!important;border-radius:0!important}.bottom-sheet,.kh-ui-overlay:has(.kh-ui-sheet){align-items:flex-end!important;padding:0!important}.kh-ui-sheet,.bottom-sheet__panel{width:min(100%,var(--kh-mobile))!important;border-radius:12px 12px 0 0!important}
.kh-ui-toast,.toast-admin,.toast{border:1px solid var(--kh-line)!important;border-radius:var(--kh-radius-sm)!important;background:#fff!important;color:var(--kh-text)!important;box-shadow:0 8px 24px rgba(31,41,51,.12)!important}
.kh-scrap::after{display:none!important}

/* Tailwind utility neutralization where it caused visual inconsistency */
.shadow,.shadow-sm,.shadow-md,.shadow-lg,.shadow-xl,.shadow-2xl{box-shadow:none!important}.rounded-xl,.rounded-2xl,.rounded-3xl{border-radius:var(--kh-radius)!important}.bg-slate-50,.bg-slate-100{background:var(--kh-surface-soft)!important}.border-slate-200{border-color:var(--kh-line)!important}.text-kahawa-600{color:var(--kh-brand)!important}

@media(max-width:980px){
  .status-grid,.cards,.kh-ui-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .menu-admin-grid{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .container,.page-content,main{padding:14px!important}
  .field-row,.form-grid,.phase12-form{grid-template-columns:1fr!important}
  .btn-group,.actions,.form-actions,.card-actions,.toolbar{align-items:stretch!important}
  .btn-group>.btn,.form-actions>button,.form-actions>.btn{flex:1 1 140px!important}
  .admin-layout{display:block!important}.admin-sidebar{position:relative!important;height:auto!important;padding:12px!important;overflow:visible!important}.admin-brand{padding-bottom:12px!important}.admin-nav{display:flex!important;gap:6px!important;overflow-x:auto!important;padding-bottom:4px!important}.admin-nav a{flex:0 0 auto!important;white-space:nowrap!important;font-size:12px!important}.admin-nav__bottom{display:none!important}.admin-header{min-height:56px!important;padding:0 14px!important}.admin-user{display:none!important}.admin-content{padding:14px!important}.admin-table{min-width:720px!important}.drawer__panel{width:100%!important}.drawer__actions{grid-template-columns:1fr!important}
}
@media(max-width:430px){
  .brand{padding:28px 18px 20px!important}.brand__name{font-size:24px!important}.brand__sub{font-size:14px!important}.order-types{grid-template-columns:1fr!important}.order-types .btn{min-height:46px!important}.status-grid,.cards,.kh-ui-grid{grid-template-columns:1fr!important}.menu-scroll{grid-auto-columns:minmax(150px,72%)!important}.menu-item,.kh-ui-menu-card{grid-template-columns:68px minmax(0,1fr)!important}.menu-item>:last-child,.kh-ui-menu-card>:last-child{grid-column:2!important}.info-row{align-items:flex-start!important}.bottom-nav a{font-size:10px!important}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* PHASE 65 responsive stabilization */
:root{--kh-page-gutter:clamp(12px,3.5vw,24px);--kh-section-gap:clamp(14px,2.5vw,24px)}
html,body{width:100%;max-width:100%}
body{overflow-wrap:anywhere}
main,.page-content,.admin-content,.container,.wrap{min-width:0}
section,.section,.card,.panel,.admin-card,.kh-ui-card{min-width:0}
pre,code{max-width:100%;overflow:auto}
iframe,canvas{max-width:100%}

/* Safer page rhythm */
.container,.page-content,main{padding-inline:var(--kh-page-gutter)!important}
.section+.section,section+section{margin-top:var(--kh-section-gap)!important}
.grid,.cards,.status-grid,.kh-ui-grid,.form-grid,.field-row{min-width:0}
.grid>*,.cards>*,.status-grid>*,.kh-ui-grid>*,.form-grid>*,.field-row>*{min-width:0}

/* Long content and actions */
button,.btn,.kh-button,.admin-btn,[role="button"]{overflow-wrap:anywhere;word-break:keep-all}
.actions>*,.form-actions>*,.card-actions>*,.toolbar>*{min-width:0}
input,select,textarea,button{max-width:100%}

/* Stable media */
.menu-card__image,.menu-item__image,.kh-ui-menu-card img,.product-image,.thumb{aspect-ratio:1/1;object-fit:cover}
.hero img,.banner img{width:100%;height:auto;object-fit:cover}

/* Fixed bars never cover content */
body:has(.bottom-nav) main,body:has(.bottom-nav) .page-content{padding-bottom:calc(var(--kh-nav-h) + 24px + env(safe-area-inset-bottom))!important}
body:has(.purchase-bar) main,body:has(.sticky-submit) main{padding-bottom:96px!important}

/* Modal safety */
.modal__panel,.dialog__panel,.drawer__panel,.bottom-sheet__panel,.kh-ui-dialog,.kh-ui-sheet{overscroll-behavior:contain}
.modal__body,.dialog__body,.drawer__body{min-width:0;overflow:auto}

/* Table mobile fallback */
@media(max-width:760px){
  .table-wrap,.table-scroll,.kh-ui-table-shell,.overflow-auto{border-radius:6px!important;-webkit-overflow-scrolling:touch}
  table,.admin-table{min-width:640px!important}
  .admin-header__actions,.toolbar{width:100%}
  .admin-header{flex-wrap:wrap!important;height:auto!important;padding-block:10px!important}
  .admin-header__actions>*{flex:1 1 auto}
  .bottom-nav{max-width:100vw!important}
  .bottom-nav a{touch-action:manipulation}
}

@media(max-width:560px){
  h1{font-size:24px!important}h2{font-size:19px!important}h3{font-size:16px!important}
  .container,.page-content,main,.admin-content{padding-inline:12px!important}
  .card,.panel,.admin-card,.kh-ui-card{padding:14px!important}
  .btn-group,.actions,.form-actions,.card-actions,.toolbar{width:100%!important}
  .btn-group>*,.actions>*,.form-actions>*,.card-actions>*{flex:1 1 100%!important;width:100%!important}
  .info-row{gap:10px!important}.info-row>span{max-width:42%}.info-row>strong{max-width:58%}
  .bottom-nav{grid-auto-columns:minmax(0,1fr)!important}
  .bottom-nav a{padding-inline:1px!important}
  .bottom-nav a>span:last-child{font-size:10px!important}
  .kh-ui-overlay,.modal,.dialog{padding:10px!important}
  .kh-ui-dialog,.modal__panel,.dialog__panel{max-height:94dvh!important}
}

@media(max-width:360px){
  body{font-size:14px}
  .brand{padding-inline:14px!important}.brand__name{font-size:22px!important}
  .bottom-nav a>span:last-child{font-size:9px!important}
  .menu-scroll{grid-auto-columns:82%!important}
}

/* Diagnostic highlight, only when explicitly enabled */
html.kh-qa-outline *{outline:1px solid rgba(180,35,46,.25)}
html.kh-qa-outline [data-kh-overflow="true"]{outline:2px solid #b4232e!important;background:rgba(180,35,46,.06)!important}