/* Lottery TUI CSS Styling */

/* Global App Styling */
LotteryTUI {
    background: $surface;
}

/* Main Container */
#main-container {
    align: center middle;
    background: #1a1a2e;
    border: round #ffd700;
    border-title-align: center;
    border-title-color: #ffd700;
    border-title-style: bold;
    height: auto;
    layout: vertical;
    margin: 2;
    min-height: 20;
    min-width: 60;
    padding: 3 5;
    width: auto;
}

/* Welcome Message */
#welcome {
    color: #ffd700;
    content-align: center middle;
    height: auto;
    margin: 0 0 2 0;
    padding: 1;
    text-style: bold;
    width: 100%;
}

/* Instructions */  
#instructions {
    color: #a0aec0;
    content-align: center middle;
    height: auto;
    margin: 1 0 0 0;
    padding: 1;
    text-style: italic;
    width: 100%;
}

/* Lottery Select Styling */
#lottery-select {
    margin: 1 0 2 0;
    width: 100%;
}

/* Hover Effects */
#welcome:hover {
    color: #ffed4a;
    text-style: bold italic;
}

#instructions:hover {
    color: #cbd5e0;
    text-style: bold italic;
}

/* Button styling */
Button {
    background: #ffd700;
    border: round #e6c200;
    color: #1a1a2e;
    height: 3;
    margin: 1;
    min-width: 12;
    text-style: bold;
}

Button:hover {
    background: #ffed4a;
    border: round #ffd700;
    color: #16213e;
}

Button:focus {
    background: #e6c200;
    border: round #b8860b;
    color: #1a1a2e;
}

/* Label styling */
Label {
    color: #e2e8f0;
    margin: 0 0 1 0;
    text-style: bold;
}

/* Draw Button Specific Styling */
#draw-button {
    background: #ffd700;
    border: round #e6c200;
    color: #1a1a2e;
    height: 3;
    margin: 1 0 0 0;
    text-style: bold;
    width: 100%;
}

#draw-button:hover {
    background: #ffed4a;
    border: round #ffd700;
    color: #16213e;
}

#draw-button:focus {
    background: #e6c200;
    border: round #b8860b;
    color: #1a1a2e;
}

/* Results Label Styling */
#result-label {
    background: #1a365d;
    border: thick #ffd700;
    color: #ffffff;
    height: auto;
    margin: 1 0 0 0;
    min-height: 4;
    padding: 1 2;
    text-style: bold;
    content-align: left middle;
    width: 100%;
}