@extends('layouts.master')

@section('browserTitle')
{{ trans('menu.home') }} {{ trans('menu.patient') }}
@endsection


@section('breadcrumb')
<li class="breadcrumb-item active">{{ trans('menu.home') }}</li>
<!-- 
Nelle altre pagine sarà
<li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
<li class="breadcrumb-item"><a href="{{ route('home') }}">Pagina</a></li>
<li class="breadcrumb-item active" aria-current="page">Pagina corrente</li> 
-->
@endsection


@section('title')
{{ trans('menu.home') }}
@endsection

@section('subtitle')
{{ trans('msg.welcome') }} {{ $_SESSION['loggedName'] }}!
@endsection


@section('body')
    <style>
        body {
            margin: 0;
            padding: 0;
            font-family: Arial, sans-serif;
        }

        .container {
            display: flex; /* Flexbox per il layout */
            flex-direction: row; /* Disposizione degli elementi in una riga */
            justify-content: space-between; /* Distribuisce lo spazio tra gli elementi */
            align-items: flex-start; /* Allinea gli elementi in alto */
            padding: 20px;
        }

        .text-content {
            flex: 1; /* Riempi il resto della pagina */
            margin-right: 20px; /* Margine destro per separare il testo dall'immagine */
        }

        .image-content {
            flex: 0; /* Dimensione fissa per l'immagine */
            margin-left: auto; /* Spingi l'immagine verso destra */
        }

        .image-content img {
            max-width: 300px; /* Limita la larghezza massima dell'immagine */
            height: auto; /* Mantieni la proporzione dell'immagine */
        }
    </style>


<div class="container" style="border: 6px solid #0b4f6c; border-radius: 10px; padding: 20px; margin: 20px;">
    <!-- Contenuto del testo -->
    <div class="text-content">
        <h1>{{ trans('msg.rehab')}}</h1>

        <p>{{ trans('msg.p1')}}
            <br>
            {{ trans('msg.p2')}}
            <ul>
                <li>{{ trans('msg.p3')}}
                <li>{{ trans('msg.p4')}}
                <li>{{ trans('msg.p5')}}
                <li>{{ trans('msg.p6')}}
            </ul>
        
            <br>
            {{ trans('msg.p7')}}
        </p>

        <a href="{{ route('exercises.exercisePage') }}" class="my-btn my-blue-btn">{{ trans('btn.start')}}</a>
    </div>

    <!-- Contenuto dell'immagine -->
    <div class="image-content">
        <img src="/img/oncobrainup.png">
    </div>
</div>

</body>
</html>



<!-- <div class="text-center">
    <div class="row">
        <div class="box1 col-6 pt-5 pb-5">
            <h2>Ricette veloci</h2>
        </div>
        <div class="box2 col-6 pt-5 pb-5">
            <h2>Ricette vegane o per intolleranti</h2>
        </div>
    </div>
    <div class="row">
        <div class="box2 col pt-5 pb-5">
            <h2>Ricette dietetiche</h2>
        </div>
        <div class="box1 col pt-5 pb-5">
            <h2>Cucina tipica</h2>
        </div>
    </div>
</div> -->
@endsection