.egitim-takvimi-wrap {
display: flex;
gap: 40px;
padding: 40px 0 60px;
align-items: flex-start;
}
.egitim-takvimi-sol {
flex: 0 0 340px;
position: sticky;
top: 20px;
}
.egitim-takvimi-sag {
flex: 1;
min-width: 0;
} .et-calendar {
background: #fff;
border-radius: 16px;
box-shadow: 0 8px 32px rgba(0, 0, 0, .08);
overflow: hidden;
}
.et-cal-header {
background: linear-gradient(135deg, #0d7377, #14a3a8);
color: #fff;
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 20px;
}
.et-cal-header .et-cal-title {
font-size: 18px;
font-weight: 700;
letter-spacing: .5px;
text-transform: uppercase;
}
.et-cal-header button {
background: rgba(255, 255, 255, .18);
border: none;
color: #fff;
width: 36px;
height: 36px;
border-radius: 50%;
font-size: 16px;
cursor: pointer;
transition: background .25s;
display: flex;
align-items: center;
justify-content: center;
}
.et-cal-header button:hover {
background: rgba(255, 255, 255, .35);
}
.et-cal-days {
display: grid;
grid-template-columns: repeat(7, 1fr);
text-align: center;
padding: 10px 12px 0;
}
.et-cal-days span {
font-size: 12px;
font-weight: 700;
color: #0d7377;
padding: 6px 0;
text-transform: uppercase;
}
.et-cal-grid {
display: grid;
grid-template-columns: repeat(7, 1fr);
text-align: center;
padding: 4px 12px 16px;
gap: 2px;
}
.et-cal-grid .et-day {
position: relative;
padding: 8px 0;
font-size: 14px;
color: #333;
border-radius: 8px;
cursor: default;
transition: background .2s, color .2s;
}
.et-cal-grid .et-day.empty {
visibility: hidden;
}
.et-cal-grid .et-day.other-month {
color: #ccc;
}
.et-cal-grid .et-day.today {
background: #e0f7f7;
font-weight: 700;
color: #0d7377;
}
.et-cal-grid .et-day.has-event {
cursor: pointer;
font-weight: 600;
}
.et-cal-grid .et-day.has-event::after {
content: '';
position: absolute;
bottom: 3px;
left: 50%;
transform: translateX(-50%);
width: 6px;
height: 6px;
border-radius: 50%;
background: #14a3a8;
}
.et-cal-grid .et-day.has-event:hover {
background: #0d7377;
color: #fff;
}
.et-cal-grid .et-day.has-event:hover::after {
background: #fff;
} .et-cal-footer {
background: #f8fafa;
padding: 14px 20px;
border-top: 1px solid #eef3f3;
}
.et-cal-footer h4 {
font-size: 13px;
font-weight: 700;
color: #0d7377;
margin: 0 0 8px;
text-transform: uppercase;
letter-spacing: .5px;
}
.et-cal-footer ul {
list-style: none;
padding: 0;
margin: 0;
}
.et-cal-footer ul li {
font-size: 13px;
color: #555;
padding: 3px 0;
display: flex;
align-items: flex-start;
gap: 6px;
}
.et-cal-footer ul li::before {
content: '●';
color: #14a3a8;
font-size: 8px;
margin-top: 4px;
flex-shrink: 0;
} .et-section-title {
font-size: 22px;
font-weight: 700;
color: #1a237e;
text-align: center;
position: relative;
padding-bottom: 12px;
margin-bottom: 28px;
}
.et-section-title::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 3px;
background: linear-gradient(90deg, #0d7377, #14a3a8);
border-radius: 2px;
}
.et-month-group {
margin-bottom: 32px;
}
.et-month-subtitle {
font-size: 17px;
font-weight: 700;
color: #0d7377;
margin: 0 0 14px;
padding-left: 4px;
display: flex;
align-items: center;
gap: 8px;
}
.et-month-subtitle::before {
content: '';
width: 4px;
height: 22px;
background: linear-gradient(180deg, #0d7377, #14a3a8);
border-radius: 2px;
flex-shrink: 0;
}
.et-month-label {
font-size: 17px;
font-weight: 700;
color: #0d7377;
margin-bottom: 16px;
padding-left: 4px;
display: flex;
align-items: center;
gap: 8px;
}
.et-month-label::before {
content: '';
width: 4px;
height: 22px;
background: linear-gradient(180deg, #0d7377, #14a3a8);
border-radius: 2px;
flex-shrink: 0;
} .et-card {
background: #fff;
border-radius: 12px;
border-left: 4px solid #14a3a8;
box-shadow: 0 2px 12px rgba(0, 0, 0, .05);
padding: 20px 24px;
margin-bottom: 14px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
transition: box-shadow .3s, transform .2s;
}
.et-card:hover {
box-shadow: 0 6px 24px rgba(13, 115, 119, .12);
transform: translateY(-2px);
}
.et-card-body {
flex: 1;
min-width: 0;
}
.et-card-meta {
font-size: 13px;
color: #0d7377;
font-weight: 600;
margin-bottom: 6px;
display: flex;
flex-wrap: wrap;
gap: 6px;
align-items: center;
}
.et-card-meta .et-sep {
color: #ccc;
}
.et-card-title {
font-size: 15px;
font-weight: 600;
color: #222;
margin: 0;
display: flex;
align-items: flex-start;
gap: 8px;
}
.et-card-title::before {
content: '●';
color: #14a3a8;
font-size: 10px;
margin-top: 4px;
flex-shrink: 0;
}
.et-card-actions {
display: flex;
gap: 8px;
flex-shrink: 0;
}
.et-btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 8px 20px;
border-radius: 6px;
font-size: 13px;
font-weight: 700;
text-decoration: none;
text-transform: uppercase;
letter-spacing: .5px;
transition: all .25s;
white-space: nowrap;
}
.et-btn-buy {
background: linear-gradient(135deg, #0d7377, #14a3a8);
color: #fff;
border: none;
}
.et-btn-buy:hover {
background: linear-gradient(135deg, #0a5c5f, #0d7377);
color: #fff;
text-decoration: none;
box-shadow: 0 4px 14px rgba(13, 115, 119, .3);
}
.et-btn-view {
background: transparent;
color: #0d7377;
border: 2px solid #0d7377;
}
.et-btn-view:hover {
background: #0d7377;
color: #fff;
text-decoration: none;
} .et-card-past {
opacity: .65;
border-left-color: #aaa;
}
.et-card-past:hover {
opacity: .85;
}
.et-badge-expired {
background: #e74c3c;
color: #fff;
font-size: 11px;
font-weight: 700;
padding: 2px 8px;
border-radius: 4px;
margin-left: 4px;
text-transform: uppercase;
letter-spacing: .3px;
} .et-past-section {
margin-top: 40px;
border-top: 2px solid #eee;
padding-top: 30px;
}
.et-past-title {
font-size: 20px;
font-weight: 700;
color: #555;
text-align: center;
margin-bottom: 24px;
position: relative;
padding-bottom: 12px;
}
.et-past-title::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 50px;
height: 3px;
background: #ccc;
border-radius: 2px;
}
.et-accordion-toggle {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
font-size: 16px;
font-weight: 700;
color: #333;
cursor: pointer;
padding: 12px 0;
border-bottom: 1px dashed #ddd;
margin-bottom: 0;
transition: color .2s;
user-select: none;
}
.et-accordion-toggle:hover {
color: #0d7377;
}
.et-accordion-toggle .et-acc-icon {
font-size: 18px;
transition: transform .3s;
}
.et-accordion-toggle.active .et-acc-icon {
transform: rotate(45deg);
}
.et-accordion-body {
display: none;
padding: 16px 0 8px;
}
.et-accordion-body.show {
display: block;
} .et-loading {
text-align: center;
padding: 40px;
color: #999;
}
.et-loading i {
font-size: 28px;
animation: et-spin 1s linear infinite;
color: #14a3a8;
}
@keyframes et-spin {
100% {
transform: rotate(360deg);
}
} .et-empty {
text-align: center;
padding: 30px;
color: #999;
font-size: 14px;
} @media (max-width: 991px) {
.egitim-takvimi-wrap {
flex-direction: column;
gap: 24px;
}
.egitim-takvimi-sol {
flex: none;
width: 100%;
max-width: 400px;
margin: 0 auto;
position: static;
}
}
@media (max-width: 576px) {
.et-card {
flex-direction: column;
align-items: flex-start;
gap: 12px;
}
.et-card-actions {
width: 100%;
}
.et-btn {
flex: 1;
text-align: center;
}
.et-cal-header .et-cal-title {
font-size: 15px;
}
.et-cal-grid .et-day {
font-size: 13px;
padding: 6px 0;
}
}