/* Rota Akademi 1.2 — only the shortcode area is styled; site header/footer stay intact */
.rota-akademi{--ra-blue:#0755ad;--ra-navy:#081b39;--ra-muted:#536680;--ra-line:#dae4f1;width:100%;max-width:none;margin:0 auto 18px;color:var(--ra-navy);font-family:inherit}
.rota-akademi,.rota-akademi *{box-sizing:border-box}
.rota-webinar-body{max-width:1180px;width:calc(100% - 48px);margin:0 auto 0}
.rota-akademi-listhead{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:26px}
.rota-list-label{display:flex;align-items:center;gap:19px;min-width:0}
.rota-list-icon{height:61px;width:61px;display:grid;place-items:center;border-radius:18px;background:#e7f2ff;color:#0056b5;flex-shrink:0}
.rota-list-icon svg{width:31px;height:31px}
.rota-akademi .rota-list-title{font-size:clamp(22px,2.5vw,31px)!important;font-weight:800!important;letter-spacing:-.4px;color:var(--ra-navy)!important;margin:0!important;line-height:1.15!important}
.rota-month-controls{display:flex;align-items:center;border:1px solid #d5e2f0;border-radius:30px;overflow:hidden;height:47px;min-width:232px;background:#fff}
.rota-akademi .rota-month-controls button{flex:0 0 48px;width:48px;height:47px;border:0!important;border-radius:0!important;background:#fff!important;color:var(--ra-blue)!important;box-shadow:none!important;font-size:30px;line-height:1;font-weight:300;padding:0!important;cursor:pointer}
.rota-akademi .rota-month-controls button:hover{background:#e8f2fd!important}
.rota-month-title{display:block;flex:1;font-size:13px;font-weight:800;text-align:center;color:var(--ra-navy);min-width:128px}
.rota-event-list{display:grid;gap:11px}
.rota-event{display:flex;align-items:center;gap:22px;background:#fff;border:1px solid var(--ra-line);box-shadow:0 2px 6px rgba(6,40,88,.045);border-radius:14px;padding:16px 20px;min-height:101px}
.rota-event-date{flex:0 0 100px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-right:1px solid #d9e4f1;padding-right:18px;gap:2px}
.rota-event-day{display:block;color:var(--ra-navy);font-size:32px;font-weight:850;line-height:1}
.rota-event-month{font-size:13px;font-weight:700;color:#253d60;text-transform:uppercase;line-height:1.4}
.rota-event-weekday{font-size:12px;color:#253d60;line-height:1.3}
.rota-event-icon{flex:0 0 60px;width:60px;height:60px;display:grid;place-items:center;border-radius:14px;background:#e8f3ff;color:var(--ra-blue)}
.rota-event-icon svg{width:30px;height:30px}
.rota-event-info{flex:1;min-width:0}
.rota-akademi .rota-event-info h4{color:#0b1c38!important;font-size:18px!important;line-height:1.3!important;font-weight:800!important;margin:0 0 10px!important}
.rota-event-meta{display:flex;flex-wrap:wrap;gap:12px 27px;align-items:center;color:#23385a;font-size:13px}
.rota-event-meta-item{display:flex;align-items:center;gap:6px}
.rota-event-meta-item svg{width:17px;height:17px;flex:0 0 17px;color:var(--ra-blue)}
.rota-akademi .rota-event-info p{font-size:13px!important;line-height:1.35!important;color:var(--ra-muted)!important;margin:8px 0 0!important}
.rota-akademi .rota-join{display:inline-flex;flex:0 0 auto;gap:9px;align-items:center;justify-content:center;padding:14px 20px!important;border-radius:12px!important;background:var(--ra-blue)!important;color:#fff!important;text-decoration:none!important;font-size:15px!important;line-height:1.3!important;font-weight:700!important;white-space:nowrap;transition:background .15s ease}
.rota-akademi .rota-join:hover{background:#003f86!important;color:#fff!important}
.rota-join svg{width:19px;height:19px}
.rota-unavailable{flex:0 0 auto;display:inline-flex;align-items:center;min-height:39px;color:#6d8093;background:#f1f4f7;border-radius:9px;padding:11px 12px;white-space:nowrap;font-size:12px}
.rota-empty{padding:35px 16px;border:1px solid var(--ra-line);background:#fff;text-align:center;border-radius:12px;color:var(--ra-muted)}
.rota-akademi button:focus-visible,.rota-akademi a:focus-visible{outline:2px solid #146dc1;outline-offset:3px}
@media(max-width:850px){.rota-hero-copy{width:68%}.rota-event{gap:12px;padding:15px}.rota-event-date{flex-basis:73px;padding-right:11px}.rota-event-icon{width:48px;height:48px;flex-basis:48px}.rota-akademi .rota-event-info h4{font-size:16px!important}}
@media(max-width:650px){.rota-webinar-body{width:calc(100% - 30px);margin:0 auto 0}.rota-akademi-listhead{flex-direction:column;align-items:stretch;margin-bottom:16px}.rota-list-label{gap:12px}.rota-list-icon{height:45px;width:45px;border-radius:12px}.rota-list-icon svg{height:25px;width:25px}.rota-akademi .rota-list-title{font-size:22px!important}.rota-month-controls{align-self:flex-end;min-width:210px;height:40px}.rota-akademi .rota-month-controls button{height:40px;width:42px;flex-basis:42px}.rota-event{gap:11px;flex-wrap:wrap;min-height:0;padding:14px 12px}.rota-event-date{flex:0 0 55px;padding-right:9px}.rota-event-day{font-size:28px}.rota-event-month{font-size:11px}.rota-event-weekday{font-size:10px}.rota-event-icon{display:none}.rota-event-info{flex:1 1 calc(100% - 70px)}.rota-akademi .rota-event-info h4{font-size:15px!important;margin-bottom:7px!important}.rota-event-meta{font-size:12px;gap:7px 14px}.rota-akademi .rota-join,.rota-unavailable{margin-left:66px;width:calc(100% - 66px);justify-content:center}}

/* 1.3: No hero; webinar list starts immediately within the existing Elementor section. */

/* v1.6 — per-webinar images automatically fit without cropping or distortion. */
.rota-event-wrap{overflow:hidden;border:1px solid var(--ra-line);border-radius:15px;background:#fff;box-shadow:0 2px 8px rgba(6,40,88,.045)}
.rota-akademi .rota-event-wrap .rota-event{border:0;border-radius:0;box-shadow:none}
.rota-akademi .rota-event-poster{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;overflow:hidden;background:#0a367a;padding:14px}
.rota-akademi .rota-event-poster img{display:block!important;object-fit:contain!important;object-position:center!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:360px!important;min-width:0!important;aspect-ratio:auto!important;margin:0 auto!important;transform:none!important;border-radius:5px}
/* Portrait posters stay compact, centered and entirely visible. */
.rota-akademi .rota-poster-portrait{padding:16px}
.rota-akademi .rota-poster-portrait img{max-height:320px!important;max-width:min(100%,380px)!important}
/* A wide banner uses available width while maintaining its native proportions. */
.rota-akademi .rota-poster-landscape img{max-height:360px!important;max-width:100%!important}
.rota-akademi .rota-poster-square img{max-height:340px!important}
@media(max-width:650px){.rota-akademi .rota-event-poster{padding:10px}.rota-akademi .rota-event-poster img{max-height:260px!important}.rota-akademi .rota-poster-portrait img{max-height:275px!important}}

/* v1.7: landscape artwork fills the full webinar card width with no side gutters.
   Its intrinsic aspect ratio is preserved: never crop, stretch, or cap the height. */
.rota-akademi .rota-event-poster.rota-poster-landscape{
    display:block!important;
    padding:0!important;
    background:transparent!important;
    height:auto!important;
    min-height:0!important;
}
.rota-akademi .rota-event-poster.rota-poster-landscape img{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:0!important;
    padding:0!important;
    border-radius:0!important;
    aspect-ratio:auto!important;
}
@media(max-width:650px){
    .rota-akademi .rota-event-poster.rota-poster-landscape{padding:0!important;}
    .rota-akademi .rota-event-poster.rota-poster-landscape img{width:100%!important;max-height:none!important;}
}

/* v1.8: Larger, more legible information strip below each webinar poster. */
@media (min-width: 651px) {
  .rota-akademi .rota-event-wrap .rota-event {
    min-height: 132px!important;
    padding: 25px 28px!important;
    gap: 25px!important;
  }
  .rota-akademi .rota-event-wrap .rota-event-date {
    flex-basis: 112px!important;
    padding-right: 23px!important;
  }
  .rota-akademi .rota-event-wrap .rota-event-day {font-size:39px!important;}
  .rota-akademi .rota-event-wrap .rota-event-month {font-size:15px!important;}
  .rota-akademi .rota-event-wrap .rota-event-weekday {font-size:13px!important;}
  .rota-akademi .rota-event-wrap .rota-event-icon {width:68px!important;height:68px!important;flex-basis:68px!important;}
  .rota-akademi .rota-event-wrap .rota-event-icon svg {width:34px!important;height:34px!important;}
  .rota-akademi .rota-event-wrap .rota-event-info h4 {font-size:22px!important;line-height:1.35!important;margin-bottom:12px!important;}
  .rota-akademi .rota-event-wrap .rota-event-meta {font-size:15px!important;gap:12px 25px!important;}
  .rota-akademi .rota-event-wrap .rota-event-meta-item svg {width:19px!important;height:19px!important;flex-basis:19px!important;}
  .rota-akademi .rota-event-wrap .rota-join {font-size:18px!important;padding:20px 30px!important;min-height:62px!important;border-radius:14px!important;gap:10px!important;}
  .rota-akademi .rota-event-wrap .rota-unavailable {font-size:14px!important;padding:15px 19px!important;}
}
@media (min-width: 651px) and (max-width: 850px) {
  .rota-akademi .rota-event-wrap .rota-event {gap:14px!important;padding:20px 16px!important;}
  .rota-akademi .rota-event-wrap .rota-event-info h4 {font-size:18px!important;}
  .rota-akademi .rota-event-wrap .rota-event-date {flex-basis:80px!important;padding-right:13px!important;}
  .rota-akademi .rota-event-wrap .rota-event-icon {width:54px!important;height:54px!important;flex-basis:54px!important;}
  .rota-akademi .rota-event-wrap .rota-join {font-size:15px!important;padding:16px 18px!important;min-height:54px!important;border-radius:12px!important;gap:9px!important;}
}
@media (max-width: 650px) {
  .rota-akademi .rota-event-wrap .rota-event {padding:20px 15px!important;gap:12px!important;}
  .rota-akademi .rota-event-wrap .rota-event-day {font-size:32px!important;}
  .rota-akademi .rota-event-wrap .rota-event-info h4 {font-size:17px!important;line-height:1.4!important;}
  .rota-akademi .rota-event-wrap .rota-event-meta {font-size:13px!important;}
  .rota-akademi .rota-event-wrap .rota-join {font-size:16px!important;padding:16px 20px!important;min-height:52px!important;border-radius:12px!important;gap:9px!important;}
}


/* v2.0: CTA fills the full right-side action area on desktop/tablet. */
@media (min-width: 651px) {
  .rota-akademi .rota-event-wrap .rota-event {
    align-items: stretch !important;
  }
  .rota-akademi .rota-event-wrap .rota-event-info {
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    padding-right: 8px !important;
  }
  .rota-akademi .rota-event-wrap .rota-join,
  .rota-akademi .rota-event-wrap .rota-unavailable {
    align-self: stretch !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    width: 230px !important;
    min-width: 230px !important;
    max-width: 230px !important;
    min-height: 100% !important;
    border-radius: 14px !important;
    white-space: normal !important;
    line-height: 1.25 !important;
    padding: 18px 18px !important;
  }
  .rota-akademi .rota-event-wrap .rota-join {
    font-size: 18px !important;
    font-weight: 800 !important;
    gap: 10px !important;
  }
  .rota-akademi .rota-event-wrap .rota-unavailable {
    font-size: 15px !important;
    font-weight: 700 !important;
  }
}
@media (min-width: 651px) and (max-width: 850px) {
  .rota-akademi .rota-event-wrap .rota-join,
  .rota-akademi .rota-event-wrap .rota-unavailable {
    width: 190px !important;
    min-width: 190px !important;
    max-width: 190px !important;
    padding: 16px 14px !important;
  }
  .rota-akademi .rota-event-wrap .rota-join {
    font-size: 16px !important;
  }
}


/* v2.3: Blink the ENTIRE real join link (the blue rectangular button).
   Visibility and opacity switch together, keeping its layout space reserved. */
@-webkit-keyframes rota-katil-tam-blink {
  0%, 43%, 100% { opacity: 1; visibility: visible; }
  44%, 79% { opacity: 0; visibility: hidden; }
  80% { opacity: 1; visibility: visible; }
}
@keyframes rota-katil-tam-blink {
  0%, 43%, 100% { opacity: 1; visibility: visible; }
  44%, 79% { opacity: 0; visibility: hidden; }
  80% { opacity: 1; visibility: visible; }
}
.rota-akademi .rota-event-wrap .rota-event a.rota-join,
.rota-akademi .rota-event-wrap .rota-event a.rota-join:hover,
.rota-akademi .rota-event-wrap .rota-event a.rota-join:focus-visible {
  -webkit-animation: rota-katil-tam-blink 1.4s steps(1, end) infinite !important;
  animation: rota-katil-tam-blink 1.4s steps(1, end) infinite !important;
  -webkit-animation-play-state: running !important;
  animation-play-state: running !important;
  transition: none !important;
}
/* Respect an OS-level request to reduce flashing motion. */
@media (prefers-reduced-motion: reduce) {
  .rota-akademi .rota-event-wrap .rota-event a.rota-join {
    animation: none !important;
    -webkit-animation: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}
