/* Panel: Text + Image */
.panel-text-image { position: relative; }
.panel-text-image .text-content { position: relative; }
.panel-text-image .panel-heading { color: #051D2E; }

/* Panel content */
.panel-text-image .panel-content { color: #051D2E; }
.panel-text-image .panel-content p { margin: 0 0 24px 0; }
.panel-text-image .panel-content p:last-child { margin-bottom: 0; }

/* Bullet lists */
.panel-text-image .panel-content ul { list-style: none; margin: 0 0 24px 0; padding: 0; }
.panel-text-image .panel-content ul li { position: relative; padding-left: 28.5px; margin-bottom: 18px; }
.panel-text-image .panel-content ul li:last-child { margin-bottom: 0; }
.panel-text-image .panel-content ul li::before { content: ''; position: absolute; left: 8px; top: 10px; width: 5px; height: 5px; background-color: #051D2E; border-radius: 50%; }
.panel-text-image .panel-content ol { margin: 0 0 24px 0; padding-left: 28px; }
.panel-text-image .panel-content ol li { margin-bottom: 18px; }
.panel-text-image .panel-content ol li:last-child { margin-bottom: 0; }

/* Image styling */
.panel-text-image .image-wrapper { position: relative; max-width:480px; }
.panel-text-image .panel-image { width: 100%; height: auto; border-radius: 12px; display: block; }
.bubble_text_over_image { font-size: 16px; font-weight: 600; line-height: 22px; padding:5px 14px; border-radius: 50px; background: #FFF; color:#051D2E; position:absolute; left:10px; bottom:10px; }

@media (min-width:1200px) {
	.panel-text-image .image-wrapper { float:right; }
	.panel-text-image.panel-class-image-align-heading .align-items-center { align-items:unset !important; -ms-flex-align:unset !important; -webkit-box-align:unset !important; }
	.panel-text-image.panel-class-image-align-heading .image-wrapper { padding-top:60px; }
}
@media (max-width:767px) {
	.panel-text-image .panel-content { margin-bottom:30px; }
	.panel-text-image .image-wrapper { height:unset; }
	.panel-text-image .image-wrapper svg { width:100%; height: 84vw; }
	.panel-text-image .panel-image { height:auto; max-height:100vw; object-fit:cover; object-position: 50% 20%; }
	.bubble_text_over_image { bottom:unset; top:10px; }
}

/* Roles accordion: two-level list converted to FAQ-style accordion (mimics panel-faqs) */
.panel-text-image[class*="roles-accordion"] .faqs-accordion { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
.panel-text-image[class*="roles-accordion"] .faq-item { background-color: transparent; border-radius: 16px; padding: 0 0 8px 0; transition: background-color 0.2s; }
/*
.panel-text-image[class*="roles-accordion"] .faq-item.is-open { background-color: rgba(171, 202, 246, 0.2); }
*/
.panel-text-image[class*="roles-accordion"] .faq-toggle { width: 100%; display: flex; align-items: flex-start; gap: 16px; background: none; border: none; padding: 0; cursor: pointer; text-align: left; }
.panel-text-image[class*="roles-accordion"] .faq-icon { flex-shrink: 0; width: 24px; height: 24px; position: relative; }
.panel-text-image[class*="roles-accordion"] .faq-icon svg { position: absolute; top: 0; left: 0; transition: opacity 0.2s; }
.panel-text-image[class*="roles-accordion"] .faq-item .icon-minus { opacity: 0; }
.panel-text-image[class*="roles-accordion"] .faq-item .icon-plus  { opacity: 1; }
.panel-text-image[class*="roles-accordion"] .faq-item.is-open .icon-minus { opacity: 1; }
.panel-text-image[class*="roles-accordion"] .faq-item.is-open .icon-plus  { opacity: 0; }
.panel-text-image[class*="roles-accordion"] .faq-question-wrapper { flex: 1; min-width: 0; }
.panel-text-image[class*="roles-accordion"] .faq-question { font-size: 21px; font-weight: 600; line-height: 1.2; color: #051d2e; margin: 0; }
.panel-text-image[class*="roles-accordion"] .faq-answer { padding-left: 40px; margin-top: 10px; }
.panel-text-image[class*="roles-accordion"] .faq-answer-content { font-size: 16px; font-weight: 400; line-height: 1.4; color: #63666F; }
.panel-text-image[class*="roles-accordion"] .faq-answer-content p { margin-bottom: 1em; }
.panel-text-image[class*="roles-accordion"] .faq-answer-content p:last-child { margin-bottom: 0; }
.panel-text-image[class*="roles-accordion"] .faq-answer-content ul { list-style: none; margin: 0; padding: 0; }
.panel-text-image[class*="roles-accordion"] .faq-answer-content ul li { margin:0; padding:0; }
.panel-text-image[class*="roles-accordion"] .faq-answer-content ul li::before { display: none; }

@media (max-width: 767px) {
	.panel-text-image[class*="roles-accordion"] .faqs-accordion { margin-bottom:30px; }
	.panel-text-image[class*="roles-accordion"] .faq-question { font-size: 18px; }
	.panel-text-image[class*="roles-accordion"] .faq-item { padding: 0 0 8px 0; }
}


/* Seasonal harvests landing page: interactive map */
.interactive-map { }
.interactive-map g { cursor:pointer; }
.interactive-map g .state { fill:#ABCAF6; transition:all 0.3s; }
.interactive-map g .label { fill:#001D67; transition:all 0.3s; }
.interactive-map g.active .state,
.interactive-map g:hover .state { fill:#001D67; }
.interactive-map g.active .label,
.interactive-map g:hover .label { fill:#fff; }
.interactive-map-popout { position:absolute; z-index:200; width: 240px; border-radius: 10px; background: #FFF; box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.10); padding:22px 33px; }
.interactive-map-popout .item { display:flex; gap:11px; }
.interactive-map-popout .item + .item { margin-top:16px; }
.interactive-map-popout .item .icon  { flex:0 0 50px; background:#003EAB; color:#fff; font-size:12px; text-align:center; width:50px; height:50px; border-radius:8px; display: flex; justify-content: center; align-items: center; overflow:hidden; }
.interactive-map-popout .item .icon img { width:100%; height:100%; object-fit:contain; max-width:32px; max-height:32px; }
.interactive-map-popout .item .text  { flex:1 1 auto; font-weight: 400; line-height: 140%; font-size: 16px; color:#63666F; }
.interactive-map-popout .item strong { font-weight: 600; color:#051D2E; display:block; }

@media (min-width:992px) {
	.interactive-map-popout.popout-qld { margin:100px 0 0 50px; }
	.interactive-map-popout.popout-nsw { margin:200px 0 0 50px; }
	.interactive-map-popout.popout-vic { margin:250px 0 0 50px; }
	.interactive-map-popout.popout-tas { margin:300px 0 0 50px; }
	.interactive-map-popout.popout-sa  { margin:200px 0 0 -50px; }
	.interactive-map-popout.popout-wa  { margin:100px 0 0 -190px; }
	.interactive-map-popout.popout-nt  { margin:100px 0 0 -50px; }
}