/* ==== DDS Patterns — shared styles (front-end + editor) ==== */

/* ---------- Callouts (OU) ---------- */
:root {
  --dds-box-radius: 4px;
  --dds-box-padding: 15px 15px 15px 20px;
  --dds-color-text: #2b2b2b;

  --dds-info-border: #0e56a7;
  --dds-info-bg: #e9eaea;
  --dds-info-text: #4d4d4d;

  --dds-success-border: #1b7f4d;
  --dds-success-bg: #e8f5ee;
  --dds-success-text: #18362a;

  --dds-warning-border: #a05f00;
  --dds-warning-bg: #fff6e5;
  --dds-warning-text: #2b2b2b;

  --dds-tip-border: #6a5acd;
  --dds-tip-bg: #f1effb;
  --dds-tip-text: #2b2b2b;

  --dds-note-border: #3a7ca5;
  --dds-note-bg: #ebf5fb;
  --dds-note-text: #1f2d3d;

  --dds-caution-border: #b00020;
  --dds-caution-bg: #fdeaea;
  --dds-caution-text: #3b0b0b;

  --dds-code-bg: #0f172a0d;
  --dds-code-border: #d0d7de;
  
  --dds-blue: #1f55a5;
  --dds-blue-darker: #3a3381;
  --dds-green: #5AC2B3;
  --dds-grey: #B0ADCD;  

  /* Event card */
  --dds-event-border: #d0d7de;
  --dds-event-bg: #ffffff;
  --dds-event-shadow: 0 1px 2px rgba(16,24,40,.06);
  --dds-event-radius: 8px;
  --dds-event-padding: 16px 18px;
  --dds-event-title: #0f172a;
  --dds-event-meta: #475569;
  --dds-event-accent: #0e56a7;

  /* Accordion */
  --dds-acc-border: #8985B3;
  --dds-acc-summary-bg: #EBEBF2;
  --dds-acc-summary-active: #B0ADCD;
  --dds-acc-bg: #ffffff;
  --dds-acc-bg-hover: #D8D6E6;
  --dds-acc-title: #24285C;
  --dds-acc-body: #24285c;
  --dds-acc-meta: #ffffff;
  --dds-acc-brand: #0e56a7;
  --dds-acc-focus: #0e56a7;
  --dds-acc-radius: 0px;
  --dds-acc-radius-curve: 20px;
  --dds-acc-pad-y: 14px;
  --dds-acc-pad-x: 16px;
  --dds-acc-icon-size: 12px;
  --dds-acc-icon-stroke: 2px;

  /* Accordion controls */
  --dds-acc-ctrl-text: #0f172a;
  --dds-acc-ctrl-muted: #64748b;
  --dds-acc-ctrl-hover: #0e56a7;
  --dds-acc-summary-hover: #ffffff;
}


/*------------------------------------------------
#
# Base callout styling
#
--------------------------------------------------*/
.box--info,
.box--success,
.box--warning,
.box--tip,
.box--note,
.box--caution {
  border: 1px solid;
  border-left: 5px solid;
  padding: var(--dds-box-padding);
  margin: 0 0 20px 0;
  color: var(--dds-color-text);
  background-color: #fff;
  border-radius: 0px;
}
.box--info p:last-child,
.box--success p:last-child,
.box--warning p:last-child,
.box--tip p:last-child,
.box--note p:last-child,
.box--caution p:last-child { margin-bottom: 0; }

.box--info    { background-color: var(--dds-blue-darker); border-color: var(--dds-grey); border-left: 1px; }
.box--success { border-color: var(--dds-success-border); background-color: var(--dds-success-bg); color: var(--dds-success-text); }
.box--warning { border-color: var(--dds-warning-border); background-color: var(--dds-warning-bg); color: var(--dds-warning-text); }
.box--tip     { border-color: var(--dds-tip-border);     background-color: var(--dds-tip-bg);     color: var(--dds-tip-text); }
.box--note    { border-color: var(--dds-grey); border-left-color: var(--dds-green); color: var(--dds-info-text); border-top-right-radius: 100px; }
.box--caution { border-color: var(--dds-caution-border); background-color: var(--dds-caution-bg); color: var(--dds-caution-text); }

