/* CSS Document */
.maincontent{
    width:100%;
}

.landscapeTitle{

    font-size:30px;
    font-weight:bold;
    margin-bottom:10px;

}

.searchBox{

    width:100%;
    padding:12px;
    font-size:16px;
    border-radius:10px;
    border:1px solid #CCC;
    box-sizing:border-box;
    margin-bottom:15px;

}

.count{

    color:#666;
    margin-bottom:20px;

}

.plantCard{

    display:flex;
    align-items:center;
    gap:15px;

    background:#FFF;

    border-radius:12px;

    padding:14px;

    margin-bottom:12px;

    text-decoration:none;

    color:#222;

    box-shadow:0 2px 6px rgba(0,0,0,.12);

}

.plantCard:hover{

    background:#F5FFF4;

}

.plantThumb{

    width:90px;

    height:90px;

    object-fit:cover;

    border-radius:10px;

    flex-shrink:0;

    border:1px solid #DDD;

}

.plantInfo{

    flex:1;

}

.plantName{

    font-size:20px;

    font-weight:bold;

    color:#226622;

}

.botanical{

    color:#777;

    font-style:italic;

    margin-top:4px;

}

.details{

    margin-top:8px;

    color:#444;

}

.evergreen{

    display:inline-block;

    margin-top:10px;

    background:#EAF8EA;

    color:#237523;

    padding:4px 10px;

    border-radius:20px;

    font-size:12px;

}

.bedCard{

    display:flex;
    align-items:center;
    gap:15px;

    background:#FFF;
    border-radius:12px;
    padding:14px;
    margin-bottom:12px;

    text-decoration:none;
    color:#222;
    box-shadow:0 2px 6px rgba(0,0,0,.12);

}

.bedCard:hover{

    background:#F5FFF4;

}

.bedIcon{

    width:52px;
    height:52px;
    display:flex;
    align-items:center;
    justify-content:center;

    background:#EAF8EA;
    border-radius:10px;
    font-size:26px;
    flex-shrink:0;

}

.bedThumb{

    width:110px;
    height:82px;
    object-fit:cover;
    border-radius:10px;
    border:1px solid #DDD;
    flex-shrink:0;

}

.bedInfo{

    flex:1;
    min-width:0;

}

.bedName{

    color:#226622;
    font-size:20px;
    font-weight:bold;

}

.bedMeta{

    color:#666;
    margin-top:4px;

}

.bedArrow{

    color:#669966;
    font-size:32px;
    line-height:1;

}

.bedDetailPhoto{

    width:100%;
    margin:5px 0 18px;
    overflow:hidden;
    border-radius:14px;
    background:#eef3ec;
    box-shadow:0 2px 8px rgba(0,0,0,.14);
    line-height:0;
    text-align:center;

}

.bedDetailPhoto img{

    display:block;
    width:100%;
    max-height:560px;
    object-fit:contain;
    margin:0 auto;

}

@media (max-width:480px){

    .bedThumb{width:88px;height:72px}

}

.emptyMessage{

    background:#FFF;
    border-radius:12px;
    padding:18px;
    color:#666;
    box-shadow:0 2px 6px rgba(0,0,0,.12);

}

.backLink{

    display:inline-block;
    margin-bottom:14px;
    color:#226622;
    text-decoration:none;

}

.backLink:hover{

    text-decoration:underline;

}

.homeLink{

    display:inline-block;
    margin-bottom:10px;
    color:#226622;
    text-decoration:none;

}

.homeLink:hover{text-decoration:underline}

.careCard{

    display:flex;
    gap:14px;
    background:#FFF;
    padding:14px;
    margin-bottom:12px;
    border-radius:12px;
    box-shadow:0 2px 6px rgba(0,0,0,.12);
    border-left:5px solid #6b9b4b;

}

