/* CDM Product Reviews — front-end styles
   Brand palette (only these four colours are used):
     #000      ink / headings / selected age / "Complete" badge / buttons
     #EE7203   accent: filled stars, links, "In progress" badge, bar fill, alerts, success
     #6D6D6D   muted / secondary text
     #c8c8c8   borders, empty stars, tracks
   Buttons reuse the theme's .btn-black / .btn-gray classes. */
.cdmr-block,
.cdmr-modal,
.cdmr-card-rating {
	--cdmr-ink: #000;
	--cdmr-accent: #EE7203;
	--cdmr-muted: #6D6D6D;
	--cdmr-border: #c8c8c8;
	--cdmr-star: #EE7203;
	--cdmr-star-empty: #c8c8c8;
	--cdmr-radius: 8px;
	color: var(--cdmr-ink);
	box-sizing: border-box;
}
.cdmr-block *, .cdmr-modal *, .cdmr-card-rating * { box-sizing: border-box; }

/* Stars */
.cdmr-stars { display: inline-flex; gap: 1px; line-height: 1; vertical-align: middle; }
.cdmr-star { color: var(--cdmr-star-empty); font-size: 1.05em; }
.cdmr-star--full { color: var(--cdmr-star); }

/* Card rating */
.cdmr-card-rating { display: flex; align-items: center; gap: 6px; margin: 6px 0 10px; font-size: 14px; }
.cdmr-card-rating .cdmr-stars { font-size: 16px; }
.cdmr-card-rating__num { font-weight: 700; color: var(--cdmr-ink); }
.cdmr-card-rating__count { color: var(--cdmr-muted); }
.cdmr-card-rating__count--empty { font-size: 13px; }

/* Block / summary */
.cdmr-block { margin: 1.5rem 0; }
.cdmr-block__heading { font-size: 1.4rem; margin: 0 0 1rem; color: var(--cdmr-ink); }
.cdmr-summary {
	display: grid; grid-template-columns: minmax(170px, 1fr) 2fr; gap: 1.25rem 2rem;
	align-items: center; padding: 1.25rem 1.5rem; border: 1px solid var(--cdmr-border);
	border-radius: 10px; margin-bottom: 1.25rem;
}
.cdmr-summary__avg { font-size: 2.6rem; font-weight: 700; line-height: 1; color: var(--cdmr-ink); }
.cdmr-summary__outof { color: var(--cdmr-muted); margin-left: 2px; }
.cdmr-summary__score .cdmr-stars { display: block; margin: .4rem 0; font-size: 1.25rem; }
.cdmr-summary__count { display: block; color: var(--cdmr-muted); font-size: .9rem; }
.cdmr-summary__bars { display: flex; flex-direction: column; gap: 6px; }
.cdmr-bar { display: grid; grid-template-columns: 36px 1fr 32px; align-items: center; gap: 8px; font-size: .85rem; }
.cdmr-bar__label { color: var(--cdmr-muted); }
.cdmr-bar__track { background: var(--cdmr-border); height: 8px; border-radius: 4px; overflow: hidden; }
.cdmr-bar__fill { display: block; height: 100%; background: var(--cdmr-accent); }
.cdmr-bar__count { color: var(--cdmr-muted); text-align: right; }

