@font-face {
    font-family: 'Lucida Handwriting Std';
    src: url('../fonts/lucida-handwriting-std-cdnfonts/LucidaHandwritingStdLight.TTF') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Tables common opens */
.table-container {
    overflow-x: auto; /* Enables horizontal scrolling */
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on mobile */
    white-space: nowrap; /* Prevents text wrapping */

    display: block; /* Ensures proper rendering */
    width: fit-content; /* Prevents unnecessary stretching */
    max-width: 100%; /* Ensures it doesn't overflow */
}

table {
    border-collapse: separate; /* Fixes overlap issue */
    border-spacing: 0; /* Removes spacing between cells */
    width: max-content; /* Prevent table from stretching full width */
    font-family: "Sitka Banner";
}

th, td {
    width: 60px;
    min-width: 60px;
    text-align: left;
    padding: 5px;
    border: 0.5px solid black;
}

th {
    background-color: #d86315;
    color: black;
}

td {
    background-color: #ffffff;
    color: black;
}
/* Tables common closes */


/* Standing tables opens */
.sticky-col {
    position: sticky; /* Ensures that column do not move */
    /* background: white; */
    z-index: 2; /* Ensures it stays on top */
}

.col-0 {
    width: 180px;
    min-width: 180px;
    left: 0;
}

.non-sticky {
    text-align: center;
    width: 60px;
    min-width: 60px;
    max-width: 60px;
}
/* Standing tables closes */


/* Live standings tables opens */
.game-table {
    width: 150px;
    min-width: 150px; /* Ensures columns don't shrink */
    max-width: 150px; /* Prevents excessive stretching */
}

.game-table:nth-child(2) {
    text-align: center;
    width: 80px;
    min-width: 80px;
    max-width: 80px;
}

.team-table:nth-child(1) {
    position: sticky; /* Ensures that column do not move */
    left: 0;
    z-index: 3; /* Ensures it stays on top */
    width: 170px;
    min-width: 170px;
    max-width: 170px;
    font-weight: bold;
}

.team-table:nth-child(2),
.team-table:nth-child(3) {
    text-align: center;
    width: 55px;
    min-width: 55px;
    max-width: 55px;
}

.team-table:nth-child(4),
.team-table:nth-child(5) {
    text-align: center;
    width: 100px;
    min-width: 100px;
    max-width: 100px;
}

.live-standings:nth-child(1) {
    position: sticky; /* Ensures that column do not move */
    left: 0;
    z-index: 3; /* Ensures it stays on top */
    width: 170px;
    min-width: 170px;
    max-width: 170px;
    font-weight: bold;
}

.live-standings:nth-child(2),
.live-standings:nth-child(3),
.live-standings:nth-child(4),
.live-standings:nth-child(5),
.live-standings:nth-child(6),
.live-standings:nth-child(7),
.live-standings:nth-child(8),
.live-standings:nth-child(9),
.live-standings:nth-child(10),
.live-standings:nth-child(11),
.live-standings:nth-child(12)
.live-standings:nth-child(13),
.live-standings:nth-child(14),
.live-standings:nth-child(15)
.live-standings:nth-child(16),
.live-standings:nth-child(17),
.live-standings:nth-child(18)
{
    text-align: center;
    width: 60px;
    min-width: 60px;
    max-width: 60px;
}
/* Live standings tables closes */


/* The rest of elements styling */
.logout-btn {
    float: right;
    height: 40px;
    width: 110px;
    background-color: #ffbf00;
    color: white;
}

.logout-btn:hover {
    background-color: #d5a104;
}

.home-btn {
    height: 40px;
    width: 110px;
    background-color: #18a3e3;
    color: white;
}

.home-btn:hover {
    background-color: #0c85be;
}

button {
    cursor: pointer;
    border-radius: 10px;
    margin: 10px;
    height: 35px;
    width: 150px;
    background-color: #ffffff;
    border: 0px solid black;
    color: black;
    font-family: "Sitka Banner";
    font-weight: bold;
}

button:hover {
    background-color: #d86315;
}

.main-page-content {
    padding: 50px;
}

body {
    margin: 0px;
}

.header-buttons-line {
    background-color: #d86315;
}

html {
    background-color: #021927;
    color: #ffffff;
    font-family: "Sitka Text";
}

.toggle-button {
    width: 200px;
    margin: 5px;
}

#wellcome-message {
    text-align: center;
    vertical-align: middle;
    margin-top: 30px;
    margin-bottom: 20px;
 }

 .wellcome-greeting-main {
    font-size: 80px;
    font-family: "Lucida Handwriting Std", cursive;
    display:inline-block;
    color: #d86315;
}

.wellcome-greeting-minor {
    font-size: 20px;
    display: block;
    color: white;
    font-style: italic;
    position: absolute;
    font-family: "Sitka Text";
}

.euroleague-logo {
    display: inline-block;
    vertical-align: middle;
    align-content: center;
}

.main-button-section {
    margin-top: 25px;
}

.index-greeting {
    color: #d86315;
    font-family: "Lucida Handwriting Std", cursive;
}

.index-input-box {
    font-size: 25px;
    vertical-align: middle;
}

.index-description {
    margin-bottom: 10px;
    font-style: italic;
}

h1, h3 {
    font-style: italic;
}

@media (max-width: 950px) {
    .wellcome-greeting-main {
        display: block;
        text-align: center;
        font-size: 25px;
    }
    .wellcome-greeting-minor {
        display: block;
        position: relative;
        align-content: center;
        font-size: 16px;

    }
    .main-button-section {
        text-align: center;

    }
    .button-container {
        text-align: center;
    }
    button {
        height: 50px;
        width: 200px;
    }
    .main-page-content {
        padding: 5px;
    }
    .toggle-icon {
        width: 250px;
    }
    .live-data-set {
        text-align: center;
    }
    .table-container {
        margin: auto;
    }
    h1 {
        text-align: center;
    }
    h3 {
        text-align: center;
    }
    .password-input-form {
        text-align: center;
    }
    .index-description {
        text-align: center;
    }
    .index-input-box {
        padding: 9px;
    }
}

/* Playoff page elements styling */
.bracket {
	display: flex;
}

.rounds {
	flex: 1;
	display: flex;
	margin-right: 30px;
	flex-direction: column;
	justify-content: space-around;
}

.match {
	margin: 15px 0;
	overflow: hidden;
	border-radius: 5px;
}

.playoff-team {
	color: #fff
	padding: 10px;
	background-color: #d86315;
}

.playoff-team:nth-child(odd) {
	border-bottom: 1px solid white;
}

.hidden {
    border: none !important;
    margin: 30px 0;
}

.playoff-score {
    float: right;
}
/* Playoff page elements styling closes*/