.acp-wrapper { width: 100%; }
.acp-container { width: 100%; }

/* BOTD card (server-rendered) uses CSS variables */
.acp-botd{
  /* defaults */
  --acp-botd-bg-color: #333;
  --acp-botd-bg-layer: none;
  --acp-botd-bg-image: none;
  --acp-botd-text: #fff;
  --acp-botd-accent: #ffd700;
  --acp-botd-btn-bg: var(--acp-botd-accent);
  --acp-botd-btn-text: #111;
  --acp-botd-border: 1px solid rgba(255,255,255,.12);
  --acp-botd-radius: 14px;
  --acp-botd-shadow: 0 14px 32px rgba(0,0,0,.22);
  --acp-botd-width: 520px;
  --acp-botd-align: left;

  width: min(100%, var(--acp-botd-width));
  color: var(--acp-botd-text);
  border: var(--acp-botd-border);
  border-radius: var(--acp-botd-radius);
  box-shadow: var(--acp-botd-shadow);

  background-color: var(--acp-botd-bg-color);
  background-image: var(--acp-botd-bg-image), var(--acp-botd-bg-layer);
  background-size: cover;
  background-position: center;

  padding: 30px 40px;
}


.acp-wrapper code {
	color: #000 !important;
	/* 
	border: 1px solid #a2322a;
    border-radius: 20px; 
	padding: 20px !important; 
	*/
	display: block;
    width: fit-content;
}
.acp-wrapper .acp-botd{
  /* align inside wrapper */
  margin-top: 10px;
  margin-bottom: 10px;
}
.acp-wrapper .acp-botd[style*="--acp-botd-align:center"]{ margin-left:auto; margin-right:auto; }
.acp-wrapper .acp-botd[style*="--acp-botd-align:right"]{ margin-left:auto; margin-right:0; }
.acp-wrapper .acp-botd[style*="--acp-botd-align:left"]{ margin-left:0; margin-right:auto; }

.acp-botd__header{
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 8px;
}

.acp-botd__league{
  opacity: .9;
  font-size: 12px;
  margin-bottom: 6px;
}

.acp-botd__match{
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 6px;
}

.acp-botd__selection{
  font-size: 13px;
  opacity: .95;
  margin-bottom: 10px;
}

.acp-botd__desc{
  font-size: 13px;
  opacity: .95;
  margin: 8px 0 12px;
  line-height: 1.35;
}

.acp-botd__odds{
  display: flex;
  gap: 10px;
  align-items: baseline;
  margin-top: 6px;
  margin-bottom: 10px;
}

.acp-botd__odds-old{
  opacity: .7;
  text-decoration: line-through;
}

.acp-botd__odds-new{
  color: var(--acp-botd-accent);
  font-weight: 800;
  font-size: 18px;
}

.acp-botd__footer{
  font-size: 12px;
  opacity: .85;
  margin-top: 6px;
}

.acp-botd__cta{
  margin-top: 12px;
}

.acp-botd-archive__selections {
    padding-left: 20px;
    margin: 20px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.acp-botd-archive__selections .acp-botd-archive__selection-row {
	font-size: 14px;
    opacity: 0.8;
}
.acp-botd-archive__selections .acp-botd-archive__selection-row::before {
	content: '\2605';
	margin-right: 10px;
}

.acp-botd__cta,
.acp-botd__btn{
  display: inline-block;
  padding: 10px 14px;
  border-radius: 10px;
  background: var(--acp-botd-btn-bg);
  color: var(--acp-botd-btn-text);
  font-weight: 700;
  text-decoration: none;
}

.acp-botd--empty,
.acp-botd--closed,
.acp-botd--error{
  padding: 14px;
  border-radius: 10px;
  background: rgba(0,0,0,.06);
  color: #222;
}


.acp-botd a.acp-botd__cta{ color: var(--acp-botd-btn-text); background: var(--acp-botd-btn-bg); }


/* ------------------------------------------------------------
 * BOTD archive dropdown
 * ------------------------------------------------------------ */

.acp-botd-archive{
  width: 100%;
  max-width: 900px;
  margin: 18px 0;
  padding: 16px;
  border-radius: 12px;
  background: rgba(0,0,0,.03);
}

.acp-botd-archive__head{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.acp-botd-archive__title{
  margin: 0;
  font-size: 20px;
  font-weight: 800;
}

.acp-botd-archive__label{
  display: flex;
  gap: 8px;
  align-items: center;
}

.acp-botd-archive__label-text{
  font-size: 13px;
  opacity: .85;
}

.acp-botd-archive__select{
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  min-width: 160px;
}

.acp-botd-archive__card{
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}

.acp-botd-archive__card-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.acp-botd-archive__league{
  font-size: 12px;
  opacity: .75;
  margin-bottom: 4px;
}

.acp-botd-archive__match{
  font-size: 16px;
  font-weight: 800;
  margin-bottom: 4px;
}

.acp-botd-archive__selection{
  font-size: 13px;
  opacity: .8;
}

.acp-botd-archive__badge {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(231,76,60,.12);
  color: #e74c3c;
  width: fit-content;
  margin: 10px 0;
}
.acp-botd-archive__header label {
  font-size: 22px;
  font-weight: 600;
}

.acp-botd-archive__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 15px;
}
.acp-botd-archive__odds{
  display: flex;
  gap: 10px;
  align-items: baseline;
}

.acp-botd-archive__odds-old{
  opacity: .6;
  text-decoration: line-through;
}

.acp-botd-archive__odds-new{
  font-weight: 900;
  font-size: 18px;
}

.acp-botd-archive__end{
  margin-top: 8px;
  font-size: 12px;
  opacity: .75;
}

.acp-botd-archive-empty{
  padding: 14px;
  border-radius: 10px;
  background: rgba(0,0,0,.04);
}