/* Event Gift List — frontend UI */
:root {
  --egl-bg: #f7f8fa;
  --egl-card: #ffffff;
  --egl-text: #252a31;
  --egl-muted: #6d747d;
  --egl-border: #e3e6ea;
  --egl-soft: #f2f4f6;
  --egl-success: #2e7d32;
  --egl-success-bg: #edf7ee;
  --egl-warning: #956b00;
  --egl-warning-bg: #fff7df;
  --egl-danger: #a83333;
  --egl-radius: 10px;
}

.egl-card,
.egl-search.card,
.egl-form-card,
.egl-manage-card,
.egl-unlock.card {
  background: var(--egl-card);
  border: 1px solid var(--egl-border);
  border-radius: var(--egl-radius);
  box-shadow: 0 2px 10px rgba(24, 32, 43, .04);
}

.egl-card,
.egl-form-card,
.egl-manage-card { padding: 1.35rem; }

.egl-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.egl-toolbar-links { display:flex; gap:.5rem; flex-wrap:wrap; }
.egl-toolbar a { text-decoration:none; }
.egl-list-closed { margin: 1rem 0; }

.egl-section-title {
  margin: 0 0 .85rem;
  font-size: 1.35rem;
  line-height: 1.25;
  font-weight: 700;
  color: var(--egl-text);
}

.egl-help,
.egl-meta,
.egl-search-product-meta { color: var(--egl-muted); }

.egl-search { margin-bottom: 1.5rem; }
.egl-searchbar {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: stretch;
  gap: .6rem;
}
.egl-searchbar .form-control {
  min-height: 48px;
  border-radius: 8px;
  border: 1px solid #d8dde2;
  padding: .7rem .9rem;
  box-shadow: none;
}
.egl-searchbar .form-control:focus {
  border-color: #9ca6b0;
  box-shadow: 0 0 0 3px rgba(31, 41, 55, .08);
}
.egl-searchbar .btn { min-width: 112px; border-radius: 8px; }

.egl-product-search { margin-top: 1rem; }
.egl-search-product {
  display: grid;
  grid-template-columns: 88px minmax(0,1fr) minmax(250px,auto);
  gap: 1.15rem;
  align-items: center;
  padding: 1rem .35rem;
  border-top: 1px solid var(--egl-border);
}
.egl-search-product:first-child { border-top: 0; }
.egl-search-product img {
  width: 82px;
  height: 82px;
  object-fit: contain;
  background: #fff;
  border: 1px solid var(--egl-border);
  border-radius: 8px;
  padding: 5px;
}
.egl-search-product-info { min-width: 0; }
.egl-search-product-title {
  display:block;
  margin-bottom:.3rem;
  color:var(--egl-text);
  font-size:1rem;
  line-height:1.35;
  font-weight:700;
}
.egl-search-product-meta { font-size:.92rem; }
.egl-search-product-meta strong { color:var(--egl-text); }

.egl-add-product-form {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  gap: .65rem;
  flex-wrap: nowrap;
}
.egl-qty-field { display:flex; flex-direction:column; gap:.3rem; }
.egl-qty-field label { margin:0; color:var(--egl-muted); font-size:.85rem; font-weight:600; }
.egl-add-product-form input[type=number],
.egl-cart-form input[type=number] {
  width: 78px;
  min-height: 44px;
  text-align:center;
  border-radius:7px;
}
.egl-add-product-form .btn,
.egl-cart-form .btn {
  min-height:44px;
  white-space:nowrap;
  border-radius:7px;
  font-weight:600;
  padding-left:1rem;
  padding-right:1rem;
}

.egl-stock-badge,
.egl-status {
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  width:max-content;
  max-width:100%;
  border-radius:999px;
  padding:.28rem .62rem;
  font-size:.82rem;
  line-height:1.2;
  font-weight:700;
}
.egl-stock-badge.available,
.egl-status.available { color:var(--egl-success); background:var(--egl-success-bg); }
.egl-stock-badge.unavailable,
.egl-status.unavailable { color:var(--egl-warning); background:var(--egl-warning-bg); }
.egl-status.completed { color:#555; background:var(--egl-soft); }

.egl-divider-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin:1.6rem 0 .75rem;
}

