/* CSS Başlangıcı */
#unique-container * {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
 
 }
 
 #unique-container {
     font-family: sans-serif;
   --purple: hsl(240, 80%, 89%);
   --pink: hsl(0, 59%, 94%);
   --light-bg: hsl(204, 37%, 92%);
   --light-gray-bg: hsl(0, 0%, 94%);
   --white: hsl(0, 0%, 100%);
   --dark: hsl(0, 0%, 7%);
   --text-gray: hsl(0, 0%, 30%);
   --box-border: hsl(0, 0%, 80%);
   --info-bg: hsl(240, 100%, 97%);
   --info-text: hsl(240, 50%, 40%);
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 15px;
 }
 
 #unique-container body {
   background: var(--light-bg);
   color: var(--dark);
   display: flex;
   justify-content: center;
   align-items: center;
   min-height: 100vh;
   padding: 20px;
 }
 
 #unique-container h3, #unique-container h4, #unique-container p {
   margin: 0;
 }
 
 #unique-container .custom-card-wrap {
   display: flex;
   justify-content: flex-start;
   align-items: stretch;
   width: 100%;
   gap: 12px;
   padding: 0;
   flex-wrap: wrap;
   margin-bottom: 8px;
 }
 
 #unique-container .custom-card-box {
   flex: 0 0 calc(33.333% - 10px);
   min-width: 350px;
   margin-bottom: 6px;
   position: relative;
   padding: 8px;
   padding-bottom: 55px;
   background: #fff;
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 20px 50px 0 rgba(0, 0, 0, 0.1);
   border-radius: 8px;
 }
 
 #unique-container .custom-card-box:hover {
   transform: translateY(-6px);
   box-shadow: 0 0 0 2px #16C79A, 0 15px 40px 0 rgba(0, 0, 0, 0.12);
 }
 
 #unique-container .custom-card-box-top {
   display: flex;
   flex-direction: column;
   gap: 8px;
   margin-bottom: 16px;
 }
 
 #unique-container .custom-card-image {
   width: 100%;
   height: 220px;
   object-fit: cover;
   object-position: 50% 20%;
   margin-bottom: 2px;
   border-radius: 8px 8px 8px 8px;
   transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
   transform-origin: center;
 }
 
 #unique-container .custom-card-box:hover .custom-card-image {
   transform: scale(1.05);
   filter: brightness(1.03) contrast(1.03);
 }
 
 #unique-container .custom-card-header {
   min-height: 45px;
   margin-bottom: 6px;
 }
 
 #unique-container .custom-card-title {
   font-size: 1em;
   font-weight: 700;
   line-height: 1.2;
   margin-bottom: 3px;
 }
 
 #unique-container .custom-card-subtitle {
   font-size: 0.8em;
   font-weight: 500;
   color: var(--text-gray);
   line-height: 1.2;
   margin-bottom: 0;
   padding-bottom: 4px;
   border-bottom: 1px solid var(--box-border);
 }
 
 #unique-container .custom-card-info-box {
   margin: 6px 0;
   padding: 8px;
   background: #f8fafc;
   border-radius: 12px;
   border-left: 4px solid #3b82f6;
 }
 
 #unique-container .custom-card-info-box table {
   width: 100%;
   border-collapse: collapse;
   border-spacing: 0;
 }
 
 #unique-container .custom-card-info-box tr {
   border: none;
 }
 
 #unique-container .custom-card-info-box td {
   padding: 3px 0;
   line-height: 1.2;
   font-size: 0.85em;
   border: none;
   vertical-align: middle;
 }
 
 #unique-container .custom-card-info-label {
   width: 20px;
 }
 
 #unique-container .info-icon {
   width: 16px;
   height: 16px;
   stroke-width: 1.5;
   stroke: #64748b;
   opacity: 0.8;
   display: block;
   margin: 0 auto;
 }
 
 #unique-container .custom-card-info-value {
   color: #1f2937;
   padding-left: 6px;
 }
 
 /* Tarih satırı için özel stil */
 #unique-container .custom-card-info-box tr:first-child td:last-child {
   color: #6b7280;
   font-style: italic;
   padding-left: 2px;
   font-size: 0.8em;
 }
 
 #unique-container .custom-card-description {
   height: 90px;
   min-height: 90px;
   max-height: 90px;
   overflow-y: auto;
   padding: 8px 10px;
   font-size: 0.82em;
   line-height: 1.5;
   color: #64748b;
   margin: 6px 0;
   background: #f8fafc;
   border-radius: 8px;
   border-left: 4px solid #3b82f6;
   scrollbar-width: thin;
   scrollbar-color: #cbd5e1 #f1f5f9;
   font-weight: 400;
   letter-spacing: 0.2px;
 }
 
 #unique-container .custom-card-description::-webkit-scrollbar {
   width: 4px;
 }
 
 #unique-container .custom-card-description::-webkit-scrollbar-track {
   background: #f1f5f9;
   border-radius: 100px;
 }
 
 #unique-container .custom-card-description::-webkit-scrollbar-thumb {
   background: #cbd5e1;
   border-radius: 100px;
 }
 
 #unique-container .custom-card-description::-webkit-scrollbar-thumb:hover {
   background: #94a3b8;
 }
 
 #unique-container .custom-card-description:hover {
   box-shadow: inset 0 0 10px rgba(0,0,0,0.02);
 }
 
 #unique-container .custom-card-footer-info {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 8px 12px;
   background: #f8fafc;
   border-top: 1px solid #e5e7eb;
   border-radius: 0 0 8px 8px;
 }
 
 #unique-container .custom-card-footer-info > div:not(:last-child) {
   display: flex;
   align-items: center;
   gap: 15px;
   font-size: 0.9em;
   color: #4b5563;
   padding: 4px 12px;
   border-radius: 6px;
   background: rgba(255, 255, 255, 0.8);
 }
 
 #unique-container .custom-card-footer-info img {
   width: 16px;
   height: 16px;
   opacity: 0.7;
 }
 
 #unique-container .custom-card-button {
   padding: 8px 12px;
   background: linear-gradient(135deg, #2563eb, #1d4ed8);
   color: #fff;
   border: none;
   border-radius: 6px;
   font-weight: 500;
   font-size: 0.9em;
   cursor: pointer;
   transition: all 0.2s ease;
   box-shadow: 0 2px 4px rgba(37, 99, 235, 0.2);
 }
 
 #unique-container .custom-card-button:hover {
   transform: translateY(-1px);
   box-shadow: 0 4px 8px rgba(37, 99, 235, 0.3);
   background: linear-gradient(135deg, #1d4ed8, #1e40af);
 }
 
 /* Sayfalama stilleri */
 /* Zarif Sayfalama Stilleri */
 .dbm-event-pagination {
   display: flex;
   justify-content: center;
   padding: 1em 0;
   font-family: Arial, sans-serif;
 }
 
 .pagination-events {
   display: flex;
   list-style: none;
   padding: 0;
   margin: 0;
   gap: 0.5em;
 }
 
 .page-item-events {
   display: flex;
 }
 
 .page-link-events {
   color: #007bff;
   background-color: transparent;
   text-decoration: none;
   padding: 0.5em 0.75em;
   border: 1px solid transparent;
   border-radius: 50px;
   transition: all 0.3s ease;
   font-size: 0.9em;
 }
 
 .page-item-events.active .page-link-events {
   background-color: #007bff;
   color: #fff;
   border-color: #007bff;
   font-weight: bold;
   box-shadow: 0 4px 12px rgba(0, 123, 255, 0.2);
   transform: scale(1.05);
 }
 
 .page-item-events.disabled .page-link-events {
   color: #6c757d;
   cursor: not-allowed;
   background-color: #f8f9fa;
 }
 
 .page-link-events:hover:not(.active):not(.disabled) {
   background-color: #e9f2ff;
   color: #007bff;
   box-shadow: 0 2px 6px rgba(0, 123, 255, 0.15);
   transform: scale(1.05);
 }
 
 
 
 @import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i');
     @import url('https://fonts.googleapis.com/css?family=Bree+Serif'); 
 * {
             box-sizing: border-box;
         }
         .tabs-body {
             display: flex;
             justify-content: center;
             padding: 10px;
             font-family: 'Source Sans Pro', sans-serif;
             color: #333;
         }
         @media (min-width: 600px) {
             .tabs-body {
                 padding: 10px 10px;
             }
         }
         h1.tabs-title {
             margin: 0;
             font-family: 'Bree Serif', serif;
             font-size: 36px;
         }
         p.tabs-paragraph {
             margin-top: 20px;
             margin-bottom: 0;
             padding: 0;
             font-size: 20px;
             line-height: 1.5;
         }
         .tabs-container {
             display: flex;
             flex-wrap: wrap;
             max-width: 960px;
             background: #e5e5e5;
             box-shadow: 0 48px 80px -32px rgba(0,0,0,0.3);
         }
         .tabs-input {
             position: absolute;
             opacity: 0;
         }
         .tabs-label {
             width: 100%;
             padding: 20px 30px;
             background: #e5e5e5;
             cursor: pointer;
             font-weight: bold;
             font-size: 18px;
             color: #7f7f7f;
             transition: background 0.1s, color 0.1s;
         }
         .tabs-label:hover {
             background: #d8d8d8;
         }
         .tabs-label:active {
             background: #ccc;
         }
         .tabs-input:focus + .tabs-label {
             z-index: 1;
         }
         .tabs-input:checked + .tabs-label {
             background: #fff;
             color: #000;
         }
         @media (min-width: 600px) {
             .tabs-label {
                 width: auto;
             }
         }
         .tabs-panel {
           min-width: 100%;
             display: none;
             padding: 20px 30px 30px;
             background: #fff;
         }
         @media (min-width: 600px) {
             .tabs-panel {
                 order: 99;
             }
         }
         .tabs-input:checked + .tabs-label + .tabs-panel {
             display: block;
         }
         
         .custom-cardholder {
           
             margin: 20px auto;
             display: flex;
             justify-content: center;
             padding: 10px;
             font-family: 'Source Sans Pro', sans-serif;
             color: #333;
 
             display: flex;
             max-width: 960px;
         }
  
         .custom-photo {
             padding: 30px;
             width: 200px;
             text-align: center;
             float: left;
         }
         .custom-photo img { 
             max-height: 200px; 
         }
         .custom-description {
             padding: 30px;
             /* float: left; */
             border-left: 2px solid #efefef;
         }
         .custom-description h1 {
             color: #515151;
             font-weight: 300;
             padding-top: 15px;
             margin: 0;
             font-size: 30px;
             font-weight: 300;
         }
         .custom-description h2 {
             color: #515151;
             margin: 0;
             text-transform: uppercase;
             font-weight: 500;
         }
         .custom-description h4 { 
             margin: 0;
             color: #727272;
             text-transform: uppercase;
             font-weight: 500;
             font-size: 12px;
         }
         .custom-description p { 
             font-size: 12px; 
             line-height: 20px;
             color: #727272;
             padding: 20px 0;
             margin: 0;
         }
         .custom-description button {
             outline: 0;
             border: 0;
             background: none;
             border: 1px solid #d9d9d9;
             padding: 8px 0px;
             margin-bottom: 30px;
             color: #515151;
             text-transform: uppercase;
             width: 125px;
             font-family: inherit;
             margin-right: 5px;
             transition: all 0.3s ease;
             font-weight: 500;
         }
         .custom-description button:hover {
             border: 1px solid #aedaa6;
             color: #aedaa6;
             cursor: pointer;
         }
 
         .custom-program-title {
           font-size: 24px;
           font-weight: bold;
           text-align: left;
           color: #333;
           /* border-bottom: 2px solid #ddd;*/
           padding-bottom: 10px;
           /*max-width: 90%;*/
           margin-bottom: 20px;
       }
 
       .custom-program-container {
           display: flex;
           flex-direction: column;
           padding-top: 5px;
           gap: 20px;
           /*max-width: 90%;*/
           margin: 0 auto;
       }
 
       .custom-program-day {
           display: flex;
           /* align-items: flex-start;*/
           border: 1px solid #ddd;
           border-radius: 5px;
           background-color: #fff;
           padding: 15px;
           position: relative;
           overflow: hidden;
           box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
       }
 
       .custom-program-day .custom-day-label {
           writing-mode: vertical-lr;
           transform: rotate(180deg);
           text-orientation: mixed;
           font-weight: bold;
           color: #777;
           background-color: #f5f5f5;
           padding: 10px;
           border-right: 2px solid #ddd;
           display: flex;
           align-items: center;
           justify-content: right;
           font-size: 18px;
           text-align: center;
           width: 50px;
       }
 
       .custom-program-day .custom-day-content {
           padding-left: 20px;
           flex: 1;
       }
 
       .custom-program-day h3 {
           color: #333;
           margin-top: 0;
           font-size: 18px;
           font-weight: bold;
       }
 
       .custom-program-day p {
           margin: 10px 0;
           color: #666;
           line-height: 1.6;
       }
 
       .custom-program-day p strong {
           color: #333;
       }
 
 
 /* FAQ Akordeon */
 .faq-container {
   /*max-width: 800px;*/
   margin: 30px auto;
 }
 
 .faq-item {
   border: 1px solid #ddd;
   border-radius: 5px;
   margin-bottom: 10px;
   background-color: #fff;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 }
 
 .faq-question {
   padding: 15px;
   font-weight: bold;
   color: #333;
   cursor: pointer;
   display: flex;
   justify-content: space-between;
   align-items: center;
 }
 
 .faq-question:hover {
   background-color: #f5f5f5;
 }
 
 .faq-answer {
   padding: 15px;
   color: #666;
   display: none;
   line-height: 1.6;
 }
 
 .faq-item.active .faq-answer {
   display: block;
 }      
 
 .product-container {
   display: flex;
   flex-wrap: wrap;
   max-width: 960px;
   margin: 30px auto;
   background-color: #fff;
   border-radius: 10px;
   overflow: hidden;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 }
 
 .product-images {
   flex: 1;
   min-width: 300px;
   display: flex;
   flex-direction: column;
   align-items: center;
   background-color: #f5f5f5;
   padding: 20px;
 }
 
 .product-images img {
   max-width: 100%;
   max-height: 400px;
   border-radius: 10px;
   cursor: pointer;
   transition: transform 0.3s ease;
 }
 
 .product-thumbnails {
   display: flex;
   gap: 10px;
   margin-top: 15px;
   overflow-x: auto;
   padding: 10px;
   scrollbar-width: thin; /* Firefox için kaydırma çubuğu ince */
 }
 
 .product-thumbnails::-webkit-scrollbar {
   height: 8px; /* Kaydırma çubuğu yüksekliği */
 }
 
 .product-thumbnails::-webkit-scrollbar-thumb {
   background-color: #ccc;
   border-radius: 4px;
 }
 
 .product-thumbnails img {
   width: 80px;
   height: 80px;
   object-fit: cover;
   border: 2px solid transparent;
   border-radius: 5px;
   cursor: pointer;
   transition: border-color 0.3s ease;
 }
 
 .product-thumbnails img:hover {
   border-color: #007BFF;
 }
 
 .product-details {
   flex: 1.5;
   padding: 30px;
 }
 
 .product-details h2 {
   font-size: 28px;
   color: #333;
   margin-top: 0;
   margin-bottom: 15px;
 }
 
 .product-details p {
   color: #666;
   line-height: 1.8;
   margin-bottom: 20px;
 }
 
 .product-details .price {
   font-size: 24px;
   color: #007BFF;
   font-weight: bold;
   margin-bottom: 20px;
 }
 
 .product-details button {
   background-color: #007BFF;
   color: #fff;
   border: none;
   border-radius: 5px;
   padding: 15px 30px;
   font-size: 18px;
   cursor: pointer;
   transition: background-color 0.3s ease;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
 }
 
 .product-details button:hover {
   background-color: #0056b3;
 }
 
 .lightbox {
   display: none;
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.8);
   justify-content: center;
   align-items: center;
   z-index: 1000;
 }
 
 .lightbox img {
   max-width: 90%;
   max-height: 90%;
   border-radius: 10px;
 }
 
 .lightbox:target {
   display: flex;
 }
 
 .lightbox-close {
   position: absolute;
   top: 20px;
   right: 20px;
   color: white;
   font-size: 30px;
   text-decoration: none;
   font-weight: bold;
 }
 
 .participant-title {
   font-size: 24px;
   font-weight: bold;
   text-align: center;
   color: #333;
   margin-bottom: 20px;
 }
 
 .participant-grid-container {
   /*max-width: 800px;*/
   margin: 0 auto;
   background-color: #fff;
   border-radius: 8px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
   padding: 20px;
   margin-bottom: 10px;
 }
 
 .participant-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 20px;
 }
 
 @media (max-width: 768px) {
   .participant-grid {
       grid-template-columns: repeat(2, 1fr);
   }
 }
 
 @media (max-width: 480px) {
   .participant-grid {
       grid-template-columns: 1fr;
   }
 }
 
 .participant-card {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: 15px;
   border: 1px solid #eee;
   border-radius: 8px;
   background-color: #f9f9f9;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 }
 
 .profile-image {
   width: 120px;
   height: 120px;
   border-radius: 15px;
   object-fit: cover;
   margin-bottom: 10px;
 }
 
 .starred-name {
   font-weight: bold;
   color: #007BFF;
   text-align: center;
 }
 
 @media (max-width: 768px) {
   .profile-image {
       width: 120px;
       height: 120px;
   }
 }
 
 .equipment-title {
   font-size: 24px;
   font-weight: bold;
   text-align: center;
   color: #333;
   margin-bottom: 20px;
 }
 
 .equipment-container {
   /*max-width: 1200px;*/
   margin: 0 auto;
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 20px;
 }
 
 @media (max-width: 768px) {
   .equipment-container {
       grid-template-columns: 1fr;
   }
 }
 
 .equipment-item {
   display: flex;
   gap: 15px;
   align-items: flex-start;
   background-color: #fff;
   padding: 15px;
   border-radius: 8px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 }
 
 .equipment-item img {
   width: 100px;
   height: 100px;
   object-fit: cover;
   border-radius: 5px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 }
 
 .equipment-info {
   display: flex;
   flex-direction: column;
   justify-content: center;
 }
 
 .equipment-info h3 {
   font-size: 18px;
   color: #333;
   margin: 0 0 5px;
 }
 
 .equipment-info p {
   font-size: 14px;
   color: #666;
   margin: 0;
   line-height: 1.6;
 }
 
 /* Zarif ücret kartları stili */
 .ucret-main-container {
   display: flex;
   gap: 15px;
   flex-wrap: wrap;
   padding: 15px 0;
 }
 
 .ucret-section {
   flex: 1;
   min-width: 300px;
   background: #fff;
   border-radius: 8px;
   box-shadow: 0 1px 8px rgba(0,0,0,0.05);
   padding: 16px;
   transition: all 0.2s ease;
 }
 
 .ucret-section:hover {
   transform: translateY(-3px);
   box-shadow: 0 3px 12px rgba(0,0,0,0.08);
 }
 
 .ucret-section .ucret-section-title {
   color: #1e3a8a;
   font-size: 1.1rem;
   margin-bottom: 16px;
   padding-bottom: 12px;
   border-bottom: 1px solid #e5e7eb;
   text-align: center;
   font-weight: 600;
   letter-spacing: 0.3px;
 }
 
 .ucret-section .ucret-list {
   list-style: none;
   padding: 0;
   margin: 0;
 }
 
 .ucret-section .ucret-list-item {
   background: #f8fafc;
   margin-bottom: 8px;
   padding: 12px 14px;
   border-radius: 6px;
   border-left: 3px solid #2563eb;
   transition: all 0.2s ease;
   font-size: 0.9rem;
   line-height: 1.5;
 }
 
 .ucret-section .ucret-list-item:hover {
   background: #f1f5f9;
   transform: translateX(3px);
 }
 
 .ucret-section .ucret-list-item strong {
   color: #575757;
   display: block;
   margin-bottom: 3px;
   font-size: 1rem;
   font-weight: 600;
 }
 
 /* Responsive tasarım */
 @media (max-width: 768px) {
   .ucret-main-container {
       flex-direction: column;
       gap: 12px;
   }
   
   .ucret-section {
       min-width: 100%;
   }
 
   .ucret-section .ucret-section-title {
       font-size: 1rem;
   }
 
   .ucret-section .ucret-list-item {
       font-size: 0.85rem;
   }
 }
 
 /* Özel renkler - daha soft tonlar */
 .ucret-dahil {
   border-top: 3px solid #10b981;
 }
 
 .ucret-dahil .ucret-section-title {
   color: #047857;
 }
 
 .ucret-dahil .ucret-list-item {
   border-left-color: #10b981;
 }
 
 .ucret-haric {
   border-top: 3px solid #f43f5e;
 }
 
 .ucret-haric .ucret-section-title {
   color: #be123c;
 }
 
 .ucret-haric .ucret-list-item {
   border-left-color: #f43f5e;
 }
 
 
  /* Daha zarif durak listesi tasarımı */
 .duraklar-container {
   background: linear-gradient(to bottom, #ffffff, #f8fafc);
   border-radius: 16px;
   box-shadow: 0 1px 6px rgba(0,0,0,0.05);
   padding: 20px;
   margin: 10px 0;
 }
 
 .duraklar-title {
   color: #1e293b;
   font-size: 1.1rem;
   font-weight: 600;
   margin-bottom: 15px;
   padding-bottom: 5px;
   /*border-bottom: 1px solid #e2e8f0;*/
   text-align: center;
   letter-spacing: 0.5px;
 }
 
 .duraklar-list {
   display: flex;
   flex-direction: column;
   gap: 16px;
   position: relative;
   padding: 0 10px;
 }
 
 .duraklar-list::before {
   content: '';
   position: absolute;
   left: 22px;
   top: 0;
   bottom: 0;
   width: 1px;
   background: linear-gradient(to bottom, #e2e8f0 50%, transparent 100%);
   z-index: 1;
 }
 
 .durak-item {
   display: flex;
   align-items: flex-start;
   padding: 16px 20px;
   background: #ffffff;
   border-radius: 12px;
   border: 1px solid #e2e8f0;
   transition: all 0.3s ease;
   position: relative;
   z-index: 2;
 }
 
 .durak-item:hover {
   background: #ffffff;
   border-color: #cbd5e1;
   transform: translateX(5px);
   box-shadow: 0 4px 12px rgba(0,0,0,0.03);
 }
 
 .durak-sira {
   width: 26px;
   height: 26px;
   background: #f8fafc;
   color: #334155;
   border: 1px solid #cbd5e1;
   border-radius: 8px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: 600;
   font-size: 0.85rem;
   margin-right: 15px;
   flex-shrink: 0;
   transition: all 0.3s ease;
 }
 
 .durak-item:hover .durak-sira {
   background: #2563eb;
   color: #ffffff;
   border-color: #2563eb;
 }
 
 .durak-detay {
   flex: 1;
 }
 
 .durak-baslik {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 10px;
 }
 
 .durak-adi {
   font-weight: bold;
   color: #1e293b;
   font-size: 1.1rem;
   letter-spacing: 0.2px;
 }
 
 .durak-saat {
   color: #2563eb;
   font-size: 1.2rem;
   font-weight: 600;
   padding: 5px 10px;
   background: #eff6ff;
   border-radius: 6px;
   letter-spacing: 0.5px;
 }
 
 .durak-konum {
   color: #64748b;
   font-size: 0.85rem;
   text-decoration: none;
   display: inline-flex;
   align-items: center;
   gap: 6px;
   padding: 8px 12px;
   background: #f8fafc;
   border: 1px solid #e2e8f0;
   border-radius: 6px;
   transition: all 0.3s ease;
 }
 
 .durak-konum:hover {
   background: #f1f5f9;
   border-color: #cbd5e1;
   color: #2563eb;
   transform: translateY(-1px);
 }
 
 .durak-konum img {
   width: 14px;
   height: 14px;
   opacity: 0.8;
   transition: opacity 0.3s ease;
 }
 
 .durak-konum:hover img {
   opacity: 1;
 }
 
 .durak-konum span {
   font-weight: 500;
   letter-spacing: 0.2px;
 }
 
 @media (max-width: 768px) {
   .duraklar-container {
       padding: 20px;
       margin: 15px 0;
   }
 
   .durak-item {
       padding: 14px;
   }
 
   .duraklar-list::before {
       left: 20px;
   }
 
   .durak-baslik {
       flex-direction: column;
       align-items: flex-start;
       gap: 8px;
   }
 
   .durak-saat {
       font-size: 0.8rem;
   }
 
   .durak-konum {
       width: 100%;
       justify-content: center;
       margin-top: 5px;
   }
 }
 
 @media (max-width: 768px) {
   .duraklar-container {
       padding: 15px;
   }
 
   .durak-item {
       padding: 12px;
   }
 
   .durak-baslik {
       flex-direction: column;
       align-items: flex-start;
       gap: 8px;
   }
 }
 
 
 /* Modern Sosyal Medya Paylaşım Butonları Stili */
 .social-share-container {
   margin: 25px 0;
   padding: 16px 20px;
   background: #ffffff;
   border: 1px solid #e5e7eb;
   border-radius: 12px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   transition: all 0.3s ease;
 }
 
 .social-share-container:hover {
   border-color: #d1d5db;
   box-shadow: 0 2px 12px rgba(0,0,0,0.03);
 }
 
 .share-content {
   display: flex;
   align-items: center;
   gap: 10px;
 }
 
 .share-icon {
   color: #6b7280;
   display: flex;
   align-items: center;
 }
 
 .share-text {
   font-size: 0.9rem;
   color: #4b5563;
   font-weight: 500;
 }
 
 .social-buttons {
   display: flex;
   gap: 8px;
 }
 
 .social-button {
   width: 36px;
   height: 36px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 8px;
   color: #6b7280;
   background: #f9fafb;
   border: 1px solid #e5e7eb;
   transition: all 0.2s ease;
   position: relative;
 }
 
 .social-button:hover {
   transform: translateY(-2px);
   color: #fff;
 }
 
 .social-button[data-tooltip]:before {
   content: attr(data-tooltip);
   position: absolute;
   bottom: 100%;
   left: 50%;
   transform: translateX(-50%) translateY(-8px);
   background: #1f2937;
   color: white;
   font-size: 0.75rem;
   padding: 5px 10px;
   border-radius: 6px;
   white-space: nowrap;
   opacity: 0;
   visibility: hidden;
   transition: all 0.2s ease;
 }
 
 .social-button[data-tooltip]:hover:before {
   opacity: 1;
   visibility: visible;
   transform: translateX(-50%) translateY(-4px);
 }
 
 
 
 /* Hover renkleri */
 .social-button:nth-child(1):hover { background: #1877f2; } /* Facebook */
 .social-button:nth-child(2):hover { background: #1da1f2; } /* Twitter */
 .social-button:nth-child(3):hover { background: #25d366; } /* WhatsApp */
 .social-button:nth-child(4):hover { background: #0077b5; } /* LinkedIn */
 .social-button:nth-child(5):hover { background: #6b7280; } /* Email */
 
 @media (max-width: 768px) {
   .social-share-container {
       flex-direction: column;
       gap: 15px;
       padding: 15px;
   }
 
   .share-content {
       justify-content: center;
   }
 
   .social-buttons {
       justify-content: center;
   }
 
   .social-button {
       width: 32px;
       height: 32px;
   }
 
   .social-button svg {
       width: 18px;
       height: 18px;
   }
 }
 
 /* Modern Katılımcı Grid Tasarımı */
 .participant-ev-grid-container {
   padding: 1.5rem;
   background: #ffffff;
   border-radius: 1rem;
   box-shadow: 0 2px 4px rgba(0,0,0,0.02);
   /*margin: 2rem 0;*/
 }
 
 .participant-ev-grid {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
   gap: 1rem;
 }
 
 .participant-ev-card {
   position: relative;
   background: #ffffff;
   border-radius: 12px;
   padding: 1rem;
   transition: all 0.3s ease;
   border: 1px solid #f3f4f6;
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   gap: 0.75rem;
   box-shadow: 0 2px 10px rgba(0,0,0,0.03);
 }
 
 .participant-ev-avatar {
   position: relative;
   width: 120px;
   height: 120px;
   border-radius: 20px;
   overflow: hidden;
   flex-shrink: 0;
   background: #f8fafc;
   border: 3px solid #f3f4f6;
 }
 
 .participant-ev-image {
   width: 100%;
   height: 100%;
   object-fit: cover;
   aspect-ratio: 1;
 }
 
 .participant-ev-info {
   width: 100%;
 }
 
 .participant-ev-name {
   color: #1f2937;
   font-size: 1rem;
   font-weight: 600;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   width: 100%;
 }
 
 /* Yedek katılımcılar için farklı stil */
 .participant-ev-card.pending {
   background: #fafafa;
   border-color: #e5e7eb;
 }
 
 .participant-ev-card.pending .participant-ev-name {
   color: #6b7280;
 }
 
 @media (max-width: 768px) {
   .participant-ev-grid {
       grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
       gap: 0.75rem;
   }
 }
 
 /* Modern Kompakt Filtreleme */
 .dbmeventslist-filter-container {
     background: #ffffff;
     border-radius: 16px;
     box-shadow: 0 4px 24px rgba(0,0,0,0.06);
     padding: 20px;
     margin: 20px 0 30px;
     border: 1px solid #f1f5f9;
     position: relative;
 }
 
 .dbmeventslist-filter-form {
     display: flex;
     flex-wrap: wrap;
     gap: 15px;
     align-items: flex-end;
 }
 
 .dbmeventslist-filter-group {
     flex: 1;
     min-width: 200px;
     position: relative;
 }
 
 .dbmeventslist-filter-group label {
     display: block;
     font-size: 12px;
     font-weight: 600;
     color: #64748b;
     text-transform: uppercase;
     letter-spacing: 0.5px;
     margin-bottom: 6px;
 }
 
 .dbmeventslist-filter-group select,
 .dbmeventslist-filter-group input {
     width: 100%;
     padding: 10px 14px;
     border: 1px solid #e2e8f0;
     border-radius: 8px;
     background: #f8fafc;
     font-size: 14px;
     color: #334155;
     transition: all 0.2s ease;
 }
 
 /* Select için özel ok ikonu */
 .dbmeventslist-filter-group select {
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'%3E%3C/path%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: right 8px center;
     background-size: 16px;
     padding-right: 32px;
     appearance: none;
 }
 
 .dbmeventslist-filter-group select:hover,
 .dbmeventslist-filter-group input:hover {
     border-color: #cbd5e1;
     background: #ffffff;
 }
 
 .dbmeventslist-filter-group select:focus,
 .dbmeventslist-filter-group input:focus {
     border-color: #3b82f6;
     background: #ffffff;
     box-shadow: 0 0 0 3px rgba(59,130,246,0.1);
     outline: none;
 }
 
 .dbmeventslist-filter-buttons {
     display: flex;
     gap: 8px;
 }
 
 .dbmeventslist-filter-submit {
     padding: 10px 20px;
     background: #3b82f6;
     color: #fff;
     border: none;
     border-radius: 8px;
     font-weight: 600;
     font-size: 14px;
     cursor: pointer;
     transition: all 0.2s ease;
 }
 
 .dbmeventslist-filter-submit:hover {
     background: #2563eb;
     transform: translateY(-1px);
 }
 
 .dbmeventslist-filter-reset {
     padding: 10px 20px;
     background: #f1f5f9;
     color: #64748b;
     border: none;
     border-radius: 8px;
     font-weight: 600;
     font-size: 14px;
     text-decoration: none;
     transition: all 0.2s ease;
 }
 
 .dbmeventslist-filter-reset:hover {
     background: #e2e8f0;
     color: #475569;
 }
 
 /* Modern Pagination */
 .dbmeventslist-pagination {
     display: flex;
     justify-content: center;
     align-items: center;
     margin: 12px 0;
 }
 
 .dbmeventslist-pagination-list {
     display: inline-flex;
     align-items: center;
     background: #ffffff;
     padding: 6px 12px;
     border-radius: 16px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
     gap: 4px;
     max-width: 100%;
     flex-wrap: wrap;
     justify-content: center;
 }
 
 .dbmeventslist-page-item {
     list-style: none;
     margin: 0;
 }
 
 .dbmeventslist-page-link {
     display: flex;
     align-items: center;
     justify-content: center;
     min-width: 34px;
     height: 34px;
     padding: 0 6px;
     font-size: 14px;
     font-weight: 500;
     color: #4b5563;
     text-decoration: none;
     border-radius: 12px;
     transition: all 0.2s ease;
     position: relative;
     border: 2px solid transparent;
 }
 
 /* Aktif sayfa */
 .dbmeventslist-page-item.active .dbmeventslist-page-link {
     background: #2563eb;
     color: #ffffff;
     font-weight: 600;
 }
 
 /* Hover efekti */
 .dbmeventslist-page-link:hover:not(.disabled) {
     background: #f1f5f9;
     color: #2563eb;
 }
 
 /* İlk/Son sayfa butonları */
 .dbmeventslist-page-item:first-child .dbmeventslist-page-link,
 .dbmeventslist-page-item:last-child .dbmeventslist-page-link {
     background: #f8fafc;
     border: 2px solid #e2e8f0;
     min-width: 42px;
 }
 
 /* Ok ikonları */
 .dbmeventslist-page-item:first-child .dbmeventslist-page-link::before,
 .dbmeventslist-page-item:last-child .dbmeventslist-page-link::before {
     content: '';
     width: 18px;
     height: 18px;
     background-position: center;
     background-repeat: no-repeat;
     opacity: 0.6;
     transition: opacity 0.2s ease;
 }
 
 .dbmeventslist-page-item:first-child .dbmeventslist-page-link::before {
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%234b5563'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M15 19l-7-7 7-7'/%3E%3C/svg%3E");
 }
 
 .dbmeventslist-page-item:last-child .dbmeventslist-page-link::before {
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%234b5563'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
 }
 
 /* Ok hover efekti */
 .dbmeventslist-page-item:first-child .dbmeventslist-page-link:hover::before,
 .dbmeventslist-page-item:last-child .dbmeventslist-page-link:hover::before {
     opacity: 1;
 }
 
 /* Disabled durum */
 .dbmeventslist-page-item.disabled .dbmeventslist-page-link {
     opacity: 0.5;
     cursor: not-allowed;
     pointer-events: none;
 }
 
 /* Üç nokta */
 .dbmeventslist-page-item.disabled span.dbmeventslist-page-link {
     background: transparent;
     border: none;
     font-weight: bold;
     letter-spacing: 2px;
 }
 
 /* Mobil Responsive */
 @media (max-width: 768px) {
     .dbmeventslist-pagination {
         margin: 10px 0;
     }
 
     .dbmeventslist-pagination-list {
         flex-wrap: nowrap;
         overflow-x: auto;
         justify-content: flex-start;
         padding: 8px;
         -webkit-overflow-scrolling: touch;
         scrollbar-width: none;
         -ms-overflow-style: none;
     }
 
     .dbmeventslist-pagination-list::-webkit-scrollbar {
         display: none;
     }
 
     .dbmeventslist-page-item {
         display: block !important;
     }
 
     .dbmeventslist-page-link {
         min-width: 36px;
         height: 36px;
         font-size: 14px;
         margin: 0 2px;
     }
 }
 
 /* Modern Etkinlik Kartları */
 .dbmeventslist-card {
     background: #ffffff;
     border-radius: 16px;
     overflow: hidden;
     box-shadow: 0 4px 20px rgba(0,0,0,0.08);
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     display: flex;
     flex-direction: column;
     height: 100%;
 }
 
 .dbmeventslist-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 30px rgba(0,0,0,0.12);
 }
 
 .dbmeventslist-card-image-container {
     position: relative;
     padding-top: 60%; /* 5:3 aspect ratio */
     overflow: hidden;
 }
 
 .dbmeventslist-card-image {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.3s ease;
 }
 
 .dbmeventslist-card:hover .dbmeventslist-card-image {
     transform: scale(1.05);
 }
 
 /* Etiketler */
 .dbmeventslist-card-tags {
     position: absolute;
     left: 6px;
     bottom: 6px;
     display: flex;
     flex-direction: column;
     gap: 4px;
     z-index: 2;
     padding: 3px;
 }
 
 .dbmeventslist-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px;
  font-size: 12px;
  font-weight: 500;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 6px;
  min-width: 90px;
  max-width: 200px;
  width: auto;
  background: rgba(23, 23, 23, 0.9);
  color: #ffffff;
  white-space: pre-line;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dbmeventslist-tag span {
  padding: 4px 8px;
  width: 100%;
  text-align: center;
}
 
 .dbmeventslist-event-id {
     position: absolute;
     right: 6px;
     bottom: 6px;
     z-index: 2;
 }
 
 /* Mobil için düzenleme */
 @media (max-width: 480px) {
     .dbmeventslist-tag {
         width: 70px;
         font-size: 10px;
     }
 }
 
 #unique-container .info-icon {
     width: 16px;
     height: 16px;
     stroke-width: 1.5;
     stroke: #64748b;
     opacity: 0.8;
     display: block;
     margin: 0 auto;
 }
 
 #unique-container .custom-card-info-box tr:hover .info-icon {
     stroke: #3b82f6;
     opacity: 1;
 }
 
 @media (max-width: 1200px) {
     #unique-container .custom-card-box {
         flex: 0 0 calc(50% - 10px);
     }
 }
 
 @media (max-width: 768px) {
     #unique-container .custom-card-box {
         flex: 0 0 100%;
     }
 }

/* Mobil için ikonları küçült */
@media (max-width: 768px) {
    #unique-container .info-icon {
        width: 14px;  /* 16px'ten 14px'e */
        height: 14px;
        stroke-width: 1.2;  /* Çizgi kalınlığını azalt */
    }

    #unique-container .custom-card-info-box td {
        padding: 2px 0;  /* Padding'i azalt */
    }

    #unique-container .custom-card-info-value {
        font-size: 0.8em;  /* Font boyutunu küçült */
        padding-left: 4px;
    }

    /* Pagination mobil stili */
    .dbmeventslist-pagination-list {
        background: #f8fafc;
        padding: 4px;
        border-radius: 8px;
        gap: 2px;
    }

    .dbmeventslist-page-link {
        min-width: 30px;  /* 34px'ten 30px'e */
        height: 30px;
        font-size: 12px;  /* Font boyutunu küçült */
        padding: 0 4px;
    }

    /* Ok ikonlarını küçült */
    .dbmeventslist-page-item:first-child .dbmeventslist-page-link::before,
    .dbmeventslist-page-item:last-child .dbmeventslist-page-link::before {
        width: 14px;
        height: 14px;
    }

    /* Aktif sayfa için daha kompakt stil */
    .dbmeventslist-page-item.active .dbmeventslist-page-link {
        font-size: 12px;
        min-width: 28px;
        height: 28px;
    }
}