.careCard.priority1{border-left-color:#b64035}
.careCard.priority2{border-left-color:#cf8b24}

.careThumb{

    width:70px;
    height:70px;
    object-fit:cover;
    border-radius:10px;
    border:1px solid #DDD;
    flex-shrink:0;

}

.careInfo{flex:1;min-width:0}

.carePlantName{

    display:block;
    color:#226622;
    font-size:18px;
    font-weight:bold;
    text-decoration:none;

}

.careType{color:#666;margin-top:3px}
.careInstructions{margin-top:9px;line-height:1.45;color:#333}

.completeForm{margin-top:12px}

.completeButton{

    background:#2c6b2f;
    color:#FFF;
    border:0;
    border-radius:7px;
    padding:8px 12px;
    cursor:pointer;
    font-size:14px;

}

.completeButton:hover{background:#205123}

.textCompleteButton{

    display:inline-block;
    margin-top:12px;
    background:#eaf8ea;
    color:#205123;
    border:1px solid #b9dcb8;
    border-radius:7px;
    padding:8px 12px;
    text-decoration:none;
    font-size:14px;
    line-height:1.35;

}

.textCompleteButton:hover{background:#d9efd8}

.careSuccess{

    background:#eaf8ea;
    color:#205123;
    border-radius:8px;
    padding:12px;
    margin-bottom:15px;

}

.landscapeIntro{

    color:#555;
    margin-bottom:20px;
    line-height:1.5;

}

.landscapeMenu{

    display:grid;
    gap:13px;

}

.landscapeMenuCard{

    display:flex;
    align-items:center;
    gap:15px;
    padding:17px;
    background:#FFF;
    border-radius:13px;
    box-shadow:0 2px 6px rgba(0,0,0,.12);
    color:#222;
    text-decoration:none;

}

.landscapeMenuCard:hover{background:#F5FFF4}

.landscapeMenuIcon{

    width:54px;
    height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#EAF8EA;
    border-radius:11px;
    font-size:27px;
    flex-shrink:0;

}

.landscapeMenuContent{flex:1;min-width:0}

.landscapeMenuTitle{

    color:#226622;
    font-size:21px;
    font-weight:bold;

}

.landscapeMenuText{color:#666;margin-top:4px;line-height:1.4}
.landscapeMenuArrow{color:#669966;font-size:34px;line-height:1}
.landscapeCareCard .landscapeMenuIcon{background:#fff1d9}

.mapControls{

    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:10px;

}

.mapControls button{

    width:35px;
    height:35px;
    border:1px solid #b9d2b8;
    border-radius:7px;
    background:#FFF;
    color:#226622;
    font-size:22px;
    cursor:pointer;

}

#zoomLabel{min-width:48px;text-align:center;color:#555}

.mapViewport{

    width:100%;
    overflow:auto;
    border:1px solid #d4d4d4;
    border-radius:12px;
    background:#eef3ec;
    box-shadow:0 2px 6px rgba(0,0,0,.12);

}

.mapStage{

    position:relative;
    width:100%;
    min-width:0;
    line-height:0;

}

.aerialMap{display:block;width:100%;height:auto}

.bedOverlay{

    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;

}

.mapLegend{margin-top:24px}
.mapLegend h2{color:#2c6b2f;margin-bottom:12px}

.mapBedList{

    display:flex;
    flex-wrap:wrap;
    gap:8px;

}

.mapBedLink{

    background:#FFF;
    border:1px solid #cde0cc;
    border-radius:20px;
    padding:7px 11px;
    color:#226622;
    text-decoration:none;
    font-size:14px;

}

.mapBedLink:hover{background:#eaf8ea}

.devotionTrailMenuCard .landscapeMenuIcon{background:#fff5d6}

.devotionWelcome{max-width:760px}

.devotionSetupNotice{

    margin-bottom:16px;
    padding:12px 14px;
    background:#fff5d6;
    border:1px solid #e1c978;
    border-radius:8px;
    color:#594716;
    line-height:1.45;

}

.devotionMapViewport{

    width:100%;
    overflow:auto;
    border:1px solid #d4d4d4;
    border-radius:12px;
    background:#eef3ec;
    box-shadow:0 2px 6px rgba(0,0,0,.12);

}

.devotionMapStage{

    position:relative;
    isolation:isolate;
    width:100%;
    line-height:0;

}

.devotionAerialMap{

    position:relative;
    z-index:0;
    display:block;
    width:100%;
    height:auto;

}

.devotionBedOverlay{

    position:absolute;
    z-index:1;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    pointer-events:none;

}

.devotionalMarker{

    position:absolute;
    z-index:3;
    width:64px;
    height:64px;
    transform:translate(-50%, -50%);
    border-radius:50%;
    line-height:0;
    filter:drop-shadow(0 2px 3px rgba(0,0,0,.5));
    transition:transform .15s ease, filter .15s ease;

}

.devotionalMarker img{display:block;width:100%;height:100%}

.devotionalMarker:hover,
.devotionalMarker:focus{

    transform:translate(-50%, -50%) scale(1.12);
    filter:drop-shadow(0 3px 5px rgba(0,0,0,.6));
    outline:3px solid #fff;
    outline-offset:2px;

}

.devotionStopSection{margin-top:28px}
.devotionStopSection h2{color:#2c6b2f;margin-bottom:5px}

.devotionStopList{

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:12px;

}

.devotionStopCard{

    display:flex;
    align-items:center;
    gap:13px;
    padding:12px;
    background:#FFF;
    border-radius:12px;
    box-shadow:0 2px 6px rgba(0,0,0,.12);
    color:#222;
    text-decoration:none;

}

.devotionStopCard:hover{background:#fffdf4}

.devotionStopThumb{

    width:72px;
    height:72px;
    object-fit:cover;
    border:1px solid #DDD;
    border-radius:9px;
    flex-shrink:0;

}

.devotionStopInfo{display:block;flex:1;min-width:0}
.devotionStopName{display:block;color:#226622;font-size:18px;font-weight:bold;line-height:1.25}
.devotionStopCommon{display:block;color:#666;margin-top:2px}
.devotionStopMeta{display:block;color:#666;margin-top:5px;font-size:14px}
.devotionStopReference{display:block;color:#745a20;margin-top:6px;font-weight:bold}
.devotionStopArrow{color:#669966;font-size:32px;line-height:1}

.devotionalPage{

    max-width:850px;
    margin:0 auto;
    background:#FFF;
    border-radius:14px;
    box-shadow:0 2px 8px rgba(0,0,0,.14);
    overflow:hidden;

}

.devotionalPlantHeader{

    display:flex;
    align-items:center;
    gap:22px;
    padding:22px;
    background:#f5faf3;

}

.devotionalPlantImage{

    width:180px;
    height:180px;
    object-fit:cover;
    border-radius:12px;
    border:1px solid #d8dfd5;
    flex-shrink:0;

}

.devotionalPlantHeading{min-width:0}
.devotionalEyebrow{text-transform:uppercase;letter-spacing:.08em;color:#8a6421;font-weight:bold;font-size:13px}
.devotionalPlantHeading h1{color:#275f2a;margin:6px 0 5px;font-size:30px;line-height:1.15}
.devotionalCommonName{color:#666;font-size:17px;margin-bottom:10px}

.devotionalBedLink{

    display:inline-block;
    color:#226622;
    text-decoration:none;
    background:#e7f4e4;
    border-radius:20px;
    padding:6px 10px;

}

.devotionalBedLink:hover{text-decoration:underline}

.devotionalScripture{

    margin:24px 24px 0;
    padding:17px 19px;
    background:#fff7db;
    border-left:4px solid #b58a2e;
    border-radius:8px;

}

.devotionalSectionLabel{text-transform:uppercase;letter-spacing:.08em;color:#75591d;font-size:12px;font-weight:bold}
.devotionalReferenceText{color:#45340e;font-size:21px;font-weight:bold;margin-top:5px}

.devotionalReading{

    padding:24px;
    color:#333;
    font-size:17px;
    line-height:1.75;

}

.devotionalActions{

    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:12px;
    padding:0 24px 26px;

}

.devotionalReturnButton{

    display:inline-block;
    background:#2c6b2f;
    color:#FFF;
    border-radius:8px;
    padding:11px 15px;
    text-decoration:none;
    font-weight:bold;

}

.devotionalReturnButton:hover{background:#205123}
.devotionalPlantLink{color:#226622;padding:8px;text-decoration:none}
.devotionalPlantLink:hover{text-decoration:underline}

@media (max-width:600px){

    .devotionalMarker{width:52px;height:52px}
    .devotionStopList{grid-template-columns:1fr}
    .devotionalPlantHeader{display:block;padding:17px}
    .devotionalPlantImage{width:100%;height:auto;aspect-ratio:4/3;margin-bottom:16px}
    .devotionalPlantHeading h1{font-size:26px}
    .devotionalScripture{margin:17px 17px 0}
    .devotionalReading{padding:20px 17px;font-size:16px}
    .devotionalActions{padding:0 17px 21px}
    .devotionalReturnButton{width:100%;box-sizing:border-box;text-align:center}

}