/*
Theme Name: Beauty Catalog
Author: InfinityDesign / ChatGPT
Description: Beauty Index Pro（多軸フィルタ＋都道府県→市区町村の連動）
Version: 1.2.1
Text Domain: beauty-catalog
*/
:root{
  --pink:#e91e63;
  --pink-100:#f8bbd0;
  --pink-50:#fde7ef;
  --ink:#111;
}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans JP,sans-serif;color:var(--ink);background:#fff}
.container{max-width:1200px;margin:0 auto;padding:24px}
.h1{font-size:28px;font-weight:800;margin:0 0 16px;color:var(--pink)}
.filter-layout{display:grid;grid-template-columns:280px 1fr;gap:20px}
@media (max-width:980px){.filter-layout{grid-template-columns:1fr} .filter-panel{display:none} .filter-toggle{display:flex}}

.filter-toggle{display:none;justify-content:flex-end;margin-bottom:10px}
.filter-toggle button{padding:10px 14px;border-radius:10px;border:1px solid var(--pink-100);background:#fff}

.filter-panel{background:#fff;border:1px solid #f5e6ec;border-radius:16px;padding:16px;box-shadow:0 4px 14px rgba(233,30,99,.08)}
.filter-group{margin-bottom:16px}
.filter-group h4{font-size:14px;margin:0 0 8px;color:#8a0041}
.filter-group .row{display:grid;grid-template-columns:1fr;gap:8px}
.filter-group select,.filter-group input[type="search"],.filter-group input[type="number"]{padding:10px 12px;border:1px solid var(--pink-100);border-radius:10px;font-size:14px;width:100%}
.filter-group .checkboxes{display:flex;flex-wrap:wrap;gap:8px}
.checkbox{display:flex;gap:8px;align-items:center;padding:6px 10px;border:1px solid var(--pink-100);border-radius:999px;background:#fff}
.checkbox input{accent-color:var(--pink)}

.apply-row{display:flex;gap:8px;justify-content:flex-end}
.apply-row button{padding:10px 14px;border-radius:10px;border:none;background:var(--pink);color:#fff;cursor:pointer}
.apply-row a{padding:10px 14px;border-radius:10px;border:1px solid var(--pink-100);background:#fff;text-decoration:none;color:#333}

.tabs{display:flex;gap:8px;border-bottom:2px solid var(--pink-50);margin-bottom:16px}
.tab{padding:10px 14px;border-radius:10px 10px 0 0;background:var(--pink-100);color:#880e4f;text-decoration:none}
.tab.active{background:var(--pink);color:#fff}

.results{min-height:200px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:1024px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid{grid-template-columns:1fr}}

.card{background:#fff;border:1px solid #f5e6ec;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px rgba(233,30,99,.08);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(233,30,99,.14)}
.card-img{aspect-ratio:4/3;background:#fff;display:block}
.card-img img{width:100%;height:100%;object-fit:cover;display:block}
.card-body{padding:14px}
.card-title{font-size:18px;font-weight:700;margin:0 0 6px}
.card-title a{text-decoration:none;color:#333}

.menu-results{display:grid;grid-template-columns:1fr;gap:12px}
.menu-item{display:grid;grid-template-columns:1fr 160px;gap:12px;border:1px solid #f5e6ec;border-radius:12px;padding:12px}
.menu-item .title{font-weight:700}
.menu-item .price{text-align:right}
.menu-item .meta{font-size:12px;color:#666}
.menu-item .clinic{margin-top:4px}

.badges{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.badge{border:1px solid var(--pink-100);border-radius:999px;padding:6px 10px;font-size:12px;background:#fff}
.badge a{margin-left:6px;color:#999;text-decoration:none}

.section{margin-top:24px}
.tile-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:800px){.tile-grid{grid-template-columns:1fr}}
.tile{border:1px solid #f5e6ec;border-radius:16px;padding:14px}
.tile h3{margin:0 0 8px;font-size:16px;color:#8a0041}
.tile .links{display:flex;flex-wrap:wrap;gap:8px}
.tile .links a{display:inline-block;padding:6px 10px;border:1px solid var(--pink-100);border-radius:999px;text-decoration:none;color:#333;background:#fff}
.pagination{display:flex;gap:8px;margin:20px 0}
.pagination a,.pagination span{padding:6px 10px;border:1px solid #e5e7eb;border-radius:8px;text-decoration:none}
.pagination .current{background:#111;color:#fff;border-color:#111}
