@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --gradient-color1: #FFC85B;
    --gradient-color2: #DB46FF;
    --gradient1: linear-gradient(to right, #FFC85B, #DB46FF);
    --red: #FF2A40;
}



::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: #272636;
}

::-webkit-scrollbar-thumb {
    background-color:  #FE5B00;
    border-radius: 10px;
    border: 3px solid #272636;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #f36e2c;
}

img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    user-select: none;
    -webkit-user-select: none;
}

.btn {
    border-radius: 10px !important;
}

/* Top Bar */
.gg-topbar {
    background-color: #1b1a26;
}

.gg-topbar .icon-announce {
    background-color: var(--red);
    color: #fff;
    min-width: 40px;
    height: 40px;
    text-align: center;
    line-height: 56px;
    margin-right: 10px;
}

.gg-topbar .icon-announce i {
    font-size: 26px;
}

.gg-topbar .announce {
    width: 100%;
}

.announce-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 300;
    font-size: 15px;
    display: block;
}

.announce {
    height: 40px;
}

.announce .swiper-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.gg-topbar .buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.gg-topbar .buttons .btn {
    font-size: 14px;
    font-weight: 500;
}

.gg-topbar .buttons .dropdown-item {
    font-size: 14px;
}

.btn-transparent {
    color: #fff !important;
}

.dropdown-menu {
    background-color: #0e1d23 !important;
    color: #fff !important;
}

.dropdown-menu .dropdown-item {
    color: #fff;
}

.dropdown-menu .dropdown-item:hover {
    background-color: rgba(250, 101, 14, 0.205) !important;
    color: #fff;
}

/* Header */
.gg-header {
    padding: 20px 0;
    background-color: #272636;
}

.gg-hover-red:hover {
    color: #FF2A40 !important;
    transition: 0.2s ease;
}

.gg-header .form-search {
    position: relative;
}

.gg-header .form-search .form-control {
    background-color: #272636 !important;
    border: 1px solid #353353 !important;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.35);
    height: 60px;
    border-radius: 6px;
    padding: 0 30px;
    width: 100%;
    display: block;
    transition: 0.75s ease;
}

.gg-header .form-search .button {
    height: 50px;
    width: 50px;
    border-radius: 100%;
    display: inline-block;
    text-align: center;
    line-height: 62px;
    color: #fff;
    position: absolute;
    top: 6px;
    right: 6px;
}

.gg-header .form-search .form-control:focus {
    border-color: #FF315B !important;
    transition: 0.2s ease-in-out;
}

.search-list {
    position: absolute;
    width: 100%;
    background-color: #272636;
    border: 1px solid #353353;
    padding: 5px;
    border-radius: 10px;
    z-index: 999;
    margin-top: 10px;
}

.search-list .product {
    padding: 15px;
    border-radius: 10px;
    cursor: pointer;
}

.search-list .product:hover {
    background-color: #201f2c;
}

.search-list .product .img {
    width: 100px;
    margin-right: 20px;
}

.search-list .product .content {
    width: 100%;
}

.search-list .product .productname {
    font-size: 18px;
}

.search-list .product .price {
    font-size: 22px;
    font-weight: 600;
    color: #31FF9F;
}

.btn-header {
    border-radius: 6px !important;
    color: #fff !important;
    position: relative;
    background-color: #0e1d23;
}


.btn-header .material-icons {
    height: 35px;
    min-width: 35px;
    max-width: 35px;
    border-radius: 100%;
    line-height: 35px;
    font-size: 20px;
}

.btn-header .content {
    display: flex;
    align-items: center;
}

.btn-header .title {
    margin: 0 10px;
}

.btn-header:hover {
    background-color: #d659281c;
}

.gg-header .buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dropdown-profile .dropdown-menu {
    width: 220px;
    border-radius: 10px;
}

.dropdown-profile .dropdown-menu .dropdown-item {
    font-size: 17px;
    padding: 7px 20px;
}

.text-danger {
    color: var(--red) !important;
}

/**/
.btn.red {
    border: 1px solid #FF315B;
    box-shadow: 0 3px 6px rgba(255, 49, 91, 0.25);
}

.btn.red .title {
    color: #FF315B;
    text-shadow: 0 0 6px #FF315B;
}

.btn.red .material-icons {
    background-color: #FF315B
}

/**/
.btn.green {
    border: 1px solid #31FF9F;
    box-shadow: 0 3px 6px rgba(49, 255, 159, 0.25);
}

.btn.green .title {
    color: #31FF9F;
    text-shadow: 0 0 6px #31FF9F;
}

.btn.green .material-icons {
    background-color: #31FF9F
}

/**/
.btn.yellow {
    border: 1px solid #FF9F31;
    box-shadow: 0 3px 6px rgba(255, 159, 49, 0.25);
}

.btn.yellow .title {
    color: #FF9F31;
    text-shadow: 0 0 6px #FF9F31;
}

.btn.yellow .material-icons {
    background-color: #FF9F31
}

/**/
.btn.purple {
    border: 1px solid #622EF4;
    box-shadow: 0 3px 6px rgba(255, 159, 49, 0.25);
}

.btn.purple .title {
    color: #622EF4;
    text-shadow: 0 0 6px #622EF4;
}

.btn.purple .material-icons {
    background-color: #622EF4
}

/**/
.btn-header.pink .img-profile {
    height: 50px;
    width: 50px;
    border-radius: 100%;
    border: 1px solid #ff5b00;
    box-shadow: 0 3px 6px rgb(255 133 49 / 35%);
}

.btn-header.pink {
    border: 1px solid #ff5b00;
    box-shadow: 0 3px 6px rgb(255 133 49 / 35%);
    text-align: left;
}

.btn-header.pink .right {
    padding: 0 25px 0 10px;
}

.btn-header.pink .title {
    text-shadow: 0 0 6px #fff;
    font-size: 9px;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin: 0;
}

.btn-header.pink .name {
    color: #ff5b00;
    text-shadow: 0 0 6px rgb(255 133 49 / 35%);
    font-size: 22px;
}

.btn-header.pink .more {
    position: absolute;
    right: -15px;
    font-size: 22px;
    color: #ff5b00;
}

/* Navbar */
.gg-navbar {
    background-color: #161520;
}

.gg-navbar .navbar-nav {
    justify-content: space-between;
    width: 100%;
}

