/*
   AS-CMS Plugin-CSS
   Plugin: as_navigation_manager
   Datei: as_navigation_manager.css
   Automatisch erzeugt durch css_umstellung.php
*/


/* ============================================================
   Übernommene CSS-Datei
   Quelle: link_backend.css
   ============================================================ */

/* link_backend.css */
.link-menu {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.link-menu ul {
    padding-left: 20px;
    margin-top: 5px;
}

.link-item {
    margin-bottom: 5px;
}

.link-anchor {
    text-decoration: none;
    color: #333;
    font-weight: normal;
    display: inline-flex;
    align-items: center;
}

.link-anchor:hover {
    text-decoration: underline;
    color: #000;
}

.link-icon {
    width: 16px;
    height: 16px;
    margin-right: 6px;
    vertical-align: middle;
}


/* ============================================================
   Übernommene CSS-Datei
   Quelle: link_frontend.css
   ============================================================ */

/* link_frontend.css */
.link-navigation { width:100%; max-width:100%; min-width:0; box-sizing:border-box; container-type:inline-size; }
.link-navigation .link-menu-title { display:none; }

.link-navigation.link-layout-card {
    padding:14px;
    border:1px solid color-mix(in srgb, var(--highlight, #2e7fc1) 22%, #d9e2e8);
    border-radius:10px;
    background:linear-gradient(180deg, #fff 0%, #f5f8fa 100%);
    box-shadow:0 4px 14px rgba(25,55,75,.08);
}
.link-navigation.link-layout-card .link-menu-title {
    display:block;
    margin:0 0 10px;
    padding-bottom:8px;
    border-bottom:1px solid #dbe5ec;
    color:var(--text-dark, #263746);
    font-size:16px;
    font-weight:700;
}
.link-navigation.link-layout-plain .link-menu-title { display:none; }
.link-navigation.link-layout-card .link-item,
.link-navigation.link-layout-plain .link-item { margin:0 0 6px; }
.link-navigation.link-layout-card .link-item:last-child,
.link-navigation.link-layout-plain .link-item:last-child { margin-bottom:0; }
.link-navigation.link-display-button .link-anchor {
    display:flex;
    width:100%;
    padding:8px 11px;
    border-radius:6px;
    box-sizing:border-box;
    background:var(--button-bg, #2e7fc1);
    color:var(--button-text, #fff);
    font-weight:600;
    text-decoration:none;
    transition:background .2s ease, transform .2s ease;
}
.link-navigation.link-display-button .link-anchor:hover {
    background:var(--button-hover-bg, #24689f);
    color:var(--button-text, #fff);
    transform:translateY(-1px);
    text-decoration:none;
}
.link-navigation.link-display-text .link-anchor { padding:4px 2px; }
.link-navigation.link-layout-card .link-menu ul,
.link-navigation.link-layout-plain .link-menu ul { padding-left:14px; margin-top:6px; }
.link-navigation .link-anchor { max-width:100%; min-width:0; overflow-wrap:anywhere; }
.link-navigation .link-icon { flex:0 0 auto; }

/* Untermenues sind bei jedem Seitenaufruf geschlossen. Sie werden nur
   waehrend einer bewussten Maus- oder Tastaturinteraktion eingeblendet. */
.link-navigation .link-item > .link-menu {
    display:none;
}
.link-navigation .link-item:hover > .link-menu,
.link-navigation .link-item:focus-within > .link-menu {
    display:block;
}

/* Bereichsunabhaengig: breit nebeneinander, schmal automatisch untereinander. */
@container (min-width: 430px) {
    .link-navigation.link-layout-card > .link-menu,
    .link-navigation.link-layout-plain > .link-menu {
        display:flex;
        flex-wrap:wrap;
        align-items:stretch;
        gap:8px;
    }
    .link-navigation.link-layout-card > .link-menu > .link-item,
    .link-navigation.link-layout-plain > .link-menu > .link-item {
        flex:1 1 150px;
        margin:0;
    }
}

.link-menu {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.link-menu ul {
    padding-left: 20px;
    margin-top: 5px;
}

.link-item {
    margin-bottom: 5px;
}

.link-anchor {
    text-decoration: none;
    color: #007acc;
    font-weight: normal;
    display: inline-flex;
    align-items: center;
}

.link-anchor:hover {
    text-decoration: underline;
    color: #005f99;
}

.link-icon {
    width: 16px;
    height: 16px;
    margin-right: 6px;
    vertical-align: middle;
}


/* ============================================================
   Übernommene CSS-Datei
   Quelle: manage.css
   ============================================================ */

/* Grundlayout */
.link-plugin {
    font-family: Arial, sans-serif;
    color: #222;
    background: #fff;
    padding: 15px;
}

/* Header */
.link-header {
    margin-bottom: 1em;
    border-bottom: 2px solid #007acc;
}

.link-header h3 {
    margin: 0;
    color: #007acc;
}

/* Flex Container */
.container-flex {
    display: flex;
    gap: 20px;
}

/* Sidebar */
.sidebar {
    width: 220px; /* fixe Sidebar-Breite */
    background: #f5f5f5;
    padding: 15px;
    border-radius: 6px;
}

.sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar ul li {
    margin-bottom: 1em;
}

.sidebar ul li a {
    display: block;
    padding: 8px 12px;
    border-radius: 4px;
    text-decoration: none;
    color: #007acc;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.sidebar ul li a.active,
.sidebar ul li a:hover {
    background-color: #007acc;
    color: white;
}

.sidebar ul li a.button-link {
    background-color: #555;
    color: #fff;
    text-align: center;
}

.sidebar ul li a.button-link:hover {
    background-color: #444;
}

/* Suchformular */
.suchformular {
    background-color: #FAFAFA;
    padding: 10px;
    border: 1px solid #BBBBBB;
    border-radius: 7px;
    box-shadow: 0 3px 7px rgba(52,152,219,0.5);
    margin-bottom: 15px;
}

.suchformular input[type="text"] {
    width: 90%;
    padding: 6px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.suchformular .suchbutton {
    background-color: #DDDDDD;
    border-radius: 5px;
    box-shadow: 0 3px 7px rgba(52,152,219,0.5);
    color: black;
    border: none;
    padding: 7px 12px;
    cursor: pointer;
    width: 100%;
    font-weight: bold;
}

.suchformular .suchbutton:hover {
    background-color: #BBBBBB;
}

/* Content Area */
.content-area {
    flex: 1 1 auto;
}

/* Tabellen */
.links-table {
    width: 100%;
    border-collapse: collapse;
}

.links-table th,
.links-table td {
    border: 1px solid #ddd;
    padding: 8px;
    vertical-align: top;
    text-align: left;
}

.links-table th {
    background: #3399ff;
    color: #fff;
    cursor: default;
    user-select: none;
}

.btn-action {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.1em;
    margin-right: 6px;
}

.btn-delete {
    color: red;
}

.btn-delete:hover {
    color: darkred;
}

/* Formular */
.link-form {
    max-width: 600px;
    background: #f9f9f9;
    padding: 15px;
    border-radius: 6px;
    border: 1px solid #ccc;
    margin-top: 1em;
}

.link-form label {
    display: block;
    margin-top: 10px;
    margin-bottom: 4px;
    font-weight: bold;
}

.link-form input[type="text"],
.link-form input[type="number"],
.link-form select {
    width: 100%;
    padding: 7px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1em;
}

.checkbox-label {
    font-weight: normal;
}

.form-buttons {
    margin-top: 15px;
    display: flex;
    gap: 15px;
}

.btn-primary {
    background: #007acc;
    color: white;
    border: none;
    padding: 10px 18px;
    border-radius: 4px;
    font-size: 1em;
    cursor: pointer;
    flex-grow: 1;
}

.btn-primary:hover {
    background: #005f99;
}

.btn-secondary {
    background: #ccc;
    color: black;
    border: none;
    padding: 10px 18px;
    border-radius: 4px;
    font-size: 1em;
    cursor: pointer;
    flex-grow: 1;
}

.btn-secondary:hover {
    background: #aaa;
}

/* Footer */
.link-footer {
    margin-top: 2em;
    text-align: center;
    font-size: 0.9em;
    color: #666;
}

/* Responsive */
@media (max-width: 720px) {
    .container-flex {
        flex-direction: column;
    }

    .sidebar {
        width: 100%;
        margin-bottom: 15px;
    }
}
.btn-action {
    background-color: transparent;
    border: 1px solid #007bff;
    color: #007bff;
    padding: 3px 8px;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    border-radius: 3px;
    transition: background-color 0.2s ease, color 0.2s ease;
    margin: 0 2px;
    user-select: none;
}

.btn-action:hover {
    background-color: #007bff;
    color: #fff;
}

.btn-delete {
    border-color: #dc3545;
    color: #dc3545;
}

.btn-delete:hover {
    background-color: #dc3545;
    color: #fff;
}


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: backend_link_list.php
   ============================================================ */

.links-table { width:100%; border-collapse:collapse; margin-top:10px; }
.links-table th,.links-table td{border:1px solid #ddd; padding:8px; text-align:left; vertical-align:middle;}
.links-table th{background:#1794DD; color:#fff;}
.links-table tr:nth-child(even){background-color:#f9f9f9;}
.btn-action{display:inline-block; padding:4px 8px; border-radius:4px; text-decoration:none; font-size:0.9em; margin-right:4px; color:#fff; background-color:#1794DD; transition:0.2s; cursor:pointer;}
.btn-action:hover{background-color:#FFCD42;color:#000;}
.btn-delete{background-color:#dc3545; border:none; cursor:pointer;}
.btn-delete:hover{background-color:#a71d2a;color:#fff;}
#sort-msg{position:fixed; top:10px; right:10px; padding:8px 12px; border-radius:4px; font-weight:bold; color:#fff; z-index:9999;}


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: frontend_link_list.php
   ============================================================ */

.links-table { width:100%; border-collapse:collapse; margin-top:10px; }
.links-table th,.links-table td{border:1px solid #ddd; padding:8px; text-align:left; vertical-align:middle;}
.links-table th{background:#1794DD; color:#fff;}
.links-table tr:nth-child(even){background-color:#f9f9f9;}
.btn-action{display:inline-block; padding:4px 8px; border-radius:4px; text-decoration:none; font-size:0.9em; margin-right:4px; color:#fff; background-color:#1794DD; transition:0.2s; cursor:pointer;}
.btn-action:hover{background-color:#FFCD42;color:#000;}
.btn-delete{background-color:#dc3545; border:none; cursor:pointer;}
.btn-delete:hover{background-color:#a71d2a;color:#fff;}
.sort-cell{white-space:nowrap;}
.sort-number{display:inline-block; min-width:24px; font-weight:bold;}
.sort-cell small{display:block; color:#666; margin-top:3px;}
.btn-sort{display:inline-block; min-width:24px; padding:3px 6px; border-radius:4px; background:#555; color:#fff; text-align:center; text-decoration:none; font-size:0.85em; line-height:1.2; margin-left:3px;}
.btn-sort:hover{background:#FFCD42; color:#000; text-decoration:none;}


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: link_backendfunctions.php
   ============================================================ */

ul.link-menu { padding-left: 0; margin: 0; }
li.seitenlink { list-style: none; margin: 5px 0; width: 100%; }
li.seitenlink > a {
    display: block;
    padding: 6px 10px;
    color: #FFFFFF;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background-color: #007ACC;
    border-radius: 3px;
    transition: background 0.2s;
}
li.seitenlink > a:hover { background-color: #769FCF; color: #FFFFFF; }
li.seitenlink > a.is-active { background-color: #FDEAB3; color: #000000; }
li.seitenlink > a:visited { color: #000000; }
.link-icon { height: 1.1em; width: 1.1em; vertical-align: text-bottom; margin-right: 6px; }


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: link_edit_backend.php
   ============================================================ */

.link-edit-backend input, .link-edit-backend select { padding:5px; font-size:0.9em; }
.btn-action { display:inline-block; padding:4px 8px; border-radius:4px; font-size:0.9em; color:#fff; background-color:#1794DD; transition:background-color 0.2s; border:none; cursor:pointer; text-align:center; }
.btn-action:hover { background-color:#FFCD42; color:#000; }


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: link_edit_frontend.php
   ============================================================ */

.link-edit-frontend input, .link-edit-frontend select { padding:5px; font-size:0.9em; }
.btn-action { display:inline-block; padding:4px 8px; border-radius:4px; font-size:0.9em; color:#fff; background-color:#1794DD; transition:background-color 0.2s; border:none; cursor:pointer; text-align:center; }
.btn-action:hover { background-color:#FFCD42; color:#000; }


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: link_start.php
   ============================================================ */

.ueberschrift {
    padding: 10px 0;
    background: #E0E0E0;
    color: #d0d0d0;
    margin: 0 0 10px 0;
    padding-left: 10px;
    border-radius: 4px 4px 0 0;
    font-weight: bold;
    letter-spacing: 1px;
    text-shadow:
        2px 2px 0 #aaa,
       -2px -2px 0 #fff;
}
.info-text {
    padding: 15px;
    background: #fdfdfd;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 15px;
    font-family: Arial, sans-serif;
    color: #222;
    word-wrap: break-word;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    transition: box-shadow 0.3s ease;
}
.info-text:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.info-text p {
    margin-bottom: 8px;
}


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: manage.php
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

.link-plugin { 
    font-family: Arial, sans-serif; 
    color: #222; 
    background: #fff; 
    padding: 15px; 
}
.link-header { margin-bottom: 1em; border-bottom: 2px solid #007acc; }
.link-header h3 { margin: 0; color: #007acc; }

.container-flex { display: flex; gap: 20px; width: 100%; }

.sidebar { width: 220px; background: #f5f5f5; padding: 15px; border-radius: 6px; }
.sidebar ul { list-style: none; padding: 0; margin: 0; }
.sidebar ul li { margin-bottom: 1em; }
.sidebar ul li a { 
    display: block; 
    padding: 8px 12px; 
    border-radius: 4px; 
    text-decoration: none; 
    color: #fff; 
    font-weight: bold; 
    background-color: #1794DD; 
    transition: background-color 0.3s ease; 
}
.sidebar ul li a:hover { background-color: #FDEAB3; color: #000; }
.sidebar ul li a.active { background-color: #FDEAB3; color: #000; }

.content-area { 
    flex: 1 1 auto; 
    min-width: 0; 
    word-wrap: break-word; 
}

.btn-action { display: inline-block; padding: 4px 8px; border-radius: 4px; text-decoration: none; font-size: 0.9em; margin-bottom: 10px; color: #fff; background-color: #1794DD; transition: background-color 0.2s; }
.btn-action:hover { background-color: #FFCD42; color: #000; }

.link-footer { 
    margin-top: 2em; 
    text-align: center; 
    font-size: 0.9em; 
    color: #666; 
    background-color: #EAEAEA;
    padding: 10px;
}

@media (max-width: 720px) { 
    .container-flex { flex-direction: column; } 
    .sidebar { width: 100%; margin-bottom: 15px; } 
}


/* ============================================================
   Übernommenes Inline-CSS aus PHP-Datei
   Quelle: navmenue.php
   ============================================================ */

.nav-container { max-width:800px;margin:20px auto;background:#fff;border:1px solid #ccc;border-radius:8px;font-family:Arial,sans-serif;overflow:hidden; }
.nav-container h2 { margin:0;padding:15px;background:#f5f5f5;border-bottom:1px solid #ddd;font-size:18px; }
.nav-tabs { display:flex;background:#eee;border-bottom:1px solid #ddd; }
.nav-tabs div { flex:1;padding:10px;text-align:center;cursor:pointer;transition:background 0.3s;font-size:14px; }
.nav-tabs div:hover { background:#ddd; }
.nav-tabs .active { background:#fff;border-bottom:2px solid #007acc;font-weight:bold; }
.nav-content { padding:20px; min-height:150px; }
.tab-content { display:none; }
.tab-content.active { display:block; }
.form-box { border:1px solid #ccc;padding:15px;border-radius:6px;background:#fafafa;max-width:600px;margin:0 auto; }
.form-box label { display:block;margin-bottom:5px;font-size:14px; }
.form-box input[type="text"], .form-box textarea { width:100%;padding:8px;margin-bottom:10px;border:1px solid #ccc;border-radius:4px;font-size:14px; }
.form-box button { background:#007acc;color:#fff;padding:8px 15px;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background 0.3s; }
.form-box button:hover { background:#005ea3; }
.zurueck { text-align:center;padding:5px; }
.zurueck a { color:#007acc;text-decoration:none; }
.zurueck a:hover { text-decoration:underline; }