/* fonts */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Oswald:wght@200..700&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&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');

/* Right Header */

/* Left */
.admin-add-match .ht-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.admin-add-match .ht-header-left { width: calc(50% - 15px); display: flex; flex-direction: column; }
.admin-add-match .ht-header .ht-header-left h2{ font-family: "Oswald", sans-serif; font-weight: bold; font-size: 28px; text-transform: uppercase; color: #fff; }
.admin-add-match .ht-header .ht-header-left p.ht-sub-title { font-family: "Work Sans", sans-serif; font-weight: 500; font-size: 12px; color: #fff; margin-bottom: 0;}

/* Right */
.admin-add-match .ht-header .ht-header-right { display: flex; flex-wrap: wrap; gap: 15px; width: calc(50% - 15px); justify-content: end; }
.admin-add-match .ht-header .ht-header-right button.add-matches { white-space: normal; word-break: break-word; background: none; padding: 15px 20px; border-radius: 5px; line-height: 1.2em; font-family: "Poppins", sans-serif; font-weight: 500; font-size: 14px; color: #fff; border: 1px solid #fff; text-transform: uppercase; display: flex; align-items: center; gap: 5px; }
.admin-add-match .ht-header .ht-header-right button.add-matches:hover { border: 1px solid #B8860B; background: linear-gradient(148deg, #D4AF37, #B8860B); color: #000; }
.admin-add-match .ht-header .ht-header-right button.add-matches:hover img { filter: invert(1); }
.admin-add-match .ht-header .ht-header-right button.export { background: linear-gradient(148deg, #D4AF37, #B8860B); padding: 15px 20px; border-radius: 5px; font-family: "Poppins", sans-serif; font-weight: 500; font-size: 14px; color: #000; border: 1px solid #B8860B; line-height: 1.2em; text-transform: uppercase; display: flex; align-items: center; gap: 5px; white-space: normal; word-break: break-word; }
.admin-add-match .ht-header .ht-header-right button.export:hover {
 border: 1px solid #fff; color: #fff; }
.admin-add-match .ht-header .ht-header-right button.export:hover img {
    filter: invert(1);
}


/* Tabs - Live & upcoming matches & Finished matches*/
.admin-add-match .ht-tabs { margin: 36px 0; }
.admin-add-match .ht-tabs .tabs{ width:100%; margin:20px auto; display: flex; flex-direction: column; background: transparent; border: none; border-radius: 0; }
.admin-add-match .ht-tabs .tab-links { display: flex; flex-wrap: wrap; border: 1px solid #252525; padding: 5px; border-radius: 12px; position: relative;}
.admin-add-match .ht-tabs .tab-links a{ padding:10px 20px; background:#ddd; text-decoration:none; color:#000; margin-right:5px; display:inline-block; }
.admin-add-match .ht-tabs .tabs .tab-btn.upcoming{ display: flex; align-items: center; justify-content: flex-start; gap:8px; letter-spacing: 1.2px; background:rgba(246,173,85,0.4); color:#F6AD55; font-family: 'poppins', sans-serif;  font-weight: bold;  font-size: 12px; text-transform: uppercase; margin: 0; width: 33.33%; border-radius: 8px 0 0 8px;}
.admin-add-match .ht-tabs .tabs .tab-btn.upcoming span{ width: 8px; height: 8px; border-radius: 50px; background: #F6AD55; display: block;}
.admin-add-match .ht-tabs .tabs .tab-btn.live{ display: flex; align-items: center; justify-content: start; gap:8px; letter-spacing: 1.2px; background:rgba(229,62,20,0.2); color:#E53E3E; font-family: 'poppins', sans-serif;  font-weight: bold;  font-size: 12px; text-transform: uppercase; margin: 0; width: 33.33%; border-radius: 0;}
.admin-add-match .ht-tabs .tabs .tab-btn.live span{  width: 8px; height: 8px; border-radius: 50px; background: #E53E3E; display: block;}
.admin-add-match .ht-tabs .tabs .tab-btn.finished{ display: flex; align-items: center; justify-content: start; gap:8px; letter-spacing: 1.2px; background:rgba(255,255,255,0.2); color:rgba(255,255,255,60%); font-family: 'poppins', sans-serif;  font-weight: bold;  font-size: 12px; text-transform: uppercase; margin: 0; width: 33.33%; border-radius: 0 8px 8px 0;}
.admin-add-match .ht-tabs .tabs .tab-btn.finished span{  width: 8px; height: 8px; border-radius: 50px; background: rgba(255,255,255,60%); display: block;}

.admin-add-match .ht-tabs .tabcontent{ display:none; border:0; padding:0px; margin-top:0px;}
.admin-add-match .ht-tabs .tabcontent.active{ display:block;}
.admin-add-match .ht-tabs input { position: absolute; right: 100%; }
.admin-add-match .ht-tabs input:checked + .tabcontent { display: block; }
.admin-add-match .ht-tabs .tabcontent { display: none; }
.admin-add-match .ht-tabs .tabs input{ display:none; }
.admin-add-match .ht-tabs .tabs .tab-btn{ padding:12px 20px; background:#f3f3f3; cursor:pointer; margin-right:5px; font-weight:600; }
.admin-add-match .ht-tabs .tabs .tab-panels{ border:none; padding:0px; margin-top:36px; }
.tab-panel{ display:none;}
#upcomingTab:checked ~ .tab-panels #upcoming{ display:block;}
#liveTab:checked ~ .tab-panels #live{ display:block;}
#finishedTab:checked ~ .tab-panels #finished{ display:block; }
/* active tab */
#upcomingTab:checked ~ .tab-links label[for="upcomingTab"],
#liveTab:checked ~ .tab-links label[for="liveTab"],
#finishedTab:checked ~ .tab-links label[for="finishedTab"]{ }


/* Right Table  */

.admin-add-match .ht-tabs .tabs .ht-matches-table { font-family: 'poppins', sans-serif; font-weight: normal; font-size: 14px; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table { width: 100%; border-collapse: collapse; border: 1px solid #262626 !important; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table thead { background: none !important;}
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table thead th { text-align: left; font-size: 12px; color: rgba(255,255,255,50%); padding: 15px 10px; border: none !important; font-family: 'poppins', sans-serif; font-weight: bold; border-bottom: 1px solid #262626 !important;  text-transform: uppercase; background: #090909; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody {border-left: 1px solid #262626; border-right: 1px solid #262626;}
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td { padding: 15px 3px; border: none; font-family: 'poppins', sans-serif;  font-weight: 600; font-size: 14px; color: rgba(255,255,255,40%); vertical-align: middle; border-bottom: 1px solid #262626 !important; text-align: left;}
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody tr:nth-child(odd) td,
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody tr:nth-child(even) td { background: none; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody tr:hover { background: none; }

.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td span.match-score { color: #f6b100 !important; font-family: 'poppins', sans-serif !important; font-weight: bold !important; font-size: 20px !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-image: linear-gradient(176deg, #D4AF37 40%, #B8860B 100%) !important; line-height: 1.2em; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td.winingteam { color: #f6b100 !important; font-family: 'poppins', sans-serif !important; font-weight: 600 !important; font-size: 12px !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-image: linear-gradient(176deg, #D4AF37 40%, #B8860B 100%) !important; line-height: 1.2em; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .mathes-block { display: flex; align-items: start; gap: 10px; } 
.admin-add-match .ht-tabs .tabs .ht-matches-table .mathes-icon { width: 36px; height: 36px; border-radius: 50%; background: #262626; border: 2px solid #ffffff20; display: flex; align-items: center; justify-content: center; color: #0F172A; font-size: 12px; font-weight: bold; font-family: 'inter', sans-serif; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .mathes-icon:nth-child(2){ margin-left: -22px;}
.admin-add-match .ht-tabs .tabs .ht-matches-table .mathes-icon img {  width: 22px; height: 22px; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .name { font-weight: 600; font-family: 'poppins', sans-serif; font-size: 12px; color: #fff; line-height: 1.2em; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .team { font-size: 12px; font-family: 'poppins', sans-serif; font-weight: 500; color:rgba(255,255,255,40%); text-transform: uppercase; line-height: 1.2em; margin-top: 5px; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td .select_option {  position: relative; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td .select_option::after{ content:''; position: absolute; right: 5px; top: 8px; background: url(../../../assets/icons/option-arrow.svg) no-repeat; width: 20px; height: 20px;} 
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td .select_option select { background: #18181B; border: 1px solid #27272A; color:rgba(255,255,255,60%); font-family: 'poppins', sans-serif; font-size: 12px; font-weight: normal; -webkit-appearance: none; width: 100%; line-height: 1.4em;}
.admin-add-match .ht-tabs .tabs .ht-matches-table .editMatch { text-align: center; color: #f6b100; font-size: 18px; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .editMatch button {border: none; background: none; padding: 0; border-radius:0; display: flex; justify-content: center; align-items: center; margin: auto; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td.finishMatch button { background: linear-gradient(148deg, #D4AF37, #B8860B); padding: 10px; border-radius: 5px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 10px; color: #000; border: none; line-height: 1.2em; padding: 6px 8px 6px 8px; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .editMatch button img {filter: invert(1);}
.admin-add-match .ht-tabs .tabs .ht-matches-table .editMatch button:hover, 
.admin-add-match .ht-tabs .tabs .ht-matches-table .editMatch button:focus {border: none; background: none; padding: 0; border-radius:0;}
.admin-add-match .ht-tabs .tabs .ht-matches-table .editMatch:hover { opacity: 0.7; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .pagination { margin-top: 0px; display: flex; justify-content: space-between; align-items: start; font-size: 13px; color: #777;margin-right: 0; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .pagination span {font-family: 'poppins', sans-serif; font-size: 12px; font-weight: normal; color: rgba(255,255,255,50%); }
.admin-add-match .ht-tabs .tabs .ht-matches-table .pages {justify-content: center; display: flex; gap: 10px; flex-wrap: wrap;}
.admin-add-match .ht-tabs .tabs .ht-matches-table .pages button { padding: 8px 16px; background-color: #161616; color: #fff;  border: 1px solid #262626; font-weight: 600; font-size: 12px; border-radius: 8px; font-family: 'poppins', sans-serif; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .pages button.left-nav,
.admin-add-match .ht-tabs .tabs .ht-matches-table .pages button.right-nav { background: none;  border: none; padding: 0; margin: 0 5px 0 10px; border-radius: 0; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .pages button.active { background: #d4af37; color: #000; border: 1px solid #d4af37; }
.admin-add-match .ht-tabs .tabs .ht-matches-table .pages button.active:hover {
    border: 1px solid #2a2f38; background: #1f242c; color: #fff;
}
.admin-add-match .ht-tabs .tabs .ht-matches-table .pages button:hover { background: #d4af37; color: #000;}

.mathes-block div:nth-child(3) {
    width: 70%;
}

/* End Right Table  */

 /* Modalbox */

.modalbox { display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index: 99999; }
.modalbox .modal-content { background:#fff; width:892px; margin:auto; padding:40px 30px; position:fixed; border-radius: 20px; top: 0; bottom: 0; left: 0; right: 0; height: fit-content; }
.modalbox .modal-content .model-header { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 10px;}
.modalbox .modal-content .model-header h2 { font-family: 'oswald', sans-serif; font-weight: bold; line-height: 1.2em !important; font-size: 40px !important; text-transform: capitalize !important; margin-bottom:0px;   
background: linear-gradient(145deg, #D4AF37 0%, #B8860B 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.modalbox .modal-content .model-header span { font-family: 'poppins', sans-serif; font-weight: normal; font-size: 12px; color: rgba(0,0,0,60%);}
.modalbox .modal-content .close-modalbox { width: 24px; }
.modalbox .modal-content .m-logo { display: flex; align-items: center; width: 100%; justify-content: center;} 

.modalbox .modal-content hr { background: linear-gradient(145deg, #D4AF37 0%, #B8860B 100%); width: 100%; height: 2px; border: none; }
.modalbox .modal-content .body-modal { margin-top: 30px; overflow-x: auto; max-height: 320px; padding-right: 10px;}
.modalbox .modal-content .body-modal .winner-calculate { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.modalbox .modal-content .body-modal .winner-calculate h5{ font-family: 'poppins', sans-serif; font-weight: bold; font-size: 16px; color: #000; text-transform: uppercase; margin-bottom: 30px; line-height: 1.2em; }
.modalbox .modal-content .body-modal .winner-calculate-match { display: flex; flex-wrap: wrap; gap: 25px;  align-items: center;}
.modalbox .modal-content .body-modal .winner-calculate-match .winner-score { display: flex; flex-wrap: wrap; flex-direction: column; gap: 10px; justify-content: center; align-items: center; }
.modalbox .modal-content .body-modal .winner-calculate-match .winner-score .sport-name { width: 72px; height: 72px;   
 padding: 16px;  background: linear-gradient(#1e1e1e, #1e1e1e) padding-box, linear-gradient(to right, #D4AF37, #B8860B) border-box; border-radius: 50em; border: 2px solid transparent; }

.modalbox .modal-content .body-modal .winner-calculate-match .team-name { font-family: 'poppins', sans-serif; font-weight: bold; font-size: 16px; color: #000; text-transform: uppercase; line-height: 1.2em; }
.modalbox .modal-content .body-modal .winner-calculate-match .team-score { font-family: 'oswald', sans-serif; font-weight: bold; font-size: 24px; color: #fff; text-transform: uppercase; width: 75px; height: 48px; border-radius: 6px; background: linear-gradient(145deg, #D4AF37 0%, #B8860B 100%); display: flex;
    justify-content: center; align-items: center; }
.modalbox .modal-content .body-modal .winner-calculate-match .team-score input[type="number"] { font-family: 'oswald', sans-serif; font-weight: bold; font-size: 24px; color: #fff; text-transform: uppercase; text-align: center; -webkit-appearance: none;} 
.modalbox .modal-content .body-modal .winner-calculate-match .team-score input[type="number"]::-webkit-inner-spin-button,
.modalbox .modal-content .body-modal .winner-calculate-match .team-score input[type="number"]::-webkit-outer-spin-button{ -webkit-appearance: none;  margin: 0;}
.modalbox .modal-content .body-modal .winner-calculate-match .team-score input[type="number"]{ -moz-appearance: textfield; }
.modalbox .modal-content .body-modal .winner-calculate-match .team-score input[type="number"]:hover::-webkit-inner-spin-button,
.modalbox .modal-content .body-modal .winner-calculate-match .team-score input[type="number"]:hover::-webkit-outer-spin-button{ opacity: 0; }
.modalbox .modal-content .body-modal .winner-calculate .card-match { margin: 60px 0; display:flex; flex-wrap: wrap; width: 100%; gap: 20px; justify-content: space-between; }

.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item { position: relative;  width: 31%; height: 137px; cursor: pointer;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-a { position: relative; background: rgb(0 0 0 / 90%); border: 1px solid #262626; border-radius: 12px;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-b { position: relative; background: linear-gradient(#fff6db, #fff6db) padding-box, linear-gradient(to right, #D4AF37, #B8860B) border-box; border-radius: 12px; border: 2px solid transparent;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-draw { position: relative; background: #fff; border: 1px solid #262626; border-radius: 12px;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-a h4 {font-family: 'oswald', sans-serif; font-weight: bold; font-size: 20px; color: #fff; text-align: center; margin-top: 52px; line-height: 1.2em; margin-bottom: 5px; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-b h4 {font-family: 'oswald', sans-serif; font-weight: bold; font-size: 20px; color: #B8860B; text-align: center; margin-top: 52px; line-height: 1.2em; margin-bottom: 5px; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-draw h4 {font-family: 'oswald', sans-serif; font-weight: bold; font-size: 20px; color: #000000; text-align: center; margin-top: 52px; margin-bottom: 5px; line-height: 1.2em; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-a strong {font-family: 'poppins', sans-serif; line-height: 1.4em; font-weight: normal; font-size: 12px; color: rgb(255 255 255 / 60%); display: flex; justify-content: center; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-b strong {font-family: 'inter', sans-serif; font-weight: normal; font-size: 10px; color: #B8860B; display: flex; justify-content: center; line-height: 1.4em; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-draw strong {font-family: 'inter', sans-serif; font-weight: normal; font-size: 10px; color: #000000; display: flex; justify-content: center;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item input { position: absolute;  opacity: 0; cursor: pointer; }

.modalbox .modal-content .body-modal .winner-calculate .card-match .checkmark { position: absolute; top: 24px; left: 0; right: 0; height: 20px; width: 20px; background: transparent;  border-radius: 50%; margin: auto; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-a .checkmark {border: 2px solid #fff;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-b .checkmark {border: 2px solid #B8860B;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-draw .checkmark {border: 2px solid #000;}
.modalbox .modal-content .body-modal .winner-calculate .card-match .checkmark:after { content: ""; position: absolute; display: none; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item input:checked ~ .checkmark:after { display: block; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-a .checkmark:after { top: 1px; left: 1px; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid #000; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-b .checkmark:after { top: 1px; left: 1px; width: 14px; height: 14px; border-radius: 50%; background: #b8860b; border: 2px solid #ffffff; }
.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item.team-draw .checkmark:after { top: 1px; left: 1px; width: 14px; height: 14px; border-radius: 50%; background: #000; border: 2px solid #ffffff; }

.modalbox .modal-content .body-modal form h5 { font-family: 'poppins', sans-serif; font-weight: normal; font-size: 12px; color: rgba(0,0,0,70%); text-align: center; margin: 20px 0 10px; text-transform: uppercase; }
.modalbox .modal-content .body-modal .winner-calculate-match .sport-vs { font-family: 'inter', sans-serif; font-weight: 800; font-size: 20px; text-transform: capitalize !important; margin-bottom:0px;   
background: linear-gradient(145deg, #D4AF37 0%, #B8860B 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.modalbox .modal-content .body-modal form .one-column { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0px; flex-direction: column;}
.modalbox .modal-content .body-modal form .one-column .form-section { margin: 10px 0; width: 100%;}

main.admin-add-match form#add-new-match-form .two-column:nth-child(3) { margin-top: 25px; }
main.admin-add-match form#add-new-match-form .two-column:nth-child(4) { margin-top: 10px; }

main.admin-add-match form#edit-match-form .two-column:nth-child(4) { margin-top: 25px; }

main.admin-add-match form#add-new-match-form .upload-text { color: #000; }
main.admin-add-match form#edit-match-form .upload-text { color: #000; }

.modalbox .modal-content .body-modal form .two-column { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px;}
.modalbox .modal-content .body-modal form .two-column .form-section { margin: 0px; width: calc(50% - 12px); display: flex; flex-direction: column;}
.modalbox .modal-content .body-modal form .two-column .form-section.upload label {
    margin-top: 0px; color: #B8860B;
}
.modalbox .modal-content .body-modal form label { font-family: 'poppins', sans-serif; font-weight: bold; font-size: 12px; color: #000; text-transform: uppercase; padding-bottom: 0px; }
.modalbox .modal-content .body-modal form input {background: rgba(0, 0, 0, 5%); border: none; border-radius: 8px; max-height: 48px; min-height: 48px; padding: 12px 10px; }
.modalbox .modal-content .body-modal form input:focus,
.modalbox .modal-content .body-modal form input:active,
.modalbox .modal-content .body-modal form input:focus-visible { outline: none; border:none;}
.modalbox .modal-content .body-modal form select { background: #F5F5F5; border-radius: 8px; color: #000; font-family: 'poppins', sans-serif; font-weight: 400; font-size: 14px; padding: 12px 10px;  border: none; max-height: 48px; min-height: 48px; }
.modalbox .modal-content .body-modal form select:focus,
.modalbox .modal-content .body-modal form select:active,
.modalbox .modal-content .body-modal form select:focus-visible { outline: none; border:none;}
.modalbox .modal-content .body-modal form textarea { background: #F5F5F5; border-radius: 8px; color: #000; font-family: 'poppins', sans-serif; font-weight: 500; font-size: 12px; padding: 12px 20px 12px 10px;  border: none; }
.modalbox .modal-content .body-modal form .textarea-input { position: relative; display: block;}
.modalbox .modal-content .body-modal form .textarea-input img { position: absolute; right: 6px; top: 6px; width: 15px; height: 15px;}
.modalbox .modal-content .body-modal form textarea::placeholder { color: rgba(0,0,0,0.6); font-family: 'poppins', sans-serif; font-weight: 500; font-size: 12px; }

.modalbox .modal-content .body-modal form .submit-finalmatch-form-btn button.submit {
    width: 100%; background: linear-gradient(145deg, #D4AF37 0%, #B8860B 100%); color: #000000; font-weight: 700; font-size: 16px; line-height: 1.2em; border-radius: 8px; font-family: 'poppins', sans-serif; border: 1px solid #B8860B !important; white-space: normal; word-break: break-word; padding: 12px 15px; text-transform: uppercase;
}
.modalbox .modal-content .body-modal form .submit-finalmatch-form-btn button.submit:hover { border: 1px solid #B8860B; color: #fff; }
.modalbox .modal-content .body-modal form .submit-finalmatch-form-btn button.submit:focus,
.modalbox .modal-content .body-modal form .submit-finalmatch-form-btn button.submit:active,
.modalbox .modal-content .body-modal form .submit-finalmatch-form-btn button.submit:focus-visible { outline: none; border: none;}

.modalbox .modal-content .body-modal form button.submit { width: calc(50% - 12px); background: linear-gradient(145deg, #D4AF37 0%, #B8860B 100%); color: #000000; font-weight: 700; font-size: 16px; line-height: 1.2em; border-radius: 8px; font-family: 'poppins', sans-serif; border: 1px solid #B8860B; white-space: normal; word-break: break-word; padding: 12px 15px; text-transform: uppercase; }
.modalbox .modal-content .body-modal form button.submit:hover { border: 1px solid #B8860B; color: #fff; }
.modalbox .modal-content .body-modal form button.submit:focus,
.modalbox .modal-content .body-modal form button.submit:active,
.modalbox .modal-content .body-modal form button.submit:focus-visible { outline: none; border: none;}
.modalbox .modal-content .body-modal .add-new-match-form-btn { margin: 30px 0 15px; display: flex;  flex-wrap: wrap; gap: 24px;}
.modalbox .modal-content .body-modal form button.cancel { width: calc(50% - 12px); background: none; border: none; color: #000000; font-weight: 700; font-family: 'poppins', sans-serif; font-size: 16px; line-height: 1.2em; border-radius: 8px; border: 1px solid transparent; white-space: normal; word-break: break-word; padding: 12px 15px; text-transform: uppercase; }
.modalbox .modal-content .body-modal form button.cancel:hover { border-radius: 8px; border: 1px solid #B8860B; background: linear-gradient(145deg, #D4AF37 0%, #B8860B 100%); }
.modalbox .modal-content .body-modal form button.cancel:focus,
.modalbox .modal-content .body-modal form button.cancel:active,
.modalbox .modal-content .body-modal form button.cancel:focus-visible { outline: none; border: none;}
.modalbox .modal-content .body-modal form .two-column .form-section.upload { background: #F5F5F5; border-radius: 12px; padding: 20px 15px; } 
.modalbox .modal-content .body-modal form .two-column .form-section.upload .teamprofile {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center;}
.modalbox .modal-content .body-modal form .two-column .form-section.upload .teamprofile input { width: 64%; background: rgba(0, 0, 0, 5%); border: none; border-radius: 8px;}
.modalbox .modal-content .body-modal form .two-column .form-section.upload .teamprofile input:focus,
.modalbox .modal-content .body-modal form .two-column .form-section.upload .teamprofile input:active,
.modalbox .modal-content .body-modal form .two-column .form-section.upload .teamprofile input:focus-visible { outline: none; border:none;}
.modalbox .modal-content .body-modal form .logo-upload { width:80px; height:80px; border:2px dashed #262626; border-radius:8px;
    display:flex; align-items:center; justify-content:center; flex-direction:column; cursor:pointer; color:#777; margin:0px; background: rgba(0, 0, 0, 5%);}
.modalbox .modal-content .body-modal form .logo-upload:hover{ border-color:#555; }
.modalbox .modal-content .body-modal form .logo-upload span{font-size:12px; margin-top:5px; }
.modalbox .modal-content .body-modal form .logo-upload input{ display:none; }
.modalbox .modal-content .body-modal form .logo-upload .upload-box { font-family: 'poppins', sans-serif; font-weight: bold; font-size: 8px; color:rgba(0, 0, 0, 60%); text-transform: uppercase; display: flex;
    flex-direction: column; align-items: center; gap: 7px; }

.modalbox .close { position:relative; right: 5px; top: 8px; font-size:20px; cursor:pointer; }
.hidden { display:none; }

form#edit-match-form img.logo-preview-b, form#edit-match-form img.logo-preview-a {
 display: none; }

 /* End Modalbox  */

 /* Media Query */
 @media screen and (max-width: 1200px) {
    .admin-add-match .ht-tabs .tabs .ht-matches-table .pagination { flex-direction: column; gap: 10px; justify-content: center; align-items: center; }
    .modalbox .modal-content { width: 90%; padding: 30px 20px; }
    .modalbox .modal-content .model-header h2 { font-size: 35px !important; }
    .main.admin-add-match .order-table thead {
        display: none !important;
    }

    .main.admin-add-match .order-table,
    .main.admin-add-match .order-table tbody,
    .main.admin-add-match .order-table tr {
        display: block !important;
        width: 100% !important;
    }

    .main.admin-add-match .order-table tr {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
        margin-bottom: 15px !important;
        padding: 12px !important;
        border: 1px solid #ddd !important;
        border-radius: 10px !important;
        background: #fff !important;
    }

    .main.admin-add-match .order-table td {
        display: block !important;
        font-size: 14px !important;
    }

    /* Match Details full width */
    .main.admin-add-match .order-table td:first-child {
        grid-column: span 2 !important;
    }

    /* Action button full width */
    .main.admin-add-match .order-table td:last-child {
        grid-column: span 2 !important;
        text-align: right !important;
    }

    /* Select full width */
    .main.admin-add-match .order-table select {
        width: 100% !important;
    }

    /* Labels */
    .main.admin-add-match .order-table td:nth-child(2)::before {
        content: "Date: " !important;
        font-weight: 600 !important;
        display: block !important;
    }

    .main.admin-add-match .order-table td:nth-child(3)::before {
        content: "Status: " !important;
        font-weight: 600 !important;
        display: block !important;
    }  
    main.admin-add-match tbody#upcomingMatchesTable tr td:nth-child(2) { display: flex; align-items: center; justify-content: center; text-align: center; }
    main.admin-add-match tbody#upcomingMatchesTable tr td:nth-child(3), main.admin-add-match tbody#upcomingMatchesTable tr td:nth-child(4) { display: flex; justify-content: center; align-items: center; }

    .admin-add-match .ht-tabs .tabs .ht-matches-table .order-table tbody td .select_option { width: 100%; }

    main.admin-add-match tbody#liveMatchesTable tr td:nth-child(1) { order: 1; }
    main.admin-add-match tbody#liveMatchesTable tr td:nth-child(2) { order: 4; display: flex; justify-content: center; align-items: center; text-align: center; }
    main.admin-add-match tbody#liveMatchesTable tr td:nth-child(3) { order: 2; display: flex; justify-content: center; align-items: center; text-align: center; }
    main.admin-add-match tbody#liveMatchesTable tr td:nth-child(4) { order: 3; display: flex; justify-content: center; align-items: center; text-align: center; }
    main.admin-add-match tbody#liveMatchesTable tr td:nth-child(5) { order: 5; display: flex; justify-content: center; align-items: center; flex: 0  0 100%; }

    main.admin-add-match tbody#finishedMatchesTable tr td:nth-child(1) { order: 1; }
    main.admin-add-match tbody#finishedMatchesTable tr td:nth-child(4) { order: 2; display: flex; justify-content: center; align-items: center; text-align: center; }
    main.admin-add-match tbody#finishedMatchesTable tr td:nth-child(2) { order: 4; display: flex; justify-content: center; align-items: center; text-align: center; }
    main.admin-add-match tbody#finishedMatchesTable tr td:nth-child(3) { order: 3; display: flex; justify-content: center; align-items: center; text-align: center; }      
 }
 @media screen and (max-width: 767px) {
.admin-add-match .ht-header { flex-direction: column; }
.admin-add-match .ht-header-left { width: 100%; flex-direction: column; justify-content: center; align-items: center; text-align: center; }

.admin-add-match .ht-header .ht-header-right { width: 100%; justify-content: center; align-items: center; text-align: center; }

.admin-add-match .ht-tabs .tabs .tab-btn.upcoming, .admin-add-match .ht-tabs .tabs .tab-btn.live, .admin-add-match .ht-tabs .tabs .tab-btn.finished { width: 100%; justify-content: center; border-radius: 8px; }

.admin-add-match .ht-tabs .tab-links { gap: 5px; }

.modalbox .modal-content .body-modal .winner-calculate .card-match .card-item { width: 100%;}

 .modalbox .modal-content .body-modal form .two-column { flex-direction: column; gap: 25px; }
.modalbox .modal-content .body-modal form .two-column .form-section { width: 100%; }
main.admin-add-match .two-column label { margin-top: 0px; }
.modalbox .modal-content .body-modal form .one-column { margin-bottom: 15px; }
.modalbox .modal-content .model-header h2 { font-size: 25px !important; }
.modalbox .modal-content .body-modal .add-new-match-form-btn { flex-direction: column; margin-bottom: 0px; }
.modalbox .modal-content .body-modal form button.submit { width: 100%; }
.modalbox .modal-content .body-modal form button.cancel { width: 100%; }
}