.gg-navbar .nav-item {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.gg-navbar .nav-link {
    color: #fff;
    font-size: 19px;
    font-weight: 300;
    text-align: center;
}

.gg-navbar .nav-link i {
    font-size: 19px;
    margin-right: 7px;
    margin-top: -2px;
}

.gg-navbar .nav-link:hover,
.gg-navbar .nav-link:focus {
    color: #FF315B;
}

.gg-navbar .nav-item:hover {
    border-bottom: 1px solid #FF315B;
    border-top: 1px solid #FF315B;
    padding-bottom: 0;
    border-radius: 6px;
}

.gg-navbar .navbar-toggler {
    color: #fff;
    outline: none !important;
    width: 100%;
    text-align: right;
}

.gg-navbar .navbar-toggler:focus {
    box-shadow: none !important;
}

/* Slider Home */
.gg-home-slider {
    margin-top: 30px;
}

.gg-home-slider .owl-carousel .item img {
    border-radius: 29px;
}

.gg-home-slider .owl-dots {
    position: relative;
    top: -50px;
    margin-top: 0;
}

.gg-home-slider .owl-dots span {
    height: 20px !important;
    width: 20px !important;
    box-shadow: 0 0 6px #FFFFFF;
}

.gg-home-slider .owl-dots .active span {
    background-color: transparent !important;
    border: 1px solid #fff;
    box-shadow: none;
}

/* Shortcut */
.gg-shortcuts {
    margin-bottom: 30px;
}

.gg-shortcut {
    background: linear-gradient(to right, #ffffff, #ffffff);
    border-radius: 16px;
    padding: 10px;
    display: flex;
    align-items: center;
    color: #484848;
    transition: 0.3s;
    margin: 10px 0;
}

.gg-shortcut .img {
    height: 83px;
    min-width: 40px;
    max-width: 110px;
    margin-right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gg-shortcut .img2 {
    visibility: hidden;
    opacity: 0;
    transition: 0.3s;
    display: none !important;
}

.gg-shortcut .content {
    text-align: center;
}

.gg-shortcut .title {
    font-size: 13px;
    text-transform: uppercase;
    margin-bottom: 2px;
}

.gg-shortcut .subtitle {
    font-size: 13px;
    font-weight: 300 !important;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.gg-shortcut:hover {
    background: linear-gradient(to top right, var(--gradient-color1), var(--gradient-color2));
    color: #fff;
}

.gg-shortcut:hover .img1 {
    display: none;
}

.gg-shortcut:hover .img2 {
    visibility: visible;
    opacity: 1;
    display: block !important;
}

.gg-shortcut:hover .title {
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

/* Auth */
.gg-auth {
    height: 100%;
    display: flex;
    align-items: center;
}

.gg-auth .img-auth {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.gg-auth .img-auth.img-auth-left {
    right: inherit;
    left: 0;
}

.gg-auth .img-logo {
    display: block;
    margin: auto;
    z-index: 2;
    position: relative;
}

.gg-auth .left {
    position: relative;
    z-index: 3;
    padding-left: 40px;
}

.gg-auth .left.register {
    padding-left: 0;
    padding-right: 60px;
}

.gg-auth form label {
    font-size: 18px;
    display: block;
    margin-bottom: 3px;
}

.gg-auth .forgot {
    color: #fff;
}

.gg-auth .forgot i {
    font-size: 20px;
    position: relative;
    top: 5px;
}

.btn-green-blur {
    border: 3px solid #2AFF9C !important;
    background-color: transparent;
    box-shadow: 0 0 15px #2AFF9C;
    color: #2AFF9C !important;
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
}

.btn-green-blur.background {
    color: #fff !important;
    background-color: #2AFF9C;
}

.btn-red-blur {
    border: 3px solid #FF2A4E !important;
    background-color: #FF2A4E !important;
    box-shadow: 0 0 15px #FF2A4E;
    color: #fff !important;
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
}

.btn-red-blur.bordered {
    color: #FF2A4E !important;
    background-color: transparent !important;
}

.form-control-border.form-control {
    background-color: transparent !important;
    border: 1px solid #ABABAB !important;
}

/* Modal Login */
.gg-modal-login .modal-title {
    font-weight: 600 !important;
    text-transform: uppercase;
    font-size: 34px;
}

.gg-modal-login .body {
    padding: 20px;
}

.gg-modal-login .head {
    text-align: center;
    padding-top: 15px;
}

.gg-modal-login .btn-close {
    position: absolute;
    top: 20px;
    right: 20px;
}

.gg-modal-login .btn {
    padding: 10px;
    font-size: 18px;
    font-weight: 500;
    border-radius: 4px !important;
}

.gg-modal-login .form-control {
    height: 52px;
    border: 1px solid #000 !important;
}

.gg-modal-login form label {
    display: block;
    margin-bottom: 3px;
}

.gg-modal-login .btn-success {
    margin-bottom: 5px;
}

.register-text {
    font-weight: 300;
    text-align: center;
    display: block;
    margin-top: 3px;
}

.register-text a {
    color: #FF315B;
    font-weight: 500;
}

.register-text a:hover {
    color: #d1193f;
}

.btn-social {
    background-color: #fff !important;
    color: #000 !important;
    position: relative;
    margin: 5px 0;
    padding: 10px !important;
    transition: 0.2s !important;
}

.btn-social img {
    position: absolute;
    left: 7px;
    top: 4px;
}

.btn-social:hover {
    transform: scale(1.02);
}

.btn-twitch {
    background-color: #8E24AA !important;
    color: #fff !important;
}

.btn-discord {
    background-color: #5865F2 !important;
    color: #fff !important;
}

.btn-steam {
    background-color: #1b2838 !important;
    color: #fff !important;
}

/* Profile */
.gg-profile {
    margin-bottom: -50px;
}

.gg-profile span {
    display: block;
    font-weight: 300;
}

.gg-profile .alt {
    position: relative;
    top: -80px;
    background-color: #161520;
    border-radius: 30px;
    padding: 0 30px 30px 30px;
}

.gg-profile .cover {
    position: relative;
    z-index: 2;
}

.gg-profile .cover img {
    border-radius: 30px;
    max-height: 270px;
    min-height: 170px;
    width: 100%;
    object-fit: cover;
}

.gg-profile .cover::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 30px;
    border: 3px solid #FF4AE7;
    background-color: rgba(7, 3, 3, 1);
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.7;
}

.gg-profile .user-info {
    text-align: center;
}

.gg-profile .user-info .img-profile {
    width: 160px;
    height: 160px;
    object-fit: cover;
    border-radius: 100%;
    border: 3px solid #FF4AE7;
    position: relative;
    z-index: 3;
    margin-bottom: 10px;
}

.gg-profile .user-info .name {
    font-size: 30px;
    color: #FF4AE7;
}

.gg-profile .user-info .text {
    font-size: 18px;
    margin-bottom: -6px;
}

.gg-profile .list {
    display: flex;
    align-items: center;
}

.gg-profile .list .li {
    text-align: center;
    margin-right: 20px;
    padding-right: 20px;
    border-right: 1px solid #272636;
    font-size: 17px;
}

.gg-profile .list .li .value {
    color: #FF31C1;
}

.gg-profile .list .li:last-child {
    border-right: 0;
    margin-right: 0;
    padding-right: 0;
}

.gg-profile .btn-edit {
    box-shadow: none !important;
    font-size: 18px;
    font-weight: 300;
    padding-left: 40px !important;
    padding-right: 40px !important;
    position: absolute;
    top: 52px;
    right: 40px;
    z-index: 3;
}

.gg-profile .btn-edit img {
    width: 23px;
    height: 23px;
    margin-right: 15px;
    position: relative;
    top: -1px;
}

.gg-profile-box {
    background-color: #161520;
    border-radius: 30px;
    padding: 30px;
}

.gg-profile-nav {
    background-color: #272636;
    color: #97979E;
}

.gg-profile-nav li a.active-link::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    background: linear-gradient(to bottom, var(--gradient-color1), var(--gradient-color2));
    width: 6px;
}

.gg-profile-nav li a {
    color: #97979E;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    display: block;
    width: 100%;
    padding: 10px 18px;
    position: relative;
    transition: 0.2s;
}

.gg-profile-nav li a.active-link {
    color: #fff;
}

.gg-profile-nav li a:hover {
    color: #fff;
}

.gg-profile-nav li:first-child a {
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.gg-profile-nav li a .material-icons {
    position: absolute;
    right: 10px;
}

.gg-profile-nav .link-body {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    padding: 4px 0;
}

.gg-profile-nav .link-body li a {
    border-top: 0;
    border-bottom: 0;
    padding: 6px 16px;
}

.gg-profile-title {
    background: var(--gradient1);
    padding: 12px 18px;
    border-radius: 8px;
    margin-bottom: 10px;
}

.gg-profile-title .title {
    font-size: 18px;
    margin-bottom: 0;
}

.gg-profile-title .nav {
    justify-content: space-between;
}

.gg-profile-title .nav .nav-link {
    background-color: transparent !important;
    color: #fff !important;
    border-radius: 0 !important;
    font-size: 20px;
    padding: 6px 14px !important;
    font-weight: 300;
}

.gg-profile-title .nav .nav-link.active {
    border-bottom: 3px solid #fff;
}

.table-profile tr:first-child td {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.table-profile td {
    border-bottom-color: rgba(255, 255, 255, 0.2) !important;
    font-weight: 300;
    font-size: 17px;
    padding: 9px 18px !important;
}

.table-profile td:first-child {
    color: #FF31C1;
}

.table-profile td:last-child {
    text-align: right;
    color: rgba(255, 255, 255, 0.7);
}

.table-gradient.table {
    background: #272636 !important;
    border-radius: 8px;
}

.table-gradient thead th {
    background-color: transparent !important;
    border-bottom: 0 !important;
}

.table-gradient tbody {
    border-top: 0 !important;
}

.table-gradient thead {
    background: var(--gradient1);
}

.table-gradient thead th:first-child {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.table-gradient thead th:last-child {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.table th,
.table td {
    font-weight: 300;
}

.table th {
    font-size: 14px;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
}

.table-gradient tbody tr:last-child td {
    border-bottom: 0;
}

.table-gradient tbody tr:last-child td:first-child {
    border-bottom-left-radius: 8px;
}

.table-gradient tbody tr:last-child td:last-child {
    border-bottom-right-radius: 8px;
}

.table-gradient td {
    padding-left: 18px !important;
    padding-right: 18px !important;
}

.gg-pay-box {
    background-color: #272636;
    border-radius: 12px;
    padding: 20px;
}

.gg-pay-box .img-pay {
    margin-bottom: 10px;
}

.gg-pay-box .komisyon {
    font-size: 18px;
    display: block;
}

.gg-pay-box .form-control {
    background-color: #161520 !important;
    padding: 10px 14px !important;
}

.gg-pay-box .amount {
    background-color: #B82A2A;
    border-radius: 5px;
    font-size: 15px;
    padding: 7px;
    margin-bottom: 10px;
    margin-top: 5px;
    font-weight: 300;
}

/* Cart */
.gg-cart-steps {
    margin: 20px 0 30px 0;
}

.gg-cart-steps .step {
    position: relative;
    text-align: center;
}

.gg-cart-steps .step .bar {
    height: 2px;
    width: 100%;
    background-color: #161520;
    position: absolute;
    top: 30px;
}

.gg-cart-steps .step .circle {
    background-color: #161520;
    height: 65px;
    width: 65px;
    border-radius: 100%;
    text-align: center;
    line-height: 65px;
    font-size: 24px;
    margin: auto;
    margin-bottom: 10px;
    outline: 5px solid #272636;
    position: relative;
    z-index: 2;
    user-select: none;
    font-weight: 300;
}

.gg-cart-steps .step .text {
    font-size: 24px;
    color: #43415A;
    display: block;
}

.gg-cart-steps .step.active .bar,
.gg-cart-steps .step.active .circle {
    background-color: #DE5853;
}

.gg-cart-steps .step.active .text {
    color: #DE5853;
    text-shadow: 0 0 15px rgba(222, 88, 83, 0.47);
}

.gg-cart-list {
    background-color: #161520;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.36);
    padding: 40px 20px;
}

.gg-cart-list .head {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #707070;
    padding-bottom: 10px;
    padding-right: 20px;
}

.gg-cart-list .head .td {
    font-size: 15px;
    text-align: center;
}

.gg-cart-list .head .td:first-child {
    width: 10%
}

.gg-cart-list .head .td:nth-child(2) {
    width: 40%
}

.gg-cart-list .head .td:nth-child(3) {
    width: 25%
}

.gg-cart-list .head .td:nth-child(4) {
    width: 25%
}

.gg-cart-item {
    display: flex;
    align-items: center;
    padding: 10px 20px 10px 0;
    border-bottom: 1px solid #707070;
}

.gg-cart-item .td:first-child {
    width: 10%
}

.gg-cart-item .td:nth-child(2) {
    width: 40%
}

.gg-cart-item .td:nth-child(3) {
    width: 25%
}

.gg-cart-item .td:nth-child(4) {
    width: 25%
}

.gg-cart-item .delete {
    color: rgba(255, 255, 255, 0.52);
    transition: 0.2s;
}

.gg-cart-item .delete:hover {
    color: #f7353585;
}

.gg-cart-item .img-product {
    max-width: 100px;
    margin-right: 20px;
}

.gg-cart-item .info .productname {
    margin-bottom: 0;
}

.gg-cart-item .info .category {
    color: rgba(255, 255, 255, 0.2);
    font-size: 12px;
    display: block;
}

.gg-cart-item .prices span {
    display: block;
}

.gg-cart-item .oldprice {
    font-size: 11px;
    color: #C93E3E;
    text-decoration: line-through;
    font-weight: 700;
    font-style: italic;
}

.gg-cart-item .price {
    font-size: 18px;
}

.gg-cart-item .number-input .quantity {
    background-color: #fff;
    border: 0 !important;
    color: #000;
    font-weight: 500;
    border-radius: 50px;
}

.gg-cart-item .number-input button {
    background-color: #35B24E;
    border-radius: 100%;
    height: 20px;
    width: 20px;
    position: relative;
    top: 5px;
    margin: 0 5px;
}

.gg-cart-total {
    background-color: #161520;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    padding: 20px;
}

.gg-cart-total .title {
    font-size: 22px;
    border-bottom: 1px solid #707070;
    padding-bottom: 10px;
    margin-bottom: 15px;
    padding-left: 8px;
}

.gg-cart-total .table td {
    color: #fff;
    border: 0 !important;
    font-size: 14px;
    font-weight: 400;
}

.gg-cart-total .table td:last-child {
    text-align: right;
}

.gg-cart-total .table tbody tr:last-child td {
    padding-bottom: 20px;
}

.gg-cart-total .table tfoot tr:first-child td {
    padding-top: 20px;
}

.gg-cart-total .table tfoot {
    border-top: 1px solid #707070;
}

.gg-cart-total .btn {
    text-shadow: 0 0 15px #000000;
}

.gg-cart-total .btn i {
    font-size: 22px;
    position: absolute;
}

.text-green {
    color: #36FF5E !important;
}

/* Accordion FAQ */
.accordion-faq .accordion-item {
    background-color: #272636;
    margin: 10px 0;
    border-radius: 20px !important;
}

.accordion-faq .accordion-button {
    background: var(--gradient1);
    color: #fff !important;
    border-radius: 20px !important;
}

.accordion-faq .accordion-button:focus {
    box-shadow: none !important;
}

.accordion-faq .accordion-button::after {
    filter: invert(1) sepia(1) saturate(200) hue-rotate(267deg) !important;
}

.accordion-faq .accordion-body {
    font-size: 16px;
    font-weight: 300;
    color: #8B87AF;
}

/* Forgot PW */
.gg-forgot-pw {
    padding: 30px 40px;
    background-color: #161520;
    border-radius: 25px;
}

.gg-forgot-pw .btn-gradient {
    font-size: 22px;
    padding: 16px 20px !important;
    font-weight: 300;
}

.gg-forgot-pw .form-control {
    height: 65px;
    border-radius: 15px;
}

.btn-gradient {
    background: var(--gradient1);
    color: #fff !important;
    padding: 12px 20px !important;
    border: 0 !important;
    box-shadow: 0 0 15px rgba(171, 101, 255, 0.65);
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

/* Product */
.gg-product {
    background-color: #161520;
    text-align: center;
    border-radius: 29px;
    margin: 30px 0;
    position: relative;
}

.gg-product .img-product {
    height: 126px;
    width: 95%;
    border-radius: 23px;
    position: relative;
    top: -20px;
    object-fit: cover;
}

.gg-product .product-content {
    padding-bottom: 15px;
    border-bottom: 1px solid #707070;
}

.gg-product .product-content .name {
    font-size: 14px;
    margin-bottom: 3px;
}

.gg-product .product-content .subtitle {
    font-size: 14px;
    color: #676677;
    margin-bottom: 3px;
}

.gg-product .product-content .price {
    background-color: #272636;
    font-size: 15px;
    font-weight: 300;
    display: inline-block;
    padding: 4px 14px;
    border-radius: 7px;
}

.gg-product .buttons {
    padding: 20px;
}

.btn-border {
    height: 48px;
    border-radius: 60px !important;
    color: #fff !important;
    position: relative;
    padding: 3px !important;
    background-color: #272636 !important;
    box-shadow: none !important;
}

.btn-border .material-icons {
    height: 40px;
    min-width: 40px;
    max-width: 40px;
    border-radius: 100%;
    line-height: 40px;
    font-size: 25px;
}

.btn-border .content {
    display: flex;
    align-items: center;
}

.btn-border .title {
    margin: 0 10px;
    font-size: 13px;
    color: #fff !important;
    text-shadow: none !important;
}

.btn-border.green .material-icons {
    box-shadow: 0 3px 6px rgba(48, 254, 158, 0.34);
}

.btn-border.green:hover {
    background-color: #31FF9F !important;
}

.btn-border.purple .material-icons {
    box-shadow: 0 3px 6px rgba(102, 48, 254, 0.34);
}

.btn-border.purple:hover {
    background-color: #622EF4 !important;
}

/* Products Table */
.gg-products-table {
    margin-bottom: 20px;
}

.gg-products-table .tr.head {
    display: flex;
    align-items: center;
    background: linear-gradient(16deg, #0c181d, #27353b 100%) !important;
    border: 1px solid #19313a;
    margin-bottom: 20px;
}

.gg-products-table .tr .td {
    text-align: center;
    padding: 12px 2px
}

.gg-products-table .tr .td:first-child {
    width: 35%;
    padding: 0
}

.gg-products-table .tr .td:nth-child(2) {
    width: 12%
}

.gg-products-table .tr .td:nth-child(3) {
    width: 8%
}

.gg-products-table .tr .td:nth-child(4) {
    width: 10%
}

.gg-products-table .tr .td:nth-child(5) {
    width: 10%
}

.gg-products-table .tr .td:nth-child(6) {
    width: 10%
}

.gg-products-table .tr .td:nth-child(7) {
    width: 15%
}

.gg-product-table {
    display: flex;
    align-items: center;
    background: linear-gradient(16deg, #0c181d, #27353b 100%) !important;
    border: 1px solid #19313a;
    margin-bottom: 15px;
}

.gg-product-table .td {
    text-align: center;
    padding: 12px 2px
}

.gg-product-table .td:first-child {
    width: 35%;
    padding: 0
}

.gg-product-table .td:nth-child(2) {
    width: 12%
}

.gg-product-table .td:nth-child(3) {
    width: 8%
}

.gg-product-table .td:nth-child(4) {
    width: 10%
}

.gg-product-table .td:nth-child(5) {
    width: 10%
}

.gg-product-table .td:nth-child(6) {
    width: 10%
}

.gg-product-table .td:nth-child(7) {
    width: 15%
}

.gg-product-table .img {
    max-width: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gg-product-table .productname {
    font-size: 24px;
    margin-bottom: 0;
}

.gg-product-table .info {
    text-align: left;
    padding-left: 15px;
}

.gg-product-table .info small {
    font-size: 12px;
}

.gg-product-table .badge-discount {
    background-color: #161520;
    border-radius: 11px;
    padding: 8px 12px;
}

.gg-product-table .stock {
    display: block;
    height: 40px;
    width: 40px;
    border-radius: 100%;
    background-color: #3F8D24;
    color: #fff;
    text-align: center;
    margin: auto;
}

.gg-product-table .stock i {
    position: relative;
    top: 8px;
}

.gg-product-table .bonus {
    color: #3F8D24;
}

.gg-product-table .price span {
    font-size: 14px;
    color: white;
    text-decoration: line-through;
}

.gg-product-table .td:last-child {
    padding: 0 20px;
}

.gg-product-table .td:last-child .btn {
    border-radius: 13px;
    font-size: 15px;
    margin: 3px 0;
    text-transform: uppercase;
}

.btn-red {
    background-color: #AA1E1E !important;
    color: #fff !important;
}

.btn-green {
    background-color: #1F9F1A !important;
    color: #fff !important;
}

input[type="number"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

.number-input {
    display: inline-flex;
}

.number-input,
.number-input * {
    box-sizing: border-box;
}

.number-input button {
    outline: none;
    -webkit-appearance: none;
    background-color: transparent;
    border: none;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    cursor: pointer;
    margin: 0;
    position: relative;
}

.number-input button:before,
.number-input button:after {
    display: inline-block;
    position: absolute;
    content: '';
    width: 1rem;
    height: 2px;
    background-color: #fff;
    transform: translate(-50%, -50%);
}

.number-input button.plus:after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.number-input input[type=number] {
    max-width: 3rem;
    padding: 0;
    border: solid #0C0808;
    color: #fff;
    border-width: 0 1px;
    font-size: 1rem;
    height: 2rem;
    font-weight: bold;
    text-align: center;
    background-color: rgba(170, 170, 172, 0.48);
}

.gg-products-comment .head-area .title {
    font-size: 32px;
    color: #696787;
}

.gg-products-comment {
    background-color: #161520;
    padding: 40px;
    border-radius: 26px;
    margin-bottom: 20px;
}

.gg-products-comment .comment {
    background-color: #262535;
    padding: 20px;
    border-radius: 30px;
    border: 1px solid #353347;
    margin: 15px 0;
}

.gg-products-comment .comment .stars i {
    font-size: 16px;
    color: #FF9B44;
    margin-left: -2px;
}

.pagination .page-link {
    height: 38px;
}

.gg-products-system {
    padding: 40px;
    background-color: #161520;
    border-radius: 26px;
    color: #696787;
}

.gg-products-system .title {
    font-size: 32px;
    margin-bottom: 30px;
}

.gg-products-system p {
    font-size: 18px;
    margin-bottom: 7px;
}

/* Category Images */
.gg-category-images {
    margin-bottom: 20px;
}

.gg-category-images img {
    max-height: 400px;
    display: block;
    margin: auto;
}

.gg-category-info {
    background-color: #161520;
    border-radius: 38px;
    min-height: 300px;
    max-height: 400px;
    display: flex;
    flex-direction: column;
    padding-bottom: 10px;
}

.gg-category-info img {
    width: 100%;
    object-fit: cover;
    border-radius: 38px;
    max-height: 200px;
}

.gg-category-info .content {
    padding: 20px;
    height: 95%;
    overflow-y: auto;
}

.gg-category-info .title {
    font-size: 26px;
    font-weight: 300 !important;
}

.gg-category-info p {
    color: #69687B;
    font-size: 13px;
    margin-bottom: 0;
}

/* Category */
.gg-category-letter .link {
    display: inline-block;
    background-color: #0e1d23;
    color: #fff;
    border-radius: 8px;
    min-width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    margin-right: 5px;
    margin-bottom: 5px;
    transition: 0.2s;
    border: 1px solid #19313a;
}

.gg-category-letter .link.gradient {
    background: #ff5a01;
    color: #fff;
}

.gg-category-letter .link:hover {
    transform: scale(1.08);
}

.gg-category-box {
    border-radius: 12px;
    background-color: #0e1d23;
    margin: 15px 0;
    transition: 0.2s;
}

.gg-category-box:hover {
    transform: scale(1.05);
}

.gg-category-box img {
    height: 220px;
    width: 100%;
    border-radius: 12px;
    object-fit: cover;
    background: linear-gradient(354deg, #19313a 93%, #ff5b00 100%);
    padding: 1px;
}

.gg-category-box .content {
    padding: 14px 10px;
    text-align: center;
}

.gg-category-box .title {
    font-weight: 300 !important;
    font-size: 20px;
}

/* İndirim */
.gg-indirim .box {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 36px;
    box-shadow: 0 0 15px #125ece;
}

.gg-indirim .box .content {
    padding: 80px 0;
}

.gg-indirim .box .content .title {
    font-size: 40px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

/* Yayıncı */
.gg-yayinci-banner .box {
    border-radius: 36px;
    box-shadow: 0 0 15px #514326;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 36px;
}

.gg-yayinci-banner .box .content {
    padding: 40px 0;
}

.gg-yayinci-banner .box .content .title {
    font-size: 40px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

/* Streamer */
.gg-streamer {
    text-align: center;
    position: relative;
    padding-top: 20px;
    background-color: #0e1d23 !important;
    border: 1px solid #19313a;
    box-shadow: none;
}

.gg-streamer img {
    height: 200px !important;
    width: 200px !important;
    border: 2px solid #fff;
    border-radius: 100%;
    display: block;
    margin: auto;
}

.gg-streamer .name {
    font-size: 18px;
    margin-top: 20px;
}

.gg-streamer .badge-live {
    background-color: #FF2C2C;
    border-radius: 9px;
    padding: 3px 10px;
    position: absolute;
    top: 10px;
    right: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.gg-streamer.live img {
    outline: 2px solid #FF4141;
    box-shadow: 0 0 15px rgba(255, 72, 72, 0.71);
}

/* Head Gradient */
.gg-head-gradient {
    background-image: url("../img/header-gradient.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 26px;
    padding: 20px 30px;
    margin-bottom: 20px;
}

.gg-head-gradient .title {
    font-size: 24px;
    font-weight: 300 !important;
    margin-bottom: 0;
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

/* Filter Empty */
.gg-filter-empty {
    background-color: #fff;
    color: #363636;
    border-radius: 11px;
    padding: 20px 30px;
    margin-bottom: 20px;
}

.gg-filter-empty .left {
    display: flex;
    align-items: center;
    margin-right: 15px;
    border-right: 1px solid #505050;
    padding-right: 15px;
}

.gg-filter-empty .text1,
.gg-filter-empty .material-icons {
    color: #6094FF;
}

.gg-filter-empty .text {
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

/* Shop Filter */
.gg-shop-filter {
    padding: 20px 25px;
    border-radius: 16px;
    color: #212121;
    position: relative;
    margin-bottom: 20px;
}

.gg-shop-filter .head-title {
    font-size: 14px;
    font-weight: 300 !important;
    border-bottom: 1px solid #333;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

.gg-shop-filter .range {
    position: relative;
    top: -20px;
}

.gg-shop-filter .filter {
    margin-bottom: 10px;
}

.gg-shop-filter .btn-filter {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 12px;
    padding: 6px 20px !important;
    z-index: 2;
}

.btn-filter {
    background: linear-gradient(to right, #5B97FF, #DB46FF);
    border: 0 !important;
    color: #fff !important;
}

/* Title Gradient */
.gg-title-gradient {
    background-color: #161520;
    position: relative;
    padding-left: 12px;
    margin-bottom: 15px;
}

.gg-title-gradient::before {
    content: "";
    display: block;
    height: 100%;
    width: 12px;
    background: linear-gradient(to bottom, var(--gradient-color1), var(--gradient-color2));
    position: absolute;
    left: 0;
    top: 0;
}

.gg-title-gradient .nav .nav-link {
    font-size: 22px;
    background-color: transparent !important;
    font-weight: 300;
    padding: 25px 20px;
    color: #fff;
}

.gg-title-gradient .nav .nav-link.active {
    color: #DB46FF;
}

.bg-darken {
    background-color: #161520;
}

/* Pazaryeri İlan */
.gg-pazaryeri-ilan {
    background-color: #161520;
    border: 1px solid #707070;
    border-radius: 32px;
    padding: 10px;
    margin-bottom: 30px;
}

.gg-pazaryeri-ilan .productimg {
    border-radius: 20px;
}

.gg-pazaryeri-ilan .content {
    margin-top: 20px;
}

.gg-pazaryeri-ilan .content .productname {
    font-size: 36px;
    margin-bottom: 20px;
}

.gg-pazaryeri-ilan .content p {
    font-size: 15px;
}

.gg-pazaryeri-ilan .actions .btn-success {
    box-shadow: 0 0 6px rgba(77, 194, 124, 0.5);
    margin-bottom: 10px;
}

.gg-pazaryeri-ilan .actions .table td {
    font-size: 13px;
    padding: 5px 0;
    background-color: transparent !important;
}

.gg-pazaryeri-ilan .actions .seller-info .profile {
    height: 50px;
    width: 50px;
    min-width: 50px;
    max-width: 50px;
    object-fit: cover;
    border-radius: 100%;
    border: 1px solid #FF31C1;
    box-shadow: 0 3px 6px rgba(255, 49, 193, 0.3);
    margin-right: 15px;
}

.gg-pazaryeri-ilan .actions .seller-info .name {
    font-size: 14px
}

.gg-pazaryeri-ilan .actions .seller-info .satis {
    font-size: 14px;
    text-align: center;
}

.gg-pazaryeri-ilan .actions .seller-info .satis i {
    font-size: 16px;
    margin-right: 5px;
    position: relative;
    top: 3px;
}

.border-start {
    border-left: 1px solid #707070 !important;
}

.gg-pi-box {
    background-color: #161520;
    padding: 15px;
    border-radius: 7px;
    margin-bottom: 20px;
}

.kural {
    margin: 7px 0;
}

.kural .left {
    background-color: #FAB670;
    border-radius: 5px;
    width: 40px;
    height: 40px;
    min-width: 40px;
    text-align: center;
    line-height: 40px;
    font-size: 24px;
    margin-right: 10px;
}

/* İlan Ver */
.gg-ilanver {
    padding: 20px;
    border-radius: 16px;
    margin-bottom: 20px;
}

.gg-ilanver .head {
    font-size: 20px;
    background: linear-gradient(to left, #DB46FF, #5B97FF);
    border-radius: 14px;
    text-align: center;
    padding: 10px;
    margin-bottom: 20px;
}

.gg-ilanver .head .title {
    font-size: 22px;
    font-weight: 300 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gg-ilanver .list-group-item {
    position: relative;
    font-size: 15px;
}

.gg-ilanver .list-group-item i {
    position: absolute;
    right: 10px;
    top: 7px;
}

.gg-ilanver .form-control {
    font-size: 15px;
    padding-right: 30px !important;
}

/* Ürün Detay */
.gg-product-detay {
    background-color: #161520;
    border: 1px solid #0F0E20;
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 10px;
}

.price-box {
    background-color: #272636;
    border: 1px solid #0F0E20;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
    font-size: 26px;
}

.gg-product-detay .productimg {
    border-radius: 9px;
}

.gg-product-detay .productname {
    font-size: 23px;
}

.gg-product-detay .table {
    margin-bottom: 10px;
}

.gg-product-detay .table td {
    font-size: 14px;
}

.gg-product-detay .table tr:first-child td {
    border-top: 1px solid #373b3e;
}

.gg-product-detay .table td:last-child {
    text-align: right;
}

.gg-product-detay .btn .material-icons {
    position: relative;
    top: 3px;
}

.gg-product-detay .btn span {
    position: relative;
    top: -3px;
}

.gg-benzer-urunler {
    background-color: #161520;
    border-radius: 10px;
    padding: 25px 0 30px 0;
}

.gg-benzer-urunler .title {
    font-size: 20px;
    padding-left: 20px;
}

.gg-benzer-urunler .urun:first-child {
    border-top: 1px solid #606060;
}

.gg-benzer-urunler .urun {
    padding: 10px 20px;
    border-bottom: 1px solid #606060;
}

.gg-benzer-urunler .urun img {
    height: 72px;
    width: 72px;
    border-radius: 11px;
    object-fit: cover;
    margin-right: 10px;
}

.gg-benzer-urunler .urun .left {
    display: flex;
    align-items: center;
}

.gg-benzer-urunler .urun .right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.gg-benzer-urunler .urun .stars i {
    font-size: 14px;
}

.gg-benzer-urunler .urun .productname {
    font-size: 16px;
    margin-bottom: 0;
}

.gg-benzer-urunler .urun .author {
    font-size: 12px;
}

.gg-benzer-urunler .urun .price {
    font-size: 15px;
}

.gg-benzer-urunler .urun .stars {
    margin: 0 10px;
}

.gg-benzer-urunler .urun .stars i {
    margin: 0 -2px;
}

.gg-benzer-urunler .urun .check {
    background-color: #239761;
    color: #fff;
    height: 25px;
    width: 25px;
    display: block;
    border-radius: 100%;
    line-height: 35px;
    text-align: center;
}

.gg-benzer-urunler .urun .check i {
    font-size: 18px;
}

.gg-product-tabs .nav {
    background-color: #161520;
    border-radius: 25px;
    padding: 20px;
    margin-bottom: 20px;
}

.gg-product-tabs .nav .nav-link {
    color: #fff !important;
    font-size: 24px;
}

.gg-product-tabs .nav .nav-link.active {
    color: #FFC85B !important;
    background-color: transparent !important;
}

.gg-product-tabs .box {
    background-color: #161520;
    border-radius: 30px;
    padding: 20px 30px;
}

.gg-product-comments .charts .list {
    margin: 10px 0;
}

.gg-product-comments .charts .list .titlechart {
    font-size: 18px;
    display: block;
    margin-right: 20px;
    width: 10%;
}

.gg-product-comments .charts .list .stars i {
    font-size: 18px;
    margin: 0 -2px;
}

.gg-product-comments .charts .list .progress {
    width: 30%;
    margin-left: 40px;
}

.write-comment.flex-start {
    align-items: flex-start !important;
}

.write-comment .profile {
    min-width: 120px;
    max-width: 120px;
    height: 120px;
    border-radius: 100%;
    border: 1px solid #FF31C1 !important;
    box-shadow: 0 3px 6px rgba(255, 49, 193, 0.32);
    margin-right: 20px;
}

.write-comment form {
    width: 70%;
    position: relative;
}

.write-comment .form-control {
    border: 1px solid #FF31C1 !important;
    box-shadow: 0 0 6px rgba(255, 49, 193, 0.32);
}

.write-comment form .btn-pink {
    position: absolute;
    bottom: 10px;
    right: 10px;
    padding-left: 30px;
    padding-right: 30px;
}

.btn-pink {
    background-color: #FF31C1 !important;
    color: #fff !important;
}

.progress {
    background-color: #999999 !important;
}

i.star {
    color: #FFA467;
}

.number-input-new {
    position: relative;
}

.number-input-new .quantity {
    height: 45px !important;
    width: 100% !important;
    max-width: 100% !important;
    border: 0 !important;
    border-radius: 4px;
    background-color: #A8A8A8 !important;
    font-weight: 300 !important;
    font-size: 26px !important;
    padding-right: 30px !important;
}

.number-input-new button {
    display: block;
    z-index: 99;
    height: 22px;
}

.number-input-new .step {
    position: absolute;
    bottom: -2px;
    right: 0;
}

.number-input-new .plus {
    position: absolute;
    top: 2px;
    right: 0;
}

.number-input-new .right {
    background-color: #646464;
    width: 30px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

/* Contact Page */
.gg-contact-page {
    background-color: #0c181d;
    border-radius: 32px;
    padding: 30px;
}

.gg-info-box {
    padding: 10px 0;
    margin: 4px 0;
}

.gg-info-box::before {
    content: "";
    display: block;
    background-image: url("../img/contact-divider.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 4px;
    width: 100%;
    margin-bottom: 5px;
}

.gg-info-box::after {
    content: "";
    display: block;
    background-image: url("../img/contact-divider.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 4px;
    width: 100%;
    margin-top: 5px;
}

.gg-info-box h2,
.gg-info-box span {
    font-size: 17px;
    margin-bottom: 0;
    font-weight: 300;
}

.gg-contact-page .page-title {
    font-size: 26px;
    margin-bottom: 15px;
}

.gg-contact-page .form .icon {
    position: relative;
}

.gg-contact-page .form .icon i {
    position: absolute;
    top: 7px;
    right: 10px;
    color: #DE51F2;
}

.gg-contact-page .form .btn-gradient {
    font-size: 22px;
    font-weight: 300;
}

/* Blogs */
.gg-blog-box {
    background-color: #161520;
    border-radius: 34px;
    margin-bottom: 30px;
    transition: 0.3s;
}

a .gg-blog-box:hover {
    transform: scale(1.03);
}

.gg-blog-box .img {
    position: relative;
}

.gg-blog-box .img img {
    border-radius: 34px;
    width: 100%;
    object-fit: cover;
    max-height: 480px;
}

.gg-blog-box .img.dark::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000);
    opacity: 0.48;
    border-radius: 34px;
}

.gg-blog-box .content {
    padding: 20px 30px;
}

.gg-blog-box .tags {
    margin-bottom: 10px;
}

.gg-blog-box .tags span {
    font-size: 26px;
    display: block;
    color: rgba(255, 255, 255, 0.6);
}

.gg-blog-box .blogtitle {
    text-shadow: 0 3px 6px rgba(99, 161, 255, 0.75);
    color: #fff;
}

.gg-blog-box .blog-info-title {
    text-align: center;
    margin-bottom: 0;
}

.gg-blogs-sidebar {
    border-radius: 34px;
    background-color: #161520;
    padding: 40px 0;
    margin-bottom: 20px;
}

.gg-blogs-sidebar ul li:first-child a {
    border: 1px solid rgba(255, 255, 255, 0.02);
}

.gg-blogs-sidebar ul li a {
    font-size: 23px;
    font-weight: 300;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.02);
    display: block;
    padding: 8px 20px;
    transition: 0.3s;
}

.gg-blogs-sidebar ul li a:hover {
    background-color: #f659012b
}

.gg-blogs-info {
    border-radius: 34px;
    background-color: #161520;
    padding: 30px;
    margin-bottom: 20px;
}

.gg-blogs-info .title {
    font-size: 23px;
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 4px solid #272636;
}

.gg-blog-box-mini {
    margin: 20px 0;
}

.gg-blog-box-mini:hover .blogtitle {
    transform: scale(1.02);
}

.gg-blog-box-mini .img {
    max-width: 120px;
    margin-right: 20px;
}

.gg-blog-box-mini .img img {
    border: 1px solid #fff;
}

.gg-blog-box-mini .blogtitle {
    font-weight: 300 !important;
    font-size: 17px;
    color: #DB46FF;
    margin-bottom: 4px;
    transition: 0.3s;
}

.gg-blog-box-mini .text {
    font-size: 14px;
    margin-bottom: 0;
    color: #fff;
}

.blog-tag {
    background: var(--gradient1);
    display: inline-block;
    padding: 6px 14px;
    border-radius: 10px;
    color: #fff;
    margin-right: 4px;
    margin-bottom: 4px;
}

.blog-tag:hover {
    color: #fff;
}

/* Page */
.gg-page {
    margin: 30px 0;
}

/* Popular */
.gg-popular-box {
    margin: 15px 0;
    border: 2px solid var(--red);
    box-shadow: 0 0 15px var(--red);
    transition: 0.2s;
}

.gg-popular-box:hover {
    transform: scale(1.015);
}

.gg-popular-box.large {
    height: 415px;
}

.gg-popular-box.mini {
    height: 200px;
}

.gg-popular-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Blog */
.gg-blog-mini {
    border: 1px solid #fff;
    height: 200px;
    margin: 10px 0;
}

.gg-blog-mini img {
    height: 100%;
    width: 100%;
    display: block;
    object-fit: cover;
    transition: 0.2s;
}

.gg-blog-mini:hover img {
    transform: scale(1.03);
}

/* Footer */
.gg-footer {
    background-color: #161520;
    margin-top: 100px;
}

.gg-features {
    border: 15px solid #161520;
    border-top-left-radius: 67px;
    border-top-right-radius: 67px;
    background-color: #272636;
    padding: 20px;
    position: relative;
    top: -50px;
}

.gg-features .box {
    display: flex;
    align-items: center;
    margin: 5px 0;
}

.gg-features .box .icon {
    height: 100px;
    width: 100px;
    min-width: 100px;
    background-color: var(--red);
    border-radius: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}

.gg-features .box .title {
    font-size: 20px;
    color: var(--red);
}

.gg-features .box .text {
    font-size: 12px;
    margin-bottom: 0;
}

.gg-footer .contact-box {
    display: flex;
    margin: 10px 0;
    align-items: center;
    font-weight: 300;
}

.gg-footer .contact-box i {
    background-color: var(--red);
    border-radius: 8px;
    height: 35px;
    width: 35px;
    line-height: 35px;
    text-align: center;
    margin-right: 10px;
}

.gg-footer .contact-box span {
    text-shadow: 0 3px 6px var(--red);
    color: var(--red);
}

.gg-footer .footer-title {
    text-shadow: 0 3px 6px var(--red);
    color: var(--red);
    font-weight: 300 !important;
    font-size: 18px;
}

.gg-footer .footer-title::after {
    content: "";
    display: block;
    background-image: url("../img/footer-divider.png");
    height: 2px;
    width: auto;
    background-repeat: no-repeat;
    margin: 6px 0;
}

.gg-footer ul li a {
    color: #fff;
    display: inline-block;
    margin: 2px 0;
    transition: 0.2s;
}

.gg-footer ul li a:hover {
    color: var(--red);
}

.gg-copyright img {
    height: 2px;
}

/* Section */
.gg-section {
    margin-bottom: 30px;
}

.gg-section-head {
    margin-bottom: 20px;
}

.gg-section-head .title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 20px;
    font-size: 29px;
}

.gg-section-head .title-red span {
    color: var(--red);
    text-shadow: 0 0 15px rgba(255, 42, 64, 0.48);
}

.gg-section-head .title span {
    white-space: pre;
}

.gg-section-head .title::before {
    content: "";
    display: inline-block;
    background-image: url("../img/divider-left.png");
    height: 3px;
    width: 100%;
    background-repeat: no-repeat;
    margin-right: 20px;
    background-position: left;
}

.gg-section-head .title::after {
    content: "";
    display: inline-block;
    background-image: url("../img/divider-right.png");
    height: 3px;
    width: 100%;
    background-repeat: no-repeat;
    margin-left: 20px;
    background-position: right;
}

/* General */
.modal-content {
    background-color: #272636 !important;
}

.modal-header {
    border-bottom: 1px solid #34324c !important;
}

.modal-footer {
    border-top: 1px solid #34324c !important;
}

.btn-close {
    filter: invert(1) sepia(1) saturate(5) hue-rotate(175deg);
}

.modal-header .modal-title {
    font-weight: 600 !important;
    text-transform: uppercase;
}

.btn-block {
    width: 100%;
    display: block;
}

.btn:focus,
.form-control:focus {
    box-shadow: none !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700 !important;
}

.btn-success {
    background-color: #36C169 !important;
    border-color: #36C169 !important;
}

.btn-success:hover {
    background-color: #2fa95b !important;
    border-color: #2fa95b !important;
}

.btn-orange {
    background-color: #FF9B36 !important;
    border-color: #FF9B36 !important;
    color: #fff !important;
}

.btn-orange:hover {
    background-color: #d57e27 !important;
    border-color: #d57e27 !important;
}

.btn-danger {
    background-color: #C74646 !important;
    border-color: #C74646 !important;
}

.btn-danger:hover {
    background-color: #ba3a3a !important;
    border-color: #ba3a3a !important;
}

.flex-start {
    display: flex;
    align-items: center;
}

.flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

a {
    text-decoration: none !important;
}

.table-dark td {
    background-color: #272636 !important;
}

.form-control {
    border: 1px solid #20202c !important;
    background-color: #20202c !important;
    color: #fff !important;
}

.form-control.gray {
    border: 1px solid #353447 !important;
    background-color: #272636 !important;
}

.form-control::placeholder {
    color: #ccc !important;
}

.form-control-white {
    background-color: #fff !important;
    border: 1px solid #fff !important;
    color: #363636 !important;
}

.form-control-white::placeholder {
    color: #363636 !important;
}

.box-shadow {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.text-shadow {
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.irs--big .irs-line {
    height: 3px !important;
    border: 0 !important;
    background: #DBE8FA !important;
    box-shadow: 0 !important;
}

.irs--big .irs-bar {
    height: 3px !important;
    border: 0 !important;
    background: #333 !important;
    box-shadow: 0 !important;
}

.irs--big .irs-handle {
    border: 0px !important;
    box-shadow: 0 !important;
    background: linear-gradient(to bottom right, #5F95FF, #DB46FF) !important;
    height: 18px !important;
    width: 18px !important;
    top: 26px !important;
    box-shadow: none !important;
}

.irs--big .irs-single {
    font-weight: 400 !important;
    font-family: "Poppins" !important;
}

.irs-to,
.irs-from {
    background: none !important;
    color: #1D1D1B !important;
    font-weight: 400 !important;
    font-size: 14px;
    font-family: "Poppins" !important;
    top: 50px !important;
    position: relative;
}

.irs-min,
.irs-max {
    visibility: hidden !important;
}

.col-1-5 {
    width: 20% !important;
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

#back-to-top {
    position: fixed;
    bottom: 70px;
    right: 20px;
    width: 50px;
    height: 50px;
    text-align: center;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
}

#back-to-top.show {
    opacity: 1;
    visibility: visible;
}

#back-to-top .circle {
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}

#back-to-top .circle svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    height: 50px;
    transform: rotate(-90deg);
}

#back-to-top .circle svg circle {
    fill: none;
    stroke: #FF2A40;
    stroke-width: 3;
    stroke-dasharray: 157;
    stroke-dashoffset: 157;
    transition: stroke-dashoffset 0.3s linear;
}

#back-to-top .circle i {
    font-size: 20px;
    color: #FF2A40;
    position: relative;
    z-index: 1;
}

@media (min-width: 1400px) {
    .container {
        max-width: 1434px !important
    }
}

@media (max-width: 1400px) {
    .btn-header .title {
        font-size: 13px;
    }

    .btn-border .title {
        font-size: 10px;
    }
}

@media (max-width: 1200px) {
    .gg-auth .left {
        padding: 30px !important;
        background-color: rgba(0, 0, 0, 0.3);
    }

    .gg-product-table .img {
        max-width: 140px;
    }

    .gg-features .box .icon {
        height: 75px;
        width: 75px;
        min-width: 75px;
        border-radius: 20px;
    }

    .gg-features .box .title {
        font-size: 17px;
    }

    .gg-profile .user-info .img-profile {
        width: 125px;
        height: 125px;
    }

    .gg-profile .list .li {
        font-size: 14px;
    }

    .gg-cart-steps .step .text {
        font-size: 18px;
    }
}

@media (max-width: 992px) {
    .gg-auth .left {
        padding: 20px;
        background-color: rgba(0, 0, 0, 0.5);
    }

    .gg-auth .img-logo {
        display: none;
    }

    .gg-cart-steps .step .text {
        font-size: 15px;
    }

    .gg-contact-page .info {
        margin-bottom: 20px;
    }

    .gg-profile {
        margin-bottom: 20px;
    }

    .gg-profile-box {
        padding: 20px;
    }

    .gg-profile .cover img {
        height: 120px;
        min-height: inherit;
        max-height: inherit;
    }

    .gg-profile-nav {
        margin-bottom: 20px;
    }

    .table-profile td {
        font-size: 15px;
    }

    .gg-profile .cover::after,
    .gg-profile .cover img {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .gg-profile .btn-edit {
        padding: 12px 20px !important;
        font-size: 16px;
    }

    .gg-profile .list {
        justify-content: center;
        margin: 20px 0;
    }

    .gg-profile .user-info {
        display: flex;
        align-items: center;
        text-align: left;
        margin-bottom: 10px;
    }

    .gg-profile .user-info .img-profile {
        margin-right: 15px;
        height: 75px;
        width: 75px;
    }

    .gg-profile .alt {
        top: inherit;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    .gg-profile .btn-edit {
        position: relative;
        top: inherit;
        right: inherit;
    }

    .col-1-5 {
        width: 25%;
        float: left;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }

    .gg-product-detay .productimg {
        margin-bottom: 10px;
    }

    .gg-product-tabs .nav .nav-link {
        font-size: 14px;
    }

    .gg-product-comments .charts .list .titlechart {
        font-size: 16px;
        width: 15%;
    }

    .gg-products-table .tr.head {
        display: none;
    }

    .gg-products-comment {
        padding: 20px;
    }

    .gg-products-comment .head-area .title,
    .gg-products-comment .head-area .title i {
        font-size: 20px;
    }

    .gg-product-table {
        flex-direction: column;
    }

    .gg-product-table .td {
        width: 100% !important;
        padding: 5px 0 !important;
    }

    .gg-product-table .td:last-child {
        padding: 10px !important;
    }

    .col-1-5 {
        width: 50% !important;
    }

    .gg-header .buttons {
        justify-content: center;
    }

    .gg-header .buttons .btn {
        margin: 0 10px;
    }

    .gg-header .form-search {
        margin: 20px 0;
    }

    .gg-header .img-logo {
        display: block;
        margin: auto;
    }

    .gg-header {
        padding: 10px 0;
    }

    .gg-popular-box.large,
    .gg-popular-box.small {
        height: 180px;
    }

    .gg-header .form-search .form-control {
        height: 50px;
    }

    .gg-header .form-search .button {
        height: 40px;
        width: 40px;
        line-height: 52px;
    }
}

@media (max-width: 768px) {
    .gg-topbar .col-lg-7 {
        padding: 0;
    }

    .gg-topbar .buttons {
        justify-content: center;
    }

    .gg-modal-login .body {
        padding: 0;
    }

    .gg-indirim .box .content .title,
    .gg-yayinci-banner .box .content .title {
        font-size: 28px;
    }

    .gg-indirim .box .content {
        padding: 50px 0;
    }

    .gg-section-head .title {
        justify-content: center;
    }

    .gg-section-head .title::before,
    .gg-section-head .title::after {
        display: none;
    }

    .gg-copyright .flex-between {
        display: block;
    }

    .gg-copyright span {
        display: block;
        text-align: center;
        margin: 5px 0;
        font-size: 14px;
    }

    .gg-cart-list .head {
        display: none;
    }

    .gg-cart-item {
        flex-direction: column;
        padding-right: 0;
    }

    .gg-cart-item .td {
        width: 100% !important;
    }

    .gg-cart-item .td:first-child {
        text-align: left !important;
    }

    .gg-cart-steps .step .text {
        font-size: 10px;
    }

    .gg-cart-steps .step .circle {
        height: 45px;
        width: 45px;
        line-height: 45px;
        font-size: 20px;
        outline-width: 2px;
    }

    .gg-cart-steps .step .bar {
        top: 22px;
    }

    .gg-head-gradient.flex-between {
        display: block;
        padding: 12px 30px;
    }

    .gg-head-gradient.flex-between .title {
        font-size: 20px;
        margin: 5px 0;
    }

    .gg-blog-box .tags span {
        font-size: 17px;
    }

    .gg-blog-box .blogtitle {
        font-size: 22px;
    }

    .gg-blog-box-mini .text {
        font-size: 12px;
    }

    .col-1-5 {
        width: 50%;
        float: left;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }

    .gg-product .img-product {
        height: 90px;
    }

    .gg-title-gradient .nav .nav-link {
        font-size: 13px;
        padding: 20px;
    }

    .kural .right {
        font-size: 14px;
    }

    .gg-benzer-urunler .urun.flex-between {
        display: block;
    }

    .gg-product-tabs .nav {
        padding: 5px;
    }

    .gg-product-tabs .nav .nav-link {
        font-size: 13px;
    }

    .gg-product-comments .charts .list .progress {
        margin-left: 20px;
    }

    .gg-product-comments .charts .list .titlechart {
        font-size: 14px;
        width: 23%;
    }

    .write-comment.flex-start {
        display: block;
    }

    .write-comment .profile {
        width: 60px;
        height: 60px;
        min-width: 60px;
        margin-bottom: 10px;
    }

    .write-comment form {
        width: 100%;
    }

    .gg-header .buttons .btn-header .title {
        display: none;
    }

    .btn-border .title {
        display: none;
    }

    .btn-border {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 48px;
    }

    .gg-product .buttons {
        padding: 10px;
    }

    .btn-header .material-icons {
        height: 45px;
        min-width: 45px;
        line-height: 40px;
    }

    .btn-header img {
        height: 45px !important;
        min-width: 45px !important;
        width: 45px !important;
    }

    .btn-header.pink .name {
        font-size: 18px;
    }

    .btn-header {
        height: 55px;
    }

    .gg-features {
        top: -30px;
    }

    .search-list .product .productname {
        font-size: 14px;
    }

    .search-list .product .price {
        font-size: 16px;
    }

    .search-list .product .img {
        margin-right: 10px;
    }
}

@media (max-width: 574px) {
    .gg-category-box img {
        height: 160px;
    }

    .gg-popular-box.mini {
        height: 150px;
    }

    .gg-popular-box.large {
        height: 150px;
        margin: 0;
    }

    .gg-blog-mini {
        height: 100px;
    }
}

.modal-content {
    background: linear-gradient(16deg, #0c181d, #27353be8 100%) !important;
    box-shadow: #c5c5c526 0 1px 7px;
}

button#loginButton {
    background: #ff5b00 !important;
    border-color: #ff5b00 !important;
}

.register-text a {
    color: #ff5b00 !important;
}

.gg-modal-login .form-control {
    border: 1px solid #1d2b30 !important;
}

.form-control {
    background-color: #ffffff !important;
    color: #1f2d34 !important;
}

.gg-head-gradient {
    background: linear-gradient(90deg, #0e1d23 0%, #27353be8 100%) !important;
    border-radius: 5px !important;
    box-shadow: 0 1px 7px rgb(33 47 53);
    border: 1px solid #ffffff21;
}

.gg-forgot-pw {
    background: linear-gradient(16deg, #0f1e24, #0c181d 100%) !important;
    box-shadow: #c5c5c526 0 1px 1px;
    border: 1px solid #19313a;
    border-radius: 6px;
}

button.btn.btn-gradient.btn-block {
    line-height: 21px;
    -webkit-border-radius: 5px !important;
    background: #ff5b00;
    font-size: 17px;
    font-weight: 500;
    color: #fff !important;
    outline: none;
    border: none !important;
    box-shadow: none !important;
}

input.form-control {
    -webkit-border-radius: 5px !important;
    height: 54px !important;
}

.gg-modal-login .btn {
    border-radius: 5px !important;
}

button.btn.btn-red-blur.bordered.btn-block {
    background: #ff5b00 !important;
    border-color: #ff5b00 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    border-radius: 5px !important;
}

.form-control {
    background-color: #0c181d !important;
    color: #ffffff !important;
    border: 1px solid #203540 !important;
}

.modal-content {
    background: linear-gradient(16deg, #0c181d, #27353b 100%) !important;
    box-shadow: #c5c5c526 0 0px 0px;
}

input.form-control.form-control-border {
    background-color: #0c181d !important;
    color: #ffffff !important;
    border: 1px solid #203540 !important;
}

input.form-control {
    height: 45px !important;
}

form.form .mb-4 {
    margin-bottom: 19px !important;
}

.gg-auth {
    height: 100vh;
}

button.btn.btn-green-blur.btn-block {
    line-height: 35px;
    -webkit-border-radius: 5px !important;
    background: #ff5b00;
    font-size: 17px;
    font-weight: 500;
    color: #fff !important;
    outline: none;
    border: none !important;
    box-shadow: none !important;
}

.button-link {
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    display: inline-block;
    padding: 9px 10px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: #13252d !important;
    border: 1px solid #19313a !important;
    line-height: 17px;
}

.button-link:hover {
    background: #ff5b00 !important;
    border: 1px solid #ff5b00 !important;
    color: #fff !important;
    box-shadow: none !important;
}

.gg-product-table .button-link {
    align-items: center;
    justify-content: center;
    gap: 2px;
    display: flex;
}

.section-top .buttons a:hover {
    color: #ff5b00 !important;
    box-shadow: none !important;
    transition: color 0.3s ease, box-shadow 0.3s ease;
}

.section-top .buttons a {
    transition: color 0.3s ease, box-shadow 0.3s ease;
}

.submit-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(90deg, #f65901, #c14907);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 15px 30px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 10px;
    position: relative;
    overflow: hidden;
}

.submit-button: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: all 0.6s ease;
}

.submit-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 7px 15px rgba(233, 85, 17, 0.3);
    color: white;
}

.submit-button:hover:before {
    left: 100%;
}

.submit-button:active {
    transform: translateY(0);
}

.submit-button i {
    font-size: 18px;
}

.alert-danger {
    color: #ff5013;
    background-color: #0e1d23;
    border-color: #9c4919;
    margin-top: 20px;
}

/* card.blade */
.cart-main .cart-container {
    font-family: 'Poppins', sans-serif;
}

/* Sepet başlık stilleri */
.cart-main .cart-header {
    background: linear-gradient(135deg, #0e1d23 0%, #1a2a33 100%);
    border-radius: 12px;
    padding: 18px;
    margin-bottom: 25px;
    color: #FFFFFF;
    font-weight: 700;
    font-size: 20px;
    text-align: center;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    border-left: 4px solid #FE5B00;
    transition: all 0.3s ease;
}

.cart-main .cart-header:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.2);
}

/* Sepet listesi stilleri */
.cart-main .cart-list {
    background: #0e1d23;
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 25px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15); 
    transition: all 0.3s ease;
}

.cart-main .cart-list:hover {
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
}

.cart-main .cart-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
}

.cart-main .cart-item:hover {
    background: rgba(255, 255, 255, 0.03);
    transform: translateX(5px);
    border-radius: 8px;
    padding-left: 10px;
}

.cart-main .cart-item:last-child {
    border-bottom: none;
}

.cart-main .cart-item img {
    max-width: 90px;
    border-radius: 8px;
    margin-right: 20px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
}

.cart-main .cart-item img:hover {
    transform: scale(1.05);
}

.cart-main .cart-item-info {
    flex: 1;
    color: #FFFFFF;
    font-size: 16px;
}

.cart-main .cart-item-info a {
    color: #FE5B00;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
    display: inline-block;
}

.cart-main .cart-item-info a:hover {
    color: #FF7043;
    transform: translateX(3px);
}

.cart-main .cart-item-info span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    display: inline-block;
    margin-top: 5px;
    background: rgba(254, 91, 0, 0.1);
    padding: 3px 8px;
    border-radius: 4px;
}

.cart-main .cart-item-quantity {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.05);
    padding: 5px;
    border-radius: 8px;
    margin: 0 15px;
}

.cart-main .cart-item-quantity input {
    width: 60px;
    text-align: center;
    border: 1px solid rgba(254, 91, 0, 0.3);
    border-radius: 5px;
    padding: 8px 5px;
    margin: 0 10px;
    background: rgba(14, 29, 35, 0.8);
    color: #FFFFFF;
    font-weight: 600;
    transition: all 0.3s ease;
}

.cart-main .cart-item-quantity input:focus {
    outline: none;
    border-color: #FE5B00;
    box-shadow: 0 0 0 2px rgba(254, 91, 0, 0.2);
}

.cart-main .cart-item-quantity button {
    background: linear-gradient(135deg, #FE5B00 0%, #FF7043 100%);
    border: none;
    color: #FFFFFF;
    padding: 8px 12px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(254, 91, 0, 0.2);
}

.cart-main .cart-item-quantity button:hover {
    background: linear-gradient(135deg, #FF7043 0%, #FE5B00 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(254, 91, 0, 0.3);
}

.cart-main .cart-item-quantity button:active {
    transform: translateY(1px);
}

.cart-main .cart-item-price {
    color: #FFFFFF;
    font-weight: 700;
    font-size: 18px;
    text-align: right;
    min-width: 100px;
}

.cart-main .cart-item-price .oldprice {
    text-decoration: line-through;
    color: #FFB74D;
    margin-right: 10px;
    font-size: 14px;
    opacity: 0.8;
    display: block;
}

.cart-main .cart-item-price .price {
    color: #FE5B00;
    background: rgba(254, 91, 0, 0.1);
    padding: 5px 10px;
    border-radius: 6px;
    display: inline-block;
}

/* Sipariş özeti stilleri */
.cart-main .cart-summary {
    background: #0e1d23;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15); 
    transition: all 0.3s ease;
}

.cart-main .cart-summary:hover {
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
}

.cart-main .cart-summary h2 {
    color: #FE5B00;
    font-weight: 700;
    margin-bottom: 25px;
    font-size: 20px;
    border-bottom: 1px solid rgba(254, 91, 0, 0.2);
    padding-bottom: 10px;
    position: relative;
}

.cart-main .cart-summary h2:after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 80px;
    height: 3px;
    background: #FE5B00;
    border-radius: 3px;
}

.cart-main .cart-summary table {
    width: 100%;
    color: #FFFFFF;
    font-size: 16px;
    border-collapse: separate;
    border-spacing: 0 12px;
}

.cart-main .cart-summary table td {
    padding: 8px 0;
}

.cart-main .cart-summary table td:last-child {
    text-align: right;
    font-weight: 600;
}

.cart-main .cart-summary table tfoot {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 18px;
    font-weight: 700;
}

.cart-main .cart-summary table tfoot td {
    padding-top: 15px;
}

.cart-main .text-green {
    color: #4CAF50 !important;
}

.cart-main .submit-button {
    background: linear-gradient(135deg, #FE5B00 0%, #FF7043 100%);
    color: #FFFFFF;
    border: none;
    padding: 15px;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 25px;
    display: block;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(254, 91, 0, 0.25);
    position: relative;
    overflow: hidden;
}

.cart-main .submit-button: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: all 0.6s ease;
}

.cart-main .submit-button:hover {
    background: linear-gradient(135deg, #FF7043 0%, #FE5B00 100%);
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(254, 91, 0, 0.3);
    color: #FFFFFF;
    text-decoration: none;
}

.cart-main .submit-button:hover:before {
    left: 100%;
}

.cart-main .submit-button:active {
    transform: translateY(1px);
}

.cart-main .submit-button i {
    vertical-align: middle;
    margin-left: 5px;
    font-size: 20px;
    transition: transform 0.3s ease;
}

.cart-main .submit-button:hover i {
    transform: translateX(5px);
}

/* Kupon kodu alanı */
.cart-main .coupon-section {
    margin-top: 25px;
    background: #0e1d23;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15); 
    transition: all 0.3s ease;
}

.cart-main .coupon-section:hover {
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
}

.cart-main .coupon-section h2 {
    color: #FE5B00;
    font-weight: 700;
    margin-bottom: 20px;
    font-size: 20px;
    border-bottom: 1px solid rgba(254, 91, 0, 0.2);
    padding-bottom: 10px;
    position: relative;
}

.cart-main .coupon-section h2:after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 80px;
    height: 3px;
    background: #FE5B00;
    border-radius: 3px;
}

.cart-main .coupon-section .form-control {
    background: rgba(14, 29, 35, 0.8);
    border: 1px solid rgba(254, 91, 0, 0.3);
    color: #FFFFFF;
    padding: 12px 15px;
    border-radius: 8px;
    margin-bottom: 15px;
    transition: all 0.3s ease;
    font-size: 16px;
}

.cart-main .coupon-section .form-control:focus {
    outline: none;
    border-color: #FE5B00;
    box-shadow: 0 0 0 3px rgba(254, 91, 0, 0.2);
}

.cart-main .coupon-section .btn {
    background: linear-gradient(135deg, #FE5B00 0%, #FF7043 100%);
    color: #FFFFFF;
    border: none;
    padding: 12px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    width: 100%;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 8px 20px rgba(254, 91, 0, 0.25);
    position: relative;
    overflow: hidden;
}

.cart-main .coupon-section .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: all 0.6s ease;
}

.cart-main .coupon-section .btn:hover {
    background: linear-gradient(135deg, #FF7043 0%, #FE5B00 100%);
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(254, 91, 0, 0.3);
}

.cart-main .coupon-section .btn:hover:before {
    left: 100%;
}

.cart-main .coupon-section .btn:active {
    transform: translateY(1px);
}

.cart-main .coupon-section .btn i {
    vertical-align: middle;
    margin-left: 5px;
    font-size: 18px;
    transition: transform 0.3s ease;
}

.cart-main .coupon-section .btn:hover i {
    transform: translateX(5px);
}

.cart-main .coupon-section .btn-danger {
    background: linear-gradient(135deg, #F44336 0%, #E53935 100%);
}

.cart-main .coupon-section .btn-danger:hover {
    background: linear-gradient(135deg, #E53935 0%, #F44336 100%);
}

/* Uyarı mesajı */
.cart-main .alert {
    background: rgba(255, 76, 76, 0.1);
    border: 1px solid rgba(255, 76, 76, 0.2);
    color: #FF4C4C;
    padding: 15px;
    border-radius: 10px;
    margin-top: 20px;
    text-align: center;
    font-weight: 600;
    box-shadow: 0 5px 15px rgba(255, 76, 76, 0.1);
    transition: all 0.3s ease;
}

.cart-main .alert:hover {
    box-shadow: 0 8px 20px rgba(255, 76, 76, 0.15);
    transform: translateY(-2px);
}

.cart-main .alert-success {
    background: rgba(76, 175, 80, 0.1);
    border: 1px solid rgba(76, 175, 80, 0.2);
    color: #4CAF50;
    box-shadow: 0 5px 15px rgba(76, 175, 80, 0.1);
}

.cart-main .alert-success:hover {
    box-shadow: 0 8px 20px rgba(76, 175, 80, 0.15);
}

/* Responsive düzenlemeler */
@media (max-width: 768px) {
    .cart-main .cart-item {
        flex-direction: column;
        align-items: flex-start;
        padding: 15px 0;
    }

    .cart-main .cart-item-info {
        margin-bottom: 15px;
        width: 100%;
    }

    .cart-main .cart-item-quantity {
        margin: 15px 0;
        width: 100%;
        justify-content: center;
    }

    .cart-main .cart-item-price {
        width: 100%;
        text-align: center;
    }

    .cart-main .cart-item img {
        margin-bottom: 10px;
    }
}

/* contact.blade */
/* İletişim Sayfası Genel Stiller */
.contact-main .gg-contact-page {
    margin: 30px 0;
    padding: 0;
}

.contact-main .contact-container {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

/* Header Stiller */
.contact-main .gg-head-gradient {
    background: linear-gradient(90deg, #1a2236 0%, #0f1623 100%);
    border-radius: 8px;
    padding: 20px 30px;
    margin-bottom: 20px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    position: relative;
    overflow: hidden;
}

.contact-main .gg-head-gradient:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(70, 90, 120, 0.1) 0%, rgba(70, 90, 120, 0) 70%);
    z-index: 1;
}

.contact-main .gg-head-gradient .title {
    position: relative;
    z-index: 2;
    margin: 0;
}

.contact-main .breadcrumb {
    font-size: 16px;
    font-weight: 400;
}

.contact-main .header-link {
    color: #fff !important;
    text-decoration: none;
    transition: all 0.3s ease;
}

.contact-main .header-link:hover {
    color: #f65901 !important;
}

/* İletişim Bilgileri Sütunu */
.contact-main .contact-info-column {
    flex: 1;
    min-width: 300px;
}

.contact-main .gg-contact-page {
    background-color: #16152000 !important;
}

.contact-main .contact-info-card {
    background-color: #0e1d23;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(70, 90, 120, 0.2);
    height: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.contact-main .contact-info-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.25);
}

.contact-main .logo-container {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.contact-main .logo-container img {
    max-width: 180px;
    height: auto;
}

.contact-main .info-item {
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.contact-main .info-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.contact-main .info-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.contact-main .info-header i {
    color: #f65901;
    margin-right: 10px;
    font-size: 24px;
}

.contact-main .info-header h3 {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    margin: 0;
}

.contact-main .info-content {
    padding-left: 34px;
}

.contact-main .info-content span,
.contact-main .info-content p {
    color: #c5c5c5;
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

/* Form Sütunu */
.contact-main .contact-form-column {
    flex: 1.5;
    min-width: 400px;
}

.contact-main .contact-form-card {
    background-color: #0e1d23;
    border-radius: 12px;
    padding: 35px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(70, 90, 120, 0.2);
    height: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.contact-main .contact-form-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.25);
}

.contact-main .form-title {
    color: #fff;
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 10px;
    position: relative;
    display: inline-block;
}

.contact-main .form-title:after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #f65901, #c14907);
    border-radius: 3px;
}

.contact-main .form-subtitle {
    color: #8a8a8a;
    font-size: 15px;
    margin-bottom: 30px;
    margin-top: 15px;
}

.contact-main .contact-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-main .form-group {
    position: relative;
}

.contact-main .input-wrapper,
.contact-main .textarea-wrapper {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.contact-main .input-wrapper:focus-within,
.contact-main .textarea-wrapper:focus-within {
    border-color: #f65901;
    box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.2);
    background-color: rgba(255, 255, 255, 0.07);
}

.contact-main .input-wrapper i {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #f65901;
    font-size: 20px;
    z-index: 1;
}

.contact-main .form-input,
.contact-main .form-textarea {
    width: 100%;
    background-color: transparent;
    border: none;
    padding: 15px 15px 15px 50px;
    color: #fff;
    font-size: 15px;
    outline: none;
    transition: all 0.3s ease;
}

.contact-main .form-textarea {
    padding: 15px;
    resize: none;
    min-height: 150px;
}

.contact-main .form-input::placeholder,
.contact-main .form-textarea::placeholder {
    color: #8a8a8a;
    opacity: 0.8;
}

.contact-main .submit-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(90deg, #f65901, #c14907);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 15px 30px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 10px;
    position: relative;
    overflow: hidden;
}

.contact-main .submit-button: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: all 0.6s ease;
}

.contact-main .submit-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 7px 15px rgba(233, 85, 17, 0.3);

}

.contact-main .submit-button:hover:before {
    left: 100%;
}

.contact-main .submit-button:active {
    transform: translateY(0);
}

.contact-main .submit-button i {
    font-size: 18px;
}

/* Responsive Düzenlemeler */
@media (max-width: 992px) {
    .contact-main .contact-container {
        flex-direction: column;
    }

    .contact-main .contact-info-column,
    .contact-main .contact-form-column {
        width: 100%;
        min-width: 100%;
    }

    .contact-main .contact-info-card {
        margin-bottom: 30px;
    }
}

@media (max-width: 576px) {
    .contact-main .gg-head-gradient {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .contact-main .contact-form-card {
        padding: 25px 20px;
    }

    .contact-main .form-title {
        font-size: 24px;
    }

    .contact-main .form-input,
    .contact-main .form-textarea {
        font-size: 14px;
    }
}

/* stramer.preview */
.streamer-main .gg-head-gradient {
    background: linear-gradient(90deg, #FF7043 0%, #FFB74D 100%);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.streamer-main .gg-head-gradient .title {
    color: #FFFFFF;
    font-size: 24px;
    font-weight: bold;
}

.streamer-main .gg-head-gradient .support-button {
    background: #FFB74D;
    color: #FFFFFF;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background 0.3s ease;
}

.streamer-main .gg-head-gradient .support-button:hover {
    background: #FF7043;
}

/* Yayıncı iframe ve form */
.streamer-main .gg-contact-page {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 0;
}

.streamer-main .gg-contact-page iframe {
    flex: 1;
    min-width: 300px;
    border-radius: 10px;
    border: none;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.streamer-main .gg-contact-page .form {
    flex: 1;
    min-width: 300px;
    background: #0e1d23;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.streamer-main .gg-contact-page .form-label {
    color: #FFFFFF;
    font-weight: bold;
    margin-bottom: 5px;
}

.streamer-main .gg-contact-page .form-control {
    background: #0e1d23;
    color: #FFFFFF;
    border: 1px solid #FF7043;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 15px;
    width: 100%;
}

.streamer-main .gg-contact-page .btn-gradient {
    background: linear-gradient(90deg, #FF7043 0%, #FFB74D 100%);
    color: #FFFFFF;
    padding: 10px 20px;
    border-radius: 5px;
    border: none;
    font-weight: bold;
    width: 100%;
    cursor: pointer;
    transition: background 0.3s ease;
}

.streamer-main .gg-contact-page .btn-gradient:hover {
    background: linear-gradient(90deg, #FFB74D 0%, #FF7043 100%);
}

.streamer-main .gg-contact-page .text-end {
    color: #FFFFFF;
    font-size: 12px;
}

/* blogs.blade */
/* Blog Sayfası Stilleri */

.blog-main .gg-blogs-sidebar ul li a {
    font-size: 16px !important;
    font-weight: lighter !important;
}

.blog-main .gg-head-gradient {
    background: linear-gradient(90deg, rgba(255, 87, 34, 0.7) 0%, rgba(103, 58, 183, 0.7) 100%);
    border-radius: 12px;
    padding: 18px 25px;
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.blog-main .gg-head-gradient .title {
    margin: 0;
    font-weight: 500;
    font-size: 18px;
    color: #fff;
}

.blog-main .gg-head-gradient .breadcrumb {
    font-size: 13px;
    opacity: 0.9;
}

.blog-main .gg-head-gradient .breadcrumb a {
    color: #fff;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.blog-main .gg-head-gradient .breadcrumb a:hover {
    opacity: 0.8;
}

/* Blog Kartları */
.blog-main .gg-blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}

.blog-main .gg-blog-card {
    background: linear-gradient(16deg, #0c181d, #27353b 100%) !important;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.03);
    text-decoration: none;
    display: block;
}

.blog-main .gg-blog-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    border-color: rgba(255, 87, 34, 0.15);
}

.blog-main .gg-blog-card .image-wrapper {
    position: relative;
    padding-top: 56.25%;
    /* 16:9 aspect ratio */
    background: #0e1d23;
    overflow: hidden;
}

.blog-main .gg-blog-card .image-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.blog-main .gg-blog-card:hover .image-wrapper img {
    transform: scale(1.05);
}

.blog-main .gg-blog-card .image-wrapper::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40%;
    background: linear-gradient(to top, rgba(18, 26, 38, 0.8), transparent);
    pointer-events: none;
}

.blog-main .gg-blog-card .content {
    padding: 16px;
}

.blog-main .gg-blog-card .meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.blog-main .gg-blog-card .category {
    background: rgba(255, 87, 34, 0.9);
    color: #fff;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.blog-main .gg-blog-card .date {
    color: #8a94a6;
    font-size: 12px;
}

.blog-main .gg-blog-card .title {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    transition: color 0.2s ease;
}

.blog-main .gg-blog-card:hover .title {
    color: #ff5722;
}

/* Sidebar - Minimal Tasarım */
.blog-main .gg-blogs-sidebar {
    background: linear-gradient(16deg, #0f1e24, #0c181d 100%) !important;
    box-shadow: #c5c5c526 0 1px 1px;
    border-radius: 8px;
    padding: 16px;
    position: sticky;
    top: 20px;
    border: 1px solid rgba(255, 255, 255, 0.02);
    margin-bottom: 20px;
    backdrop-filter: blur(10px);
}

.blog-main .gg-blogs-sidebar h3 {
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 87, 34, 0.1);
    letter-spacing: 0.3px;
}

.blog-main .gg-blogs-sidebar ul {
    margin: 0;
    padding: 0;
}

.blog-main .gg-blogs-sidebar li {
    margin-bottom: 4px;
}

.blog-main .gg-blogs-sidebar a {
    display: flex;
    align-items: center;
    padding: 8px 10px;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-size: 13.5px;
    background: rgba(255, 255, 255, 0.02);
    line-height: 1.4;
    position: relative;
}

.blog-main .gg-blogs-sidebar a::before {
    content: '';
    width: 3px;
    height: 0;
    background: #ff5722;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: height 0.2s ease;
    border-radius: 0 2px 2px 0;
    opacity: 0;
}

.blog-main .gg-blogs-sidebar a:hover {
    color: #fff;
    background: rgba(255, 87, 34, 0.04);
    transform: translateX(3px);
    padding-left: 15px;
}

.blog-main .gg-blogs-sidebar a:hover::before {
    height: 70%;
    opacity: 1;
}

/* Pagination */
.blog-main .pagination {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 25px;
}

.blog-main .page-item .page-link {
    background: rgba(18, 26, 38, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.03);
    color: #a0aec0;
    padding: 8px 12px;
    border-radius: 6px;
    transition: all 0.2s ease;
    font-size: 14px;
}

.blog-main .page-item.active .page-link {
    background: rgba(255, 87, 34, 0.9);
    color: #fff;
    border-color: transparent;
}

.blog-main .page-item .page-link:hover {
    background: rgba(255, 87, 34, 0.05);
    color: #ff5722;
}

/* Responsive */
@media (max-width: 992px) {
    .blog-main .gg-blog-grid {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }

    .blog-main .gg-blogs-sidebar {
        margin-top: 25px;
        position: static;
        padding: 14px;
    }

    .blog-main .gg-blogs-sidebar a {
        padding: 7px 10px;
    }
}

@media (max-width: 768px) {
    .blog-main .gg-blog-grid {
        grid-template-columns: 1fr;
    }

    .blog-main .gg-head-gradient {
        flex-direction: column;
        text-align: center;
        gap: 8px;
    }
}

/* Boş içerik uyarısı */
.blog-main .empty-alert {
    background-color: rgba(255, 193, 7, 0.05);
    color: #FFC107;
    border-radius: 8px;
    padding: 15px;
    border: 1px solid rgba(255, 193, 7, 0.1);
    text-align: center;
    margin: 20px 0;
}

/* blog.blade */
.blog-main .blog-container {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-top: 30px;
}

.blog-main .blog-main-content {
    flex: 1;
    min-width: 65%;
}

.blog-main .blog-sidebar {
    width: 30%;
    min-width: 300px;
}

/* Header Stiller */
.blog-main .gg-head-gradient {
    background: linear-gradient(90deg, #1a2236 0%, #0f1623 100%);
    border-radius: 8px;
    padding: 20px 30px;
    margin-bottom: 20px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    position: relative;
    overflow: hidden;
}

.blog-main .gg-head-gradient:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(70, 90, 120, 0.1) 0%, rgba(70, 90, 120, 0) 70%);
    z-index: 1;
}

.blog-main .gg-head-gradient .title {
    position: relative;
    z-index: 2;
}

.blog-main .header-link {
    color: #fff !important;
    text-decoration: none;
    transition: all 0.3s ease;
}

.blog-main .header-link:hover {
    color: #f65901 !important;
}

.blog-main .breadcrumb {
    font-size: 16px;
    font-weight: 400;
}

/* Blog İçerik Stiller */
.blog-main .gg-blog-box {
    background-color: #0e1d23;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
    border: 1px solid rgba(70, 90, 120, 0.2);
}

.blog-main .gg-blog-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

.blog-main .blog-header {
    padding: 25px 30px 0;
}

.blog-main .blog-title {
    font-size: 28px;
    font-weight: 600;
    margin: 15px 0;
    color: #fff;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.blog-main .featured-image {
    width: 100%;
    height: 400px;
    overflow: hidden;
    margin-bottom: 20px;
    position: relative;
}

.blog-main .featured-image:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(to top, rgba(19, 27, 41, 1) 0%, rgba(19, 27, 41, 0) 100%);
    pointer-events: none;
}

.blog-main .featured-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.blog-main .featured-image img:hover {
    transform: scale(1.05);
}

.blog-main .blog-content {
    padding: 0 30px 30px;
    color: #c5c5c5;
    line-height: 1.8;
    font-size: 16px;
}

.blog-main .blog-content p {
    margin-bottom: 20px;
}

.blog-main .blog-content h3,
.blog-main .blog-content h4 {
    margin: 25px 0 15px;
    color: #fff;
    font-weight: 600;
}

.blog-main .blog-content img {
    max-width: 100%;
    border-radius: 8px;
    margin: 20px 0;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.blog-main .blog-content a {
    color: #f65901;
    text-decoration: none;
    transition: all 0.3s ease;
}

.blog-main .blog-content a:hover {
    color: #f65901;
    text-decoration: underline;
}

/* Etiket Stiller */
.blog-main .blog-tags {
    padding: 20px 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.blog-main .tags-title {
    font-size: 18px;
    margin-bottom: 15px;
    color: #fff;
    font-weight: 600;
}

.blog-main .tags-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.blog-main .blog-tag {
    display: inline-block;
    padding: 6px 15px;
    background: rgba(74, 144, 226, 0.1);
    color: #f65901;
    border: 1px solid rgba(74, 144, 226, 0.3);
    border-radius: 20px;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.blog-main .blog-tag:hover {
    background: rgba(74, 144, 226, 0.2);
    transform: translateY(-3px);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

/* Kategori ve Tarih */
.blog-main .tags {
    margin-bottom: 10px;
}

.blog-main .category {
    display: inline-block;
    padding: 5px 12px;
    background-color: rgba(74, 144, 226, 0.1);
    color: #f65901;
    border: 1px solid rgba(74, 144, 226, 0.3);
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
}

.blog-main .date {
    color: #8a8a8a;
    font-size: 14px;
}

/* Sidebar Stiller */
.blog-main .gg-blogs-info {
    background-color: #0e1d23;
    border-radius: 8px;
    padding: 25px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(70, 90, 120, 0.2);
}

.blog-main .sidebar-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #fff;
    padding-bottom: 10px;
    border-bottom: 2px solid rgba(74, 144, 226, 0.3);
    position: relative;
}

.blog-main .sidebar-title:after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 60px;
    height: 2px;
    background: #f65901;
}

.blog-main .recent-posts {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.blog-main .recent-post-item {
    display: flex;
    gap: 15px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: all 0.3s ease;
}

.blog-main .recent-post-item:hover {
    transform: translateX(5px);
}

.blog-main .recent-post-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.blog-main .post-image {
    width: 80px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(70, 90, 120, 0.2);
}

.blog-main .post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.blog-main .recent-post-item:hover .post-image img {
    transform: scale(1.1);
}

.blog-main .post-content {
    flex: 1;
}

.blog-main .post-title {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 8px;
    color: #fff;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.3s ease;
}

.blog-main .recent-post-item:hover .post-title {
    color: #f65901;
}

.blog-main .post-excerpt {
    font-size: 14px;
    color: #8a8a8a;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-main .read-more {
    font-size: 13px;
    color: #f65901;
    font-weight: 500;
    transition: all 0.3s ease;
    display: inline-block;
}

.blog-main .read-more:hover {
    color: #f65901;
    transform: translateX(3px);
}

.blog-main .blog-link {
    text-decoration: none;
}

/* Responsive Düzenlemeler */
@media (max-width: 992px) {
    .blog-main .blog-container {
        flex-direction: column;
    }

    .blog-main .blog-main-content,
    .blog-main .blog-sidebar {
        width: 100%;
    }

    .blog-main .featured-image {
        height: 300px;
    }
}

@media (max-width: 576px) {
    .blog-main .gg-head-gradient {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .blog-main .featured-image {
        height: 200px;
    }

    .blog-main .blog-title {
        font-size: 22px;
    }
}

/* game.blade */
.game-main .gg-head-gradient {
    background: linear-gradient(90deg, #FF7043 0%, #FFB74D 100%);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    text-align: center;
    margin-bottom: 30px;
}

.game-main .gg-head-gradient .title {
    color: #FFFFFF;
    font-size: 24px;
    font-weight: bold;
}

/* Kategori ve ürün bilgileri */
.game-main .gg-category-images {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

.game-main .gg-category-info {
    background: #0e1d23;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    color: #FFFFFF;
}

.game-main .gg-category-info .title {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.game-main .gg-category-info p {
    font-size: 14px;
    line-height: 1.5;
}

/* Ürün tablosu */
.game-main .gg-products-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
}

.game-main .gg-products-table .tr {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    background: #0e1d23;
    color: #FFFFFF;
    border-radius: 5px;
    margin-bottom: 10px;
}

.game-main .gg-products-table .td {
    flex: 1;
    text-align: center;
}

.game-main .gg-products-table .td:first-child {
    flex: 2;
    text-align: left;
}

.game-main .gg-products-table .badge-discount {
    background: #FF7043;
    color: #FFFFFF;
    padding: 5px 10px;
    border-radius: 5px;
    font-weight: bold;
}

.game-main .gg-products-table .price-old {
    text-decoration: line-through;
    color: #FFB74D;
    margin-right: 5px;
}

.game-main .gg-products-table .btn {
    background: #FF7043;
    color: #FFFFFF;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background 0.3s ease;
}

.game-main .gg-products-table .btn:hover {
    background: #FFB74D;
}

/* Yorumlar */
.game-main .gg-products-comment {
    background: #0e1d23;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    color: #FFFFFF;
}

.game-main .gg-products-comment .head-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.game-main .gg-products-comment .comment {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.game-main .gg-products-comment .comment .head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.game-main .gg-products-comment .comment .stars i {
    color: #FF7043;
}

.game-main .gg-products-comment .comment .text {
    font-size: 14px;
    line-height: 1.5;
}

/* 404.blade */
.main-404 .error-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem 1rem;
}

.main-404 .error-code {
    font-size: 8rem;
    font-weight: 700;
    margin: 0;
    background: linear-gradient(135deg, #FF6C0A 0%, #FF9F5A 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    text-shadow: 0 5px 15px rgba(255, 108, 10, 0.2);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

.main-404 .error-title {
    font-size: 2rem;
    color: #FFFFFF;
    margin: 1rem 0;
    font-weight: 600;
}

.main-404 .error-message {
    font-size: 1.2rem;
    color: #A9A9A9;
    margin-bottom: 2rem;
    max-width: 600px;
}

.main-404 .home-button {
    background-color: #FF6C0A;
    color: #FFFFFF;
    border: none;
    padding: 0.8rem 2rem;
    font-size: 1rem;
    font-weight: 500;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
    box-shadow: 0 4px 8px rgba(255, 108, 10, 0.3);
}

.main-404 .home-button:hover {
    background-color: #E55D00;
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(255, 108, 10, 0.4);
}

.main-404 .error-illustration {
    margin: 2rem 0;
    width: 100%;
    max-width: 300px;
    opacity: 0.8;
}

.main-404 .error-divider {
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #1B1F24, #FF6C0A, #1B1F24);
    margin: 1.5rem auto;
    border-radius: 2px;
}

/* Responsive Ayarlamalar */
@media (max-width: 768px) {
    .main-404 .error-code {
        font-size: 6rem;
    }

    .main-404 .error-title {
        font-size: 1.5rem;
    }

    .main-404 .error-message {
        font-size: 1rem;
    }

    .main-404 .error-illustration {
        max-width: 200px;
    }
}

@media (max-width: 480px) {
    .main-404 .error-code {
        font-size: 4rem;
    }

    .main-404 .error-container {
        padding: 1rem;
    }
}

/* payment.blade */
/* Genel stiller */
.payment-main .payment-container {
    font-family: 'Poppins', sans-serif;
    color: #FFFFFF;
}

/* Tab navigasyon stilleri */
.payment-main .payment-tabs {
    background: linear-gradient(135deg, #ff6a30 0%, #FE5B00 100%);
    border-radius: 16px;
    padding: 12px;
    margin-bottom: 30px;
    box-shadow: 0 10px 25px rgba(254, 91, 0, 0.2);
    position: relative;
    overflow: hidden;
}

.payment-main .payment-tabs::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='rgba(255,255,255,0.05)' fill-rule='evenodd'/%3E%3C/svg%3E");
    opacity: 0.5;
    z-index: 0;
}

.payment-main .payment-tabs .nav-item {
    margin: 0 6px;
    position: relative;
    z-index: 1;
}

.payment-main .payment-tabs .nav-link {
    color: rgba(255, 255, 255, 0.8);
    border: none;
    padding: 14px 28px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.payment-main .payment-tabs .nav-link::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: all 0.6s ease;
}

.payment-main .payment-tabs .nav-link:hover::before {
    left: 100%;
}

.payment-main .payment-tabs .nav-link.active {
    background: rgba(255, 255, 255, 0.15);
    color: #FFFFFF;
    backdrop-filter: blur(5px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.payment-main .payment-tabs .nav-link:not(.active):hover {
    background: rgba(255, 255, 255, 0.05);
    transform: translateY(-2px);
}

/* Ödeme kutusu stilleri */
.payment-main .payment-box {
    background: linear-gradient(135deg, #0c181d 0%, #0e1d23 100%);
    border-radius: 16px;
    border: 1px solid rgba(254, 91, 0, 0.15);
    padding: 35px;
    margin-bottom: 30px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

.payment-main .payment-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg, #FE5B00, #FF7043);
}

.payment-main .payment-box:hover {
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
    transform: translateY(-5px);
}

/* Logo ve komisyon alanı */
.payment-main .payment-logo {
    text-align: center;
    padding: 25px;
    background: rgba(254, 91, 0, 0.05);
    border-radius: 14px;
    margin-bottom: 25px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(254, 91, 0, 0.1);
}

.payment-main .payment-logo::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #FE5B00, #FF7043);
}

.payment-main .payment-logo:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}

.payment-main .payment-logo img {
    max-width: 200px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
    filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.1));
}

.payment-main .payment-logo:hover img {
    transform: scale(1.05);
}

.payment-main .payment-commission {
    color: #FE5B00;
    font-size: 15px;
    font-weight: 600;
    background: rgba(254, 91, 0, 0.1);
    padding: 8px 15px;
    border-radius: 30px;
    display: inline-block;
    box-shadow: 0 4px 10px rgba(254, 91, 0, 0.1);
    transition: all 0.3s ease;
}

.payment-main .payment-logo:hover .payment-commission {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(254, 91, 0, 0.15);
}

/* Form alanları */
.payment-main .payment-title {
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.payment-main .payment-title::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 80px;
    height: 3px;
    background: linear-gradient(90deg, #FE5B00, #FF7043);
    border-radius: 3px;
}

.payment-main .payment-input {
    background: rgba(14, 29, 35, 0.8);
    border: 1px solid rgba(254, 91, 0, 0.2);
    color: #FFFFFF;
    padding: 16px;
    border-radius: 12px;
    font-size: 16px;
    width: 100%;
    margin-bottom: 18px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.payment-main .payment-input:focus {
    border-color: #FE5B00;
    box-shadow: 0 0 0 3px rgba(254, 91, 0, 0.15);
    outline: none;
    transform: translateY(-2px);
}

.payment-main .payment-input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

/* Tutar gösterimi */
.payment-main .payment-amount {
    background: linear-gradient(135deg, rgba(254, 91, 0, 0.1) 0%, rgba(255, 112, 67, 0.1) 100%);
    color: #FE5B00;
    padding: 18px;
    border-radius: 12px;
    font-size: 20px;
    font-weight: 700;
    margin: 25px 0;
    text-align: center;
    box-shadow: 0 8px 20px rgba(254, 91, 0, 0.1);
    border: 1px solid rgba(254, 91, 0, 0.15);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.payment-main .payment-amount::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(254, 91, 0, 0.1), transparent);
    transition: all 0.6s ease;
}

.payment-main .payment-amount:hover::before {
    left: 100%;
}

.payment-main .payment-amount:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(254, 91, 0, 0.15);
}

/* Ödeme butonu */
.payment-main .payment-button {
    background: linear-gradient(135deg, #FE5B00 0%, #FF7043 100%);
    color: #FFFFFF;
    border: none;
    padding: 18px 30px;
    border-radius: 12px;
    font-size: 18px;
    font-weight: 700;
    width: 100%;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 8px 20px rgba(254, 91, 0, 0.25);
    position: relative;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.payment-main .payment-button::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: all 0.6s ease;
}

.payment-main .payment-button:hover {
    background: linear-gradient(135deg, #FF7043 0%, #FE5B00 100%);
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(254, 91, 0, 0.3);
}

.payment-main .payment-button:hover::before {
    left: 100%;
}

.payment-main .payment-button:active {
    transform: translateY(1px);
}

/* Kart bilgileri grid */
.payment-main .payment-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-bottom: 18px;
}

.payment-main .payment-card-grid .payment-input {
    margin-bottom: 0;
}

/* Uyarı mesajı */
.payment-main .payment-alert {
    background: linear-gradient(135deg, rgba(255, 76, 76, 0.1) 0%, rgba(255, 76, 76, 0.05) 100%);
    border: 1px solid rgba(255, 76, 76, 0.2);
    color: #FF4C4C;
    padding: 18px;
    border-radius: 12px;
    margin-top: 25px;
    text-align: center;
    font-weight: 600;
    box-shadow: 0 8px 20px rgba(255, 76, 76, 0.1);
    position: relative;
    overflow: hidden;
}

.payment-main .payment-alert::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 76, 76, 0.05), transparent);
    transition: all 0.6s ease;
}

.payment-main .payment-alert:hover::before {
    left: 100%;
}

/* Responsive düzenlemeler */
@media (max-width: 992px) {
    .payment-main .payment-box {
        padding: 25px;
    }

    .payment-main .payment-logo {
        margin-bottom: 30px;
    }
}

@media (max-width: 768px) {
    .payment-main .payment-tabs {
        overflow-x: auto;
        white-space: nowrap;
        padding: 10px;
    }

    .payment-main .payment-tabs .nav {
        flex-wrap: nowrap;
    }

    .payment-main .payment-tabs .nav-link {
        padding: 12px 20px;
        font-size: 14px;
    }

    .payment-main .payment-box {
        padding: 20px;
    }

    .payment-main .payment-card-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .payment-main .payment-card-grid> :last-child {
        grid-column: 1 / -1;
    }

    .payment-main .payment-amount {
        font-size: 18px;
        padding: 15px;
    }

    .payment-main .payment-button {
        font-size: 16px;
        padding: 15px;
    }
}

/* Animasyonlar */
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(254, 91, 0, 0.4);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(254, 91, 0, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(254, 91, 0, 0);
    }
}

.payment-main .pulse-animation {
    animation: pulse 2s infinite;
}

/* streamerlist blade */
.streamerlist-main .gg-head-gradient {
    background: linear-gradient(90deg, #FF7043 0%, #FFB74D 100%);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    text-align: center;
    margin-bottom: 30px;
}

.streamerlist-main .gg-head-gradient .title {
    color: #FFFFFF;
    font-size: 24px;
    font-weight: bold;
}

/* Yayıncı kartları */
.streamerlist-main .gg-streamer {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    background-color: #1A2A2D;
    height: 300px;
}

.streamerlist-main .gg-streamer img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 15px;
    transition: transform 0.3s ease;
}

.streamerlist-main .gg-streamer:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

.streamerlist-main .gg-streamer .name {
    position: absolute;
    bottom: 20px;
    width: 100%;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}

/* Responsive tasarım */
@media (max-width: 768px) {
    .streamerlist-main .gg-streamer {
        height: 200px;
    }

    .streamerlist-main .gg-streamer .name {
        font-size: 16px;
    }
}
/* headermobil */
.mobile-menu .dropdown-profile {
    width: 100%;
    position: relative;
}

.mobile-menu .user-profile {
    width: 100%;
    padding: 10px 15px;
    background-color: #0e1a1e;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
    text-align: left;
    transition: all 0.3s ease;
}

.mobile-menu .user-profile:hover,
.mobile-menu .user-profile:focus {
    background-color: #ff5d2421;
}

.mobile-menu .user-profile .title {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
}

.mobile-menu .user-profile .name {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
}

.mobile-menu .img-profile-mobile {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}

.mobile-menu .dropdown-menu-mobile {
    width: 100%;
    background-color: #1E1E1E;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    margin-top: 5px;
    padding: 8px 0;
    display: none;
}

.mobile-menu .dropdown-menu-mobile.show {
    display: block;
}

.mobile-menu .dropdown-menu-mobile .dropdown-item {
    color: #fff;
    padding: 8px 15px;
    font-size: 14px;
    transition: all 0.2s ease;
}

.mobile-menu .dropdown-menu-mobile .dropdown-item:hover,
.mobile-menu .dropdown-menu-mobile .dropdown-item:focus {
    background-color: #2A2A2A;
}

.mobile-menu .dropdown-menu-mobile .dropdown-item.text-danger {
    color: #FF5B00 !important;
}

/* Mobil Bar Kullanıcı Dropdown Stilleri */
.mobile-bar .dropdown-menu-mobile-bar {
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 200px;
    background-color: #1E1E1E;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    margin-bottom: 5px;
    padding: 8px 0;
    display: none;
    z-index: 1000;
}

.mobile-bar .dropdown-menu-mobile-bar.show {
    display: block;
}

.mobile-bar .dropdown-menu-mobile-bar .dropdown-item {
    color: #fff;
    padding: 8px 15px;
    font-size: 14px;
    transition: all 0.2s ease;
}

.mobile-bar .dropdown-menu-mobile-bar .dropdown-item:hover,
.mobile-bar .dropdown-menu-mobile-bar .dropdown-item:focus {
    background-color: #2A2A2A;
}

.mobile-bar .dropdown-menu-mobile-bar .dropdown-item.text-danger {
    color: #FF5B00 !important;
}

/* Mobil Menü Genel Düzenlemeler */
.mobile-menu-btn.user-profile {
    border: 1px solid #ff5b00;
    box-shadow: 0 3px 6px rgb(255 133 49 / 35%);
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mobile-menu-btn.user-profile .material-icons {
    transition: transform 0.3s ease;
}

.mobile-menu-btn.user-profile[aria-expanded="true"] .material-icons {
    transform: rotate(180deg);
}

/* Mobil Bar Kullanıcı Dropdown Açılır Kapanır Animasyonu */
.mobile-bar .dropdown-toggle::after {
    display: none;
}

.mobile-bar-item .dropdown-toggle[aria-expanded="true"]+.dropdown-menu-mobile-bar {
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Bootstrap Dropdown Uyumluluğu */
.dropdown-menu.show {
    display: block;
}

.header-mobile .mobile-logo {
    text-align: center;
}

.header-mobile .mobile-logo img {
    max-height: 40px;
    width: auto;
}