/* Grundlayout & Seitenverhältnis */
.form-container {
    width: 1000px; /* Basisbreite */
    min-height: 600px; /* Entspricht ca. 17:12 Verhältnis */
    margin: 20px auto;
    padding: 20px;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    font-family: sans-serif;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.table_eingabe {
    width: 100%;
    /*border-collapse: separate;
    border-spacing: 5px;*/
	border: black 1px solid;
	background-color: #fff;
}

/* Kopfdaten & Teams */
.header-table td {
    padding: 10px;
    vertical-align: middle;
}

.td_textR-borderL {
	text-align: right;
	border-left: 1px solid #ddd;
	padding-right: 2px;
}

/* Radio-Buttons untereinander */
.radio-container {
    display: flex;
    flex-direction: column; /* Stapelt A-D und 1-4 */
    font-size: 9px;
    padding: 2px 30px 2px 0;
}

.radio-item {
    display: flex;
    align-items: center;
    justify-content: left;
    cursor: pointer;
	gap: 2px;
}

/* Input-Felder Formatierung */
input[readonly] {
    background-color: #ededed;
    cursor: not-allowed;
	line-height: normal;
	border: 1px solid #999;
  	border-radius: 2px;
}

.input-short, .input-runde, .input-date, .input-passnr, .input-player-name, .input-team-name, .input-sets, .input-player-doppel-14, .input-player-doppel-AD, .game-nr {
	font-size: 0.9rem !important;
}

.input-short {
	width: 60px;
	text-align: center;
	padding: 0;
	line-height: normal;
	text-transform: uppercase;
}

.input-date {
	width: 50% !important;
	display: inline !important;
	padding: 2px !important;
}

.input-team-name { width: 70%; }
.input-player-name {
	margin: 0 0 5px 0;
	width: 98%;
	border: 1px solid #999;
  	border-radius: 2px;
}

.input-player-doppel-14, .input-player-doppel-AD {
	margin-top: 5px;
	width: 100%;
}

.input-player-doppel-14 {text-align: right;}
.input-player-doppel-AD {text-align: left;}

.input-passnr {
	width: 70px;
	line-height: normal;
	padding: 0;
	margin: 5px 0 0 0;
}

/* Die Ergebnis-Quadrate (Sätze) */
.input-sets {
    width: 17px;
    text-align: center;
    border: 1px solid #999;
	padding: 0;
	line-height: normal;
    text-transform: uppercase;
}

.input-runde {
	width: 18px;
    text-align: left;
    border: 1px solid #f1f1f1;
	padding: 0;
	line-height: normal;
}

/* Matrix-Zellen */
.matrix-cell, .matrix-cell-R, .matrix-player-name, .matrix-passnr {
    border: 1px solid #ddd;

}

.matrix-cell {
	border-left: none;
    text-align: center;
}

.matrix-cell-R {
	border-right: none;
	border-left: none;
	text-align: center;
}

.matrix-cell-leer, .matrix-cell-leer-R {
	border: 1px solid #ddd;
	position: relative;
	text-align: center;
	vertical-align: middle;
	background:
	linear-gradient(
	  to bottom right,          /* Richtung: oben rechts → unten links */
	  #f8f9fa 49.5%,       /* transparent bis knapp vor Linie */
	  #ddd 49.5%,              /* Linie beginnt */
	  #ddd 50.5%,              /* Linie endet (1px dick) */
	  #f8f9fa 50.5%        /* transparent danach */
	);
    height: 52px;
}

.matrix-cell-leer-R{
	border-right: none;
}

.matrix-player-name, .matrix-passnr {
	border-left: none;
    text-align: left;	
}

.matrix-player-name {border-top: none;}
.matrix-passnr {border-bottom: none;}

.matrix-passnr-R {
	border-top: 1px solid #ddd;
	text-align: left;
}

.matrix-player-name-R {
	border-bottom: 1px solid #ddd;
	text-align: left;
}

.game-nr {
    color: #666;
    width: 17px;
	vertical-align: top;
	padding: 0;
	border-top: 1px solid #ddd;
  	border-bottom: 1px solid #ddd;
	margin: 5px 0 0 0;
}

.quick-btns {
    margin-bottom: 5px;
}

.quick-btns button {
    background: #f8f9fa;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 0px 5px;
    font-size: 10px;
    color: #555;
    cursor: pointer;
    margin: 0 1px;
    transition: all 0.2s;
}

.quick-btns button:hover {
    background: #e2e6ea;
    border-color: #adb5bd;
}

.quick-btns button:active {
    background: #dae0e5;
    box-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
}

/* Action Buttons (Icons) */
.action-btn {
    width: 24px;
    height: 24px;
    border: none;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
    cursor: pointer;
    vertical-align: middle;
}

.eintragen_btn { background-image: url('../icons/add.png'); } /* Pfade anpassen */
.check_btn { background-image: url('../icons/check.png'); }
.fail_btn { background-image: url('../icons/error.png'); }

/* Submit Bereich */
.button-row {
    margin-top: 30px;
    display: flex;
    justify-content: space-around;
}

input[type="submit"] {
    padding: 10px 40px;
    background-color: #28a745;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: bold;
	margin: 5px 0;
}

.button_reset {
    padding: 10px 20px;
    background-color: #dc3545;
    color: white;
    border: none;
    border-radius: 4px;
	margin: 5px 0;
	font-weight: bold;
}

/* Basis-Styling für alle Action-Buttons */
.action-btn {
    width: 22px;
    height: 22px;
   /* border: 1px solid #ccc;
    border-radius: 4px;*/
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    cursor: pointer;
    vertical-align: middle;
    margin-left: 5px;
    transition: all 0.2s ease;
}

.action-btn:hover {
    border-color: #999;
    background-color: #f0f0f0;
}

/* Icon: Lupe / Plus (Spieler suchen/anlegen) */
.eintragen_btn {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org' fill='none' viewBox='0 0 24 24' stroke='%23555'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0zM10 7v6m-3-3h6' /%3E%3C/svg%3E");
}

/* Icon: Grüner Haken (Erfolgreich gespeichert) */
.check_btn {
    background-color: #d4edda;
    border-color: #c3e6cb;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org' fill='none' viewBox='0 0 24 24' stroke='%23155724'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M5 13l4 4L19 7' /%3E%3C/svg%3E");
}

/* Icon: Rotes Kreuz (Fehler) */
.fail_btn {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org' fill='none' viewBox='0 0 24 24' stroke='%23721c24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 18L18 6M6 6l12 12' /%3E%3C/svg%3E");
}

/**********************************************/
/*CSS-Regel zur formatierung der Statusmeldung*/
/**********************************************/

/* Container für Statusmeldungen */
.status-message {
    padding: 12px 20px;
    margin-bottom: 20px;
    border-radius: 4px;
    font-size: 1rem;
    font-weight: bold;
    text-align: center; /* Zentriert die Nachricht für eine klare Optik */
    border: 1px solid;
    animation: fadeIn 0.4s ease-in-out;
}

/* Erfolg: Dezent grünes Design */
.status-success {
    background-color: #d4edda;
    color: #155724;
    border-color: #c3e6cb;
}

/* Fehler: Dezent rotes Design */
.status-error {
    background-color: #f8d7da;
    color: #721c24;
    border-color: #f5c6cb;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}