/* Review list */
.cdmr-list { list-style: none; margin: 0; padding: 0; }
.cdmr-review { padding: 1.15rem 0; border-bottom: 1px solid var(--cdmr-border); }
.cdmr-review__head { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.cdmr-review__title { margin: 0; font-size: 1.02rem; color: var(--cdmr-ink); }
.cdmr-review__meta { display: flex; gap: .75rem; color: var(--cdmr-muted); font-size: .85rem; margin: .25rem 0 .5rem; }
.cdmr-review__author { font-weight: 600; color: var(--cdmr-ink); }
.cdmr-review__body { margin: 0; }
.cdmr-review__body p { margin: 0 0 .5rem; }
.cdmr-empty { color: var(--cdmr-muted); padding: 1.25rem 0; }
.cdmr-loadmore-wrap { text-align: center; margin-top: 1rem; }

/* Modal shell */
.cdmr-modal[hidden] { display: none; }
.cdmr-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.cdmr-modal__overlay { position: absolute; inset: 0; background: rgba(0,0,0,.55); }
.cdmr-modal__dialog {
	position: relative; background: #fff; border-radius: 12px; width: 100%; max-width: 620px;
	max-height: 92vh; overflow-y: auto; padding: 1.5rem 1.75rem 1.75rem; box-shadow: 0 20px 60px rgba(0,0,0,.3);
}
body.cdmr-modal-open { overflow: hidden; }
.cdmr-modal__header { display: flex; align-items: center; gap: .85rem; padding-bottom: 1rem; border-bottom: 1px solid var(--cdmr-border); }
.cdmr-modal__thumb { width: 48px; height: 48px; object-fit: contain; flex: 0 0 auto; }
.cdmr-modal__header h3 { margin: 0; font-size: 1.05rem; line-height: 1.3; color: var(--cdmr-ink); flex: 1; }
.cdmr-modal__close { background: none; border: 0; font-size: 1.9rem; line-height: 1; cursor: pointer; color: var(--cdmr-muted); flex: 0 0 auto; }
.cdmr-required-note[hidden] { display: none; }
.cdmr-required-note { color: var(--cdmr-muted); font-size: .85rem; margin: .9rem 0; padding-bottom: .9rem; border-bottom: 1px solid var(--cdmr-border); }

/* Step indicator */
.cdmr-step[hidden] { display: none; }
.cdmr-step { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.1rem; }
.cdmr-step__num { width: 26px; height: 26px; border: 1px solid var(--cdmr-ink); color: var(--cdmr-ink); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: .85rem; }
.cdmr-step__label { font-weight: 600; color: var(--cdmr-ink); }
.cdmr-step__badge { margin-left: auto; background: var(--cdmr-accent); color: #fff; border-radius: 14px; padding: 3px 12px; font-size: .78rem; font-weight: 600; }
.cdmr-step__badge--complete { background: var(--cdmr-ink); }

/* Form */
.cdmr-form[hidden] { display: none; }
.cdmr-field { margin-bottom: 1.1rem; }
.cdmr-field__labelrow { display: flex; justify-content: space-between; align-items: baseline; }
.cdmr-field label, .cdmr-label { display: block; font-weight: 700; margin-bottom: .4rem; font-size: .95rem; color: var(--cdmr-ink); }
.cdmr-field em { color: var(--cdmr-accent); font-style: normal; }
.cdmr-guidelines { font-size: .85rem; color: var(--cdmr-accent); }
.cdmr-field input[type="text"], .cdmr-field input[type="email"], .cdmr-field textarea {
	width: 100%; padding: .7rem .8rem; border: 1px solid var(--cdmr-border); border-radius: var(--cdmr-radius); font: inherit; color: var(--cdmr-ink);
}
.cdmr-field textarea { resize: vertical; min-height: 120px; }
.cdmr-field input:focus, .cdmr-field textarea:focus { outline: none; border-color: var(--cdmr-accent); box-shadow: 0 0 0 2px rgba(238,114,3,.22); }
.cdmr-counter { display: block; text-align: right; color: var(--cdmr-muted); font-size: .8rem; margin-top: .3rem; }
.cdmr-counter--bad { color: var(--cdmr-accent); }
.cdmr-hint { display: block; color: var(--cdmr-muted); font-size: .8rem; margin-top: .3rem; font-weight: 400; }

/* Star rating input — natural order, click Nth to fill 1..N (JS-driven) */
.cdmr-rating-input { display: inline-flex; flex-direction: row; gap: 8px; }
.cdmr-rating-input__star { position: relative; }
.cdmr-rating-input__star input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cdmr-rating-input__star span[aria-hidden] {
	display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px;
	border: 1px solid var(--cdmr-border); border-radius: 6px; font-size: 1.9rem;
	color: var(--cdmr-star-empty); cursor: pointer; transition: color .1s, border-color .1s;
}
.cdmr-rating-input__star--on span[aria-hidden] { color: var(--cdmr-star); border-color: var(--cdmr-star); }
.cdmr-rating-input__star input:focus-visible ~ span[aria-hidden] { outline: 2px solid var(--cdmr-ink); }

/* Age button group */
.cdmr-age { display: flex; flex-wrap: wrap; gap: 10px; }
.cdmr-age__option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cdmr-age__option span {
	display: inline-flex; align-items: center; justify-content: center; min-width: 64px;
	padding: .55rem .9rem; border: 1px solid var(--cdmr-border); border-radius: 6px; cursor: pointer; font-size: .9rem;
	color: var(--cdmr-ink); transition: all .1s;
}
.cdmr-age__option input:checked + span { background: var(--cdmr-ink); border-color: var(--cdmr-ink); color: #fff; }
.cdmr-age__option input:focus-visible + span { outline: 2px solid var(--cdmr-ink); }

/* Terms */
.cdmr-field--check label { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400; font-size: .9rem; line-height: 1.45; color: var(--cdmr-ink); }
.cdmr-field--check input { margin-top: 3px; flex: 0 0 auto; }
.cdmr-field--check a { color: var(--cdmr-accent); text-decoration: underline; }

/* Honeypot + messages */
.cdmr-hp { position: absolute !important; left: -9999px !important; height: 0; overflow: hidden; }
.cdmr-form__message { margin: .5rem 0; font-size: .9rem; }
.cdmr-form__message--error { color: var(--cdmr-accent); }
.cdmr-form__message ul { margin: .25rem 0 0; padding-left: 1.15rem; }
.cdmr-form__message li { margin: .15rem 0; }
.cdmr-form__actions { margin-top: .75rem; }
.cdmr-form__actions .cdmr-submit { min-width: 160px; }

/* Invalid fields */
.cdmr-field.cdmr-invalid input, .cdmr-field.cdmr-invalid textarea { border-color: var(--cdmr-accent); box-shadow: 0 0 0 2px rgba(238,114,3,.18); }
.cdmr-field.cdmr-invalid .cdmr-rating-input__star span[aria-hidden],
.cdmr-field.cdmr-invalid .cdmr-age__option span { border-color: var(--cdmr-accent); }

/* Success panel — stands out, manual close only */
.cdmr-success[hidden] { display: none; }
.cdmr-success { text-align: center; padding: 1.5rem .5rem .5rem; border-top: 3px solid var(--cdmr-accent); margin-top: .5rem; }
.cdmr-success__icon {
	width: 64px; height: 64px; margin: 0 auto 1rem; border-radius: 50%;
	background: var(--cdmr-accent); color: #fff; font-size: 2rem; line-height: 64px;
}
.cdmr-success__title { margin: 0 0 .5rem; font-size: 1.4rem; color: var(--cdmr-ink); }
.cdmr-success__text { margin: 0 auto 1.25rem; max-width: 420px; color: var(--cdmr-muted); }
.cdmr-success__close { min-width: 160px; }

.cdmr-block .screen-reader-text, .cdmr-modal .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }

@media (max-width: 600px) {
	.cdmr-summary { grid-template-columns: 1fr; }
	.cdmr-rating-input__star span[aria-hidden] { width: 46px; height: 46px; font-size: 1.6rem; }
	.cdmr-modal__dialog { padding: 1.25rem; }
}

/* ---- Reviews list: show 5, scroll for the rest (JS sets max-height) ---- */
.cdmr-list--scroll { overflow-y: auto; -webkit-overflow-scrolling: touch; padding-right: 10px; scrollbar-width: thin; scrollbar-color: #c8c8c8 transparent; }
.cdmr-list--scroll::-webkit-scrollbar { width: 8px; }
.cdmr-list--scroll::-webkit-scrollbar-thumb { background: #c8c8c8; border-radius: 4px; }
.cdmr-list--scroll::-webkit-scrollbar-track { background: transparent; }

/* ---- Mobile responsiveness for the reviews list ---- */
@media (max-width: 600px) {
	.cdmr-block { margin: 1.25rem 0; }
	.cdmr-block__heading { font-size: 1.2rem; }
	.cdmr-summary { padding: 1rem; }
	.cdmr-summary__avg { font-size: 2.1rem; }
	.cdmr-review { padding: 1rem 0; }
	.cdmr-review__head { gap: .5rem; }
	.cdmr-review__title { font-size: .98rem; }
	.cdmr-review__meta { flex-wrap: wrap; gap: .4rem .75rem; }
	.cdmr-review__body { font-size: .95rem; overflow-wrap: anywhere; }
	.cdmr-list--scroll { padding-right: 6px; }
}

/* ---- Product card: rating + write-review link ---- */
.cdmr-card { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 8px 0 10px; }
.cdmr-card .cdmr-card-rating { margin: 0; }
.cdmr-card-review-link { color: #EE7203; font-size: 14px; font-weight: 600; text-decoration: underline; cursor: pointer; background: none; border: 0; }
.cdmr-card-review-link:hover { color: #EE7203; opacity: .82; }

/* ---- Review guidelines popup (layered above the review modal) ---- */
.cdmr-guidelines { background: none; border: 0; padding: 0; cursor: pointer; font-size: .85rem; color: #EE7203; text-decoration: underline; }
.cdmr-guidelines:hover { opacity: .85; }
.cdmr-guidelines-modal { z-index: 100001; }
.cdmr-guidelines-modal__dialog { max-width: 560px; }
.cdmr-guidelines-content { font-size: .95rem; color: #000; padding-top: .75rem; }
.cdmr-guidelines-content p { margin: 0 0 .75rem; }
.cdmr-guidelines-content ul { margin: 0 0 .75rem; padding-left: 1.25rem; }
.cdmr-guidelines-content li { margin: .4rem 0; }
.cdmr-consent-note { color: #6D6D6D; font-size: .82rem; margin: .25rem 0 1rem; line-height: 1.45; }