/*
 * =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
 * DD Poker - Source Code
 * Copyright (c) 2003-2025 Doug Donohoe
 * 
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 * 
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * For the full License text, please see the LICENSE.txt file
 * in the root directory of this project.
 * 
 * The "DD Poker" and "Donohoe Digital" names and logos, as well as any images, 
 * graphics, text, and documentation found in this repository (including but not
 * limited to written documentation, website content, and marketing materials) 
 * are licensed under the Creative Commons Attribution-NonCommercial-NoDerivatives 
 * 4.0 International License (CC BY-NC-ND 4.0). You may not use these assets 
 * without explicit written permission for any uses not covered by this License.
 * For the full License text, please see the LICENSE-CREATIVE-COMMONS.txt file
 * in the root directory of this project.
 * 
 * For inquiries regarding commercial licensing of this source code or 
 * the use of names, logos, images, text, or other assets, please contact 
 * doug [at] donohoe [dot] info.
 * =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
 */
/**
 * YUI reset
 */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset, img {
    border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
    font-weight: normal;
}

ol, ul {
    list-style-type: none;
}

caption, th {
    text-align: left;
}

tr {
    vertical-align: top;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}

q:before, q:after {
    content: '';
}

abbr, acronym {
    border: 0;
}

a {
    text-decoration: none;
}

/**
* global settings
*/
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.2rem;
    background: white;
    color: black;
}

em {
    font-style: italic;
}

strong {
    font-weight: bold;
}

.spicy {
    font-style: italic;
    font-weight: bold;
    color: red;
}

.mild {
    font-style: italic;
    font-weight: bold;
    color: green;
}

.caption {
    font-size: 85%;
    font-style: italic;
}

.spacer10 {
    height: 10px;
}

.bold {
    font-weight: bold;
}

input[type="submit" i] {
    padding-left: 3px;
    padding-right: 3px;
}

/**
 * Wicket feedback panel
 */

li.feedbackPanelERROR {
    color: red;
    list-style-type: disc;
    margin-left: 20px;
}

/**
 * Grid
 */

/* contain the float so following content doesn't slide up */
.media {
    display: flow-root;
}

/* float the image to the right, add space on its left/bottom */
.float-right, .float-right img {
    float: right;
    margin: 0 0 1rem 1rem; /* top right bottom left */
    max-width: 500px;
    height: auto;
}

/* responsive: drop the float on narrow screens */
@media (max-width: 768px) {
    .float-right, .float-right img {
        float: none;
        display: block;            /* make it a block */
        margin: 0 auto 0;       /* centers horizontally */
        max-width: 300px;
    }
}

/* float the image to the left, add space on its left/bottom */
.float-left, .float-left img {
    float: left;
    margin: 0 1rem 0 1rem; /* top right bottom left */
    max-width: 300px;
    height: auto;
}

@media (max-width: 768px) {
    .float-left, .float-left img {
        max-width: 300px;
    }
}

.center-image {
    padding-bottom: 1rem;
}

@media (max-width: 768px) {
    .center-image {
        max-width: 300px;
    }
}

/* optional spacing for the next block */
.next {
    margin-top: 1rem;
}

.action-buttons {
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
}

.action-button {
    padding-left: 1rem;
    padding-right: 1rem;
}

@media (max-width: 768px) {
    .action-button {
        padding-left: .5rem;
        padding-right: .5rem;
        max-height: 55px;
    }
}

.extra-top-padding {
    padding-top: 1rem;
}

@media (max-width: 768px) {
    .extra-top-padding {
        padding-top: 0;
    }
}

.extra-top-padding-desc {
    padding-top: 2.5rem;
}

.ej {
    font-style: italic;
    font-weight: bold;
}

.ej-icon {
    display: inline-block;      /* ensure it's inline-level */
    vertical-align: middle;     /* center against text line */
    height: 1em;                /* size to text height (optional) */
    padding-right: 4px;
    /* tweak if it still looks a hair low/high: */
    /* vertical-align: -0.125em;  // nudge up*/
    /* vertical-align: 0.125em;   // nudge down */
}

/**
 * common
 */

.tiny {
    font-size: 75%;
}

.small {
    font-size: 85%;
}

.large {
    font-size: 1.2em;
}