/* Görsel üzerindeki etiketler için mobil düzenleme */
.dbmeventslist-card-tags {
    left: 6px;  /* 8px'ten 6px'e */
    bottom: 6px;
    gap: 4px;  /* Dikey boşluk */
    z-index: 2;
    padding: 3px;  /* Etiket grubu dış boşluk */
}

.dbmeventslist-tag {
    padding: 4px 8px;  /* 6px 12px'ten 4px 8px'e */
    font-size: 11px;  /* 13px'ten 11px'e */
    width: 80px;  /* 100px'ten 80px'e */
    border-radius: 4px;  /* 6px'ten 4px'e */
}

.dbmeventslist-event-id {
    right: 6px;  /* 8px'ten 6px'e */
    bottom: 6px;
}

.dbmeventslist-event-id .dbmeventslist-tag {
    font-size: 11px;
    padding: 4px 8px;
    margin: 0;  /* ID etiketi için margin'i sıfırla */
}

/* Çok küçük ekranlar için ek düzenleme */
@media (max-width: 480px) {
    .dbmeventslist-tag {
        width: 70px;  /* Daha da küçük ekranlar için */
        font-size: 10px;
    }
}

/* Tarih seçici stilleri */
.dbmeventslist-filter-group input[type="date"] {
    position: relative;
    padding-right: 35px;
    cursor: pointer;
    background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E") no-repeat;
    background-position: right 8px center;
    background-size: 20px;
}

