/* Només la plantilla Personalizado. L'agenda anterior conserva agenda.css. */
.agenda-esqueleton {
    /* Valors per defecte del filtre lateral del plugin, si el panell és buit. */
    --agenda-primary: #03045E;
    --agenda-hover: #151515;
    --agenda-event: #c5c5c5;
    --agenda-taronja: #BE5240;
    font-family: 'Pretendard-Regular', sans-serif;
    float: left;
    width: 100%;
}

.agenda-esqueleton [hidden] { display: none !important; }
.agenda-esqueleton button, .agenda-esqueleton input, .agenda-esqueleton select { font: inherit; }
.agenda-esqueleton button { cursor: pointer; }
.agenda-esqueleton button:focus-visible, .agenda-esqueleton select:focus-visible { outline: 2px solid var(--agenda-primary); outline-offset: 3px; }
.agenda-esqueleton .breadcrum { width: 100%; float: left; padding: 40px 0 25px; }
.agenda-esqueleton .breadcrum ul { display: flex; flex-wrap: wrap; justify-content: flex-start; }
.agenda-esqueleton .breadcrum li { font-size: 14px; position: relative; margin-right: 10px; padding-right: 14px; color: #000; }
.agenda-esqueleton .breadcrum li::after { content: '|'; position: absolute; right: 0; top: 0; }
.agenda-esqueleton .breadcrum li:last-child::after { display: none; }
.agenda-esqueleton .breadcrum a { color: #000; font-family: 'Pretendard-Light'; }
.agenda-esqueleton .inner-ban-sec { float: left; width: 100%; }
.agenda-esqueleton .eventos { gap: 20px; margin-bottom: 40px; }
.agenda-esqueleton .calendar-title { font-family: 'Pretendard-Black'; font-size: 75px; line-height: 1; letter-spacing: -2.54px; color: #000; }
.agenda-esqueleton .agenda-controls { display: flex; gap: 20px; align-items: center; }
.agenda-esqueleton .agenda-filt { font-family: 'Pretendard-Regular'; }
.agenda-esqueleton .switch input:checked + .slider-bar { background: var(--agenda-primary); }
.agenda-esqueleton .agenda-mobile-filter { display: none; }
.agenda-esqueleton .agenda-layout { display: flex; align-items: flex-start; gap: 50px; }
.agenda-esqueleton .agenda-main-lft { float: none; width: 350px; flex: 0 0 350px; display: flex; flex-direction: column; gap: 15px; }
.agenda-esqueleton .agenda-main-rgt { float: none; flex: 1; width: auto; min-width: 0; }
.agenda-esqueleton .search-bar { position: relative; width: 100%; }
.agenda-esqueleton .search-input { border: 2px solid rgba(33,33,33,.2) !important; font-family: 'Pretendard-Regular' !important; }
.agenda-esqueleton .search-button { color: #fff; background: var(--agenda-primary); display: flex; align-items: center; justify-content: center; }
.agenda-esqueleton .search-b0x-list button.search-button:hover, .agenda-esqueleton .agenda-retry:hover, .agenda-esqueleton .pagination button:hover { background: var(--agenda-hover); color: #fff; }
.agenda-esqueleton .agenda-select { position: relative; width: 100%; }
.agenda-esqueleton .agenda-select::after { content: ''; position: absolute; right: 20px; top: 17px; width: 10px; height: 10px; border-right: 2px solid #777; border-bottom: 2px solid #777; transform: rotate(45deg); pointer-events: none; }
.agenda-esqueleton .agenda-filter { appearance: none; -webkit-appearance: none; width: 100%; height: 50px; padding: 5px 42px 5px 20px; border: 2px solid rgba(33,33,33,.2); border-radius: 25px; background: #fff; color: #163833; font-size: 16px; cursor: pointer; }
.agenda-esqueleton .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.agenda-esqueleton .agenda-calendar { border: 2px solid rgba(33,33,33,.2); border-radius: 10px; padding: 20px; width: 100%; }
.agenda-esqueleton .agenda-calendar-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; }
.agenda-esqueleton .agenda-month-title { flex: 1; font: 20px/28px 'Pretendard-Black'; text-transform: capitalize; color: #333; }
.agenda-esqueleton .agenda-calendar-heading button { border: none; background: transparent; font-size: 30px; line-height: 30px; color: #666; padding: 0 4px; }
.agenda-esqueleton .agenda-days { width: 100%; table-layout: fixed; border-collapse: collapse; }
.agenda-esqueleton .agenda-days th { font-size: 14px; font-weight: normal; color: #9f9f9f; text-align: center; padding: 5px 0 10px; }
.agenda-esqueleton .agenda-days td { padding: 5px 0; border: none !important; text-align: center; }
.agenda-esqueleton .agenda-day { width: 32px; height: 32px; padding: 0; border: 2px solid transparent; border-radius: 50%; background: transparent; color: #2e1647; font-size: 14px; }
.agenda-esqueleton .agenda-day:disabled { cursor: default; opacity: 1; }
.agenda-esqueleton .agenda-day.event-past { color: #aaa; }
.agenda-esqueleton .agenda-day.has-event { background: var(--agenda-event); color: #fff; }
.agenda-esqueleton .agenda-day.event-past.has-event { background: var(--agenda-past, var(--agenda-event)); opacity: .55; }
.agenda-esqueleton .agenda-day[aria-pressed="true"] { border-color: #525252; }
.agenda-esqueleton .agenda-day:not(:disabled):hover { border-color: var(--agenda-hover); }
.agenda-esqueleton .agenda-day.today { background: var(--agenda-primary); color: #fff; }
.agenda-esqueleton .agenda-clear-day { border: 0; background: transparent; color: var(--agenda-primary); margin-top: 15px; text-decoration: underline; }
.agenda-esqueleton .select-tag { padding-bottom: 20px; }
.agenda-esqueleton .recent-list { display: flex; flex-wrap: wrap; gap: 10px; }
.agenda-esqueleton .tag-name { border: 1px solid #ddd; border-radius: 20px; background: #fff; padding: 7px 15px; color: #333; }
.agenda-esqueleton .agenda-loading { clear: both; }
.agenda-esqueleton .form-response { padding: 20px; border-radius: 8px; background: #f5f5f5; color: #333; margin-bottom: 15px; clear: both; }
.agenda-esqueleton .agenda-retry { border: 0; border-radius: 25px; padding: 10px 25px; color: #fff; background: var(--agenda-primary); }
.agenda-esqueleton .list-item { width: 100%; float: left; }
.agenda-esqueleton .list-item ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 50px 3%; width: 100%; padding: 0; margin: 0; list-style: none; }
.agenda-esqueleton .list-item li { min-width: 0; }
.agenda-esqueleton .inner-agenda-img { position: relative; overflow: hidden; margin-bottom: 20px; }
.agenda-esqueleton .org-img { display: block; width: 100%; aspect-ratio: 1.5; object-fit: cover; transition: transform .4s; }
.agenda-esqueleton .inner-agenda-img:hover .org-img { transform: scale(1.03); }
.agenda-esqueleton .tag { position: absolute; left: 0; bottom: 0; background: var(--agenda-taronja); padding: 12px 15px; color: #fff; }
.agenda-esqueleton .inner-agenda-cnt { padding-right: 25px; }
.agenda-esqueleton .inner-agenda-cnt h3 { font: 30px/36px 'Pretendard-SemiBold'; margin-bottom: 15px; color: #000; }
.agenda-esqueleton .inner-agenda-cnt h3 a { color: inherit; }
.agenda-esqueleton .inner-agenda-cnt p { font-size: 16px; line-height: 24px; color: #000; margin-bottom: 20px; }
.agenda-esqueleton .inner-agenda-cnt h4 { font-size: 16px; line-height: 24px; padding-left: 28px; position: relative; color: #000; }
.agenda-esqueleton .inner-agenda-cnt h4::before { content: ''; position: absolute; left: 0; top: 5px; width: 16px; height: 16px; background: url(../../resources/v1/images/clock.svg) no-repeat; }
.agenda-esqueleton .agenda-section-title { clear: both; padding-top: 35px; font: 24px/30px 'Pretendard-SemiBold'; color: #000; }
.agenda-esqueleton .pagination { display: flex; flex-wrap: wrap; gap: 8px; clear: both; padding: 30px 0; width: 100%; }
.agenda-esqueleton .pagination button { min-width: 38px; height: 38px; border: 1px solid #ddd; border-radius: 50%; color: #333; background: #fff; }
.agenda-esqueleton .pagination button[aria-current="page"] { color: #fff; background: var(--agenda-primary); border-color: var(--agenda-primary); }

@media screen and (max-width: 1100px) {
    .agenda-esqueleton .agenda-layout { gap: 30px; }
    .agenda-esqueleton .agenda-main-lft { width: 300px; flex-basis: 300px; }
    .agenda-esqueleton .inner-agenda-cnt h3 { font-size: 25px; line-height: 31px; }
}
@media screen and (max-width: 1023px) {
    .agenda-esqueleton .agenda-layout { flex-direction: column; }
    .agenda-esqueleton .agenda-main-lft { display: none; width: 100%; flex-basis: auto; }
    .agenda-esqueleton .agenda-main-lft.show { display: flex; }
    .agenda-esqueleton .agenda-main-rgt { width: 100%; }
    .agenda-esqueleton .agenda-mobile-filter { display: block; border: 1px solid #ddd; border-radius: 20px; padding: 8px 18px; background: #fff; }
    .agenda-esqueleton .agenda-calendar { max-width: 400px; }
}
@media screen and (max-width: 767px) {
    .agenda-esqueleton .calendar-title { font-size: 48px; letter-spacing: -1px; }
    .agenda-esqueleton .eventos { align-items: flex-start; flex-direction: column; margin-bottom: 25px; }
    .agenda-esqueleton .agenda-controls { width: 100%; justify-content: space-between; }
    .agenda-esqueleton .list-item ul { grid-template-columns: 1fr; gap: 35px; }
    .agenda-esqueleton .inner-agenda-cnt { padding-right: 0; }
}