div.table-caption {
    margin-bottom: 10px;
    text-align: center;
    font-size: 125%;
}

div.footnote {
    font-size: 75%;
    padding-top: 10px;
}

input[type=text], input[type=password] {
    border: 1px solid #336600;
    color: blue;
    font-size: 115%;
    padding-left: 5px;
}

select {
    border: 1px solid #336600;
    color: blue;
    font-size: 108%;
}

.exception {
    font-family: courier, monospace;
    font-size: 11px;
    padding-left: 40px;
    padding-top: 10px;
}

/**
 * currency
 */

.poker-number-negative {
    color: red;
}

.poker-number-positive {
    color: black;
}

/**
 * links (default and nav bar)
 */

a:link {
    color: blue
}

a:visited {
    color: blue
}

a:hover {
    color: #FF9900
}

a:active {
    color: #00FFFF
}

a.nav:link {
    color: #FFFFFF
}

a.nav:visited {
    color: #FFFFFF
}

a.nav:hover {
    color: #FF9900
}

a.nav:active {
    color: #00FFFF
}

a.box {
    padding: 0.05em 0.3em 0.05em 0.3em;
    outline-color: invert;
    outline-style: none;
    outline-width: medium;
    border: 1px solid #9AAFE5;
    background: #FFFFFF;
    color: #000000;
    font-weight: bold;
    font-size: 95%;
    vertical-align: .05em;
}

a.box:hover {
    border-color: #2E6AB1;
    background: #FFFFD0;
}

a.name:link {
    color: inherit;
}

a.name:visited {
    color: inherit;
}

a.name:hover {
    color: inherit;
}

a.name:active {
    color: inherit;
}

/**
* current-profile
*/
div.current-profile {

    padding-right: 6px;
    padding-top: 6px;
    padding-bottom: 0;

    text-align: right;
    font-size: 80%;
}

div.current-profile span.name {
    font-weight: bold;
}

div.current-profile em {
    color: red;
}

/**
 * content box
 */
#content {
    margin-left: auto;
    margin-right: auto;

    border-top-width: 0;
    border-collapse: collapse;

    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 3rem;
    padding-right: 3rem;
}

@media (max-width: 768px) {
    #content  {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

.centered {
    text-align: center;
}

.description {
    padding-bottom: 10px;
}

.description ul {
    padding-top: 1em;
    padding-bottom: .5em;
}

.description li {
    margin-left: 0;
    padding-bottom: .5em;
}

.description p {
    padding-bottom: 1em;
}

.description-column {
}

.description-column p {
    padding-bottom: 1em;
    overflow: hidden;      /* in desktop, don't wrap around images */
}

@media (max-width: 768px) {
    .description-column p {
        padding-top: 1rem;
    }

    .description-column p {
        padding-bottom: .75em;
        overflow: initial;
    }
}

.description-column-wrap p {
    padding-bottom: 1em;
}


.title {
    text-align: center;
    padding-bottom: 10px;

    color: #336600;
    font-weight: bold;
    font-size: 140%;
}

.sub-title {
    font-size: 75%;
    font-weight: normal;
}

.title-smaller {
    text-align: center;
    padding-bottom: 1rem;
    padding-top: .5rem;

    color: black;
    font-weight: bold;
    font-size: 115%;
    font-style: italic;
}

.title-banner {
    text-align: center;
    padding: 10px;
    margin-top: 15px;
    margin-bottom: 15px;
    border: 1px solid black;

    background: #CCCCCC;

    color: black;
    font-weight: bold;
    font-size: 120%;
}

.description strong {
    color: #006600;
    font-weight: normal;
}

p.callout {
    padding: 10px;
    border: 1px solid black;
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: auto;
    background-color: palegoldenrod;
    font-size: 105%;
}

/**
 * site map table
 */
#site-map {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
}

#site-map td {
    padding: 5px;
    padding-bottom: 15px;
}

#site-map td.col1 {
    width: 150px;
    text-align: right;
    padding-right: 0px;
}

#site-map td.col1x {
    width: 15px;
    text-align: left;
    padding-right: 10px;
}

#site-map td.col2 {
    width: 430px;
}

/**
 * copyright settings
 */
div.copyright {
    padding-top: 5px;
    padding-bottom: 10px;
}

