:root { 
  --bs-primary:#007bff;
  --bs-secondary:#6c757d;
  --bs-success:#28a745;
  --bs-danger:#dc3545;
  --bs-light:#F5F5F5; 
  --bs-dark:#343a40;
  --bs-white:#ffffff;
  --bs-black:#000000;  
  --bs-ice:#CED6E5;
  --bs-midnight:#232f3E;
  --bs-gold:#FFB700;
  --bs-silver:#C0C0C0;
  --bs-custom:#883BAF;
  --bs-custom-light:#ECD9f6;
  --bs-custom-dark:#4B1A6E;
  
  --gutter-x: 1.5rem;
  --gutter-y: 1.5rem;
  --transition-all:all 0.3s ease-in-out;
  
  --border-radius: 0.5rem;
  --box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  --box-shadow-hover: 0 8px 25px rgba(0, 0, 0, 0.2);
  --box-shadow-active: 0 2px 8px rgba(0, 0, 0, 0.15);
  --height: 44px;
  --padding: 0.5rem 1rem;
  --padding-sm: 0.375rem 0.75rem;
  --padding-lg: 0.75rem 1.25rem;
}

* { box-sizing:border-box }
body { margin:0; padding:0; font-family:'Poppins', sans-serif; font-size:1rem; font-weight:400; line-height:1.5; color:var(--bs-dark) }
a { text-decoration:none; color:inherit; transition:color 0.3s ease-in-out }