/* Varsayılan takvim ikonunu gizle */
.dbmeventslist-filter-group input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
}

/* Hover efekti */
.dbmeventslist-filter-group input[type="date"]:hover {
    border-color: #cbd5e1;
    background-color: #ffffff;
}

/* Focus durumu */
.dbmeventslist-filter-group input[type="date"]:focus {
    border-color: #3b82f6;
    background-color: #ffffff;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.1);
    outline: none;
}

/* Görsel container'ı */
#unique-container .custom-card-box-top > div {
    overflow: hidden;
    border-radius: 8px;
}

#unique-container .pinned-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(37, 99, 235, 0.95);
  color: white;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  z-index: 10;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

#unique-container .pinned-badge::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(45deg, rgba(255,255,255,0.1), rgba(255,255,255,0));
  border-radius: 6px;
}

@media (max-width: 768px) {
  #unique-container .pinned-badge {
      top: 8px;
      left: 8px;
      padding: 4px 8px;
      font-size: 11px;
  }
}

#unique-container .featured-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(16, 185, 129, 0.95);
    color: white;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

#unique-container .featured-badge::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(255,255,255,0.1), rgba(255,255,255,0));
    border-radius: 6px;
}

@media (max-width: 768px) {
    #unique-container .featured-badge {
        top: 8px;
        left: 8px;
        padding: 4px 8px;
        font-size: 11px;
    }
}