p.copyright {
    font-size: 65%;
    vertical-align: middle;
    text-align: center;
}

@media (max-width: 768px) {
    p.copyright {
        font-size: 50%
    }

}

/**
 * form settings
 */

div.form-panel {
    padding-top: 0;
    padding-bottom: 10px;
}

div.form {
    border: 2px solid black;
    width: 330px;
    margin-left: auto;
    margin-right: auto;
    background-color: #999999;
}

div.form-title {
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
    color: white;
}

div.form td {
    padding: 5px;
    vertical-align: middle;
}

div.form td.label {
    color: yellow;
    text-align: right;
    vertical-align: top;
}

div.form td.sample {
    color: white;
    text-align: left;
    font-family: courier, monospace;
}

div.form label {
    color: white;
}

li.form-style1-ERROR {
    background-color: red;
    color: white;
    text-align: left;
    padding: 5px;
}

li.form-style2-ERROR {
    color: red;
    text-align: center;
}

li.form-style2-INFO {
    color: green;
    text-align: center;
}

li.form-style3-ERROR {
    list-style: disc;
    color: red;
    text-align: left;
}

li.form-style3-INFO {
    padding-top: 4px;
    color: green;
    text-align: center;
    font-size: 120%;
}

li.form-style4-ERROR {
    color: red;
    text-align: center;
    font-size: 120%;
}

li.form-style4-INFO {
    padding-bottom: 15px;
    color: green;
    text-align: center;
    font-size: 140%;
}

/**
 * aliases settings
 */
table.aliases {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
}

table.aliases td.label {
    font-weight: bold;
    padding-right: 10px;
}

table.aliases td.names {
    width: 450px;
    font-weight: normal;
    font-size: 80%;
    vertical-align: middle;
}

.alias-names {
    margin-right: .75em;
}

/**
 * general tournament-info table/CSS
 */

div.tournament-info-navigator {
    margin-left: auto;
    margin-right: auto;
}

table.tournament-info {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    border: 2px solid #333333;
}

table.tournament-info th {
    background-color: #333333;
    text-align: center;
    color: yellow;
    padding: 2px;
    border: 1px solid white;
    font-weight: normal;
}

table.tournament-info tr.even {
    background-color: #BBBBBB;
}

table.tournament-info tr.odd {
    background-color: #DDDDDD;
}

table.tournament-info tr.highlight {
    background-color: khaki;
}

table.tournament-info td {
    padding: 2px 4px;
    border: 1px solid white;
    color: black;
    vertical-align: middle;
    text-align: right;
}

table.tournament-info td.right {
    text-align: right;
}

table.tournament-info td.left {
    text-align: left;
}

table.tournament-info td.top-left {
    text-align: left;
    vertical-align: top;
}

table.tournament-info td.left-small {
    text-align: left;
    font-size: 80%;
}

table.tournament-info td.left-highlight {
    text-align: left;
    color: blue;
}

table.tournament-info td.center {
    text-align: center;
}

table.tournament-info td.number {
    text-align: right;
    padding: 2px 2px;
    padding-left: 4px;
    font-family: courier, monospace;
}

table.tournament-info span.addpadding {
    padding-right: .4em;
}

/**
 * paging
 */

.pagenav {
    padding-bottom: 10px;
}

.pages {
    font-size: 75%;
}

.rowcount {
    text-align: right;
    font-size: 95%;
    vertical-align: middle;
}

/* defaults for all links (disabled) */
.pages a.link, .pages span.link, .current-page-link, .active-page-link, .anchor-disabled-page-link {
    background: #EEEEEE;
    color: #888888;
    border: 1px solid #AAAAAA;
    display: block;
    float: left;
    margin-right: 3px;
    padding: 0.2em 0.5em 0.2em 0.5em;
    outline-color: invert;
    outline-style: none;
    outline-width: medium;
    font-weight: bold;
}

/* current page */
.current-page-link {
    background: #2E6AB1;
    border: 1px solid #2E6AB1;
    color: #FFFFFF;
    font-weight: bold;
}

/* active link to another page */
.active-page-link {
    border: 1px solid #9AAFE5 !important;
    background: #FFFFFF !important;
    color: #000000 !important;
    font-weight: bold !important;
}

