/* JodalMate Public UI System - loaded last from public_footer.php */
:root{
  --ui-content-max:1180px;--ui-page-top:34px;--ui-title-size:24px;--ui-desc-size:11px;
  --ui-action-h:38px;--ui-radius:12px;--ui-gap:10px;
}
body:not(.page-home) .site-main{min-height:calc(100vh - 160px)}
body:not(.page-home) .site-main>.products-hero,
body:not(.page-home) .site-main>.bids-hero{padding-top:var(--ui-page-top)!important;padding-bottom:18px!important}
.profile-page,.product-detail,.signup-section,.auth-section,.account-status-section,.signup-complete-section,.password-reset-section{padding-top:var(--ui-page-top)!important}

/* Page heading system */
.public-title-row,.products-title-row,.bids-title-row{display:grid!important;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:5px 10px;margin:0!important}
.public-title-row>h1,.products-title-row>h1,.bids-title-row>h1{grid-column:1;margin:0!important;font-size:var(--ui-title-size)!important;line-height:1.28!important}
.public-title-row>.eyebrow,.products-title-row>.eyebrow,.bids-title-row>.eyebrow{grid-column:2;margin:0!important}
.products-title-actions{grid-column:4;justify-self:end;align-self:center;margin:0!important}
.public-page-desc{margin:5px 0 0!important;font-size:var(--ui-desc-size)!important;line-height:1.55!important;color:var(--muted)!important}

.profile-page-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:16px;margin-bottom:20px!important}
.profile-page-head>div{display:grid!important;grid-template-columns:auto auto minmax(0,1fr);align-items:center;justify-content:start;gap:5px 10px!important}
.profile-page-head>div>h1{grid-column:1;grid-row:1;margin:0!important}
.profile-page-head>div>.eyebrow{grid-column:2;grid-row:1;margin:0!important}
.profile-page-head>div>p{grid-column:1/-1;grid-row:2;margin:0!important}
.profile-page-head>.btn{align-self:center;justify-self:end}