.egl-results { margin-top: 1rem; }
.egl-result {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:1rem 1.1rem;
  margin-bottom:.65rem;
  background:var(--egl-card);
  border:1px solid var(--egl-border);
  border-radius:9px;
}
.egl-result strong { color:var(--egl-text); }
.egl-result-actions { display:flex; gap:.45rem; flex-wrap:wrap; }
.egl-list-item-image { width:100px; height:100px; object-fit:contain; flex:0 0 100px; border:1px solid var(--egl-border); border-radius:7px; background:#fff; padding:3px; }
.egl-list-qty-field { min-width:190px; }
.egl-list-qty-field label { display:block; margin:0 0 .3rem; color:var(--egl-muted); font-size:.8rem; font-weight:600; }
.egl-list-qty-field input { width:100%; }
.egl-list-item-actions { display:flex; flex-direction:column; gap:.45rem; align-items:stretch; }
.egl-list-item-actions .btn { width:100%; white-space:nowrap; }

.egl-product {
  display:grid;
  grid-template-columns:180px minmax(0,1fr);
  gap:1.5rem;
  padding:1.3rem;
  margin-bottom:1rem;
  background:var(--egl-card);
  border:1px solid var(--egl-border);
  border-radius:var(--egl-radius);
}
.egl-image img {
  width:100%;
  height:auto;
  max-height:190px;
  object-fit:contain;
  border-radius:8px;
}
.egl-info h3 { margin:.1rem 0 .55rem; font-size:1.15rem; }
.egl-info h3 a { color:var(--egl-text); text-decoration:none; }
.egl-desc { color:var(--egl-muted); line-height:1.5; }
.egl-price { font-size:1.35rem; font-weight:800; margin:.65rem 0; color:var(--egl-text); }
.egl-cart-form { display:flex; align-items:flex-end; gap:.7rem; flex-wrap:wrap; margin-top:.75rem; }
.egl-cart-form .egl-qty-field { flex:0 0 90px; width:90px; }
.egl-cart-form .egl-qty-field input[type=number] { width:100% !important; }
.egl-cart-form .egl-cart-error { flex-basis:100%; margin:0; }
.egl-cart-native-form { display:flex; align-items:flex-end; gap:.7rem; flex-wrap:wrap; margin-top:.75rem; }
.egl-cart-native-form .egl-qty-field { flex:0 0 90px; width:90px; }
.egl-cart-native-form .egl-qty-field label { display:block; margin:0 0 .32rem; color:var(--egl-muted); font-size:.85rem; font-weight:600; }
.egl-cart-native-form .egl-qty-field input[type=number] { width:100% !important; min-height:44px; text-align:center; border-radius:7px; }
.egl-cart-native-form .btn { min-height:44px; white-space:nowrap; border-radius:7px; font-weight:600; padding-left:1rem; padding-right:1rem; }

.egl-form-card .form-group { margin-bottom:1rem; }
.egl-form-card label { font-weight:600; color:var(--egl-text); }
.egl-form-card .form-control { border-radius:7px; }
.egl-form-actions { display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.35rem; }

.egl-advanced { margin-top:1.25rem; }
.egl-advanced summary {
  cursor:pointer;
  font-weight:700;
  color:var(--egl-text);
  padding:.25rem 0;
}
.egl-advanced[open] summary { margin-bottom:.8rem; }

.eventgiftlist-top-link { display:inline-flex; align-items:center; margin:0 .75rem; }
.eventgiftlist-top-link a { display:inline-flex; align-items:center; gap:.35rem; text-decoration:none; }
.eventgiftlist-top-link .material-icons { font-size:20px; }

@media (max-width: 991px) {
  .egl-search-product { grid-template-columns:74px minmax(0,1fr); }
  .egl-search-product img { width:70px; height:70px; }
  .egl-add-product-form,
  .egl-search-product > .egl-status { grid-column:1 / -1; justify-content:flex-start; padding-left:calc(74px + 1.15rem); }
}

@media (max-width: 767px) {
  .egl-card,.egl-form-card,.egl-manage-card { padding:1rem; }
  .egl-searchbar { grid-template-columns:1fr; }
  .egl-searchbar .btn { width:100%; }
  .egl-search-product { grid-template-columns:64px minmax(0,1fr); gap:.8rem; }
  .egl-search-product img { width:60px; height:60px; }
  .egl-add-product-form { grid-column:1/-1; padding-left:0; display:grid; grid-template-columns:90px minmax(0,1fr); width:100%; }
  .egl-add-product-form .btn { width:100%; }
  .egl-result { align-items:flex-start; flex-direction:column; }
  .egl-result-actions { width:100%; }
  .egl-result-actions .btn { flex:1 1 auto; }
  .egl-product { grid-template-columns:90px minmax(0,1fr); gap:1rem; padding:1rem; }
  .egl-image img { max-height:100px; }
  .egl-cart-form { grid-column:1/-1; }
}

@media (max-width: 420px) {
  .egl-search-product { grid-template-columns:52px minmax(0,1fr); }
  .egl-search-product img { width:50px; height:50px; }
  .egl-add-product-form { grid-template-columns:1fr; }
  .egl-add-product-form input[type=number], .egl-cart-form input[type=number] { width:100%; }
  .egl-product { grid-template-columns:1fr; }
  .egl-image { max-width:150px; }
}

/* Event Gift List 1.0.4 */
.egl-code-box {
  display:grid;
  grid-template-columns:auto auto 1fr auto;
  align-items:center;
  column-gap:.75rem;
  row-gap:.35rem;
  flex-wrap:wrap;
  padding:.85rem 1rem;
  margin:0 0 1rem;
  background:var(--egl-card);
  border:1px solid var(--egl-border);
  border-left:4px solid var(--egl-accent, #2fb344);
  border-radius:9px;
}
.egl-code-box span { font-weight:600; color:var(--egl-muted); }
.egl-code-box strong { font-size:1.15rem; letter-spacing:.06em; color:var(--egl-text); }
.egl-code-box small { grid-column:1 / 4; color:var(--egl-muted); }
.egl-code-box-actions { grid-column:4; grid-row:1 / span 2; display:flex; align-items:center; justify-content:flex-end; gap:.5rem; }
.egl-code-box-actions .btn { white-space:nowrap; }
.egl-result-code { margin-top:.3rem; font-size:.88rem; color:var(--egl-muted); letter-spacing:.02em; }
.egl-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.egl-combination-field { min-width:220px; }
.egl-combination-field label,.egl-qty-field label { display:block; margin-bottom:.3rem; font-weight:600; }
.egl-variant { display:inline-block; margin:.15rem 0 .45rem; padding:.25rem .5rem; border-radius:999px; background:#f2f3f5; color:var(--egl-muted); font-size:.85rem; }
.egl-public-head { margin-bottom:1.25rem; }
@media (max-width:767px){ .egl-form-grid{grid-template-columns:1fr;} .egl-combination-field{min-width:0;width:100%;} }


/* Event Gift List 1.0.9 — alignment and action buttons */
.egl-page-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  margin-bottom:1rem;
}

.egl-btn,
.egl-toolbar-links .btn,
.egl-result-actions .btn,
.egl-cart-form .btn,
.egl-add-product-form .btn,
.egl-form-actions .btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  min-height:44px;
  line-height:1.2;
  font-weight:600;
  text-align:center;
}

.egl-btn .material-icons,
.egl-toolbar-links .material-icons,
.egl-result-actions .material-icons,
.egl-cart-form .material-icons,
.egl-add-product-form .material-icons,
.egl-form-actions .material-icons {
  font-size:18px;
  line-height:1;
}

.egl-result-list {
  gap:1.2rem;
}

.egl-result-body {
  min-width:0;
}

.egl-result-title {
  display:block;
  font-size:1.06rem;
  line-height:1.35;
  margin-bottom:.25rem;
}

.egl-result-actions {
  align-items:center;
}

.egl-result-actions .btn {
  min-width:108px;
}

.egl-toolbar-links .btn {
  padding-left:1rem;
  padding-right:1rem;
}

.egl-code-box {
  margin-bottom:1.25rem;
}
@media (max-width:767px){
  .egl-code-box { grid-template-columns:auto 1fr; }
  .egl-code-box small { grid-column:1 / -1; }
  .egl-code-box-actions { grid-column:1 / -1; grid-row:auto; justify-content:flex-start; flex-wrap:wrap; margin-top:.5rem; }
}

.egl-search-product {
  padding:1rem 0;
}

.egl-add-product-form {
  gap:.75rem;
}

.egl-combination-field label,
.egl-qty-field label,
.egl-cart-form label {
  margin:0 0 .32rem;
  color:var(--egl-muted);
  font-size:.85rem;
  font-weight:600;
}

.egl-cart-form label {
  display:block;
}

.egl-products {
  display:flex;
  flex-direction:column;
  gap:1rem;
}

.egl-view-switch {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:.5rem;
  flex-wrap:nowrap;
  margin:0 0 1rem;
  padding:.7rem .85rem;
  background:var(--egl-card);
  border:1px solid var(--egl-border);
  border-radius:var(--egl-radius);
}
.egl-view-switch-label { color:var(--egl-muted); font-size:.9rem; font-weight:600; margin-right:.15rem; white-space:nowrap; }
.egl-view-switch-button { display:inline-flex; align-items:center; justify-content:center; gap:.35rem; min-height:38px; padding:.45rem .7rem; background:#fff; border:1px solid #cfd5db; border-radius:6px; box-shadow:none; color:var(--egl-text); cursor:pointer; font:inherit; font-size:.9rem; line-height:1.2; white-space:nowrap; }
.egl-view-switch-button:hover { border-color:#25b9d7; color:#168da6; }
.egl-view-switch-button .material-icons { font-size:18px; line-height:1; }
.egl-view-switch-button[aria-pressed="true"] { background:#25b9d7; border-color:#25b9d7; color:#fff; }
.egl-products.egl-products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); align-items:stretch; }
.egl-products.egl-products-grid .egl-product { grid-template-columns:1fr; gap:1rem; margin:0; padding:1rem; }
.egl-products.egl-products-grid .egl-image { height:210px; max-width:none; display:flex; align-items:center; justify-content:center; }
.egl-products.egl-products-grid .egl-image a { display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.egl-products.egl-products-grid .egl-image img { width:100%; height:100%; max-height:none; object-fit:contain; }
.egl-products.egl-products-grid .egl-cart-form { margin-top:1rem; }

@media (max-width: 767px) {
  .egl-page-head { align-items:stretch; }
  .egl-page-head .btn { width:100%; }
  .egl-result-actions { width:100%; gap:.5rem; }
  .egl-result-actions .btn { flex:1 1 calc(50% - .5rem); min-width:0; }
  .egl-view-switch { flex-wrap:wrap; }
  .egl-view-switch-label { width:100%; }
  .egl-products.egl-products-grid { grid-template-columns:1fr; }
}

@media (max-width: 480px) {
  .egl-result-actions .btn { flex:1 1 100%; }
}