.active-page-link:hover {
    color: #000000;
    border-color: #2E6AB1;
    background: #FFFFD0;
}

.active-page-link:link, .active-page-link:visited {
    color: #000000;
}

.pages span.dots {
    color: #000000;
    display: block;
    float: left;
    padding-left: 0.45em;
    padding-right: 0.45em;
    margin-right: 3px;
}

/**
 * game url panel
 */

div.url {
    text-align: center;
}

div.url a.join {
    font-size: 125%;
    padding-right: .75em;
    padding-left: .75em;
}

/**
* games list
*/

div.games-list {
    margin-left: auto;
    margin-right: auto;
}

div.games-list td.players-list {
    width: 200px;
    text-align: left;
    font-size: 80%;
}

div.games-list td.url {
    font-size: 80%;
}

div.games-list table.tournament-info td {
    vertical-align: top;
}

/**
 * leaderboard
 */

div.leaderboard {
    margin-left: auto;
    margin-right: auto;
}

div.leaderboard-form-gap {
    height: 10px;
    font-size: 1px;
}

div.leaderboard .ai {
    color: forestgreen;
    font-style: italic;
}

div.leaderboard .current {
    font-weight: bold;
}

/**
 * tournament history
 */

div.tournament-history {
    margin-left: auto;
    margin-right: auto;
}

.retired {
    color: red;
}

/**
 * tournament detail
 */

div.tournament-detail-url {
    margin-bottom: 20px;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid black;
    padding: 5px 4px;
    background-color: #DDDDDD;
}

div.tournament-finish {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    width: 400px;
}

div.tournament-details {
    margin-left: auto;
    margin-right: auto;
}

.tournament-details-unbold {
    font-weight: normal;
}

div.tournament-createdate {
    font-size: 75%;
    text-align: center;
    padding-top: 5px;
}

div.tournament-details table.tournament-info td.header {
    background-color: #333333;
    color: yellow;
    text-align: right;
    vertical-align: top;
}

div.tournament-details table.tournament-info table.sub-table {
    margin-left: auto;
    margin-right: auto;
    margin-top: 8px;
    margin-bottom: 6px;
    border: 2px solid #333333;
}

/* override tournament-info defaults */

div.tournament-details table.tournament-info {
}

div.tournament-details table.tournament-info td {
    padding-left: 8px;
    padding-right: 8px;
}

div.tournament-details table.tournament-info th {
    padding-left: 8px;
    padding-right: 8px;
}

/**
 * search
 */

div.search-player {
    margin-left: auto;
    margin-right: auto;
}

div.search-form {
    padding-top: 4px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;

    text-align: center;
}

div.search-form table {
    margin-left: auto;
    margin-right: auto;
}

div.search-form td {
    vertical-align: middle;
    text-align: right;
    padding: 2px;
}

div.search-form td.space-after {
    padding-right: 20px;
    text-align: left;
}

div.search-form label {
    padding-right: 10px;
}

div.search-form .button {
    text-align: center;
}

span.search-highlight {
    border: 1px dotted #444444;
}

div.search-player table.tournament-info td {
    padding-bottom: 5px;
    padding-top: 5px;
}

div.no-results {
    padding-top: 5px;
}

div.no-results span {
    font-weight: bold;
    color: green;
}

div.search-player table.profile-info td.profile-info {
    text-align: left;
    padding: 0;
    padding-left: 10px;
    vertical-align: top;
}

div.search-player table.profile-info td {
    border: 0;
    margin: 0;
    padding: 0 0 4px 0;
    vertical-align: top;
}

span.password {
    color: red;
}

/**
 * host search
 */

div.host-list {
    margin-left: auto;
    margin-right: auto;
}

div.host-search {
    margin-bottom: 15px;
    text-align: center;
}

div.host-search span.gap {
    margin-right: 20px;
}

/**
 * Home page
 */


#homepage ul {
    padding-left: 2rem;
}

li {
    background-image: url( images/spade.jpg );
    background-repeat: no-repeat;
    background-position: 0 0;
    padding-bottom: 3px;
    padding-left: 25px;
}

li ul li {
    background-image: none;
}