body:not(.page-home) .site-main .eyebrow{display:inline-flex!important;align-items:center!important;min-height:24px;padding:4px 9px!important;border:1px solid #cfe0f8!important;border-radius:999px!important;background:#eaf2ff!important;color:#1d4ed8!important;-webkit-text-fill-color:#1d4ed8!important;font-size:10px!important;font-weight:800!important;line-height:1.15!important;letter-spacing:.035em!important;white-space:nowrap!important;opacity:1!important}
html[data-theme="dark"] body:not(.page-home) .site-main .eyebrow{background:#203a5c!important;border-color:#345f8f!important;color:#eaf2ff!important;-webkit-text-fill-color:#eaf2ff!important;background-image:none!important;opacity:1!important;visibility:visible!important}

/* Buttons: one role = one geometry */
.site-main .btn,.site-main .btn-primary,.site-main .btn-subtle,.site-main .btn-ghost{min-height:var(--ui-action-h);border-radius:10px!important;padding:0 14px!important;display:inline-flex;align-items:center;justify-content:center;font-size:12px!important;font-weight:800!important;line-height:1!important}
.site-main .btn-primary{background:var(--primary)!important;border-color:var(--primary)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
.site-main .btn-primary:hover{filter:brightness(.96)}

/* Result/list toolbar alignment */
.products-result-head,.bids-result-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;min-height:40px;margin-top:0!important;margin-bottom:8px!important}
.products-result-tools,.bids-result-tools{display:flex!important;align-items:center!important;gap:8px!important;margin-left:auto!important}
.products-view-toggle,.bids-view-toggle{height:34px!important;display:inline-flex!important;align-items:center!important;border-radius:9px!important}
.products-per-page,.bids-per-page-form{display:flex!important;align-items:center!important;gap:8px!important}
.products-per-page label,.bids-per-page-form label{margin:0!important;white-space:nowrap!important}
.products-per-page select,.bids-per-page-form select{height:34px!important;min-width:76px!important}

/* Public scroll-to-top */
.public-scroll-top{position:fixed;right:24px;bottom:24px;z-index:1200;width:42px;height:42px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--primary,var(--brand,#2563eb)) 30%,var(--line));border-radius:50%;background:var(--surface);color:var(--primary,var(--brand,#2563eb));box-shadow:0 8px 24px rgba(15,23,42,.16);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .16s ease,transform .16s ease,visibility .16s ease,background .16s ease,color .16s ease}
.public-scroll-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.public-scroll-top:hover{background:var(--primary,var(--brand,#2563eb));color:#fff}.public-scroll-top svg{width:20px;height:20px;fill:currentColor}

@media(max-width:720px){
 .public-title-row,.products-title-row,.bids-title-row{grid-template-columns:auto auto 1fr;gap:5px 7px}
 .products-title-actions{grid-column:1/-1;grid-row:3;justify-self:stretch;margin-top:7px!important}.products-title-actions .btn{width:100%}
 .profile-page-head{grid-template-columns:1fr}.profile-page-head>.btn{justify-self:stretch;width:100%}
 .products-result-head,.bids-result-head{align-items:flex-end!important;flex-wrap:wrap}.public-scroll-top{right:16px;bottom:16px}
}

/* Shared service controls: search/filter/action/pagination */
.site-main button.btn-primary,
.site-main a.btn-primary,
.site-main input[type="submit"].btn-primary {
  background:var(--primary)!important;
  border-color:var(--primary)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
}
.site-main button.btn-primary:hover,
.site-main button.btn-primary:focus-visible,
.site-main a.btn-primary:hover,
.site-main a.btn-primary:focus-visible {
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.site-main .btn-subtle {
  color:var(--text)!important;
  -webkit-text-fill-color:var(--text)!important;
  background:var(--surface)!important;
  border-color:var(--line)!important;
}


/* Shared pagination states. */
.site-main .products-pagination,
.site-main .bids-pagination,
.site-main .pagination {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}
.site-main .products-pagination a,
.site-main .bids-pagination a,
.site-main .pagination a,
.site-main nav[aria-label*="페이지"] a {
  color:var(--text)!important;
  -webkit-text-fill-color:var(--text)!important;
}
.site-main .products-pagination a.is-current,
.site-main .products-pagination a[aria-current="page"],
.site-main .bids-pagination a.is-current,
.site-main .bids-pagination a[aria-current="page"],
.site-main .pagination a.is-current,
.site-main .pagination a.active,
.site-main .pagination a[aria-current="page"],
.site-main nav[aria-label*="페이지"] a.is-current,
.site-main nav[aria-label*="페이지"] a.active,
.site-main nav[aria-label*="페이지"] a[aria-current="page"] {
  background:var(--primary)!important;
  border-color:var(--primary)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
}
.site-main .products-pagination a.is-disabled,
.site-main .bids-pagination a.is-disabled,
.site-main .pagination a.is-disabled,
.site-main .pagination a.disabled,
.site-main nav[aria-label*="페이지"] a.is-disabled {
  opacity:.38!important;
  pointer-events:none!important;
}

/* Title actions use one vertical center rule on every service page. */
.public-title-row > .products-title-actions,
.products-title-row > .products-title-actions,
.bids-title-row > .bids-title-actions,
.public-title-row > .page-title-actions {
  align-self:center!important;
  display:flex!important;
  align-items:center!important;
}

/* 2026-08-17: final shared action visibility tokens.
   Do not depend on page-level --primary because legacy pages redefine it. */
:root {
  --ui-action-bg:#2563eb;
  --ui-action-border:#2563eb;
  --ui-action-fg:#ffffff;
}
html[data-theme="dark"] {
  --ui-action-bg:#3b82f6;
  --ui-action-border:#3b82f6;
  --ui-action-fg:#ffffff;
}

/* All public primary actions, including search buttons. */
.site-main button.btn-primary,
.site-main a.btn-primary,
.site-main input[type="submit"].btn-primary,
.site-main .products-search-row .btn-primary,
.site-main .bids-search-row .btn-primary,
.site-main .search-row .btn-primary,
.site-main .filter-actions .btn-primary {
  background:var(--ui-action-bg)!important;
  background-image:none!important;
  border-color:var(--ui-action-border)!important;
  color:var(--ui-action-fg)!important;
  -webkit-text-fill-color:var(--ui-action-fg)!important;
  text-shadow:none!important;
  opacity:1!important;
  visibility:visible!important;
}
.site-main button.btn-primary:hover,
.site-main button.btn-primary:focus-visible,
.site-main a.btn-primary:hover,
.site-main a.btn-primary:focus-visible,
.site-main input[type="submit"].btn-primary:hover,
.site-main input[type="submit"].btn-primary:focus-visible {
  background:color-mix(in srgb,var(--ui-action-bg) 90%,#000)!important;
  border-color:color-mix(in srgb,var(--ui-action-border) 90%,#000)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

/* Current page must remain visible in both light and dark themes. */
.site-main .products-pagination a.is-current,
.site-main .products-pagination a.active,
.site-main .products-pagination a[aria-current="page"],
.site-main .bids-pagination a.is-current,
.site-main .bids-pagination a.active,
.site-main .bids-pagination a[aria-current="page"],
.site-main .pagination a.is-current,
.site-main .pagination a.active,
.site-main .pagination a[aria-current="page"],
.site-main nav[aria-label*="페이지"] a.is-current,
.site-main nav[aria-label*="페이지"] a.active,
.site-main nav[aria-label*="페이지"] a[aria-current="page"] {
  background:var(--ui-action-bg)!important;
  background-image:none!important;
  border-color:var(--ui-action-border)!important;
  color:var(--ui-action-fg)!important;
  -webkit-text-fill-color:var(--ui-action-fg)!important;
  text-shadow:none!important;
  opacity:1!important;
}



/* =========================================================
 * Public service shared search/filter typography
 * OWNERSHIP: common UI only. Page CSS must not override these sizes.
 * Compact: 12px labels / 14px controls
 * Wide:    14px labels / 16px controls
 * ========================================================= */
.site-main .products-filter label,
.site-main .bids-filter label,
.site-main .products-per-page label,
.site-main .bids-per-page-form label {
    font-size: 12px !important;
    font-weight: 400 !important;
}

.site-main .products-filter select,
.site-main .products-filter input,
.site-main .bids-filter select,
.site-main .bids-filter input,
.site-main .products-per-page select,
.site-main .bids-per-page-form select,
.site-main .products-filter .btn,
.site-main .bids-filter .btn,
.site-main .products-search-row .btn,
.site-main .bids-search-row .btn,
.site-main .bids-date-quick {
    font-size: 14px !important;
}

@media (min-width: 901px) {
    html[data-layout="wide"] .site-main .products-filter label,
    html[data-layout="wide"] .site-main .bids-filter label,
    html[data-layout="wide"] .site-main .products-per-page label,
    html[data-layout="wide"] .site-main .bids-per-page-form label {
        font-size: 14px !important;
    }

    html[data-layout="wide"] .site-main .products-filter select,
    html[data-layout="wide"] .site-main .products-filter input,
    html[data-layout="wide"] .site-main .bids-filter select,
    html[data-layout="wide"] .site-main .bids-filter input,
    html[data-layout="wide"] .site-main .products-per-page select,
    html[data-layout="wide"] .site-main .bids-per-page-form select,
    html[data-layout="wide"] .site-main .products-filter .btn,
    html[data-layout="wide"] .site-main .bids-filter .btn,
    html[data-layout="wide"] .site-main .products-search-row .btn,
    html[data-layout="wide"] .site-main .bids-search-row .btn,
    html[data-layout="wide"] .site-main .bids-date-quick {
        font-size: 16px !important;
    }
}

/* Public page heading description: shared compact/wide typography */
@media (min-width: 901px) {
    html[data-layout="wide"] {
        --ui-desc-size: 12px;
    }
}


/* =========================================================
 * Public member teaser / signup guidance
 * Shared by standard products and bid notices.
 * ========================================================= */
.public-member-teaser {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 24px;
    padding: 16px 18px;
    border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--line));
    border-radius: 14px;
    background: color-mix(in srgb, var(--brand) 4%, var(--surface));
}
.public-member-teaser-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.public-member-teaser-copy strong {
    font-size: 13px;
}
.public-member-teaser-copy span {
    color: var(--muted);
    font-size: 11px;
}
.public-member-teaser-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}
html[data-layout="wide"] .public-member-teaser {
    padding: 18px 20px;
}
html[data-layout="wide"] .public-member-teaser-copy strong {
    font-size: 14px;
}
html[data-layout="wide"] .public-member-teaser-copy span {
    font-size: 12px;
}
@media (max-width: 620px) {
    .public-member-teaser {
        align-items: flex-start;
        flex-direction: column;
    }
    .public-member-teaser-actions {
        width: 100%;
    }
    .public-member-teaser-actions .btn {
        flex: 1 1 0;
    }
}

/* Public search accordion - shared search/filter section shell */
.public-search-accordion {
    margin-bottom: 18px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: var(--shadow);
    overflow: hidden;
}
.public-search-accordion-toggle {
    width: 100%;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 18px;
    border: 0;
    background: transparent;
    color: var(--text);
    text-align: left;
    cursor: pointer;
}
.public-search-accordion-toggle:hover,
.public-search-accordion-toggle:focus-visible {
    background: color-mix(in srgb, var(--brand) 4%, var(--surface));
}
.public-search-accordion-toggle:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--brand) 42%, transparent);
    outline-offset: -2px;
}
.public-search-accordion-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}
.public-search-accordion-heading > strong {
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 850;
    white-space: nowrap;
}
.public-search-accordion-summary {
    min-width: 0;
    color: var(--muted);
    font-size: 11px;
    font-weight: 650;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.public-search-accordion-action {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.public-search-accordion-action svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .16s ease;
}
.public-search-accordion-body {
    border-top: 1px solid var(--line);
}
.public-search-accordion-body[hidden] {
    display: none !important;
}
.public-search-accordion.is-collapsed .public-search-accordion-action svg {
    transform: rotate(180deg);
}
html[data-layout="wide"] .public-search-accordion-toggle {
    min-height: 54px;
    padding-left: 20px;
    padding-right: 20px;
}
html[data-layout="wide"] .public-search-accordion-heading > strong { font-size: 14px; }
html[data-layout="wide"] .public-search-accordion-summary,
html[data-layout="wide"] .public-search-accordion-action { font-size: 12px; }
@media (max-width: 680px) {
    .public-search-accordion-toggle {
        min-height: 48px;
        padding: 11px 14px;
    }
    .public-search-accordion-heading {
        gap: 8px;
    }
    .public-search-accordion-action > span {
        display: none;
    }
}

/* 2026-08-27: 공통 검색영역 날짜 빠른선택 버튼 굵기 제거 */
.site-main .bids-date-quick,
.site-main .products-date-quick,
.site-main .public-filter .date-quick,
.site-main .public-filter .quick-date {
    font-weight: 400 !important;
}