/* ============================================================
   Hashamba Community — shared component styles.
   Matches the client mockups (עיצוב עמודים): green #3CB34D primary,
   white rounded cards, green creator bar, pill buttons, chips, dots.
   Components inherit the page font for visual consistency.
   ============================================================ */
:root{
	--hsc-green:  var(--e-global-color-4168ba8, #3CB34D);
	--hsc-green-d:#2f9a41;
	--hsc-olive:  var(--e-global-color-primary, #A3A930);
	--hsc-teal:   var(--e-global-color-aa568fb, #00C2C7);
	--hsc-blue:   var(--e-global-color-630b2e9, #0091FE);
	--hsc-red:    #E8482C;
	--hsc-ink:    var(--e-global-color-text, #1d1d1d);
	--hsc-muted:  var(--e-global-color-aa1e35a, #7C8D97);
	--hsc-line:   #e7ebee;
	--hsc-soft:   var(--e-global-color-secondary, #F8F9FA);
	--hsc-radius: 14px;
}

/* ---- buttons ---- */
.hsc-btn,.hsc-action,.hsc-join-btn,.hsc-prefs-btn,.hsc-privacy-btn,.hsc-profile-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:.4em;
	cursor:pointer;border:none;border-radius:999px;padding:.6em 1.5em;
	font:inherit;font-weight:700;line-height:1.2;text-decoration:none;
	background:var(--hsc-green);color:#fff;transition:background .15s,opacity .15s;
}
.hsc-btn:hover,.hsc-action:hover,.hsc-join-btn:hover{background:var(--hsc-green-d);color:#fff;}
.hsc-btn[disabled],.hsc-join-btn[disabled]{opacity:.6;pointer-events:none;}
.hsc-btn-outline,.hsc-action-dup{background:#fff;color:var(--hsc-ink);border:2px solid var(--hsc-line);}
.hsc-btn-outline:hover,.hsc-action-dup:hover{background:var(--hsc-soft);color:var(--hsc-ink);}

/* ---- section heading ---- */
.hsc-h{display:flex;align-items:center;gap:.4em;color:var(--hsc-green);font-weight:800;
	border-bottom:2px solid var(--hsc-line);padding-bottom:.3em;margin:0 0 .8em;}

/* ---- creator bar (green) ---- */
.hsc-creator{display:flex;gap:14px;align-items:center;background:var(--hsc-green);
	color:#fff;border-radius:var(--hsc-radius);padding:14px 18px;}
.hsc-creator-avatar img{border-radius:50%;border:2px solid rgba(255,255,255,.6);display:block;}
.hsc-creator-name{font-weight:800;font-size:1.1em;}
.hsc-creator-name a{color:#fff;text-decoration:none;}
.hsc-creator-name a:hover{text-decoration:underline;}
.hsc-creator-rank{margin:3px 0;}
.hsc-creator .hsc-rank-badge{background:rgba(255,255,255,.22);}
.hsc-creator-contrib{color:rgba(255,255,255,.9);font-size:.88em;}

/* ---- rank badge ---- */
.hsc-rank-badge{display:inline-block;background:var(--hsc-green);color:#fff;border-radius:999px;
	padding:.2em 1em;font-weight:700;font-size:.85em;}

/* ---- data card (מידע על המסלול) ---- */
.hsc-data{margin:0;background:#fff;border:1px solid var(--hsc-line);border-radius:var(--hsc-radius);
	padding:6px 18px;}
.hsc-data-row{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--hsc-line);}
.hsc-data-row:last-child{border-bottom:0;}
.hsc-data dt{font-weight:800;min-width:110px;color:var(--hsc-ink);}
.hsc-data dd{margin:0;color:#333;}

/* ---- chips / tags ---- */
.hsc-chip{display:inline-block;background:var(--hsc-green);color:#fff;border-radius:999px;
	padding:.25em .9em;font-size:.85em;font-weight:600;margin:0 0 6px;}
.hsc-chip.is-water{background:var(--hsc-teal);}
.hsc-chip.is-access{background:var(--hsc-muted);}

/* ---- difficulty dots ---- */
.hsc-dots{display:inline-flex;gap:4px;vertical-align:middle;}
.hsc-dots i{width:12px;height:12px;border-radius:50%;background:#dfe4e7;display:inline-block;}
.hsc-dots i.on:nth-child(1){background:#5bbd4a;}
.hsc-dots i.on:nth-child(2){background:#b6c63b;}
.hsc-dots i.on:nth-child(3){background:#f0a531;}
.hsc-dots i.on:nth-child(4){background:var(--hsc-red);}

/* ---- card grid ---- */
.hsc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;}
.hsc-card{position:relative;display:flex;flex-direction:column;background:#fff;
	border:1px solid var(--hsc-line);border-radius:var(--hsc-radius);overflow:hidden;
	text-decoration:none;color:inherit;transition:box-shadow .2s,transform .2s;}
.hsc-card:hover{box-shadow:0 10px 28px rgba(0,0,0,.09);transform:translateY(-3px);}
.hsc-card-img{display:block;height:140px;background-size:cover;background-position:center;background-color:var(--hsc-soft);}
.hsc-card-badge{position:absolute;top:10px;inset-inline-end:10px;background:var(--hsc-green);color:#fff;
	border-radius:999px;padding:.2em .8em;font-size:.78em;font-weight:700;}
.hsc-card-badge.is-draft{background:var(--hsc-red);}
.hsc-card-body{padding:12px 14px;display:flex;flex-direction:column;gap:6px;flex:1;}
.hsc-card-title{font-weight:700;line-height:1.3;}
.hsc-card-meta{color:var(--hsc-muted);font-size:.85em;}
.hsc-card-cta{margin-top:auto;align-self:flex-start;}

/* ---- save (heart) ---- */
.hsc-save-btn{cursor:pointer;background:#fff;border:1px solid var(--hsc-line);border-radius:50%;
	width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
	font-size:1.2em;line-height:1;color:var(--hsc-red);padding:0;}
.hsc-save-btn.is-saved{background:var(--hsc-red);color:#fff;border-color:var(--hsc-red);}

/* ---- success popup (join, etc.) ---- */
.hsc-pop{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:99999;font-family:"Noto Sans Hebrew",sans-serif;}
.hsc-pop-card{background:#fff;border-radius:18px;padding:28px 36px;text-align:center;max-width:360px;direction:rtl;}
.hsc-pop-emoji{font-size:46px;}
.hsc-pop-card h3{margin:.3em 0;color:var(--hsc-green,#3CB34D);}
.hsc-pop-ok{margin-top:14px;background:var(--hsc-green,#3CB34D);color:#fff;border:none;border-radius:10px;padding:.6em 1.8em;font:inherit;font-weight:700;cursor:pointer;}

/* ---- join / participants ---- */
.hsc-join-btn.is-registered{background:var(--hsc-muted);}
.hsc-join-msg{margin:.5em 0 0;font-size:.95em;}
.hsc-participants-count{font-weight:700;}
.hsc-participants-count .sep{color:var(--hsc-line);margin:0 .4em;}
.hsc-participants-list{list-style:none;margin:.6em 0 0;padding:0;display:flex;flex-direction:column;gap:.5em;}
.hsc-participants-list li{display:flex;align-items:center;gap:.6em;}
.hsc-participants-list img{border-radius:50%;}
.hsc-leader-badge{background:var(--hsc-green);color:#fff;border-radius:999px;padding:.1em .7em;font-size:.78em;font-weight:700;}

/* ---- actions row ---- */
.hsc-actions{display:flex;gap:10px;flex-wrap:wrap;}

/* ---- map ---- */
.hsc-map{position:relative;}
.hsc-map img{width:100%;border-radius:var(--hsc-radius);display:block;}
.hsc-map-btn{position:absolute;inset-inline-start:12px;bottom:12px;background:rgba(0,0,0,.7);color:#fff;
	text-decoration:none;border-radius:8px;padding:.4em 1em;font-weight:700;}

/* ---- ranking tab ---- */
.hsc-ranking-bar{height:14px;background:#eef1f3;border-radius:8px;overflow:hidden;margin:8px 0;}
.hsc-ranking-bar span{display:block;height:100%;background:var(--hsc-green);}
.hsc-ranking-table{border-collapse:collapse;margin-top:8px;}
.hsc-ranking-table td{border-bottom:1px solid var(--hsc-line);padding:8px 18px 8px 0;}

/* ---- my-account content list ---- */
.hsc-mycontent{list-style:none;margin:0;padding:0;}
.hsc-mycontent-row{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--hsc-line);}
.hsc-mc-title{font-weight:700;}
.hsc-mc-status{color:var(--hsc-muted);font-size:.9em;}
.hsc-mc-link{margin-inline-start:auto;color:var(--hsc-green);font-weight:700;text-decoration:none;}