/* Toolbar */
.ca-toolbar { display:flex; flex-wrap: wrap; gap:12px; margin:12px 0 16px; align-items:center; }
#ca-search { flex:1; padding:10px 12px; border:1px solid #e5e7eb; border-radius:10px; }

/* Grid of cards */
.ca-cards {
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap:16px;
}

/* Card */
.ca-card {
  border:1px solid #e5e7eb; border-radius:16px; background:#fff;
  padding:14px; box-shadow:0 2px 8px rgba(0,0,0,.04);
  display:flex; flex-direction:column; gap:12px;
  height:100%;
}

/* Head */
.ca-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ca-card-left { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ca-logo img { width:40px; height:40px; border-radius:9999px; object-fit:cover; border:1px solid #e5e7eb; }

.ca-card-title { display: none; }

/* Inline title */
.ca-title-inline { display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-weight:700; }
.ca-title-inline .name { font-size:16px; }
.ca-title-inline .slash { color:#cbd5e1; font-weight:600; }
.ca-title-inline .category { color:#64748b; font-weight:600; font-size:14px; }

.ca-chips { display:flex; gap:6px; flex-wrap:wrap; margin-top:4px; }

/* Chips & badges */
.ca-chip {
  display:inline-block; padding:4px 8px; border-radius:999px;
  background:#f1f5f9; color:#0f172a; font-size:.8rem; line-height:1;
}
.ca-chip--muted { background:#f8fafc; color:#475569; }
.ca-chip--accent { background:#eef2ff; color:#3730a3; font-weight:600; }

.ca-badge {
  padding:6px 10px; border-radius:999px; font-weight:700; line-height:1;
  font-size:.85rem; border:1px solid #e5e7eb;
}
.ca-badge--rating { background:#fff7ed; color:#9a3412; }

/* Body */
.ca-card-body {
  display:flex;
  flex-direction:column;
  gap:10px;
  flex:1 1 auto;
}
.ca-hero img { width:100%; height:auto; display:block; border-radius:12px; border:1px solid #eef2f7; }

/* Description */
.ca-desc { line-height:1.25; font-size:14px; }
.ca-desc-toggle {
  margin-left:8px; border:none; background:none; cursor:pointer;
  color:#058cc3; font-weight:600; padding:0 5px; font-size:14px;
}
.ca-desc-toggle:hover { text-decoration:underline; }

/* Functions */
.ca-functions { margin-top:6px; }
.ca-functions-title {
  font-size:15px;
  color:#475569;
  font-weight:600;
  padding-top:8px;
}
.ca-functions-content {
  font-size:14px;
  text-align:left;
  white-space:pre-line;
  padding:8px 0;
  border-top:1px solid #eef2f7;
}
.ca-functions .ca-list { margin:0; padding-left:18px; }
.ca-functions .ca-list li { list-style:disc; margin:0 0 4px; }

/* Details grid */
.ca-more { margin-top:4px; }
.ca-more-toggle {
  border:none; background:none; color:#2563eb; cursor:pointer; font-weight:600; padding:0; margin-top:8px;
}
.ca-more-toggle:hover { text-decoration:underline; }

.ca-details { }
button.ca-more-toggle { font-size:14px; }
button.ca-cta { font-size:16px; }

.ca-details .ca-rowitem { display:flex; flex-direction:column; }
.ca-details .lbl {
  font-size:15px;
  color:#475569;
  font-weight:600;
  text-align:left;
  padding:0;
  border-top:1px solid #eef2f7;
}
.ca-details .val {
  font-size:14px;
  text-align:left;
  white-space:pre-line;
  padding:8px 0;
  border-top:1px solid #eef2f7;
}
.ca-details .ca-rowitem:first-child .lbl,
.ca-details .ca-rowitem:first-child .val { border-top:0; }
.ca-details .ca-list { margin:0; padding-left:18px; }
.ca-details .ca-list li { list-style:disc; margin:0 0 4px; }

/* CTA pinned bottom */
.ca-cta-wrap { margin-top:auto !important; }
.ca-cta {
    display: inline-block;
    text-decoration: none;
    padding: 5px 10px;
    border-radius: 10px;
    background: #111827;
    color: #fff;
    border: 1px solid #1f2937;
    font-weight: 400;
    font-size: 15px;
}
.ca-cta:hover { filter:brightness(0.95); }

/* Images in fields */
.ca-img { max-width:100%; height:auto; display:block; }

/* Hide list marker when shortcode in <li> */
.ca-no-marker { list-style:none !important; }
.ca-no-marker::marker { content:"" !important; }
.ca-no-marker::before { content:none !important; }

/* Category filter select */
#ca-filter-cat {
  min-width: 180px;
  padding: 10px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  font-size: 14px;
}
@media (max-width: 640px){
  #ca-filter-cat { flex: 1; }
}

/* Load more */
.ca-loadmore-wrap {
  display: none;
  margin-top: 25px;
  text-align: center;
}
.ca-loadmore {
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background: #038bc4;
    font-weight: 600;
    cursor: pointer;
    font-size: 14px;
    color: #fff;
    width: 120px;
}
.ca-loadmore:hover { filter: brightness(0.97); }

/* Modal */
.ca-modal-overlay[hidden]{ display:none; }
.ca-modal-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9999; display:flex; align-items:center; justify-content:center; padding:20px; }
.ca-modal{ background:#fff; border-radius:16px; max-width:980px; width:100%; max-height:90vh; overflow:auto; padding:16px; box-shadow:0 10px 30px rgba(0,0,0,.15); position:relative; }
.ca-modal-close{ position:absolute; top:8px; right:8px; border:none; background:#f1f5f9; width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:20px; line-height:1; }
.ca-modal-close:hover{ background:#e2e8f0; }
.ca-modal-grid{ display:grid; grid-template-columns: 220px 1fr; gap:16px; }
.ca-modal-left .ca-logo img{ width:100%; height:auto; border-radius:12px; border:1px solid #eef2f7; }
.ca-modal-right .ca-hero img{ width:100%; height:auto; border-radius:12px; border:1px solid #eef2f7; margin-top:8px; }
.ca-desc-fulltext{ margin:10px 0; font-size:14px; line-height:1.45; }
.ca-modal-actions{ margin-top:12px; }
@media (max-width: 720px){
  .ca-modal-grid{ grid-template-columns: 1fr; }
}

/* Read more icon (Dashicons) */
.ca-readmore-link::after{
  content: "\f504";
  font-family: "dashicons";
  font-weight: normal;
  display: inline-block;
  margin-left: 6px;
  line-height: 1;
  font-size: 14px;
  speak: none;
}