.donate-form {
    padding-top: 20px;
    padding-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.donate-element {
    padding-left: 1rem;
    padding-right: 1rem;
}

.donate-form input[type=image] {
    padding-left: 0;
    display: inline-block;      /* ensure it's inline-level */
    vertical-align: middle;     /* center against text line */
}

@media (max-width: 768px) {
    .donate-form input[type=image] {
        padding-top: 1rem;
    }
}

.donate-note {
    font-size: 85%;
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
}

/**
 * download
 */
div.download {
    padding-top: 20px;
    margin-left: auto;
    margin-right: auto;
}

/**
 * about/details pages
 */

.float-right-doug-greg {
    float: right;
    margin-top: 1rem;
    margin-bottom: 25px;
    margin-right: 20px;
    margin-left: 20px;
    text-align: center;
}

p.titlelink {
    padding-bottom: 10px;
    font-size: 1.2em;
    text-align: center;
}

/**
 * wrapper div to reduce cut/paste work as much as possible
 */

div.legacy-details {
    padding-top: 1rem;
}

div.legacy-details ol li {
    list-style: decimal;
    list-style-position: outside;
    padding-bottom: .25em;
    margin-left: 0;
}

div.legacy-details li {
    list-style-position: outside;
    padding-bottom: .25em;
    margin-left: 0;
}

div.legacy-details li ul {
    padding-top: .25em;
}

div.legacy-details li ul li {
    list-style-position: outside;
    list-style: circle;
    margin-left: 2rem;
    padding-left: .5rem;
}

div.legacy-details li strong {
    font-weight: bold;
}

div.legacy-details p strong {
    display: block;
    padding-bottom: 10px;
    text-align: center;
}

div.legacy-details p {
    padding-bottom: 1rem;
}

div.legacy-details tt {
    color: green;
    font-size: 1.1rem;
}

/**
 * support
 */

table.issue-list {
    border: 1px solid green;
    padding: 5px;
    border-collapse: collapse;
    margin-top: 5px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
}

table.issue-list td {
    border: 1px solid green;
    padding: 5px;
}

tr.issue-header {
    background-color: #FFFFCC;
}

.help-menu {
    margin-left: auto;
    margin-right: auto;
}

.help-menu table {
    margin-bottom: 20px;
}

.help-menu td {
    padding: 10px;
    border: 1px solid green;
    border-collapse: collapse;
}

.known-links {
    padding-right: 20px;
    padding-left: 20px;
    font-size: 120%;
    font-weight: bold;
}

ul.extra-space {
    padding-bottom: 1em;
}

ul.extra-space li {
    padding-bottom: 1em;
}

div.faq {
    padding-top: 15px;
}

div.faq-question {
    border-top: 1px solid green;
    padding-top: 4px;
    padding-bottom: 15px;
    font-weight: bold;
}

/**
 * my profile
 */

div.myprofile {
    padding-top: 20px;
    margin-left: auto;
    margin-right: auto;
}

table.myprofile {
    margin-left: auto;
    margin-right: auto;
}

td.myprofile {
    padding: 5px 30px;

}

.myprofile-desc {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 0px;
}

.myprofile-desc p {
    padding-bottom: 1em;
}

.myprofile-desc ul {
    padding-top: 10px;
}

.myprofile-desc li {
    padding-left: 10px;
    padding-bottom: 4px;
    list-style: disc;
    list-style-position: inside;
}

div.pw-form {
    padding-top: 5px;
    padding-bottom: 20px;
}

div.pw-form table {
    border: 2px solid black;
    background-color: #DDDDDD;
    margin-left: auto;
    margin-right: auto;
}

div.pw-form td {
    vertical-align: middle;
    text-align: right;
    padding: 2px;
    padding-left: 10px;
    color: green;
}

div.pw-form td.space-after {
    padding-right: 15px;
    padding-left: 2px;
    width: 100px;
    text-align: left;
}

div.pw-form label {
    padding-right: 10px;
}

div.pw-form .button {
    padding: 8px;
    text-align: center;
}

/**
 * store
 */

.store-items {
    margin-left: auto;
    margin-right: auto;
}

.store-items td {
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
    text-align: center;
    font-size: 85%;
}

.store-items img {
    padding-bottom: .5em;
}

.store-item {
    width: 125px;
    float: left;
}

.clearboth {
    clear: both;
}