/* ========== SCROLLBAR ========== */
::-webkit-scrollbar { width:10px; }
::-webkit-scrollbar-track { background:#F5F5FA; }
::-webkit-scrollbar-thumb { background-color:var(--bs-custom); border-radius:5px; }
::-webkit-scrollbar-thumb:hover { background-color:#a855c7; background-color:color-mix(in srgb,var(--bs-custom)85%,white); }


/* ========== SELECTİON ========== */
::selection { background-color:var(--bs-custom); color:#FFF; }


/* ========== BAŞLIKLAR ========== */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin-top:0; margin-bottom:0.5rem; font-weight:500; line-height:1.2; }
h1, .h1 { font-size:calc(1.375rem + 1.20vw); }
h2, .h2 { font-size:calc(1.325rem + 0.9vw); }
h3, .h3 { font-size:calc(1.3rem + 0.6vw); }
h4, .h4 { font-size:calc(1.275rem + 0.3vw); }
h5, .h5 { font-size:1.20rem; }
h6, .h6 { font-size:1.10rem; }


/* ========== PARAGRAF VE YAZI ETİKETLERİ ========== */
p, span, li { font-size:1rem; color:var(--text-dark); } 
p, .p { margin-top:0; margin-bottom:1rem; }
.fw-light { font-weight:300 !important; }
.fw-normal { font-weight:400 !important; }
.fw-bold { font-weight:700 !important; }

.text-start { text-align:left !important; }
.text-end { text-align:right !important; }
.text-center { text-align:center !important; }

.text-lowercase { text-transform:lowercase !important; }
.text-uppercase { text-transform:uppercase !important; }
.text-capitalize { text-transform:capitalize !important; }

.text-wrap { text-wrap:wrap !important; white-space:normal !important; }


/* ========== RENKLER ========== */
.text-primary { color:var(--bs-primary) !important; }
.text-secondary { color:var(--bs-secondary) !important; }
.text-success { color:var(--bs-success) !important; }
.text-danger { color:var(--bs-danger) !important; }
.text-light { color:var(--bs-light) !important; }
.text-dark { color:var(--bs-dark) !important; }
.text-white { color:var(--bs-white) !important; }
.text-black { color:var(--bs-black) !important; }
.text-ice { color:var(--bs-ice) !important; }
.text-midnight { color:var(--bs-midnight) !important; }
.text-gold { color:var(--bs-gold) !important; }
.text-silver { color:var(--bs-silver) !important; }
.text-custom { color:var(--bs-custom) !important; }
.text-muted { color:var(--bs-secondary) !important; }

.bg-primary { background-color:var(--bs-primary) !important; }
.bg-secondary { background-color:var(--bs-secondary) !important; }
.bg-success { background-color:var(--bs-success) !important; }
.bg-danger { background-color:var(--bs-danger) !important; }
.bg-light { background-color:var(--bs-light) !important; }
.bg-dark { background-color:var(--bs-dark) !important; }
.bg-white { background-color:var(--bs-white) !important; }
.bg-black { background-color:var(--bs-black) !important; }
.bg-ice { background-color:var(--bs-ice) !important; }
.bg-midnight { background-color:var(--bs-midnight) !important; }
.bg-gold { background-color:var(--bs-gold) !important; }
.bg-silver { background-color:var(--bs-silver) !important; }
.bg-custom { background-color:var(--bs-custom) !important; }
.bg-custom-light { background-color:var(--bs-custom-light) !important; }
.bg-custom-dark { background-color:var(--bs-custom-dark) !important; }
.bg-gradient { background:linear-gradient(145deg, #6a82fb, #fc5c7d) !important; }


/* ========== GÖLGELER ========== */
.shadow { box-shadow:var(--box-shadow) !important; }
.shadow-sm { box-shadow:0 2px 5px rgba(0, 0, 0, 0.05) !important; }
.shadow-lg { box-shadow:0 10px 20px rgba(0, 0, 0, 0.15) !important; }
.shadow-none { box-shadow:none !important; }
.shadow-hover:hover { box-shadow:0 10px 20px rgba(0, 0, 0, 0.15) !important; transition:box-shadow 0.3s ease; }


/* ========== BORDERLAR ========== */
.border { border:1px solid #dee2e6 !important; }
.border-light { border:1px solid var(--bs-light) !important; }
.border-dark { border:1px solid var(--bs-dark) !important; }
.border-top { border-top:1px solid #dee2e6 !important; }
.border-end { border-right:1px solid #dee2e6 !important; }
.border-bottom { border-bottom:1px solid #dee2e6 !important; }
.border-start { border-left:1px solid #dee2e6 !important; }
.border-0 { border:0 !important; }
.border-top-0 { border-top:0 !important; }
.border-end-0 { border-right:0 !important; }
.border-bottom-0 { border-bottom:0 !important; }
.border-start-0 { border-left:0 !important; }


/* ========== BORDER RADİUSLAR ========== */
.rounded { border-radius:var(--border-radius) !important; }
.rounded-0 { border-radius:0 !important; }
.rounded-1 { border-radius:0.2rem !important; }
.rounded-2 { border-radius:0.25rem !important; }
.rounded-3 { border-radius:0.3rem !important; }
.rounded-4 { border-radius:0.375rem !important; }
.rounded-5 { border-radius:0.5rem !important; }
.rounded-circle { border-radius:50% !important; }
.rounded-pill { border-radius:50rem !important; }
.rounded-top { border-top-left-radius:0.375rem !important; border-top-right-radius:0.375rem !important; }
.rounded-end { border-top-right-radius:0.375rem !important; border-bottom-right-radius:0.375rem !important; }
.rounded-bottom { border-bottom-right-radius:0.375rem !important; border-bottom-left-radius:0.375rem !important; }
.rounded-start { border-top-left-radius:0.375rem !important; border-bottom-left-radius:0.375rem !important; }


/* ========== RESPONSİVE RESİMLER ========== */
.img-fluid { max-width:100%; height:auto; }


/* ========== MARGIN & PADDING ========== */
.m-0 { margin:0 !important; }
.mt-0 { margin-top:0 !important; }
.me-0 { margin-right:0 !important; }
.mb-0 { margin-bottom:0 !important; }
.ms-0 { margin-left:0 !important; }

.m-1 { margin:0.25rem !important; }
.mt-1 { margin-top:0.25rem !important; }
.me-1 { margin-right:0.25rem !important; }
.mb-1 { margin-bottom:0.25rem !important; }
.ms-1 { margin-left:0.25rem !important; }

.m-2 { margin:0.5rem !important; }
.mt-2 { margin-top:0.5rem !important; }
.me-2 { margin-right:0.5rem !important; }
.mb-2 { margin-bottom:0.5rem !important; }
.ms-2 { margin-left:0.5rem !important; }

.m-3 { margin:1rem !important; }
.mt-3 { margin-top:1rem !important; }
.me-3 { margin-right:1rem !important; }
.mb-3 { margin-bottom:1rem !important; }
.ms-3 { margin-left:1rem !important; }

.m-4 { margin:1.5rem !important; }
.mt-4 { margin-top:1.5rem !important; }
.me-4 { margin-right:1.5rem !important; }
.mb-4 { margin-bottom:1.5rem !important; }
.ms-4 { margin-left:1.5rem !important; }

.m-5 { margin:3rem !important; }
.mt-5 { margin-top:3rem !important; }
.me-5 { margin-right:3rem !important; }
.mb-5 { margin-bottom:3rem !important; }
.ms-5 { margin-left:3rem !important; }

.mx-auto { margin:0 auto !important; }
.my-auto { margin:auto 0 !important; }

.p-0 { padding:0 !important; }
.pt-0 { padding-top:0 !important; }
.pe-0 { padding-right:0 !important; }
.pb-0 { padding-bottom:0 !important; }
.ps-0 { padding-left:0 !important; }

.p-1 { padding:0.25rem !important; }
.pt-1 { padding-top:0.25rem !important; }
.pe-1 { padding-right:0.25rem !important; }
.pb-1 { padding-bottom:0.25rem !important; }
.ps-1 { padding-left:0.25rem !important; }

.p-2 { padding:0.5rem !important; }
.pt-2 { padding-top:0.5rem !important; }
.pe-2 { padding-right:0.5rem !important; }
.pb-2 { padding-bottom:0.5rem !important; }
.ps-2 { padding-left:0.5rem !important; }

.p-3 { padding:1rem !important; }
.pt-3 { padding-top:1rem !important; }
.pe-3 { padding-right:1rem !important; }
.pb-3 { padding-bottom:1rem !important; }
.ps-3 { padding-left:1rem !important; }

.p-4 { padding:1.5rem !important; }
.pt-4 { padding-top:1.5rem !important; }
.pe-4 { padding-right:1.5rem !important; }
.pb-4 { padding-bottom:1.5rem !important; }
.ps-4 { padding-left:1.5rem !important; }

.p-5 { padding:3rem !important; }
.pt-5 { padding-top:3rem !important; }
.pe-5 { padding-right:3rem !important; }
.pb-5 { padding-bottom:3rem !important; }
.ps-5 { padding-left:3rem !important; }


/* ========== DİSPLAY ========== */
.d-none { display:none !important; }
.d-inline { display:inline !important; }
.d-inline-block { display:inline-block !important; }
.d-block { display:block !important; }
.d-flex { display:flex !important; }
.d-grid { display:grid !important; }
.d-table { display:table !important; }

@media (min-width: 768px) {
.d-md-block { display:block !important; }
}

/*(flex-direction) */
.flex-row { flex-direction:row !important; }
.flex-column { flex-direction:column !important; }
.flex-wrap { flex-wrap:wrap !important; }

/*(justify-content) */
.justify-content-start { justify-content:flex-start !important; }
.justify-content-end { justify-content:flex-end !important; }
.justify-content-center { justify-content:center !important; }
.justify-content-between { justify-content:space-between !important; }
.justify-content-around { justify-content:space-around !important; }

/*(align-items) */
.align-items-start { align-items:flex-start !important; }
.align-items-end { align-items:flex-end !important; }
.align-items-center { align-items:center !important; }
.align-items-baseline { align-items:baseline !important; }
.align-items-stretch { align-items:stretch !important; }

/* (gap) */
.gap-1 { gap:0.25rem !important; }
.gap-2 { gap:0.5rem !important; }
.gap-3 { gap:1rem !important; }
.gap-4 { gap:1.5rem !important; }
.gap-5 { gap:3rem !important; }


/* ========== POSİTİON ========== */
.position-static { position:static !important; }
.position-relative { position:relative !important; }
.position-absolute { position:absolute !important; }
.position-fixed { position:fixed !important; }
.position-sticky { position:sticky !important; }

/*(top/right/bottom/left) */
.top-0 { top:0 !important; }
.right-0 { right:0 !important; }
.bottom-0 { bottom:0 !important; }
.left-0 { left:0 !important; }


/* ========== FLOAT HİZALAMALAR ========== */
.float-start { float:left !important; }
.float-center { float:center !important; }
.float-end { float:right !important; }


/* ========== WİDTH VE HEİGHT ========== */
.w-25 { width:25% !important; }
.w-50 { width:50% !important; }
.w-75 { width:75% !important; }
.w-100 { width:100% !important; }
.h-25 { height:25% !important; }
.h-50 { height:50% !important; }
.h-75 { height:75% !important; }
.h-100 { height:100% !important; }


/* ========== İKONLAR ========== */
.icon-sm { font-size:20px; }
.icon-md { font-size:28px; }
.icon-lg { font-size:32px; }


/* ========== Z-INDEX ========== */
.z-index-0 { z-index:0 !important; }
.z-index-1 { z-index:1 !important; }
.z-index-2 { z-index:2 !important; }
.z-index-3 { z-index:3 !important; }
.z-index-4 { z-index:4 !important; }
.z-index-5 { z-index:5 !important; }


/* ========== GRİD ========== */
.container { width:90%; margin:0 auto; }
.row { display:flex; flex-wrap:wrap; margin-right:calc(-1 * var(--gutter-x)); margin-left:calc(-1 * var(--gutter-x)); row-gap:var(--gutter-y); }
.row > [class*='col'] { padding-right:var(--gutter-x); padding-left:var(--gutter-x); }
.col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, 
.col-auto, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md-auto, 
.col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-auto { position:relative; width:100%; }
.col { flex-basis:0; flex-grow:1; max-width:100%; }
.col-auto { flex:0 0 auto; width:auto; max-width:100%; }

.col-1 { flex:0 0 8.333333%; max-width:8.333333%; }
.col-2 { flex:0 0 16.666667%; max-width:16.666667%; }
.col-3 { flex:0 0 25%; max-width:25%; }
.col-4 { flex:0 0 33.333333%; max-width:33.333333%; }
.col-5 { flex:0 0 41.666667%; max-width:41.666667%; }
.col-6 { flex:0 0 50%; max-width:50%; }
.col-7 { flex:0 0 58.333333%; max-width:58.333333%; }
.col-8 { flex:0 0 66.666667%; max-width:66.666667%; }
.col-9 { flex:0 0 75%; max-width:75%; }
.col-10 { flex:0 0 83.333333%; max-width:83.333333%; }
.col-11 { flex:0 0 91.666667%; max-width:91.666667%; }
.col-12 { flex:0 0 100%; max-width:100%; }

.g-0  { --gutter-x:0; --gutter-y:0; }
.g-1  { --gutter-x:0.25rem; --gutter-y:0.25rem; }
.g-2  { --gutter-x:0.4rem; --gutter-y:0.4rem; } /* 0.5 olacak ama ben 0.4 yaptım*/
.g-3  { --gutter-x:1rem; --gutter-y:1rem; }
.g-4  { --gutter-x:1.5rem; --gutter-y:1.5rem; }
.g-5  { --gutter-x:3rem; --gutter-y:3rem; }

.gx-0  { --gutter-x:0; }
.gx-1  { --gutter-x:0.25rem; }
.gx-2  { --gutter-x:0.5rem; }
.gx-3  { --gutter-x:1rem; }
.gx-4  { --gutter-x:1.5rem; }
.gx-5  { --gutter-x:3rem; }

.gy-0  { --gutter-y:0; }
.gy-1  { --gutter-y:0.25rem; }
.gy-2  { --gutter-y:0.5rem; }
.gy-3  { --gutter-y:1rem; }
.gy-4  { --gutter-y:1.5rem; }
.gy-5  { --gutter-y:3rem; }

@media (min-width:768px) { 
.col-md { flex-basis:0; flex-grow:1; max-width:100%; }
.col-md-auto { flex:0 0 auto; width:auto; max-width:100%; }
.col-md-1 { flex:0 0 8.333333%; max-width:8.333333%; }
.col-md-2 { flex:0 0 16.666667%; max-width:16.666667%; }
.col-md-3 { flex:0 0 25%; max-width:25%; }
.col-md-4 { flex:0 0 33.333333%; max-width:33.333333%; }
.col-md-5 { flex:0 0 41.666667%; max-width:41.666667%; }
.col-md-6 { flex:0 0 50%; max-width:50%; }
.col-md-7 { flex:0 0 58.333333%; max-width:58.333333%; }
.col-md-8 { flex:0 0 66.666667%; max-width:66.666667%; }
.col-md-9 { flex:0 0 75%; max-width:75%; }
.col-md-10 { flex:0 0 83.333333%; max-width:83.333333%; }
.col-md-11 { flex:0 0 91.666667%; max-width:91.666667%; }
.col-md-12 { flex:0 0 100%; max-width:100%; }

.g-md-0 { --gutter-x:0; --gutter-y:0; }
.g-md-1 { --gutter-x:0.25rem; --gutter-y:0.25rem; }
.g-md-2 { --gutter-x:0.5rem; --gutter-y:0.5rem; }
.g-md-3 { --gutter-x:1rem; --gutter-y:1rem; }
.g-md-4 { --gutter-x:1.5rem; --gutter-y:1.5rem; }
.g-md-5 { --gutter-x:3rem; --gutter-y:3rem; }
}

@media (min-width:992px) { 
.col-lg { flex-basis:0; flex-grow:1; max-width:100%; }
.col-lg-auto { flex:0 0 auto; width:auto; max-width:100%; }
.col-lg-1 { flex:0 0 8.333333%; max-width:8.333333%; }
.col-lg-2 { flex:0 0 16.666667%; max-width:16.666667%; }
.col-lg-3 { flex:0 0 25%; max-width:25%; }
.col-lg-4 { flex:0 0 33.333333%; max-width:33.333333%; }
.col-lg-5 { flex:0 0 41.666667%; max-width:41.666667%; }
.col-lg-6 { flex:0 0 50%; max-width:50%; }
.col-lg-7 { flex:0 0 58.333333%; max-width:58.333333%; }
.col-lg-8 { flex:0 0 66.666667%; max-width:66.666667%; }
.col-lg-9 { flex:0 0 75%; max-width:75%; }
.col-lg-10 { flex:0 0 83.333333%; max-width:83.333333%; }
.col-lg-11 { flex:0 0 91.666667%; max-width:91.666667%; }
.col-lg-12 { flex:0 0 100%; max-width:100%; }

.g-lg-0 { --gutter-x:0; --gutter-y:0; }
.g-lg-1 { --gutter-x:0.25rem; --gutter-y:0.25rem; }
.g-lg-2 { --gutter-x:0.5rem; --gutter-y:0.5rem; }
.g-lg-3 { --gutter-x:1rem; --gutter-y:1rem; }
.g-lg-4 { --gutter-x:1.5rem; --gutter-y:1.5rem; }
.g-lg-5 { --gutter-x:3rem; --gutter-y:3rem; }
}


@media (min-width: 768px) { 
.g-md-0 { --gutter-x:0; --gutter-y:0; }
.g-md-1 { --gutter-x:0.25rem; --gutter-y:0.25rem; }
.g-md-2 { --gutter-x:0.5rem; --gutter-y:0.5rem; }
.g-md-3 { --gutter-x:1rem; --gutter-y:1rem; }
.g-md-4 { --gutter-x:1.5rem; --gutter-y:1.5rem; }
.g-md-5 { --gutter-x:3rem; --gutter-y:3rem; }
}


/* ========== UTİLİTİES ========== */
.transition-all { transition:all 0.3s ease-in-out; }
.cursor-pointer { cursor:pointer !important; }
.cursor-not-allowed { cursor:not-allowed !important; }
.user-select-none { user-select:none !important; }
.pointer-events-none { pointer-events:none !important; }
.scroll-smooth { scroll-behavior:smooth !important; }
.list-unstyled { list-style:none !important; padding-left:0 !important; margin-bottom:0 !important; }
.overflow-hidden { overflow:hidden !important; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0; }


/* ========== BUTONLAR ========== */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:0.5rem; padding:var(--padding); font-weight:600; line-height:1.5; border-radius:var(--border-radius); cursor:pointer; user-select:none; transition:var(--transition-all); font-size:1rem; border:none; position:relative; overflow:hidden; text-decoration:none; box-shadow:var(--box-shadow); -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; touch-action:manipulation; min-height:var(--height); }
.btn::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); transition:left 0.5s; }
.btn:hover::before { left:100%; }
.btn:active { transform:translateY(1px); box-shadow:var(--box-shadow-active); }
.btn:focus { outline:none; }
.btn[type="submit"]:disabled, button[type="submit"]:disabled { background-color:#999 !important; opacity:0.6 !important; color:#fff !important; cursor:not-allowed; transform:none; box-shadow:none; }

.btn-primary { color:#fff; background:linear-gradient(135deg, var(--bs-primary) 0%, #0056b3 100%); }
.btn-primary:hover { background:linear-gradient(135deg, #0056b3 0%, var(--bs-primary) 100%); box-shadow:var(--box-shadow-hover); }
.btn-primary:active, .btn-primary:focus, .btn-primary:disabled { background:linear-gradient(135deg, var(--bs-primary) 0%, #0056b3 100%) !important; transform:translateY(0); box-shadow:var(--box-shadow-active); }

.btn-secondary { color:#fff; background:linear-gradient(135deg, var(--bs-secondary) 0%, #5a6268 100%); }
.btn-secondary:hover { background:linear-gradient(135deg, #5a6268 0%, var(--bs-secondary) 100%); box-shadow:var(--box-shadow-hover); }
.btn-secondary:active, .btn-secondary:focus, .btn-secondary:disabled { background:linear-gradient(135deg, var(--bs-secondary) 0%, #5a6268 100%) !important; transform:translateY(0); box-shadow:var(--box-shadow-active); }

.btn-success { color:#fff; background:linear-gradient(135deg, var(--bs-success) 0%, #1e7e34 100%); }
.btn-success:hover { background:linear-gradient(135deg, #1e7e34 0%, var(--bs-success) 100%); box-shadow:var(--box-shadow-hover); }
.btn-success:active, .btn-success:focus, .btn-success:disabled { background:linear-gradient(135deg, var(--bs-success) 0%, #1e7e34 100%) !important; transform:translateY(0); box-shadow:var(--box-shadow-active); }

.btn-danger { color:#fff; background:linear-gradient(135deg, var(--bs-danger) 0%, #c82333 100%); }
.btn-danger:hover { background:linear-gradient(135deg, #c82333 0%, var(--bs-danger) 100%); box-shadow:var(--box-shadow-hover); }
.btn-danger:active, .btn-danger:focus, .btn-danger:disabled { background:linear-gradient(135deg, var(--bs-danger) 0%, #c82333 100%) !important; transform:translateY(0); box-shadow:var(--box-shadow-active); }

.btn-light { color:var(--bs-dark); background:linear-gradient(135deg, var(--bs-light) 0%, #e9ecef 100%); }
.btn-light:hover { background:linear-gradient(135deg, #e9ecef 0%, var(--bs-light) 100%); box-shadow:var(--box-shadow-hover); }
.btn-light:active, .btn-light:focus, .btn-light:disabled { background:linear-gradient(135deg, var(--bs-light) 0%, #e9ecef 100%) !important; transform:translateY(0); box-shadow:var(--box-shadow-active); }

.btn-dark { color:#fff; background:linear-gradient(135deg, var(--bs-dark) 0%, #212529 100%); }
.btn-dark:hover { background:linear-gradient(135deg, #212529 0%, var(--bs-dark) 100%); box-shadow:var(--box-shadow-hover); }
.btn-dark:active, .btn-dark:focus, .btn-dark:disabled { background:linear-gradient(135deg, var(--bs-dark) 0%, #212529 100%) !important; transform:translateY(0); box-shadow:var(--box-shadow-active); }

.btn-custom { color:#fff; background:linear-gradient(135deg, var(--bs-custom) 0%, var(--bs-custom-dark) 100%); position:relative; }
.btn-custom:hover { background:linear-gradient(135deg, var(--bs-custom-dark) 0%, var(--bs-custom) 100%); box-shadow:var(--box-shadow-hover); }
.btn-custom:active, .btn-custom:focus, .btn-custom:disabled { background:linear-gradient(135deg, var(--bs-custom) 0%, var(--bs-custom-dark) 100%) !important; transform:translateY(0); box-shadow:var(--box-shadow-active); }

/* Özel buton boyutları */
.btn-sm { padding:var(--padding-sm); font-size:0.875rem; border-radius:calc(var(--border-radius) * 0.8); min-height:var(--height); }
.btn-lg { padding:var(--padding-lg); font-size:1.125rem; border-radius:calc(var(--border-radius) * 1.2); min-height:var(--height); font-weight:700; }

/* Özel buton stilleri */
.btn-outline { background:transparent; border:2px solid currentColor; color:var(--bs-custom); }
.btn-outline:hover { background:var(--bs-custom); color:#fff; }
.btn-ghost { background:rgba(136, 59, 175, 0.1); color:var(--bs-custom); border:1px solid rgba(136, 59, 175, 0.2); }
.btn-ghost:hover { background:var(--bs-custom); color:#fff; border-color:var(--bs-custom); }

/* Buton grupları */
.btn-group { display:inline-flex; gap:0.5rem; flex-wrap:wrap; }
.btn-group .btn { margin:0; }

/* Mobil optimizasyonları */
@media (max-width: 768px) {
  .btn { min-height:var(--height); padding:0.75rem 1rem; font-size:1rem; }
  .btn-sm { min-height:var(--height); padding:0.5rem 0.625rem; }
  .btn-lg { min-height:var(--height); padding:1rem 1rem; font-size:1.125rem; }
  .btn-group { flex-direction:column; width:100%; }
  .btn-group .btn { width:100%; }
}

/* Animasyonlar */
@keyframes buttonPulse { 0% { box-shadow:0 0 0 0 rgba(136, 59, 175, 0.7); } 70% { box-shadow:0 0 0 10px rgba(136, 59, 175, 0); } 100% { box-shadow:0 0 0 0 rgba(136, 59, 175, 0); } }
.btn-pulse { animation:buttonPulse 2s infinite; }
/* Loading state */
.btn-loading { position:relative; color:transparent !important; }
.btn-loading::after { content:''; position:absolute; width:16px; height:16px; top:50%; left:50%; margin-left:-8px; margin-top:-8px; border:2px solid transparent; border-top-color:#fff; border-radius:50%; animation:spin 1s linear infinite; }
@keyframes spin { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); } }


/* ========== ALERTLER ========== */
.alert { position:relative; padding:var(--padding); margin-bottom:1rem; border:1px solid transparent; border-radius:var(--border-radius); }
.alert-primary { color:#084298; background-color:#cfe2ff; border-color:#b6d4fe; }
.alert-secondary { color:#41464b; background-color:#e2e3e5; border-color:#d3d6d8; }
.alert-success { color:#0f5132; background-color:#d1e7dd; border-color:#badbcc; }
.alert-danger { color:#842029; background-color:#f8d7da; border-color:#f5c2c7; }
.alert-custom { color:var(--bs-custom-dark); background-color:var(--bs-custom-light); border-color:#d1a3e0; border-color:color-mix(in srgb,var(--bs-custom-light)90%,black); }


/* ========== FORMLAR ========== */
label { font-weight:600; color:var(--bs-dark); margin-bottom:0.5rem; display:block; }
input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], input[type="url"], input[type="time"], input[type="date"], select, textarea { font-size:1rem; color:var(--bs-dark); padding:var(--padding); line-height:1.5; border:1px solid #e0e0e0; border-radius:var(--border-radius); width:100%; max-width:100%; transition:var(--transition-all); appearance:none; -webkit-appearance:none; -moz-appearance:none; background-color:#fff; min-height:var(--height); font-family:inherit; }
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="url"]:focus, input[type="time"]:focus, input[type="date"]:focus, select:focus, textarea:focus { outline:none; border-color:var(--bs-custom); box-shadow:0 0 0 3px rgba(136, 59, 175, 0.1); }
input[type="radio"], input[type="checkbox"] { transform:scale(1.25); cursor:pointer; margin-right:0.5rem; }
select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23212529' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6' stroke='%23212529' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 0.75rem center; background-size:16px 12px; padding-right:2.5rem; }
textarea { min-height:120px; resize:vertical; font-family:inherit; }

/* Input boyutları */
.input-sm { padding:var(--padding-sm); font-size:0.875rem; min-height:var(--height); }
.input-lg { padding:var(--padding-lg); font-size:1.125rem; min-height:var(--height); }

/* Mobil optimizasyonları */
@media (max-width: 768px) {
  input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], input[type="url"], input[type="time"], input[type="date"], select, textarea { min-height:var(--height); padding:0.75rem 1rem; font-size:1rem; }
  .input-sm { min-height:var(--height); padding:0.5rem 0.75rem; }
  .input-lg { min-height:var(--height); padding:1rem 1.25rem; }
}


/* ========== TABLOLAR ========== */
.table { width:100%; overflow-x:auto; margin-bottom:1rem; color:var(--bs-dark); vertical-align:top; border-color:#dee2e6; border-spacing:0; border-radius:var(--border-radius); }
.table th, .table td { padding:0.5rem; vertical-align:top; border-top:1px solid #dee2e6; }
.table thead th { vertical-align:bottom; border-bottom:2px solid #dee2e6; }
.table-bordered { border:1px solid #dee2e6; }
.table-bordered th, .table-bordered td { border:1px solid #dee2e6; }
.table-striped tbody tr:nth-of-type(odd) { background-color:rgba(0, 0, 0, 0.05); }


/* ========== CARDLAR ========== */
.card { position:relative; display:flex; flex-direction:column; height:100%; word-wrap:break-word; background-color:#fff; background-clip:border-box; border:0px solid rgba(0, 0, 0, 0.125); border-radius:var(--border-radius); }
.card-img-top { max-width:100%; height:auto; border-top-left-radius:calc(var(--border-radius) - 1px); border-top-right-radius:calc(var(--border-radius) - 1px); object-fit:cover; }
.card-body { flex:1 1 auto; padding:0.25rem; }
.card-title { margin-bottom:0.5rem; line-height:1.25rem}
.card-text { margin-bottom:0.5rem; }
.card-color { width:20px; height:20px; border-radius:50%; border:1px solid grey; }


/* ========== SEARCH ========== */
.search-container { display:flex; align-items:center; border-radius:var(--border-radius); overflow:hidden; background-color:var(--bs-custom-light); }
.search-input { flex:1; border:none; color:var(--bs-dark); border-top-right-radius:0; border-bottom-right-radius:0; }
.search-input::-webkit-outer-spin-button, .search-input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.search-input:focus { border-color:none; outline:0; box-shadow:none; }
.search-button { background-color:transparent; color:#000; font-size:20px; padding:0.5rem 1rem; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.search-button:hover { background-color:none; }


/* ========== UNDERLİNE ========== */
.underline-single { display:inline-block; position:relative; margin-bottom:1rem; }
.underline-single::after { content:""; display:block; width:70%; height:2px; margin:8px auto 0; background:linear-gradient(90deg,transparent 0%,#999 50%,transparent 100%); }
.underline-double { display:inline-block; position:relative; margin-bottom:1rem; padding-bottom:4px; }
.underline-double::before, .underline-double::after { content:""; position:absolute; left:15%; width:70%; height:2px; background:linear-gradient(90deg,transparent 0%,#999 50%,transparent 100%); }
.underline-double::before { bottom:0; }
.underline-double::after { bottom:-4px; }
.underline-focus { display:inline-block; position:relative; margin-bottom:1rem; }
.underline-focus::after { content:""; position:absolute; left:0; bottom:-6px; width:100%; height:2px; background:linear-gradient(90deg,transparent 0%,rgba(153,153,153,0.3) calc(50% - 25px),#999 calc(50% - 25px),#999 calc(50% + 25px),rgba(153,153,153,0.3) calc(50% + 25px),transparent 100%); }


/* ========== TABS ========== */
.tabs { border-radius:var(--border-radius); }
.tab-header { display:flex; justify-content:center; border-bottom:1px solid rgba(0,0,0,0.05); }
.tab-btn { padding:1rem; background-color:transparent; border:none; cursor:pointer; font-size:1rem; font-weight:600; color:var(--bs-secondary); position:relative; margin:0 0.25rem; }
.tab-btn.active { color:var(--bs-custom); }
.tab-btn::after { content:''; position:absolute; bottom:0; left:50%; width:0; height:3px; background-color:var(--bs-custom); transform:translateX(-50%); transition:width 0.3s ease-in-out; }
.tab-btn.active::after { width:60%; }
.tab-content { padding:1rem auto; display:none; animation:fadeInUp 0.3s ease-out; min-height:250px; }
.tab-content.active { display:block; }
#tab1 a { color:#5c9edc; }
#tab1 a:hover { color:#3d7bbf; }


/* ========== MODAL DİALOG ========== */
.modal-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.5); align-items:center; justify-content:center; z-index:1000; backdrop-filter:blur(3px); }
.modal-content { background-color:white; border-radius:var(--border-radius); width:90%; max-width:500px; overflow:hidden; animation:fadeInUp 0.3s ease-out; }
.modal-header { border-bottom:1px solid #eee; display:flex; justify-content:space-between; align-items:center; }
.modal-title { margin:0; font-size:1.5rem; color:#333; }
.btn-close { background-color:transparent; border:none; font-size:2rem; cursor:pointer; }
.modal-body { line-height:1.5; color:#555; }
.modal-footer { border-top:1px solid #eee; display:flex; justify-content:flex-end; gap:10px; }


/* ========== TOOLTİP ========== */
[data-tooltip] { position:relative; color:white; border:none; border-radius:var(--border-radius); cursor:pointer; font-size:1rem; }
[data-tooltip]:hover::before { content:attr(data-tooltip); position:absolute; bottom:calc(100% + 10px); left:50%; transform:translateX(-50%); background-color:rgba(48, 48, 48, 0.8); color:white; font-size:0.9rem; padding:5px; border-radius:var(--border-radius); width:max-content; max-width:200px; }
[data-tooltip]:hover::after { content:''; position:absolute; bottom:100%; left:50%; transform:translateX(-50%); border:5px solid transparent; border-top-color:rgba(48, 48, 48, 0.8); }


/* ========== ACCORDİON ========== */
.accordion { width:100%; }
.accordion-question { display:flex; align-items:center; justify-content:space-between; background-color:var(--bs-ice); color:var(--bs-dark); padding:1rem; margin-bottom:0.5rem; border-radius:var(--border-radius); cursor:pointer; position:relative; user-select:none; }
.accordion-icon { display:flex; align-items:center; }
.accordion-icon i { color:var(--bs-dark); }
.accordion-answer { background-color:#fff; padding:1rem; margin-bottom:1rem; border-radius:var(--border-radius); display:none; overflow:hidden; }
.accordion-item.expanded .accordion-answer { display:block; }
.accordion-item.expanded .accordion-icon { transform:rotate(180deg); }


/* ========== ANİMATİON ========== */
@keyframes fadeInUp { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.fade-in-up { opacity:0; transform:translateY(40px); animation:fadeInUp 1s ease-out forwards; }


/* ========== HEADER & MENULER ========== */
.header { position:absolute; top:0; left:0; width:100%; background-color:var(--bs-custom-dark); }
.header .marquee { width:100%; overflow:hidden; background-color:var(--bs-gold); z-index:1001; }
.header .marquee span { display:inline-block; white-space:nowrap; padding-left:100%; animation:marquee 15s linear infinite; font-size:0.9rem; color:#333; margin:0 auto; line-height:30px; }
@keyframes marquee { 0% { transform:translateX(0); } 100% { transform:translateX(-100%); } }
.header .container { display:flex; align-items:center; justify-content:space-between; height:70px; z-index:1000; }
.mobile-header { display:none; }
.logo img { height:45px; }
.nav { position:relative; }
.nav ul { list-style:none; display:flex; gap:1rem; padding:0; }
.nav ul li { position:relative; }
.nav ul li a { color:white; text-decoration:none; padding:1.5rem 1rem; display:block; transition:color 0.3s ease; font-size:1rem; font-weight:500; }
.nav ul li ul { display:block; opacity:0; visibility:hidden; position:absolute; top:100%; background-color:var(--bs-custom-dark); white-space:nowrap; min-width:185px; max-height:450px; overflow-y:auto; border-radius:0 0 8px 8px; transition:opacity 0.3s ease, max-height 0.4s ease, visibility 0.3s ease; z-index:10; box-sizing:border-box; }
.nav ul li ul li a { padding:0.75rem 1rem; font-size:1rem; }
.menu-toggle { display:none; font-size:2rem; cursor:pointer; color:white; background:none; border:none; }


@media (min-width:769px) { 
.nav ul li:hover ul { display:block; opacity:1; visibility:visible; } 
.nav ul li a::after { content:''; display:block; width:0; height:2px; background:white; transition:width 0.4s ease; position:absolute; bottom:1.3rem; left:50%; transform:translateX(-50%); }
.nav ul li a:hover::after { width:80%; }
.nav ul li ul li:hover { background-color:var(--bs-custom); }
.nav ul li ul li a::after { content:none; }

.article-column { column-count:2; column-gap:50px; text-align:justify; column-rule:1px dashed grey; }
}


@media (max-width:768px) { 
.nav { position:fixed; top:0; left:-300px; width:300px; height:100%; transition:left 0.3s ease; z-index:1001; overflow-y:auto; background-color:var(--bs-custom-dark); }
.nav.active { left:0; }
.nav ul { flex-direction:column; gap:0; padding:0 5%; }
.nav ul li a { padding:0.75rem 0; border-bottom:1px solid rgba(255, 255, 255, 0.1); }
.nav ul li ul { padding-right:0; display:none; position:static; margin-left:20px; left:0; background-image:none; max-height:auto; scrollbar-width:none; -ms-overflow-style:none; }
.nav ul li ul.open { display:block; opacity:1; visibility:visible; }
.menu-toggle { display:block; } 
.overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.5); z-index:999; } 
.overlay.active { display:block; } 
.mobile-header { display:flex; justify-content:space-between; align-items:center; padding:1rem; margin-bottom:20px; height:100px; background-color:rgba(255, 255, 255, 0.05); } 
.btn-close-menu { font-size:1.5rem; color:#fff; background:none; border:none; cursor:pointer; }
.card-color { width:16px; height:16px; border-radius:50%; border:1px solid grey; }
  .card-title { font-size:0.95rem; }
}


/* ========== CUSTOM CSS ========== */
.main { margin-top:100px; min-height:calc(100vh - 100px); }

.homepage-hero-section { height:100vh; padding-top:100px; background-image:radial-gradient(circle at 0% 0%,rgba(93, 29, 136, 0.20) 0%, rgba(93, 29, 136, 0) 70% ), url("../images/tisorthane-anasayfa-masaustu.webp"); background-position:top left, bottom right; background-size:contain, contain; background-repeat:no-repeat, no-repeat; display:flex; align-items:center; }
.homepage-hero-section2 { height:100vh; padding-top:100px; background-image:radial-gradient(circle at 0% 0%,rgba(93, 29, 136, 0.20) 0%, rgba(93, 29, 136, 0) 70% ), url("../images/tisort-baski-anasayfa-masaustu.webp"); background-position:top left, bottom right; background-size:contain, contain; background-repeat:no-repeat, no-repeat; display:flex; align-items:center; }
.homepage-hero-content { max-width:600px; color:var(--bs-dark); font-weight:500; }
.homepage-hero-content h2 { font-size:calc(1.5rem + 1.5vw); }
.homepage-hero-content p { font-size:1.1rem; line-height:1.5; }

.category-link { position:relative; display:block; border-left:4px solid transparent; transition:all 0.3s ease; }
.category-link:hover { background-color:rgba(245,245,245,0.9); border-left-color:var(--bs-custom); transform:translateX(5px);ca box-shadow:0 2px 8px rgba(0,0,0,0.05); }
.category-link::before { content:''; position:absolute; top:0; left:0; width:0; height:100%; background:linear-gradient(90deg,rgba(93,29,136,0.1),transparent); transition:width 0.3s ease; }
.category-link:hover::before { width:100%; }

.blog-detail-subscriber { width:100%; padding:100px 5%; background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.3)),url('../../assets/images/newsletter-background.webp'); background-position:center; background-size:cover; background-attachment:fixed; display:flex; align-items:center; flex-direction:column; justify-content:center; }
article a {color:#1a73e8;text-decoration:none;transition:color 0.3s ease;}
article a:hover {color:#0c47b7;}

@media (max-width:768px) { 
.homepage-hero-section { height:calc(94vh); background-image:linear-gradient(rgba(0,0,0,0.25),rgba(0,0,0,0.25)),url('../../assets/images/tisorthane-anasayfa-mobil.webp'); background-size:cover; background-position:center; background-repeat:no-repeat; }
.homepage-hero-section2 { height:calc(94vh); background-image:linear-gradient(rgba(0,0,0,0.25),rgba(0,0,0,0.25)),url('../../assets/images/tisort-baski-anasayfa-mobil.webp'); background-size:cover; background-position:center; background-repeat:no-repeat; }
.homepage-hero-content { color:var(--bs-white); }
}

