/* ============================================
 * AGA Clinic Search - Frontend Styles
 * Prefixed with .aga-cs- to avoid theme conflicts
 * ============================================ */
.aga-cs-wrapper {
  --aga-primary: #2563eb;
  --aga-primary-light: #dbeafe;
  --aga-primary-dark: #1d4ed8;
  --aga-gray-50: #f9fafb;
  --aga-gray-100: #f3f4f6;
  --aga-gray-200: #e5e7eb;
  --aga-gray-300: #d1d5db;
  --aga-gray-500: #6b7280;
  --aga-gray-700: #374151;
  --aga-gray-900: #111827;
  --aga-radius: 12px;
  font-family: -apple-system, BlinkMacSystemFont, 'Hiragino Sans', 'Noto Sans JP', sans-serif;
  line-height: 1.7;
  color: var(--aga-gray-900);
  max-width: 1100px;
  margin: 0 auto;
}
.aga-cs-wrapper *, .aga-cs-wrapper *::before, .aga-cs-wrapper *::after { box-sizing: border-box; }

/* Initial Message */
.aga-cs-initial-message { background:#fff; border-radius:var(--aga-radius); padding:48px 24px; margin-bottom:24px; box-shadow:0 1px 3px rgba(0,0,0,.08); border:1px solid var(--aga-gray-200); text-align:center; }
.aga-cs-initial-icon { font-size:3rem; margin-bottom:12px; }
.aga-cs-initial-text { font-size:1.05rem; color:var(--aga-gray-500); line-height:1.8; margin:0; }

/* Search Panel */
.aga-cs-search-panel { background:#fff; border-radius:var(--aga-radius); padding:24px; margin-bottom:24px; box-shadow:0 1px 3px rgba(0,0,0,.08); border:1px solid var(--aga-gray-200); }
.aga-cs-search-title { font-size:1.4rem; font-weight:700; text-align:center; margin-bottom:4px; }
.aga-cs-search-sub { text-align:center; font-size:.9rem; color:var(--aga-gray-500); margin-bottom:20px; }
.aga-cs-filter-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-bottom:16px; }
.aga-cs-filter-group label { display:block; font-size:.8rem; font-weight:600; color:var(--aga-gray-700); margin-bottom:6px; }
.aga-cs-filter-group select { width:100%; padding:10px 12px; border:1px solid var(--aga-gray-300); border-radius:8px; font-size:.9rem; background:#fff; color:var(--aga-gray-900); cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; }
.aga-cs-filter-group select:focus { outline:none; border-color:var(--aga-primary); box-shadow:0 0 0 3px var(--aga-primary-light); }
.aga-cs-checkbox-filters { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:20px; padding-top:12px; border-top:1px solid var(--aga-gray-100); }
.aga-cs-checkbox-filters > span { font-size:.8rem; font-weight:600; color:var(--aga-gray-700); line-height:2; }
.aga-cs-cb-label { display:flex; align-items:center; gap:6px; font-size:.85rem; cursor:pointer; background:var(--aga-gray-50); padding:6px 14px; border-radius:20px; border:1px solid var(--aga-gray-200); transition:all .2s; user-select:none; }
.aga-cs-cb-label:hover { border-color:var(--aga-primary); background:var(--aga-primary-light); }
.aga-cs-cb-label input { accent-color:var(--aga-primary); }
.aga-cs-cb-label.active { background:var(--aga-primary-light); border-color:var(--aga-primary); color:var(--aga-primary-dark); font-weight:600; }
.aga-cs-btn-row { display:flex; gap:12px; justify-content:center; }
.aga-cs-btn { padding:10px 32px; border-radius:8px; font-size:.9rem; font-weight:600; border:none; cursor:pointer; transition:all .2s; }
.aga-cs-btn-primary { background:var(--aga-primary); color:#fff; }
.aga-cs-btn-primary:hover { background:var(--aga-primary-dark); }
.aga-cs-btn-secondary { background:var(--aga-gray-100); color:var(--aga-gray-700); border:1px solid var(--aga-gray-300); }
.aga-cs-btn-secondary:hover { background:var(--aga-gray-200); }

/* Results Bar */
.aga-cs-results-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
.aga-cs-results-count { font-size:.95rem; font-weight:600; color:var(--aga-gray-700); }
.aga-cs-results-count strong { color:var(--aga-primary); font-size:1.2rem; }
.aga-cs-results-controls { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.aga-cs-sort-btns { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.aga-cs-sort-btns > span { font-size:.8rem; color:var(--aga-gray-500); font-weight:600; }
.aga-cs-sort-btn { padding:5px 12px; border-radius:6px; font-size:.78rem; border:1px solid var(--aga-gray-200); background:#fff; color:var(--aga-gray-500); cursor:pointer; transition:all .2s; }
.aga-cs-sort-btn.active { background:var(--aga-primary); color:#fff; border-color:var(--aga-primary); }
.aga-cs-view-toggle { display:flex; gap:4px; background:var(--aga-gray-100); border-radius:8px; padding:3px; }
.aga-cs-view-btn { padding:6px 14px; border-radius:6px; font-size:.8rem; font-weight:600; border:none; cursor:pointer; background:transparent; color:var(--aga-gray-500); transition:all .2s; }
.aga-cs-view-btn.active { background:#fff; color:var(--aga-primary); box-shadow:0 1px 2px rgba(0,0,0,.08); }

/* Cards */
.aga-cs-cards-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:20px; }
.aga-cs-card { background:#fff; border-radius:var(--aga-radius); border:1px solid var(--aga-gray-200); overflow:hidden; transition:all .3s; display:flex; flex-direction:column; }
.aga-cs-card:hover { box-shadow:0 8px 25px rgba(0,0,0,.1); transform:translateY(-2px); }
.aga-cs-card-header { background:linear-gradient(135deg,var(--aga-primary),#3b82f6); color:#fff; padding:16px 20px; display:flex; align-items:center; justify-content:space-between; }
.aga-cs-card-name { font-size:1rem; font-weight:700; }
.aga-cs-card-badge { background:rgba(255,255,255,.2); padding:3px 10px; border-radius:12px; font-size:.7rem; font-weight:600; }
.aga-cs-card-body { padding:20px; flex:1; display:flex; flex-direction:column; }
.aga-cs-price-hl { text-align:center; padding:12px; background:#fef3c7; border-radius:8px; margin-bottom:16px; }
.aga-cs-price-hl .label { font-size:.75rem; color:var(--aga-gray-500); margin-bottom:2px; }
.aga-cs-price-hl .price { font-size:1.5rem; font-weight:800; color:#b45309; }
.aga-cs-price-hl .price small { font-size:.8rem; font-weight:600; }
.aga-cs-price-hl .note { font-size:.7rem; color:var(--aga-gray-500); margin-top:2px; }
.aga-cs-tag-row { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.aga-cs-tag { font-size:.7rem; padding:3px 10px; border-radius:12px; font-weight:600; }
.aga-cs-tag-blue { background:#dbeafe; color:#1d4ed8; }
.aga-cs-tag-green { background:#d1fae5; color:#065f46; }
.aga-cs-tag-orange { background:#fef3c7; color:#92400e; }
.aga-cs-tag-purple { background:#ede9fe; color:#5b21b6; }

/* Coupon in card */
.aga-cs-coupon-section { margin-bottom:16px; }
.aga-cs-coupon-title { font-size:.78rem; font-weight:700; color:var(--aga-gray-700); margin-bottom:8px; }
.aga-cs-coupon-item { display:flex; align-items:center; gap:8px; margin-bottom:6px; background:linear-gradient(135deg,#fef9ee,#fff7ed); border:1px dashed #f59e0b; border-radius:8px; padding:8px 12px; }
.aga-cs-coupon-code-box { display:flex; align-items:center; gap:6px; flex:1; min-width:0; }
.aga-cs-coupon-code { font-family:'Courier New',Consolas,monospace; font-size:.9rem; font-weight:800; color:#92400e; letter-spacing:.5px; white-space:nowrap; }
.aga-cs-coupon-desc { font-size:.7rem; color:var(--aga-gray-500); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aga-cs-copy-btn { flex-shrink:0; display:flex; align-items:center; gap:4px; padding:5px 12px; border:1px solid #f59e0b; border-radius:6px; background:#fff; color:#92400e; font-size:.75rem; font-weight:700; cursor:pointer; transition:all .2s; white-space:nowrap; }
.aga-cs-copy-btn:hover { background:#fef3c7; border-color:#d97706; }
.aga-cs-copy-btn.copied { background:#d1fae5; border-color:#059669; color:#065f46; }
.aga-cs-copy-btn svg { width:14px; height:14px; }

/* Card Info */
.aga-cs-card-info { font-size:.82rem; color:var(--aga-gray-700); margin-bottom:16px; flex:1; }
.aga-cs-info-row { display:flex; padding:6px 0; border-bottom:1px solid var(--aga-gray-100); }
.aga-cs-info-row:last-child { border-bottom:none; }
.aga-cs-info-label { min-width:80px; font-weight:600; color:var(--aga-gray-500); font-size:.78rem; }
.aga-cs-info-value { flex:1; }
.aga-cs-card-footer { padding:16px 20px; border-top:1px solid var(--aga-gray-100); display:flex; gap:8px; }
.aga-cs-btn-detail { flex:1; padding:10px; border-radius:8px; font-size:.85rem; font-weight:600; border:none; cursor:pointer; transition:all .2s; text-align:center; text-decoration:none; display:block; }
.aga-cs-btn-detail.primary { background:var(--aga-primary); color:#fff; }
.aga-cs-btn-detail.primary:hover { background:var(--aga-primary-dark); }
.aga-cs-btn-detail.outline { background:#fff; color:var(--aga-primary); border:1px solid var(--aga-primary); }
.aga-cs-btn-detail.outline:hover { background:var(--aga-primary-light); }

/* Table */
.aga-cs-table-wrapper { overflow-x:auto; background:#fff; border-radius:var(--aga-radius); border:1px solid var(--aga-gray-200); }
.aga-cs-table { width:100%; border-collapse:collapse; font-size:.85rem; }
.aga-cs-table th { background:var(--aga-gray-50); padding:12px 16px; text-align:left; font-weight:600; color:var(--aga-gray-700); border-bottom:2px solid var(--aga-gray-200); white-space:nowrap; font-size:.8rem; }
.aga-cs-table td { padding:12px 16px; border-bottom:1px solid var(--aga-gray-100); vertical-align:top; }
.aga-cs-table tr:hover { background:var(--aga-gray-50); }
.aga-cs-table .clinic-name { font-weight:700; color:var(--aga-primary); white-space:nowrap; }
.aga-cs-table .price-cell { font-weight:700; color:#b45309; white-space:nowrap; }
.aga-cs-tbl-coupon { display:inline-flex; align-items:center; gap:6px; background:#fff7ed; border:1px dashed #f59e0b; border-radius:6px; padding:4px 8px; margin-bottom:4px; }
.aga-cs-tbl-coupon-code { font-family:'Courier New',Consolas,monospace; font-size:.82rem; font-weight:800; color:#92400e; }
.aga-cs-tbl-copy-btn { padding:2px 8px; border:1px solid #f59e0b; border-radius:4px; background:#fff; color:#92400e; font-size:.7rem; font-weight:700; cursor:pointer; transition:all .2s; }
.aga-cs-tbl-copy-btn:hover { background:#fef3c7; }
.aga-cs-tbl-copy-btn.copied { background:#d1fae5; border-color:#059669; color:#065f46; }

/* Modal */
.aga-cs-modal-overlay { display:none; position:fixed; top:0;left:0;right:0;bottom:0; background:rgba(0,0,0,.5); z-index:99999; justify-content:center; align-items:center; padding:16px; }
.aga-cs-modal-overlay.active { display:flex; }
.aga-cs-modal { background:#fff; border-radius:var(--aga-radius); max-width:680px; width:100%; max-height:85vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,.2); }
.aga-cs-modal-header { padding:20px 24px; border-bottom:1px solid var(--aga-gray-200); display:flex; justify-content:space-between; align-items:center; position:sticky; top:0; background:#fff; z-index:10; border-radius:var(--aga-radius) var(--aga-radius) 0 0; }
.aga-cs-modal-title-text { font-size:1.1rem; font-weight:700; }
.aga-cs-modal-close { width:32px; height:32px; border-radius:50%; border:none; background:var(--aga-gray-100); cursor:pointer; font-size:1.2rem; display:flex; align-items:center; justify-content:center; color:var(--aga-gray-500); }
.aga-cs-modal-close:hover { background:var(--aga-gray-200); }
.aga-cs-modal-body { padding:24px; }

/* Modal coupon */
.aga-cs-modal-coupon { margin-bottom:20px; padding:16px; background:linear-gradient(135deg,#fef9ee,#fff7ed); border:1px dashed #f59e0b; border-radius:10px; }
.aga-cs-modal-coupon-title { font-size:.85rem; font-weight:700; color:#92400e; margin-bottom:10px; }
.aga-cs-modal-coupon-item { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid rgba(245,158,11,.2); }
.aga-cs-modal-coupon-item:last-child { border-bottom:none; }
.aga-cs-modal-coupon-left { display:flex; flex-direction:column; gap:2px; }
.aga-cs-modal-coupon-code { font-family:'Courier New',Consolas,monospace; font-size:1.05rem; font-weight:800; color:#92400e; letter-spacing:1px; }
.aga-cs-modal-coupon-desc { font-size:.75rem; color:var(--aga-gray-500); }
.aga-cs-modal-copy-btn { flex-shrink:0; display:flex; align-items:center; gap:5px; padding:7px 16px; border:1.5px solid #f59e0b; border-radius:8px; background:#fff; color:#92400e; font-size:.82rem; font-weight:700; cursor:pointer; transition:all .2s; }
.aga-cs-modal-copy-btn:hover { background:#fef3c7; }
.aga-cs-modal-copy-btn.copied { background:#d1fae5; border-color:#059669; color:#065f46; }
.aga-cs-modal-copy-btn svg { width:15px; height:15px; }

/* Plan table in modal */
.aga-cs-plan-table { width:100%; border-collapse:collapse; font-size:.82rem; margin-bottom:12px; }
.aga-cs-plan-table th { background:var(--aga-gray-50); padding:10px 12px; text-align:left; font-weight:600; border-bottom:1px solid var(--aga-gray-200); }
.aga-cs-plan-table td { padding:10px 12px; border-bottom:1px solid var(--aga-gray-100); }
.aga-cs-plan-table .plan-price { font-weight:700; color:#b45309; white-space:nowrap; }

.aga-cs-no-results { text-align:center; padding:60px 20px; color:var(--aga-gray-500); font-size:.95rem; }

@media (max-width:640px) {
  .aga-cs-search-title { font-size:1.2rem; }
  .aga-cs-filter-grid { grid-template-columns:1fr; }
  .aga-cs-cards-grid { grid-template-columns:1fr; }
  .aga-cs-results-bar { flex-direction:column; align-items:flex-start; }
}