.box--info h3 { color: #fff; margin: 0 !important; padding: 10px !important; }
.box--info .box--info-content { padding: 10px !important; }
.box--info .box--info-content p { color: #fff; margin-bottom: 5px; }
.box--info .box--info-content .btn { padding: 15px 25px; }


/* Block-style toggles for Group */
.is-style-dds-info,
.is-style-dds-success,
.is-style-dds-warning,
.is-style-dds-tip,
.is-style-dds-note,
.is-style-dds-caution {
  border-left-width: 3px;
  border-style: solid;
  padding: var(--dds-box-padding);
  border-radius: var(--dds-box-radius);
}
.is-style-dds-info    { background: #fff; border-color: var(--dds-grey); border-left-color: var(--dds-blue); color: var(--dds-info-text); box-shadow: none; }
.is-style-dds-success { border-color: var(--dds-success-border); background-color: var(--dds-success-bg); color: var(--dds-success-text); }
.is-style-dds-warning { border-color: var(--dds-warning-border); background-color: var(--dds-warning-bg); color: var(--dds-warning-text); }
.is-style-dds-tip     { border-color: var(--dds-tip-border);     background-color: var(--dds-tip-bg);     color: var(--dds-tip-text); }
.is-style-dds-note    { background: #fff; border-color: var(--dds-grey); border-left-color: var(--dds-green); color: var(--dds-info-text); border-top-right-radius: 100px; }
.is-style-dds-caution { border-color: var(--dds-caution-border); background-color: var(--dds-caution-bg); color: var(--dds-caution-text); }

.is-style-dds-info h4::before { display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: 'Font Awesome 6 Free'; content: '\f05a'; margin-right: 16px; }
.is-style-dds-info h4 { font-size: 16px; }

/* Code block */
.box--code {
  background: var(--dds-code-bg);
  border: 1px solid var(--dds-code-border);
  border-radius: 6px;
  padding: 12px 14px;
  margin: 0 0 20px 0;
}
.box--code p:first-child { margin-top: 0; font-weight: 600; }
.box--code pre { margin: 0; overflow: auto; }
.box--code pre code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.9rem;
  line-height: 1.5;
  tab-size: 4;
}
/* Block-style on core/code */
.wp-block-code.is-style-dds-code {
  background: var(--dds-code-bg);
  border: 1px solid var(--dds-code-border);
  border-radius: 6px;
  padding: 12px 14px;
}
.wp-block-code.is-style-dds-code code {
  display: block;
  overflow: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.9rem;
  line-height: 1.5;
}



/*------------------------------------------------
#
# Event card styles
#
--------------------------------------------------*/
.card--event {
  background: var(--dds-event-bg);
  border: 1px solid var(--dds-event-border);
  border-radius: var(--dds-event-radius);
  padding: var(--dds-event-padding);
  box-shadow: var(--dds-event-shadow);
  margin: 0 0 20px 0;
}
.card--event .event-title { margin: 0 0 8px 0; color: var(--dds-event-title); line-height: 1.25; }
.card--event .event-meta { margin: 0 0 8px 0; }
.card--event .event-meta p { margin: 0 0 4px 0; color: var(--dds-event-meta); font-size: 0.95rem; }
.card--event .event-summary { margin: 8px 0 12px 0; }
.card--event .event-actions .wp-block-button__link { background: var(--dds-event-accent); border-radius: 6px; }
.card--event .event-actions .wp-block-button__link:hover,
.card--event .event-actions .wp-block-button__link:focus { filter: brightness(0.95); }
@media (max-width: 480px) { .card--event { padding: 14px 16px; } }



/*------------------------------------------------
#
# Accordion styling
#
--------------------------------------------------*/
.dds-accordion-group { margin: 0 0 20px 0; }
.wp-block-details.dds-accordion {
  border: 1px solid var(--dds-acc-border);
  border-radius: var(--dds-acc-radius);
  border-top-right-radius: var(--dds-acc-radius-curve);
  background: var(--dds-acc-bg);
  margin: 0 0 10px 0;
  overflow: clip;
}
.wp-block-details.dds-accordion > summary {
  background:var(--dds-acc-summary-bg);
  list-style: none;
  cursor: pointer;
  padding: var(--dds-acc-pad-y) var(--dds-acc-pad-x);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  color: var(--dds-acc-title);
  position: relative;  
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
}
.wp-block-details.dds-accordion > summary:hover { background: var(--dds-acc-bg-hover); }
/* .wp-block-details.dds-accordion > summary:hover::after { } */
.wp-block-details.dds-accordion > summary::-webkit-details-marker { display: none; }
.wp-block-details.dds-accordion > summary::after {
  content:"\f078"; 
  font-family: "Font Awesome 6 Free"; 
  display: inline-block; 
  transition: transform 150ms ease;
  margin-left: 12px;
}
.wp-block-details.dds-accordion[open] > summary { background: var(--dds-acc-summary-active); }
.wp-block-details.dds-accordion[open] > summary::after { transform: rotate(180deg); }
.wp-block-details.dds-accordion > summary:focus-visible {
  outline: 3px solid var(--dds-acc-focus);
  outline-offset: 3px;
  border-radius: calc(var(--dds-acc-radius) - 2px);
}
.wp-block-details.dds-accordion > *:not(summary) {
  padding: 20px var(--dds-acc-pad-x) var(--dds-acc-pad-y) var(--dds-acc-pad-x);
  color: var(--dds-acc-body);
}
.wp-block-details.dds-accordion[open] { /*border-left: 3px solid var(--dds-acc-brand);*/ }

/* Block-style on core/details */
.wp-block-details.is-style-dds-accordion { border: 1px solid var(--dds-acc-border); border-radius: var(--dds-acc-radius); background: var(--dds-acc-bg); margin: 0 0 10px 0; overflow: clip; }
.wp-block-details.is-style-dds-accordion > summary { list-style: none; cursor: pointer; padding: var(--dds-acc-pad-y) var(--dds-acc-pad-x); display: grid; grid-template-columns: 1fr auto; align-items: center; font-weight: 600; color: var(--dds-acc-title); position: relative; }
.wp-block-details.is-style-dds-accordion > summary:hover { background: var(--dds-acc-bg-hover); }
.wp-block-details.is-style-dds-accordion > summary::-webkit-details-marker { display: none; }
.wp-block-details.is-style-dds-accordion > summary::after {
  content: ""; width: var(--dds-acc-icon-size); height: var(--dds-acc-icon-size);
  border-right: var(--dds-acc-icon-stroke) solid var(--dds-acc-meta);
  border-bottom: var(--dds-acc-icon-stroke) solid var(--dds-acc-meta);
  transform: rotate(-45deg); transition: transform 150ms ease; margin-left: 12px;
}
.wp-block-details.is-style-dds-accordion[open] > summary::after { transform: rotate(45deg); }
.wp-block-details.is-style-dds-accordion > *:not(summary) { padding: 20px var(--dds-acc-pad-x) var(--dds-acc-pad-y) var(--dds-acc-pad-x); color: var(--dds-acc-body); }
.wp-block-details.is-style-dds-accordion[open] { border-left: 3px solid var(--dds-acc-brand); }

/* Accordion controls (caret + label) */
.dds-accordion-controls { margin: 0 0 8px 0; }
.dds-acc-ctrl { margin: 0; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.dds-acc-sep { color: var(--dds-acc-ctrl-muted); }
.dds-acc-link {
  display: inline-flex; align-items: center; gap: 8px;
  text-decoration: none; color: var(--dds-acc-ctrl-text); font-weight: 600;
}
.dds-acc-link:hover, 
.dds-acc-link:focus { color: var(--dds-acc-ctrl-hover); text-decoration: underline; }
.dds-caret::after {
  display: inline-block; 
  transform: rotate(-0deg); 
  margin-right: 2px;
  content:"\f078"; 
  font-family: "Font Awesome 6 Free";
}
.dds-caret.ddsc-open { transform: rotate(180deg); }

/* Optional: wrap controls + accordion in a light "card" */
.dds-accordion-card {
  border: 1px solid var(--dds-acc-border);
  border-radius: var(--dds-acc-radius);
  background: #fff;
  padding: 10px;
}

.dds-accordion ol, .dds-accordion ul{margin:0 20px 20px 20px;}
.dds-accordion .wp-block-columns figure.wp-block-image{margin:10px 0 20px 0;}
.dds-accordion .wp-block-columns h3{margin:10px 10px 20px 10px !important;}

/* RTL mirroring */
html[dir="rtl"] .box--info,
html[dir="rtl"] .box--success,
html[dir="rtl"] .box--warning,
html[dir="rtl"] .box--tip,
html[dir="rtl"] .box--note,
html[dir="rtl"] .box--caution {
  border-left-width: 0; border-right-width: 3px;
  padding: 15px 20px 15px 15px;
}